/* ==========================================================================
   ALTUNAKAR — MAĞAZA KURUMSAL KATMANI (2026-08-17)

   NEDEN: 2026-08-17'de ana sayfa "kt-" kurumsal tasarımına geçti. Mağaza ve
   ona bağlı ~20 iç sayfa (ürün, sepet, ödeme, hesabım, yasal sayfalar, SSS,
   iletişim) hâlâ store.css'in eski dilini konuşuyordu: başka bir mavi, başka
   bir gri, 800 ağırlıklı bağıran başlıklar, köşeli butonlar. İki yüzey arasında
   gezinen müşteri iki ayrı site geziyormuş gibi hissediyordu.

   NE YAPIYOR: store.css'i YENİDEN YAZMIYOR. store.css baştan sona CSS
   değişkeni kullandığı için işin büyük kısmı aşağıdaki tek değişken bloğuyla
   çözülüyor (store-dark.css ile aynı strateji). Kalan kısım tipografi ritmi,
   buton/kart reçetesi ve stil dosyasında sabit yazılmış birkaç renk.

   İLKELER (anasayfa-kurumsal.css'ten birebir devralındı)
   1. Tek aksan ailesi — 214°, #0a5ecb. İkinci bir mavi yok.
   2. Tek kart reçetesi — aynı kenarlık, yarıçap, gölge, hover.
   3. Tek buton reçetesi — hap biçim, 600 ağırlık, renkli parıltı yok.
   4. Başlıklar 640 ağırlık + negatif harf aralığı. Büyük harf yok.
   5. Üç gölge, beş yarıçap, dört yüzey. Dışına çıkılmaz.

   KOYU MOD: Renk PALETİ yalnızca açık modda değişir (`html:not([data-theme="dark"])`);
   store-dark.css'in paleti olduğu gibi duruyor. Ama biçim kuralları — tipografi
   ağırlığı, hap butonlar, kart yarıçapı, odak halkası — İKİ MODDA DA geçerli;
   zaten amaç bu, koyu modun eski dilde kalması tutarsızlık olurdu.
   Bu yüzden renkli her jetonun iki modda ayrı değeri var (bkz. §01 sonu).

   GERİ ALMA: magaza_ust.php içindeki tek <link> bloğunu silmek yeterli.
   Bu dosya hiçbir HTML'i, hiçbir PHP'yi, hiçbir sınıf adını değiştirmiyor.
   ========================================================================== */


/* == 01 Değişken eşlemesi ================================================= */
/* store.css'in paleti kt paletiyle değiştiriliyor. Tek blok, 2257 satırlık
   stil dosyasının tamamını yeniden derisi. */

html:not([data-theme="dark"]) {
    /* -- Aksan: #1f5aa6 (donuk lacivert) → #0a5ecb (kt aksan ailesi) -- */
    --primary:      #0a5ecb;   /* kt-aksan-600 */
    --primary-d:    #0a4a92;   /* kt-aksan-700 */
    --primary-dd:   #093868;   /* kt-aksan-800 */
    --primary-soft: #e4eefd;   /* kt-aksan-100 */
    --primary-ring: rgba(10, 94, 203, .16);

    /* -- Yüzeyler: mavi-gri (#f3f5f9) → kt'nin nötr grisi -- */
    --c-bg:        #f6f6f8;    /* kt-yuzey-2 */
    --c-surface:   #ffffff;    /* kt-yuzey-1 */
    --c-surface-2: #eeeef1;    /* kt-yuzey-3 */

    /* -- Metin -- */
    --c-ink:   #101014;        /* kt-murekkep */
    --c-ink-2: #5f6169;        /* kt-sis */
    --c-muted: #8b8d95;        /* kt-sis-2 */
    --price:   #101014;        /* fiyat da aynı mürekkep — ikinci bir siyah yok */

    /* -- Çizgiler -- */
    --c-line:   #e3e4e8;       /* kt-cizgi */
    --c-line-2: #eeeef1;

    /* -- Durum renkleri: kt yeşili daha koyu ve daha az doygun -- */
    --success:      #106b45;   /* kt-yesil */
    --success-soft: #e8f5ee;   /* kt-yesil-z */

    /* -- Yarıçaplar: kt'nin beş kademesi -- */
    --r:   16px;               /* kt-r-m */
    --r-2: 12px;               /* kt-r-s */
    --r-3: 8px;                /* kt-r-xs */

    /* -- Gölgeler: dört kademe → kt'nin üç kademesi.
          --sh-xs ve --sh-sm aynı yumuşak gölgeye bağlandı; kt'de "çok hafif"
          ile "hafif" diye iki ayrı seviye yok. -- */
    --sh-xs: 0 1px 2px rgba(16, 16, 20, .04);
    --sh-sm: 0 1px 2px rgba(16, 16, 20, .04);
    --sh-md: 0 4px 16px rgba(16, 16, 20, .07), 0 1px 3px rgba(16, 16, 20, .04);
    --sh-lg: 0 18px 48px rgba(16, 16, 20, .13), 0 4px 12px rgba(16, 16, 20, .06);
}

/* Hareket eğrisi ve yarıçap — moddan bağımsız. */
.magaza-body {
    --mk-hiz: .26s cubic-bezier(.3, .1, .25, 1);
    --mk-r-l: 22px;   /* kt-r-l — kart yarıçapı */
}

/* Renkli jetonlar İKİ MODDA AYRI tanımlanır. Tek değer verilirse (#d2d4da gibi
   açık bir gri) koyu modda parlayıp kalıyor — DESIGN.md kural 2. */
html:not([data-theme="dark"]) .magaza-body {
    --mk-siyah:   #08080a;   /* kt siyahı */
    --mk-cizgi-k: #d2d4da;   /* kt-cizgi-koyu */
    --mk-bilgi-c: #cbe0fb;   /* kt-aksan-200 */
}
html[data-theme="dark"] .magaza-body {
    --mk-siyah:   #070d18;   /* store-dark'ın footer zemini — ikinci bir siyah yok */
    --mk-cizgi-k: #33496b;   /* --c-line'ın bir tık üstü */
    --mk-bilgi-c: #22344f;
}


/* == 02 Tipografi ========================================================= */
/* kt'nin en belirgin imzası: başlıklar 800 değil 640 ağırlıkta ve harfleri
   sıkışık. 800 ağırlık ekranda "bağırıyor"; kurumsal dil bunu istemiyor. */

.magaza-body h1,
.magaza-body h2,
.magaza-body h3,
.magaza-body h4 {
    font-family: var(--font-disp);
    font-weight: 640;
    letter-spacing: -.028em;
    text-wrap: balance;
    text-transform: none;
}
.magaza-body h1 { letter-spacing: -.032em; line-height: 1.08; }
.magaza-body h2 { line-height: 1.1; }
.magaza-body h3,
.magaza-body h4 { letter-spacing: -.022em; line-height: 1.2; }

/* Bölüm başlıkları (vitrin, kategori listesi, ürün detay sekmeleri) */
.magaza-body .section-title {
    font-family: var(--font-disp);
    font-size: clamp(21px, 2.1vw, 27px);
    font-weight: 640;
    letter-spacing: -.026em;
    gap: 11px;
}
.magaza-body .section-title i { color: var(--primary); }

/* Yasal / kurumsal sayfa başlıkları (gizlilik, sözleşme, iade, hakkımızda) */
.magaza-body .yasal-sayfa h1 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 640; }
.magaza-body .yasal-sayfa h2 { font-size: 19px; font-weight: 640; }
.magaza-body .yasal-sayfa h3 { font-size: 15.5px; font-weight: 640; }
.magaza-body .yasal-sayfa p,
.magaza-body .yasal-sayfa li { color: var(--c-ink-2); line-height: 1.72; text-wrap: pretty; }

/* BÜYÜK HARF TEMİZLİĞİ — kt'de hiçbir başlık büyük harfe çevrilmez.
   Tek istisna: .kt-etiket tarzı küçük göz-etiketleri (aşağıda korunuyor). */
.magaza-body .magaza-footer h6,
.magaza-body .yasal-tablo th,
.magaza-body .magaza-brand .logo-txt span {
    text-transform: none;
    letter-spacing: -.01em;
}
.magaza-body .magaza-footer h6 { font-weight: 640; font-size: 14px; }
.magaza-body .magaza-brand .logo-txt span { letter-spacing: .02em; }


/* == 03 Buton reçetesi ==================================================== */
/* kt butonları HAP biçimli, 600 ağırlıkta ve altlarında renkli parıltı yok.
   store.css'te 12px köşe + mavi glow vardı; iki yüzey arasındaki en göze
   batan fark buydu. */

.magaza-body .btn-p,
.magaza-body .btn-o,
.magaza-body .btn-ara {
    border-radius: 100px;
    font-weight: 600;
    letter-spacing: -.01em;
    min-height: 50px;
    padding: 0 26px;
    transition: background var(--mk-hiz), transform var(--mk-hiz),
                box-shadow var(--mk-hiz), color var(--mk-hiz), border-color var(--mk-hiz);
}
.magaza-body .btn-p {
    background: var(--primary);
    box-shadow: none;              /* renkli parıltı kalktı */
    border: 1px solid transparent;
}
.magaza-body .btn-p:hover {
    background: var(--primary-d);
    transform: translateY(-1px);
    box-shadow: var(--sh-md);
}
.magaza-body .btn-p:active { transform: none; box-shadow: none; }
.magaza-body .btn-p:disabled {
    background: var(--c-surface-2); color: var(--c-muted);
    box-shadow: none; transform: none;
}

/* Hatlı buton — kt'de hover'da mavi olmaz, mürekkebe döner. */
.magaza-body .btn-o {
    background: none;
    color: var(--c-ink);
    border: 1px solid var(--mk-cizgi-k);
}
.magaza-body .btn-o:hover {
    background: var(--c-bg);
    color: var(--c-ink);
    border-color: var(--c-ink);
}

.magaza-body .btn-ara:hover { background: #9a5f08; }

/* Küçük butonlar hap kalsın ama yüksekliği ezilmesin */
.magaza-body .pcard-btn,
.magaza-body .pg-btn,
.magaza-body .btn-cerez-sifirla {
    border-radius: 100px;
    font-weight: 600;
    letter-spacing: -.01em;
}
.magaza-body .pcard-btn {
    height: 42px;
    background: var(--primary);
    transition: background var(--mk-hiz), transform var(--mk-hiz);
}
.magaza-body .pcard-btn:hover { background: var(--primary-d); }
.magaza-body .pg-btn.aktif { box-shadow: none; }

/* Arama kutusundaki gönder düğmesi de aynı aileye girsin */
.magaza-body .magaza-search .git { border-radius: 100px; width: 44px; }
.magaza-body .magaza-search input { border-radius: 100px; padding-left: 46px; border-width: 1px; }


/* == 04 Kart reçetesi ===================================================== */
/* kt'de TEK kart reçetesi var: 22px yarıçap, 1px --c-line kenarlık, çok hafif
   gölge; hover'da 3px yükselir, gölge büyür ve kenarlık KOYULAŞIR (maviye
   dönmez). store.css'te ürün kartı hover'da mavi kenarlık + mavi gölge
   alıyordu — katalogda 24 kart aynı anda mavi yanıp sönüyordu. */

.magaza-body .pcard,
.magaza-body .kat-tile,
.magaza-body .yasal-sayfa,
.magaza-body .pd-media,
.magaza-body .sorgula-kart,
.magaza-body .bos-durum {
    border-radius: var(--mk-r-l);
    border: 1px solid var(--c-line);
    box-shadow: var(--sh-xs);
    transition: transform var(--mk-hiz), box-shadow var(--mk-hiz), border-color var(--mk-hiz);
}

.magaza-body .pcard:hover,
.magaza-body .kat-tile:hover {
    transform: translateY(-3px);
    border-color: var(--mk-cizgi-k);
    box-shadow: var(--sh-lg);
}

/* Ürün kartı iç ritmi */
.magaza-body .pcard-media { border-bottom-color: var(--c-line); }
.magaza-body .pcard-body  { padding: 14px 15px 15px; }
.magaza-body .pcard-title {
    font-weight: 600;
    color: var(--c-ink);           /* başlık mavi değil mürekkep — kt kuralı */
    letter-spacing: -.014em;
}
.magaza-body .pcard-title:hover { color: var(--primary); text-decoration: none; }
.magaza-body .pcard-fiyat .val {
    color: var(--c-ink);
    font-weight: 700;
    letter-spacing: -.03em;
}

/* Yasal / kurumsal içerik paneli — kt bölüm ritmine yaklaştırıldı */
.magaza-body .yasal-sayfa {
    max-width: 860px;
    padding: clamp(28px, 4vw, 52px);
    box-shadow: var(--sh-sm);
}
.magaza-body .yasal-box { border-radius: var(--r); }
.magaza-body .yasal-box.bilgi { border-color: var(--mk-bilgi-c); }


/* == 05 Rozetler ve çipler ================================================ */
/* kt'de küçük durum etiketleri hap biçimli. store.css'te 5-6px köşeliydi. */

.magaza-body .pcard-tag,
.magaza-body .pcard-ribbon,
.magaza-body .pcard-hizmet,
.magaza-body .mf-trust .t {
    border-radius: 100px;
    font-weight: 600;
    letter-spacing: -.005em;
}
.magaza-body .pcard-hizmet.os { background: var(--primary-soft); color: var(--primary-d); }
.magaza-body .pcard-hizmet.montaj { background: var(--success-soft); color: var(--success); }

/* Göz-etiketi (kt-etiket karşılığı) — burada büyük harf KASITLI, kt'de de öyle */
.magaza-body .liste-bas .section-title + .liste-ozet { color: var(--c-ink-2); }


/* == 06 Başlık, duyuru şeridi, footer ===================================== */
/* store.css'te üç ayrı "koyu" vardı: #0b1324 (topbar), #0b1324 (footer),
   #0b0b0b (logo). kt'nin tek siyahı #08080a. */

.magaza-body .magaza-topbar { background: var(--mk-siyah); color: rgba(255,255,255,.62); }
.magaza-body .magaza-topbar .sag a { color: rgba(255,255,255,.62); }
.magaza-body .magaza-topbar .sag a:hover { color: #fff; }
.magaza-body .magaza-topbar i,
.magaza-body .magaza-topbar .tb-kur b { color: #63a0ee; }   /* kt-aksan-400 */
.magaza-body .magaza-topbar .tb-kur + .tb-kur { border-left-color: rgba(255,255,255,.14); }

.magaza-body .magaza-header { box-shadow: none; border-bottom: 1px solid var(--c-line); }
.magaza-body .magaza-brand .logo-mark { border-radius: 12px; box-shadow: none; }
.magaza-body .hdr-btn { border-radius: 100px; font-weight: 600; }

.magaza-body .magaza-footer {
    background: var(--mk-siyah);
    color: rgba(255,255,255,.62);
    padding: clamp(44px, 4.4vw, 66px) 0 26px;   /* kt bölüm ritmi */
}
.magaza-body .magaza-footer p,
.magaza-body .magaza-footer a,
.magaza-body .mf-kunye .mfk-bilgi { color: rgba(255,255,255,.62); }
.magaza-body .magaza-footer a:hover { color: #fff; }
.magaza-body .mf-kunye .mfk-bilgi b,
.magaza-body .mf-kunye .mfk-etbis a { color: rgba(255,255,255,.82); }
.magaza-body .magaza-footer .mf-ico { color: #63a0ee; }
.magaza-body .mf-brand .lm { background: var(--primary); border-radius: 12px; }
.magaza-body .mf-trust .t { border-color: rgba(255,255,255,.14); }
.magaza-body .mf-alt { color: rgba(255,255,255,.42); }


/* == 07 Odak halkası ====================================================== */
/* kt'de klavye odağı her yerde aynı: 2px aksan, 3px boşluk. */

.magaza-body a:focus-visible,
.magaza-body button:focus-visible,
.magaza-body summary:focus-visible,
.magaza-body input:focus-visible,
.magaza-body select:focus-visible,
.magaza-body textarea:focus-visible,
.magaza-body [role="button"]:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}
.magaza-body .magaza-search input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px var(--primary-ring);
}


/* == 08 Sabit yazılmış renk yamaları ====================================== */
/* store.css'te değişkene bağlanmamış, göze çarpan birkaç renk. */

.magaza-body .pcard-media .ph { color: var(--c-surface-2); }
.magaza-body .btn-p:disabled  { background: var(--c-surface-2); }
.magaza-body .pcard:hover     { box-shadow: var(--sh-lg); }   /* maviye boyalı gölge yerine nötr */


/* == 09 Hareket saygısı =================================================== */

@media (prefers-reduced-motion: reduce) {
    .magaza-body .pcard,
    .magaza-body .kat-tile,
    .magaza-body .btn-p {
        transition: none;
    }
    .magaza-body .pcard:hover,
    .magaza-body .kat-tile:hover,
    .magaza-body .btn-p:hover {
        transform: none;
    }
}

/* == YAZI ÖLÇEĞİ — bir tık küçültme (2026-08-20) ==========================
   Ana sayfa ve hizmet sayfalarıyla aynı hamle. Ürün adı, fiyat ve buton
   metinleri DEĞİŞMEDİ — mağazada bunlar okunabilirlikten çok karar verme
   öğeleri, küçültmek satın alma akışını zorlaştırır.
   GERİ ALMA: bu bloğu sil.
   ========================================================================== */
.magaza-body .section-title { font-size: clamp(19px, 1.85vw, 24px); }
.magaza-body .yasal-sayfa h1 { font-size: clamp(25px, 2.95vw, 35px); }
.magaza-body .yasal-sayfa h2 { font-size: 17.5px; }