/* Theme Name: InnoTheme Theme URI: https://paylas.org.tr Author: Innovator Technology Description: WooCommerce uyumlu, Elementor destekli, InnoTheme Settings panelinden marka renkleri/tipografi/header/footer görünümü kod yazmadan yönetilebilen özelleştirilebilir tema. Version: 1.0.0 Requires PHP: 7.4 Text Domain: paylas */ /* View Transitions API (cross-document) — sayfa geçişlerinde tarayıcı yerleşik, hafif bir cross-fade uygular. JS gerektirmez, tek satır; bunu desteklemeyen tarayıcılar bu at-rule'u sessizce yok sayar, normal (anlık) sayfa geçişi olduğu gibi çalışmaya devam eder — hiçbir risk yok. */ @view-transition { navigation: auto; } /* ── Tasarım tokenleri ──────────────────────────────────────────────────── */ :root { /* Renkler — 2026-08 marka yenilemesi: yeşil üzerine, açık/canlı bir palet (önceki terrakota+zümrüt yeşili paletinin yerine). Birincil #9cb73b (zeytin-limon yeşili, CTA/marka rengi), ikincil #60a340 (daha koyu/dolgun yeşil, vurgu rengi) — kullanıcının verdiği tam değerler. Diğer tonlar bunlardan türetildi (koyu/açık varyantlar), zemin renkleri de yeşille çatışmasın diye sıcak kremden soğuk/nötr açık yeşile kaydırıldı. */ --color-primary: #9cb73b; --color-primary-dark: #7c9430; --color-primary-light: #b5cf5e; --color-accent: #60a340; --color-accent-dark: #4a7d31; --color-bg: #fbfdf6; --color-bg-alt: #f3f8e9; --color-surface: #ffffff; --color-fg: #1c2414; --color-fg-muted: #5c6b4a; --color-border: #dde8c8; --color-destructive: #dc2626; --color-ring: #9cb73b; /* Tipografi — Elementor Site Ayarları > Global Fontlar ile birebir aynı: Birincil = Ubuntu Sans (başlıklar), Metin = Poppins (gövde). */ --font-heading: 'Ubuntu Sans', -apple-system, 'Segoe UI', sans-serif; --font-body: 'Poppins', -apple-system, 'Segoe UI', sans-serif; /* Ölçek */ --radius-sm: 8px; --radius-md: 14px; --radius-lg: 24px; --radius-image: 12px; --space-xs: 8px; --space-sm: 16px; --space-md: 24px; --space-lg: 48px; --space-xl: 96px; --container-max: 1200px; --shadow-card: 0 1px 3px rgba(28, 36, 20, 0.06), 0 8px 24px -8px rgba(28, 36, 20, 0.12); --shadow-card-none: none; /* Buton ölçüleri + tek bir global geçiş hızı (InnoTheme Settings > Butonlar & Kartlar'dan yönetilir) */ --btn-padding-y: 12px; --btn-padding-x: 24px; --btn-min-height: 44px; --btn-border-width: 2px; --transition-base: 200ms; /* Sepet/checkout ilerleme çubuğu + odak kenarlıkları (InnoTheme Settings > WooCommerce Stilleri'nden yönetilir) */ --woo-checkout-accent: #0d9488; --woo-checkout-accent-shadow: rgba(13, 148, 136, 0.4); } /* ── Reset ──────────────────────────────────────────────────────────────── */ *, *::before, *::after { box-sizing: border-box; } /* overflow-x:hidden TEK BAŞINA iOS Safari'de yeterli değil — touch/rubber-band kaydırma sırasında / üzerindeki overflow-x:hidden görmezden gelinip sayfa yatay yönde "kayabiliyor" (kullanıcı bildirimi: "her mobil telefonda hala kayma var"). overflow-x:clip, tarayıcının bu touch-scroll davranışını da (hidden'ın aksine) gerçekten engelleyen daha güçlü/yeni bir kısıtlama (Safari 16+ / iOS 16+ destekliyor); hidden bunu desteklemeyen çok eski tarayıcılar için yedek olarak duruyor. overscroll-behavior-x de aynı amaçla ek güvenlik katmanı. Kök nedenin (width:100vw tabanlı "tam genişlik" kart şeritleri) düzeltmesi assets/css/layout-v3.css içinde. */ html { overflow-x: hidden; overflow-x: clip; overscroll-behavior-x: none; max-width: 100%; } /* Lenis kendi RAF-tabanlı yumuşatmasını yapıyor; native "scroll-behavior:smooth" AYNI ANDA aktif kalırsa ikisi birbiriyle yarışıp kayma sırasında takılma/jank yaratıyor. Lenis başarıyla başlatıldığı an 'e kalıcı olarak ".lenis" class'ını ekliyor (NOT ".lenis-smooth" — o class yalnızca programatik scrollTo() sırasında GEÇİCİ olarak eklenip kaldırılıyor, normal tekerlek kaydırmasında hiç görünmüyor; ilk denemede bu ayrımı kaçırıp yanlış class'ı hedeflemiştik). Lenis aktifken native smooth'u devre dışı bırakıyoruz. Lenis hiç yüklenemezse (script hatası, reduced-motion vb.) ":not(.lenis)" hâlâ devrede kalıp normal anchor-link kaydırmasını sağlıyor. !important ŞART: Elementor'ün kendi frontend.min.css'i de "@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }" kuralını taşıyor (Elementor'ün "Smooth Scroll" deneysel özelliğinden, bizim kodumuzdan bağımsız) ve bizim stylesheet'imizden SONRA yükleniyor. .lenis class'ı varken ":not(.lenis)" hiç eşleşmediği için o an Elementor'ün !important'sız kuralı tek başına kalıp native smooth'u sessizce tekrar açıyordu — asıl "takılma" şikayetinin kaynağı buydu. !important bunu kalıcı olarak eziyor. */ html:not(.lenis) { scroll-behavior: smooth; } html.lenis { scroll-behavior: auto !important; } body { margin: 0; background: var(--color-bg); color: var(--color-fg); font-family: var(--font-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; overflow-x: clip; overscroll-behavior-x: none; max-width: 100%; } img { max-width: 100%; height: auto; display: block; } a { color: inherit; text-decoration: none; } ul { list-style: none; margin: 0; padding: 0; } /* -webkit-appearance:none ŞART: iOS Safari, özel arka plan/border/padding verdiğimiz