/* ==================================================================
   turkbil — global kimlik katmani

   KAPSAM: WISECP'nin kendi Bootstrap arayuzu (musteri paneli, odeme
   akisi, formlar, tablolar). Disa donuk kabuk (ust serit, menu, hero,
   bolumler, footer) turkbil-ui.css tarafindan yonetilir.

   Basic'in hicbir dosyasi degistirilmez; bu dosya uzerine biner.
   Yukleme sirasi: theme.css -> default*.css -> <style> (ayarlar)
                   -> BU DOSYA -> turkbil-ui.css
   ================================================================== */

/* --- Tipografi ---------------------------------------------------
   Plus Jakarta Sans yerelden sunulur (latin + latin-ext).
   latin-ext alt kumesi Turkce g/s/i icin zorunludur.
   "Jakarta Fallback" Arial'den turetilmis metrik esli yedektir:
   font yuklenene kadar satir yuksekligi oynamaz (CLS = 0).          */
:root {
    --basic-font-family: "Plus Jakarta Sans", "Jakarta Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* PJS genis kurgulu bir yazi tipi; basliklarda biraz sikilastiriyoruz */
h1, h2, h3 { letter-spacing: -0.02em; }

/* --- Ana eylem butonu --------------------------------------------
   Eski turkbil.net.tr'deki .anasolbuton kuralinin karsiligi:
   linear-gradient(135deg, #001f3f, #004b93), hover'da ters yon.
   WISECP'nin tum panelinde .btn-primary kullanildigi icin burada.   */
.btn-primary {
    background-image: linear-gradient(135deg, var(--basic-deep, #001f3f), var(--basic-primary));
    border-color: transparent;
    font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus-visible {
    background-image: linear-gradient(135deg, var(--basic-primary), var(--basic-deep, #001f3f));
    border-color: transparent;
    box-shadow: 0 10px 25px rgba(var(--basic-primary-rgb), .28);
}

.btn-primary:active {
    background-image: linear-gradient(135deg, var(--basic-deep, #001f3f), var(--basic-primary));
    box-shadow: none;
}

/* Ikincil vurgu: Turkbil kirmizisi — "dikkat cek" amacli, iptal/sil degil */
.btn-accent {
    background-image: linear-gradient(135deg, var(--basic-secondary), #ff2d4d);
    border: 0;
    color: #fff;
    font-weight: 600;
}

.btn-accent:hover {
    color: #fff;
    box-shadow: 0 10px 25px rgba(var(--basic-secondary-rgb), .3);
}

/* --- Odak halkasi — klavye kullanicilari icin net ve marka renginde */
:focus-visible {
    outline: 2px solid rgba(var(--basic-primary-rgb), .65);
    outline-offset: 2px;
}

/* --- Koyu mod -----------------------------------------------------
   Lacivert ana renk koyu zeminde okunurlugunu yitiriyor; butonlarda
   kontrasti olculu bicimde artiriyoruz.                             */
[data-bs-theme="dark"] .btn-primary {
    background-image: linear-gradient(135deg, var(--basic-primary), #0a6fd0);
}

[data-bs-theme="dark"] .btn-primary:hover {
    background-image: linear-gradient(135deg, #0a6fd0, var(--basic-primary));
}

/* Panel ici baglanti oklari marka renginde */
.link-arrow { color: var(--basic-primary); }

/* ==================================================================
   KAPSAYICI SOZLESMESI — CHECKOUT / FATURA DUZENLERI (2026-10-13)
   Bu dosya uc duzenin (default, checkout, invoice) hepsinde yuklenir.
   Odeme duzeni (checkout-shell.css) genisligi max-width ile degil,
   (100% - 1320px)/2 formulu ile kurar; asagisi ayni formulu 1440px ve
   20px kenar payiyla yeniden yazar. Dar ekranda en az 20px kenar.
   ================================================================== */
/* Genislik tek kaynaktan: Tema Ayarlari > Gorunum > Icerik Genisligi (5.0-beta.3).
   standard 1320 · wide 1440 (varsayilan, 2026-10-13 sozlesmesi) · wider 1600.
   <html data-content-width> niteligini layouts/*.tpl basar; --tb-shell her yerde bunu izler. */
:root { --tb-shell: 1320px; }
:root[data-content-width="wide"] { --tb-shell: 1440px; }
:root[data-content-width="wider"] { --tb-shell: 1600px; }
.container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { width: 100%; max-width: var(--tb-shell, 1440px); margin-inline: auto; padding-inline: 20px; box-sizing: border-box; }
@media (min-width: 992px) { .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { padding-inline: 24px; } }
@media (max-width: 991.98px) {
    body.checkout-shell .container, body.checkout-shell .checkout-split-main { padding-inline: 20px !important; }   /* cekirdek .75rem formulunu asar; dar ekranda 20px alt siniri */
}
@media (min-width: 1400px) {
    body.checkout-shell:not(.checkout-shell-centered) .checkout-split-main { padding-inline-start: max(20px, calc((100% - var(--tb-shell, 1440px)) / 2 + 20px)); padding-inline-end: max(20px, calc((100% - var(--tb-shell, 1440px)) / 2 + 20px)); }
    body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-header > .container, body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-footer > .container { padding-inline-start: max(20px, calc((100% - var(--tb-shell, 1440px)) / 2 + 20px)); padding-inline-end: calc(var(--rail-w) + max(20px, (100% - var(--tb-shell, 1440px)) / 2 + 20px)); }
    .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-split-aside { margin-inline-end: max(20px, calc((100% - var(--tb-shell, 1440px)) / 2 + 20px)); }
    .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-header > .container, .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-footer > .container { padding-inline-end: max(20px, calc((100% - var(--tb-shell, 1440px)) / 2 + 20px)); }
}
/* 992–1399px: cekirdegin 960/1140 merkezleme formulleri yerine akiskan genislik + 24px kenar (1440 sozlesmesiyle tutarli) */
@media (min-width: 992px) and (max-width: 1399.98px) {
    body.checkout-shell:not(.checkout-shell-centered) .checkout-split-main { padding-inline: 24px; }
    body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-header > .container, body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-footer > .container { padding-inline-start: 24px; padding-inline-end: calc(var(--rail-w) + 24px); }
    .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-split-aside { margin-inline-end: 24px; }
    .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-header > .container, .checkout-layout-card body.checkout-shell:not(.checkout-shell-centered) .checkout-shell-footer > .container { padding-inline-end: 24px; }
}

/* 2026-10-22 RTL (ar): default.rtl.css oklari scaleX(-1) ile cevirir ama satir-ici <i> ogesinde transform islemez;
   "Simdi al", "Odemeye devam" gibi dugmelerde ok saga bakiyordu. Bu dosya sepet/odeme yerlesiminde de yuklenir. */
html[dir="rtl"] .bi-arrow-right, html[dir="rtl"] .bi-arrow-left, html[dir="rtl"] .bi-arrow-up-right { display: inline-block; }
html[dir="rtl"] .bi-arrow-up-right { transform: scaleX(-1); }
html[dir="rtl"] .store-tab-label i { display: none; }

/* @@ LOGO-KIRMIZISI-AYDINLIK BASLA (acik-kip.py uretir, elle duzenleme) @@ */
html:not([data-bs-theme="dark"]) .btn-accent{background-image: linear-gradient(135deg, var(--basic-secondary), #d04555)}
/* @@ LOGO-KIRMIZISI-AYDINLIK BITIR @@ */