/* ============================================================
   TEMA4 · NAVY GOLD CONSOLE  (v2)
   Online fatura ödeme platformu — AYDINLIK, yüksek kontrastlı,
   koyu lacivert konsol + altın tema. Yaşlı-dostu okunaklılık.
   Ortalanmış arama-odaklı hero + istatistik + kurum ticker layout korunur.
   Token + bileşen override katmanı (home.php/sigorta dahil).
   ============================================================ */

:root {
    /* Zemin & yüzeyler (açık) */
    --bg:        #faf8f3;   /* yumuşak yeşil-beyaz */
    --bg-2:      #E8F1EC;
    --surface:   #FFFFFF;

    /* Kartlar — okunaklılık için SOLID beyaz + net kenar */
    --glass:      #FFFFFF;
    --glass-2:    #fbfaf6;
    --glass-3:    #FFFFFF;
    --glass-brd:  #e7e1d6;
    --glass-brd2: rgba(245,166,35,.18);
    --border:     #e9e4d9;
    --border-2:   #dbd4c6;

    /* Marka — kurumsal mavi (güven) */
    --primary:    #f5a623;   /* zümrüt — imza */
    --primary-dim:#e0921a;
    --primary-lt: #ede9e0;
    --secondary:  #f5a623;   /* açık zümrüt — ikincil */
    --secondary-b: #fbc97a;
    --secondary-lt:#fdf3e0;
    --accent:  #f5a623;   /* yeşil-teal — gradient derinliği */
    --accent-b: #fbc97a;
    --accent-ink:#FFFFFF;

    /* Metin — YÜKSEK KONTRAST (yaşlı-dostu) */
    --text:      #0f1e3d;
    --muted:     #566173;
    --faint:     #94a3b8;

    /* Gölge (yumuşak yeşil) */
    --glow-violet: 0 0 0 1px rgba(245,166,35,.20), 0 18px 44px -14px rgba(245,166,35,.32);
    --glow-cyan:   0 0 0 1px rgba(245,166,35,.22), 0 18px 44px -14px rgba(245,166,35,.32);
    --shadow-sm:   0 4px 16px -8px rgba(15,30,61,.18);
    --shadow:      var(--card-shadow, 0 20px 46px -22px rgba(15,30,61,.28));
    --shadow-lg:   0 34px 72px -28px rgba(15,30,61,.34);

    --display: var(--font-family, "Manrope", "Inter", sans-serif);
    --mono:    "JetBrains Mono", ui-monospace, monospace;

    --hdr-1: #0f1e3d;
    --hdr-2: #16294a;

    color-scheme: light;
}

/* ---------- Base ---------- */
html, body { background: var(--bg) !important; color: var(--text) !important; }
body {
    background-image:
        radial-gradient(1200px 700px at 2% -12%, rgba(245,166,35,.08), transparent 56%),
        radial-gradient(1100px 720px at 106% 0%, rgba(245,166,35,.07), transparent 55%),
        radial-gradient(900px 640px at 50% 120%, rgba(245,166,35,.05), transparent 60%),
        linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%) !important;
    background-attachment: fixed !important;
}
main, section, .bg-transparent { background: transparent !important; }
::selection { background: rgba(245,166,35,.18); color: var(--text); }
* { scrollbar-color: var(--primary) transparent; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-thumb { background: linear-gradient(var(--primary), var(--secondary)); border-radius: var(--radius, 20px); border: 3px solid var(--bg); }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- Tipografi ---------- */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5 {
    font-family: var(--display) !important; color: var(--text) !important;
    letter-spacing: -0.02em !important; font-weight: 700 !important;
}
p, span, li, label, td, th { color: var(--text); }
.text-muted, small, .small { color: var(--muted) !important; }
.mono, .tutar, .amount, .price, .fiyat, .fs-mono { font-family: var(--mono) !important; }

.faturaodeme h1, main section h1:first-of-type {
    font-size: clamp(1.7rem, 2.6vw + 1rem, 3rem) !important; line-height: 1.12 !important;
    background: linear-gradient(96deg, #0f1e3d 0%, var(--primary) 45%, var(--accent) 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent !important;
    text-transform: none !important;
}
.faturaodeme h4 { color: var(--muted) !important; font-family: var(--display) !important; font-weight: 500 !important; }
a { color: var(--primary-dim); transition: color .2s ease; }
a:hover { color: var(--primary) !important; }

/* ---------- Header (zümrüt gradient, beyaz yazı) ---------- */
.sticky-header, .sticky-header.active, .pageHeader {
    background:
        radial-gradient(150% 240% at 6% -80%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 46%),
        linear-gradient(108deg, var(--header-bg, var(--headerC1, var(--primary, #0f1e3d))) 0%, var(--header-bg2, var(--headerC2, #16294a)) 60%, var(--header-bg2, var(--headerC2, var(--secondary, #14243f))) 100%) !important;
    -webkit-backdrop-filter: none; backdrop-filter: none;
    border-bottom: 1px solid rgba(255,255,255,.1) !important;
    box-shadow: var(--card-shadow, 0 14px 34px -18px rgba(15,30,61,.5)) !important; position: relative;
}
.sticky-header::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
    background: linear-gradient(90deg, transparent 0%, rgba(251,201,122,.6) 22%, rgba(245,166,35,.85) 50%, rgba(251,201,122,.6) 78%, transparent 100%);
    opacity: .85; pointer-events: none;
}
.sticky-header { padding-top: 0 !important; padding-bottom: 0 !important; }
.sticky-header .py-15px { padding-top: 0 !important; padding-bottom: 0 !important; }
.sticky-header.active { box-shadow: var(--card-shadow, 0 18px 40px -18px rgba(15,30,61,.6)) !important; }
.hdr-container { max-width: 1260px !important; }
.hdr-inner { min-height: 70px; }
.hdr-logo-wrap, .hdr-actions-wrap { flex: 0 0 auto; }
@media (min-width: 1024px) { .hdr-nav-wrap { display: flex !important; flex: 1 1 auto; justify-content: center; align-items: center !important; } }
/* Logo yuksekligi: klasik temada logo .w-logo-sm (150px genislik) ile buyuk cikiyor;
   bu kural onu ezdigi icin temalarda 89x34'e dusup kucuk kaliyordu. 56px -> 147x56
   (dogal oran 950x363). SINIR: .hdr-inner ic yuksekligi 70px; 62px'e kadar header
   yuksekligi degismez, uzerine cikilirsa header'i da buyutmek gerekir. */
header .site-logo img { height: 56px; width: auto; margin-top: 0 !important; transition: transform .25s ease, opacity .2s ease, filter .25s ease; filter: drop-shadow(0 2px 6px rgba(0,0,0,.2)); }
header .site-logo:hover img { transform: translateY(-1px) scale(1.02); opacity: .96; }
header .nav-list a, header .text-whiteColor { color: #fff !important; }
header .hdr-nav-pill, header .rightmenu { height: auto !important; }
.hdr-nav-pill { display: inline-flex !important; align-self: center; align-items: center !important; width: fit-content; margin: 0 auto; gap: 4px !important; background: transparent !important; border: none !important; border-radius: 999px; padding: 0 !important; box-shadow: none !important; }
header .nav-list .hdr-link, header .nav-list .hdr-link span { color: #FFFFFF !important; }
header .nav-list .hdr-link {
    display: inline-flex !important; align-items: center; gap: 8px; padding: 10px 16px; border-radius: var(--radius, 12px); line-height: 1;
    font-size: 15px; font-weight: 600 !important; letter-spacing: .005em; white-space: nowrap; position: relative;
    text-shadow: 0 1px 2px rgba(10,22,46,.28);
    transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
header .nav-list .hdr-link .hdr-link-ic { font-size: 17px; color: rgba(255,255,255,.82); transition: color .2s ease, transform .2s ease; }
header .nav-list .hdr-link:hover { color: #fff !important; background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); transform: translateY(-1px); }
header .nav-list .hdr-link:hover .hdr-link-ic { color: #e7e1d6; transform: translateY(-1px) scale(1.05); }
header .nav-list .hdr-link.is-active, header .nav-list .hdr-link.is-active span { color: #b8770f !important; }
header .nav-list .hdr-link.is-active { background: #FFFFFF; text-shadow: none; box-shadow: var(--card-shadow, 0 8px 18px -8px rgba(10,22,46,.45)); }
header .nav-list .hdr-link.is-active .hdr-link-ic { color: #f5a623; }
.hdr-actions-wrap { position: relative; display: flex !important; align-items: center !important; }
header .rightmenu { gap: 8px; align-items: center !important; margin: 0 !important; padding-left: 0 !important; }
header .nav-list { margin-top: 0 !important; margin-bottom: 0 !important; }
.hamburgermenu, .hamburgermenu .open-mobile-menu { margin: 0 !important; }
@media (min-width: 1024px) { .hdr-actions-wrap::before { content: ""; position: absolute; left: -14px; top: 50%; transform: translateY(-50%); width: 1px; height: 26px; background: rgba(255,255,255,.18); } }
.icon-btn { display: inline-flex !important; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: var(--radius, 11px); background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); color: #fff !important; font-size: 18px; position: relative; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.icon-btn:hover { color: #fff !important; background: rgba(255,255,255,.26); border-color: rgba(255,255,255,.4); transform: translateY(-1px); }
.icon-btn iconify-icon { display: block; line-height: 0; }
.icon-btn img { display: none !important; }
.basketicon { position: relative; }
.basketicon .badge, .hdr-badge {
    position: absolute !important; top: -5px !important; right: -5px !important; min-width: 18px; height: 18px; padding: 0 5px !important;
    display: inline-flex; align-items: center; justify-content: center; font-family: var(--mono) !important; font-size: 10.5px !important; font-weight: 700 !important;
    line-height: 1 !important; border-radius: 999px !important; background: #FFFFFF !important; color: #e0921a !important; border: 2px solid #f5a623 !important; box-shadow: var(--card-shadow, 0 3px 8px -2px rgba(10,22,46,.4)) !important;
}
.hdr-cta {
    display: inline-flex !important; align-items: center; gap: 7px; height: 40px; padding: 0 18px; border-radius: var(--radius, 12px);
    font-weight: 800 !important; font-size: 14px; letter-spacing: .015em; color: #b8770f !important; white-space: nowrap; position: relative; overflow: hidden;
    background: linear-gradient(135deg, #FFFFFF 0%, #fdf3e0 100%);
    box-shadow: var(--card-shadow, 0 8px 20px -6px rgba(10,22,46,.35), inset 0 1px 0 rgba(255,255,255,.6));
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.hdr-cta iconify-icon { font-size: 17px; position: relative; z-index: 1; }
.hdr-cta span { position: relative; z-index: 1; }
.hdr-cta:hover { color: #b8770f !important; transform: translateY(-1px); filter: brightness(1.02); box-shadow: 0 12px 26px -6px rgba(10,22,46,.45); }

/* ---------- Sektör kartları (solid beyaz) ---------- */
.sektorler { gap: 20px !important; }
.sektor {
    background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; border-radius: var(--radius, 20px) !important; color: var(--text) !important;
    box-shadow: var(--card-shadow, var(--shadow-sm)) !important;
    transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, border-color .3s ease !important; position: relative; overflow: hidden;
}
.sektor > svg {
    color: var(--primary) !important; width: 32px !important; height: 32px !important; box-sizing: content-box !important; padding: 15px !important; border-radius: var(--radius, 18px) !important;
    background: linear-gradient(150deg, #ede9e0 0%, #faf8f3 100%) !important; box-shadow: inset 0 0 0 1px rgba(245,166,35,.12) !important;
    transition: background .3s ease, color .3s ease, transform .38s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease !important; overflow: visible !important;
}
.sektor > svg [stroke]:not([stroke="none"]) { stroke: currentColor !important; }
.sektor > svg [fill]:not([fill="none"]) { fill: currentColor !important; }
.sektor span { color: var(--text) !important; font-family: var(--display) !important; letter-spacing: .01em; font-weight: 700; }
.sektor::before { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background: radial-gradient(120% 130% at 50% -25%, rgba(245,166,35,.1), transparent 62%); opacity:0; transition:opacity .3s ease; }
.sektor:hover { transform: translateY(-8px) !important; border-color: rgba(245,166,35,.42) !important; box-shadow: var(--glow-violet) !important; color: var(--text) !important; }
.sektor:hover::before { opacity:1; }
.sektor:hover > svg { color: #ffffff !important; background: linear-gradient(150deg, var(--secondary) 0%, var(--primary) 55%, var(--primary-dim) 100%) !important; box-shadow: 0 16px 28px -10px rgba(245,166,35,.5), inset 0 0 0 1px rgba(255,255,255,.25) !important; transform: translateY(-4px) scale(1.08) rotate(-3deg) !important; }
.sektor.sektor-bayi { background: var(--primary-lt) !important; }
.sektor.sektor-bayi:hover { background: var(--primary-lt) !important; }
.sektor.sektor-bayi .sektor-bayi-ad { color: var(--primary-dim) !important; }

/* ---------- Kurum kartları ---------- */
.kurum { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; border-radius: var(--radius, 14px) !important; color: var(--text) !important; box-shadow: var(--shadow-sm) !important; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease !important; }
.kurum:hover { border-color: rgba(245,166,35,.4) !important; box-shadow: var(--glow-violet) !important; color: var(--text) !important; transform: translateY(-3px); }
.kurum span { color: var(--text) !important; }

/* ---------- 4 adım ---------- */
.circle { background: linear-gradient(150deg, var(--secondary) 0%, var(--primary) 50%, var(--primary-dim) 100%) !important; border: 4px solid #FFFFFF !important; box-shadow: var(--card-shadow, 0 14px 30px -12px rgba(245,166,35,.5), 0 0 0 1px rgba(245,166,35,.12)) !important; position: relative; transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease; }
.circle:hover { transform: translateY(-4px) scale(1.04); box-shadow: 0 22px 44px -14px rgba(245,166,35,.65), 0 0 0 1px rgba(245,166,35,.18) !important; }
.circle .img { mix-blend-mode: screen; }
.circle .img img { filter: none !important; max-width: 44px; height:auto; opacity:1; }
.step .d-block, .circle .d-block { color: var(--text) !important; font-family: var(--display) !important; font-weight:600 !important; }
.faturaodemestepcizgi { opacity:.55; filter: hue-rotate(90deg) saturate(1.3) brightness(1.05); }

/* ---------- Butonlar ---------- */
.odemebutton, .btn-primary, .cuzdan-login-btn, button.odemebutton { background: linear-gradient(120deg, var(--primary) 0%, var(--primary-dim) 100%) !important; border: none !important; color: #FFFFFF !important; font-family: var(--display) !important; font-weight: 800 !important; border-radius: var(--radius, 12px) !important; box-shadow: var(--card-shadow, 0 12px 26px -10px rgba(245,166,35,.5)) !important; transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important; }
.odemebutton:hover, .btn-primary:hover { filter: brightness(1.05) !important; transform: translateY(-2px) !important; box-shadow: 0 18px 36px -10px rgba(245,166,35,.65) !important; color: #FFFFFF !important; }
.btn-success, .odeme-onayla, .btnOde { background: linear-gradient(120deg, var(--secondary) 0%, var(--primary-dim) 100%) !important; border: none !important; color: #FFFFFF !important; box-shadow: var(--card-shadow, 0 12px 26px -10px rgba(245,166,35,.5)) !important; }
.btn-success:hover, .odeme-onayla:hover, .btnOde:hover { filter: brightness(1.05); transform: translateY(-2px); box-shadow: 0 18px 36px -10px rgba(245,166,35,.65) !important; color:#FFFFFF !important; }
.btn-outline-primary { border:1px solid var(--primary) !important; color: var(--primary-dim) !important; background: transparent !important; }
.btn-outline-primary:hover { background: var(--primary-lt) !important; color: var(--primary-dim) !important; }

/* ---------- Genel kart / form / tablo ---------- */
.card, .faturasonuc, .abonenoform, .cuzdan-modal-content, .modal-content { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; color: var(--text) !important; border-radius: var(--radius, 18px) !important; box-shadow: var(--shadow) !important; }
.abonenoform { background: linear-gradient(160deg, #FFFFFF 0%, #faf8f3 100%) !important; }
.form-control, .form-select, input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], textarea, select { background: #FFFFFF !important; color: var(--text) !important; border: 1.5px solid var(--border-2) !important; border-radius: var(--radius, 12px) !important; }
.form-control::placeholder { color: var(--faint) !important; }
.form-control:focus, .form-select:focus, textarea:focus, input:focus { background: #FFFFFF !important; border-color: var(--primary) !important; box-shadow: 0 0 0 4px rgba(245,166,35,.16) !important; color: var(--text) !important; }
.table, .table td, .table th { color: var(--text) !important; border-color: var(--border) !important; }
hr { border-color: var(--border) !important; opacity: 1; }
.text-primary, .text-primaryColor { color: var(--primary-dim) !important; }
.text-black-50 { color: var(--muted) !important; }
.bg-primary { background: var(--primary) !important; }
main img[src*="bankalar"], main img[src*="guven"] { background: #FFFFFF; border-radius: var(--radius, 18px); padding: 20px 24px; box-shadow: var(--shadow); border: 1px solid var(--glass-brd); max-width: 100%; }

.cuzdan-modal-header { border-bottom: 1px solid var(--border) !important; }
.cuzdan-close-btn, .cuzdan-close-btn i { color: #fff !important; }
.icon-frame { background: linear-gradient(145deg, var(--primary), var(--primary-dim)) !important; border-color: rgba(255,255,255,.25) !important; }
.modal-backdrop.show { opacity:.5 !important; background:#062018; }

/* ---------- Footer (koyu yeşil — açık gövdeyle şık kontrast) ---------- */
footer, .footer-top, .footer-bottom {border-top: 1px solid #1e3252 !important; color: #b0a893 !important; position: relative; }
.footer-top::before { content:""; position:absolute; left:0; right:0; top:0; height:2px; background: linear-gradient(90deg, transparent, rgba(245,166,35,.8) 30%, rgba(251,201,122,.6) 60%, transparent); opacity:.75; pointer-events:none; }
footer h4, .footer-top h4 { color: #FFFFFF !important; font-family: var(--display) !important; }
footer p, .footer-top p, footer li, .footer-top li { color: #b0a893 !important; }
footer a, .footer-top a { color: #b0a893 !important; }
footer a:hover, .footer-top a:hover { color: var(--secondary-b) !important; }
.loading { background: rgba(240,250,251,.85) !important; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid var(--primary) !important; outline-offset: 2px; }

/* ============================================================
   HOME.PHP · ortalanmış hero + istatistik/ticker override'ları (AÇIK)
   ============================================================ */
.hero2 .hero-badge { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; color: #3d4a5f !important; box-shadow: var(--card-shadow, 0 8px 22px -12px rgba(15,30,61,.4)) !important; }
.hero2 .hero-badge-dot { background: var(--primary) !important; }
.hero2 .hero-title { color: #0f1e3d !important; }
.hero2 .hero-title .hg { background: linear-gradient(96deg, var(--primary) 0%, var(--accent) 55%, var(--secondary) 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; }
.hero2 .hero-sub { color: #475569 !important; }
.hero2 .hero-sub b { color: var(--primary-dim) !important; }
.hero2 .hero-trust span { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; color: #3d4a5f !important; box-shadow: var(--card-shadow, 0 6px 16px -10px rgba(15,30,61,.3)) !important; }
.hero2 .hero-trust span:hover { border-color: rgba(245,166,35,.4) !important; box-shadow: 0 12px 24px -12px rgba(245,166,35,.4) !important; }
.hero2 .hero-trust .t-ssl svg { color: var(--primary) !important; }
.hero2 .hero-trust .t-fast svg { color: var(--accent) !important; }
.hero2 .hero-trust .t-card svg { color: var(--primary-dim) !important; }
.hero2 .hero-trust .t-clock svg { color: #f5a623 !important; }
.hero2 .hero2-orb.o1 { background: radial-gradient(circle, rgba(245,166,35,.16), transparent 70%) !important; }
.hero2 .hero2-orb.o2 { background: radial-gradient(circle, rgba(245,166,35,.14), transparent 70%) !important; }
.hero2 .hero2-orb.o3 { background: radial-gradient(circle, rgba(245,166,35,.12), transparent 70%) !important; }
/* nokta-grid arka plan → açık zeminde ince yeşil */
.hero2::before { background-image: radial-gradient(rgba(245,166,35,.11) 1px, transparent 1px) !important; opacity: .85 !important; }

/* istatistik tile'ları → solid beyaz kart */
.hero3-stats .hero3-stat { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; box-shadow: var(--card-shadow, 0 10px 28px -16px rgba(15,30,61,.35)) !important; }
.hero3-stats .hero3-stat:hover { border-color: rgba(245,166,35,.4) !important; box-shadow: 0 18px 38px -16px rgba(245,166,35,.35) !important; }
.hero3-stats .hero3-stat b { background: linear-gradient(120deg, var(--primary), var(--accent)) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; }
.hero3-stats .hero3-stat span { color: #566173 !important; }
/* kurum ticker pill'leri → açık */
.hero3-marquee .hero3-kpill { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; color: #3d4a5f !important; box-shadow: var(--card-shadow, 0 4px 14px -10px rgba(15,30,61,.3)) !important; }
.hero3-marquee .hero3-kpill::before { background: var(--primary) !important; box-shadow: var(--card-shadow, 0 0 6px rgba(245,166,35,.5)) !important; }

/* arama input'u — açık, belirgin yeşil vurgu */
.faturaodeme .fatura-search-box input#kurumarama {
    background-color: #FFFFFF !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23F5A623' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
    border: 1.5px solid rgba(245,166,35,.4) !important; color: #0f1e3d !important;
    box-shadow: var(--card-shadow, 0 0 0 4px rgba(245,166,35,.07), 0 22px 50px -24px rgba(15,30,61,.4)) !important;
}
.faturaodeme .fatura-search-box input#kurumarama::placeholder { color: #94a3b8 !important; }
.faturaodeme .fatura-search-box input#kurumarama:focus { border-color: var(--primary) !important; box-shadow: 0 0 0 4px rgba(245,166,35,.18), 0 26px 56px -24px rgba(15,30,61,.5) !important; }
.fatura-search .fatura-search-btn { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dim) 100%) !important; box-shadow: var(--card-shadow, 0 10px 24px -8px rgba(245,166,35,.55)) !important; }
.fatura-search .fatura-search-btn, .fatura-search .fatura-search-btn span, .fatura-search .fatura-search-btn svg { color: #FFFFFF !important; }
.fatura-search-clear { background: #f2efe8 !important; color: #566173 !important; }
.fatura-search-clear:hover { background: #e7e1d6 !important; color: var(--primary-dim) !important; }

/* 4 adım bölümü açık */
.fatura-how { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; box-shadow: var(--card-shadow, 0 34px 80px -38px rgba(15,30,61,.35)) !important; }
.fatura-how-badge { background: var(--primary-lt) !important; color: var(--primary-dim) !important; box-shadow: inset 0 0 0 1px rgba(245,166,35,.14) !important; }
.fatura-how-title { color: #0f1e3d !important; }
.fatura-how-sub { color: #475569 !important; }
.fatura-steps-track { background: #e7e1d6 !important; }
.fatura-step-badge { background: linear-gradient(150deg, #f5a623 0%, var(--primary) 55%, var(--primary-dim) 100%) !important; box-shadow: var(--card-shadow, 0 18px 34px -12px rgba(245,166,35,.55), inset 0 1px 0 rgba(255,255,255,.28)) !important; color:#fff !important; }
.fatura-step-pay .fatura-step-badge { background: linear-gradient(150deg, #fbc97a 0%, var(--accent) 55%, #f5a623 100%) !important; box-shadow: var(--card-shadow, 0 16px 30px -12px rgba(245,166,35,.5), inset 0 1px 0 rgba(255,255,255,.25)) !important; }
.fatura-step-badge svg { color:#fff !important; }
.fatura-step-num { background: #fff !important; color: var(--primary-dim) !important; border: 1px solid #D5EAE1 !important; box-shadow: var(--card-shadow, 0 4px 10px -2px rgba(15,30,61,.3)) !important; }
.fatura-step-pay .fatura-step-num { color: #f5a623 !important; }
.fatura-step-title { color: #0f1e3d !important; }
.fatura-step-desc { color: #566173 !important; }

/* trust band açık */
.trust-band { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; box-shadow: var(--card-shadow, 0 34px 80px -38px rgba(15,30,61,.32)) !important; }
.trust-chip { background: var(--secondary-lt) !important; color: #f5a623 !important; box-shadow: inset 0 0 0 1px rgba(245,166,35,.18) !important; }
.trust-title { color: #0f1e3d !important; }
.trust-title span { background: linear-gradient(96deg, var(--primary), var(--accent)) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; }
.trust-sub { color: #475569 !important; }
.trust-cards { background: linear-gradient(180deg,#fbfaf6 0%,#f2efe8 100%) !important; border: 1px solid var(--glass-brd) !important; }
.trust-badge { background: #fbfaf6 !important; border: 1px solid var(--glass-brd) !important; color: #0f1e3d !important; }
.trust-badge svg { color: var(--primary-dim) !important; }
.trust-badge:hover { border-color: rgba(245,166,35,.4) !important; box-shadow: 0 12px 26px -14px rgba(245,166,35,.5) !important; }

/* ---------- Auth (login/register) açık ---------- */
.login-left { background: linear-gradient(140deg, #e0921a 0%, #f5a623 55%, #f5a623 100%) !important; }
.login-left h2, .login-left p, .login-left .feature-list li, .login-left .feature-list li * { color: #FFFFFF !important; }
.login-left .feature-list li svg [stroke]:not([stroke="none"]) { stroke: #fff !important; }
.btn-login { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dim) 100%) !important; color: #fff !important; }
.btn-login:hover { box-shadow: 0 8px 20px -8px rgba(245,166,35,.5) !important; }
.form-control-login:focus { border-color: var(--primary) !important; box-shadow: 0 0 0 4px rgba(245,166,35,.14) !important; }
.forgot-password a, .register-link a { color: var(--primary-dim) !important; }
.forgot-password a:hover, .register-link a:hover { color: var(--primary) !important; }

/* ============================================================
   SIGORTA BÖLÜMÜ (sigortalar-section.php) · AÇIK override
   ============================================================ */
.sigortalar-section { background: linear-gradient(180deg, #FFFFFF 0%, #fdf3e0 100%) !important; border-top: 1px solid var(--glass-brd) !important; }
.sigortalar-section::before { background: radial-gradient(760px 320px at 12% 0%, rgba(245,166,35,.08), transparent 60%), radial-gradient(640px 320px at 100% 100%, rgba(245,166,35,.07), transparent 60%) !important; }
.sigortalar-section .sigortalar-badge { background: var(--primary-lt) !important; color: var(--primary-dim) !important; box-shadow: inset 0 0 0 1px rgba(245,166,35,.14) !important; }
.sigortalar-section .sigortalar-title { color: #0f1e3d !important; }
.sigortalar-section .sigortalar-title b { background: linear-gradient(96deg, var(--primary), var(--accent)) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; }
.sigortalar-section .sigortalar-subtitle { color: #475569 !important; }
.sigortalar-section .sigorta-card { background: #FFFFFF !important; border: 1px solid var(--glass-brd) !important; box-shadow: var(--card-shadow, 0 2px 14px -6px rgba(15,30,61,.2)) !important; }
.sigortalar-section .sigorta-card::after { background: linear-gradient(90deg, var(--secondary) 0%, var(--primary) 60%, var(--primary-dim) 100%) !important; }
.sigortalar-section .sigorta-card::before { background: radial-gradient(120% 100% at 50% -10%, rgba(245,166,35,.1), transparent 62%) !important; }
.sigortalar-section .sigorta-card:hover { box-shadow: 0 26px 50px -18px rgba(245,166,35,.3) !important; border-color: rgba(245,166,35,.38) !important; }
.sigortalar-section .sigorta-icon { color: var(--primary) !important; background: linear-gradient(145deg, #ede9e0 0%, #faf8f3 100%) !important; box-shadow: inset 0 0 0 1px rgba(245,166,35,.12) !important; }
.sigortalar-section .sigorta-card:hover .sigorta-icon { color: #fff !important; background: linear-gradient(145deg, var(--secondary) 0%, var(--primary) 55%, var(--primary-dim) 100%) !important; box-shadow: 0 14px 26px -10px rgba(245,166,35,.6), inset 0 0 0 1px rgba(255,255,255,.22) !important; }
.sigortalar-section .sigorta-name { color: #0f1e3d !important; }
.sigortalar-section .sigorta-btn { background: var(--primary-lt) !important; color: var(--primary-dim) !important; }
.sigortalar-section .sigorta-btn:hover, .sigortalar-section .sigorta-card:hover .sigorta-btn { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dim) 100%) !important; color: #fff !important; box-shadow: 0 10px 22px -8px rgba(245,166,35,.55) !important; }
.sigortalar-section .sigorta-btn:hover svg, .sigortalar-section .sigorta-card:hover .sigorta-btn svg { color: #fff !important; }
.sigortalar-section .sigorta-cta { background: linear-gradient(120deg, #0f1e3d 0%, #e0921a 55%, #f5a623 100%) !important; box-shadow: var(--card-shadow, 0 26px 54px -26px rgba(15,30,61,.6)) !important; }
.sigortalar-section .sigorta-cta::before { background: radial-gradient(circle, rgba(251,201,122,.3), transparent 60%) !important; }
.sigortalar-section .sigorta-cta-ic { background: rgba(255,255,255,.14) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.22) !important; color: #fff !important; }
.sigortalar-section .sigorta-cta-text strong { color: #fff !important; }
.sigortalar-section .sigorta-cta-text span { color: rgba(255,255,255,.85) !important; }
.sigortalar-section .sigorta-cta-btn { background: #fff !important; color: #e0921a !important; box-shadow: var(--card-shadow, 0 12px 26px -10px rgba(0,0,0,.3)) !important; }
.sigortalar-section .sigorta-cta-btn:hover { color: #0f1e3d !important; }
/* yüzen sigorta butonu — açık kart, logo okunur */
.sfb-card { background: #FFFFFF !important; border: 1px solid rgba(245,166,35,.3) !important; }
.sfb-logo { filter: none !important; }
.sfb-tag { background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) !important; color: #fff !important; }


/* ============================================================
   THEME ENGINE — Yerleşim tüketim katmanı
   Admin panelindeki button_style / card_style / header_style ayarları
   <html> üzerine data-* attribute olarak basılır; buradaki kurallar uygular.
   Ayar seçilmezse attribute yok → aşağıdaki kurallar devreye girmez, mevcut tasarım kalır.
   (border_radius/--radius ve font_family/--font-family yukarıda ilgili bileşenlerde tüketiliyor.)
   ============================================================ */

/* --- Buton stili --- */
[data-button-style="pill"] .btn,
[data-button-style="pill"] .odemebutton,
[data-button-style="pill"] .btn-primary,
[data-button-style="pill"] .btn-success,
[data-button-style="pill"] .cuzdan-login-btn,
[data-button-style="pill"] .sigorta-btn,
[data-button-style="pill"] .fatura-search-btn,
[data-button-style="pill"] .sigorta-cta-btn { border-radius: 999px !important; }

[data-button-style="outline"] .odemebutton,
[data-button-style="outline"] .btn-primary,
[data-button-style="outline"] .btn-success,
[data-button-style="outline"] .cuzdan-login-btn,
[data-button-style="outline"] .sigorta-btn,
[data-button-style="outline"] .fatura-search-btn {
    background: transparent !important;
    color: var(--primary) !important;
    border: 2px solid var(--primary) !important;
    box-shadow: none !important;
}
/* outline: buton içi metin/ikon da primary olsun (aksi halde beyaz yazı şeffaf zeminde kaybolur) */
[data-button-style="outline"] .odemebutton *,
[data-button-style="outline"] .btn-primary *,
[data-button-style="outline"] .cuzdan-login-btn *,
[data-button-style="outline"] .sigorta-btn *,
[data-button-style="outline"] .fatura-search-btn * {
    color: var(--primary) !important;
    -webkit-text-fill-color: var(--primary) !important;
}
[data-button-style="outline"] .odemebutton:hover,
[data-button-style="outline"] .btn-primary:hover,
[data-button-style="outline"] .btn-success:hover,
[data-button-style="outline"] .cuzdan-login-btn:hover,
[data-button-style="outline"] .sigorta-btn:hover,
[data-button-style="outline"] .fatura-search-btn:hover {
    background: var(--primary) !important;
    color: #fff !important;
}
[data-button-style="outline"] .sigorta-btn:hover *,
[data-button-style="outline"] .fatura-search-btn:hover * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* --- Kart stili --- (genel .card + ana sayfadaki görünür kart sınıfları) */
[data-card-style="flat"] .card,
[data-card-style="flat"] .faturasonuc,
[data-card-style="flat"] .abonenoform,
[data-card-style="flat"] .sigorta-card,
[data-card-style="flat"] .t-card,
[data-card-style="flat"] .sfb-card,
[data-card-style="flat"] .cuzdan-app-card,
[data-card-style="flat"] .fatura-search-box,
[data-card-style="flat"] .cuzdan-info-box,
[data-card-style="flat"] .sektor,
[data-card-style="flat"] .pop-panel,
[data-card-style="flat"] .hero3-stat,
[data-card-style="flat"] .fatura-how { box-shadow: none !important; border: 1px solid var(--border) !important; }

[data-card-style="elevated"] .card,
[data-card-style="elevated"] .faturasonuc,
[data-card-style="elevated"] .abonenoform,
[data-card-style="elevated"] .sigorta-card,
[data-card-style="elevated"] .t-card,
[data-card-style="elevated"] .sfb-card,
[data-card-style="elevated"] .cuzdan-app-card,
[data-card-style="elevated"] .fatura-search-box,
[data-card-style="elevated"] .cuzdan-info-box,
[data-card-style="elevated"] .sektor,
[data-card-style="elevated"] .pop-panel,
[data-card-style="elevated"] .hero3-stat,
[data-card-style="elevated"] .fatura-how { box-shadow: var(--shadow-lg) !important; }

[data-card-style="glass"] .card,
[data-card-style="glass"] .faturasonuc,
[data-card-style="glass"] .abonenoform,
[data-card-style="glass"] .sigorta-card,
[data-card-style="glass"] .t-card,
[data-card-style="glass"] .sfb-card,
[data-card-style="glass"] .cuzdan-app-card,
[data-card-style="glass"] .fatura-search-box,
[data-card-style="glass"] .cuzdan-info-box,
[data-card-style="glass"] .sektor,
[data-card-style="glass"] .pop-panel,
[data-card-style="glass"] .hero3-stat,
[data-card-style="glass"] .fatura-how {
    background: rgba(255,255,255, var(--glass-opacity, .65)) !important;
    -webkit-backdrop-filter: blur(var(--blur-radius, 14px));
    backdrop-filter: blur(var(--blur-radius, 14px));
    border: 1px solid rgba(255,255,255,.55) !important;
}

/* --- Header stili (gradient = varsayılan) --- */
[data-header-style="solid"] .sticky-header,
[data-header-style="solid"] .sticky-header.active,
[data-header-style="solid"] .pageHeader {
    background: var(--header-bg, var(--primary, #0f1e3d)) !important;
}
[data-header-style="glass"] .sticky-header,
[data-header-style="glass"] .sticky-header.active,
[data-header-style="glass"] .pageHeader {
    background: linear-gradient(108deg, rgba(10,56,143, var(--glass-opacity, .6)), rgba(30,90,240, var(--glass-opacity, .6))) !important;
    -webkit-backdrop-filter: blur(var(--blur-radius, 12px));
    backdrop-filter: blur(var(--blur-radius, 12px));
}

/* --- Efektler ---
   transition_speed → etkileşimli öğelerin geçiş süresi (--transition-speed).
   hover_scale → butonlarda hover büyümesi (--hover-scale; 1 = etkisiz).
   glass_opacity / blur_radius → yukarıdaki "glass" kart/header stillerinde tüketiliyor. */
a, .btn, .odemebutton, .btn-primary, .btn-success, .cuzdan-login-btn {
    transition-duration: var(--transition-speed, .18s) !important;
}
.odemebutton:hover, .btn-primary:hover, .btn-success:hover, .cuzdan-login-btn:hover {
    transform: translateY(-2px) scale(var(--hover-scale, 1)) !important;
}