/* =========================================
   Seri Döviz — Royal Gold Tema (güncel)
   ========================================= */

/* Temalar */
:root[data-theme="seridoviz-dark"] {
    --sg-bg: #0b1621;
    --sg-surface: #0f1a27;
    --sg-surface-2: #0c1723;
    --sg-border: #1a2a3c;
    --sg-text: #eef3f8;
    --sg-muted: #9cb2ca;
    --sg-gold: #d4af37;
    --sg-gold-2: #b8891e;
    --sg-glow: rgba(212,175,55,.35);
    --sg-shadow: 0 12px 32px rgba(0,0,0,.35);
    --sg-nav-glow: linear-gradient(90deg, rgba(212,175,55,.0) 0%, rgba(212,175,55,.55) 35%, rgba(184,137,30,.55) 65%, rgba(212,175,55,.0) 100%);
    --sg-ink: rgba(212,175,55,.45);
}

:root[data-theme="seridoviz-light"] {
    --sg-bg: #f6f8fc;
    --sg-surface: #ffffff;
    --sg-surface-2: #eff2f7;
    --sg-border: #d8e0ea;
    --sg-text: #17202b;
    --sg-muted: #5a6f86;
    --sg-gold: #b8901f;
    --sg-gold-2: #9c7717;
    --sg-glow: rgba(184,144,31,.25);
    --sg-shadow: 0 10px 24px rgba(0,0,0,.10);
    --sg-nav-glow: linear-gradient(90deg, rgba(184,144,31,.0) 0%, rgba(184,144,31,.45) 35%, rgba(156,119,23,.45) 65%, rgba(184,144,31,.0) 100%);
    --sg-ink: rgba(184,144,31,.3);
}

/* Global */
html, body {
    height: 100%
}

html {
    scroll-behavior: smooth
}

.sg-body {
    background: var(--sg-bg);
    color: var(--sg-text);
    transition: color .2s, background-color .2s, border-color .2s;
}

/* Ambient uzay/ikon kayma */
.sg-ambient {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

    .sg-ambient .float {
        position: absolute;
        opacity: .06;
        filter: blur(1.5px);
        font-size: clamp(26px,4vw,56px);
        color: var(--sg-text);
        animation: drift var(--t,18s) linear infinite;
        user-select: none;
    }

@keyframes drift {
    0% {
        transform: translate3d(var(--x,0), 110vh, 0) rotate(0)
    }

    100% {
        transform: translate3d(calc(var(--x,0) + 6vw), -20vh, 0) rotate(180deg)
    }
}

/* NAVBAR */
.sg-navbar.fixed-top {
    z-index: 1100;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    padding-top: env(safe-area-inset-top);
    background: color-mix(in srgb, var(--sg-surface) 96%, transparent);
    border-bottom: 1px solid var(--sg-border);
    transition: background .25s, box-shadow .25s, border-color .2s;
}

.sg-navbar.scrolled {
    background: color-mix(in srgb, var(--sg-surface) 99%, black 1%);
    box-shadow: 0 8px 28px rgba(0,0,0,.18);
}

.sg-navbar .navbar {
    padding-block: .55rem
}

/* NAV glass alt parlama çizgisi */
.nav-glow {
    height: 2px;
    background: var(--sg-nav-glow);
    box-shadow: 0 0 24px rgba(0,0,0,.12) inset;
}

/* NAV GRID */
.sg-navbar .container-xxl.sg-navgrid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
}

.sg-left {
    justify-self: start
}

.sg-brand {
    justify-self: center;
    position: relative
}

.sg-right {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: .5rem
}

/* Logo boyutu (değişken) */
:root {
    --nav-brand-h: 200px;
    --nav-link-size: 1.08rem;
}

@media (max-width: 1199.98px) {
    :root {
        --nav-brand-h: 84px
    }
}

@media (max-width: 991.98px) {
    :root {
        --nav-brand-h: 72px
    }
}

@media (max-width: 575.98px) {
    :root {
        --nav-brand-h: 60px
    }
}

.sg-navbar .navbar .brand-logo {
    height: var(--nav-brand-h);
    width: auto;
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 8px 24px rgba(0,0,0,.25));
    transition: transform .25s ease, filter .25s ease;
}

    .sg-navbar .navbar .brand-logo:hover {
        transform: translateY(-2px)
    }

/* Logo halka/ışık efekti (cafcaf) */
.brand-ring {
    position: absolute;
    inset: auto;
    width: calc(var(--nav-brand-h) * .82);
    height: calc(var(--nav-brand-h) * .82);
    border-radius: 999px;
    z-index: -1;
    filter: blur(16px);
    background: radial-gradient(60% 60% at 50% 50%, var(--sg-glow) 0%, transparent 70%);
    transform: translateY(4px);
}

/* İçerik boşluğu */
.sg-main {
    padding-top: calc(var(--nav-brand-h) + 28px) !important;
}

@media (max-width: 991.98px) {
    .sg-main {
        padding-top: calc(var(--nav-brand-h) + 22px) !important
    }
}

/* Nav link */
.sg-nav .nav-link {
    color: var(--sg-text) !important;
    opacity: .95;
    position: relative;
    padding: .85rem 1.1rem;
    font-size: var(--nav-link-size);
    transition: color .2s, opacity .2s, transform .2s;
}

    .sg-nav .nav-link:hover {
        color: var(--sg-gold) !important;
        opacity: 1;
        transform: translateY(-1px)
    }

    .sg-nav .nav-link.active, .sg-nav .nav-link.show {
        color: var(--sg-gold) !important
    }

    .sg-nav .nav-link::after {
        content: "";
        position: absolute;
        left: 1rem;
        right: 1rem;
        bottom: .15rem;
        height: 2px;
        background: linear-gradient(90deg,var(--sg-gold),var(--sg-gold-2));
        transform: scaleX(0);
        transform-origin: left;
        transition: transform .25s;
    }

    .sg-nav .nav-link:hover::after, .sg-nav .nav-link.active::after {
        transform: scaleX(1)
    }

@media (min-width: 992px) {
    .sg-navbar .navbar {
        padding-top: .45rem;
        padding-bottom: .06rem
    }

    .sg-navbar .container-xxl.sg-navgrid {
        align-items: end
    }

    .sg-navbar .sg-brand {
        align-self: center
    }

    .sg-navbar .sg-left, .sg-navbar .sg-right {
        display: flex;
        align-items: flex-end
    }

    .sg-navbar .sg-nav .nav-link {
        padding-top: .55rem;
        padding-bottom: .22rem;
        line-height: 1.05
    }

        .sg-navbar .sg-nav .nav-link::after {
            bottom: .05rem
        }

    .sg-navbar .icon-btn.lg {
        margin-bottom: .06rem
    }
}

/* Butonlar / Icon btn */
.btn-gold-outline {
    --bs-btn-color: var(--sg-gold);
    --bs-btn-border-color: var(--sg-gold);
    --bs-btn-hover-bg: var(--sg-gold);
    --bs-btn-hover-color: #111;
    --bs-btn-hover-border-color: var(--sg-gold-2);
    --bs-btn-active-bg: var(--sg-gold-2);
    --bs-btn-active-border-color: var(--sg-gold-2);
    --bs-btn-focus-shadow-rgb: 212,175,55;
}

.icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    color: var(--sg-text);
    opacity: .95;
    text-decoration: none;
    background: transparent;
    border: 1px solid var(--sg-border);
    transition: color .2s,background-color .2s,border-color .2s,opacity .2s,transform .2s;
}

    .icon-btn:hover {
        opacity: 1;
        color: #111;
        background: var(--sg-gold);
        border-color: var(--sg-gold);
        transform: translateY(-1px)
    }

    .icon-btn.lg {
        width: 44px;
        height: 44px;
        border-radius: 12px
    }

#themeBtn {
    padding: .5rem .8rem;
    border-radius: 10px;
    font-weight: 600
}

/* Tipografi & alt tonlar */
:root[data-theme="seridoviz-dark"] {
    --sg-muted-strong: color-mix(in srgb,var(--sg-text) 86%, var(--sg-bg) 14%)
}

:root[data-theme="seridoviz-light"] {
    --sg-muted-strong: color-mix(in srgb,var(--sg-text) 68%, var(--sg-bg) 32%)
}

.text-muted {
    color: var(--sg-muted-strong) !important;
    opacity: 1 !important
}

.text-subtle {
    color: color-mix(in srgb,var(--sg-text) 64%, var(--sg-bg) 36%) !important
}

.text-gold {
    color: var(--sg-gold) !important
}

/* Gold animasyonlu başlık */
.gold-sheen {
    background: linear-gradient(90deg,var(--sg-gold) 0%,var(--sg-gold-2) 50%,var(--sg-gold) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: sheen 3s linear infinite;
    background-size: 200% 100%;
}

@keyframes sheen {
    0% {
        background-position: 0% 50%
    }

    100% {
        background-position: 200% 50%
    }
}

/* Kartlar */
.sg-card {
    background: var(--sg-surface);
    border: 1px solid var(--sg-border);
    border-radius: 16px;
    box-shadow: var(--sg-shadow);
    position: relative;
    z-index: 1;
    transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s, transform .2s;
}

    .sg-card.gold-border::before {
        content: "";
        position: absolute;
        inset: -1px;
        border-radius: 17px;
        padding: 1px;
        background: linear-gradient(135deg,transparent 20%,var(--sg-gold) 50%,transparent 80%);
        -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
    }

/* Hover parıltı */
[data-glow]:hover {
    box-shadow: 0 0 0 4px var(--sg-glow), 0 16px 36px rgba(0,0,0,.25);
    transform: translateY(-2px)
}

/* “Flash-up” (price tick) */
@keyframes flashUp {
    0% {
        box-shadow: 0 0 0 0 rgba(25,195,125,.0)
    }

    40% {
        box-shadow: 0 0 0 6px rgba(25,195,125,.22)
    }

    100% {
        box-shadow: 0 0 0 0 rgba(25,195,125,.0)
    }
}

.flash-up {
    animation: flashUp .6s ease-out
}

/* Footer */
.sg-footer {
    background: var(--sg-surface-2);
    border-top: 1px solid var(--sg-border);
    transition: color .2s, background-color .2s, border-color .2s
}

/* To top */
.to-top {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1030;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all .2s
}

    .to-top.show {
        opacity: 1;
        visibility: visible;
        transform: translateY(0)
    }

/* Ripple */
.sg-ripple {
    position: absolute;
    border-radius: 999px;
    background: color-mix(in srgb,var(--sg-gold) 26%, white 8%);
    transform: scale(.2);
    opacity: .5;
    pointer-events: none;
    animation: ripple .5s ease-out forwards;
}

@keyframes ripple {
    to {
        transform: scale(2.8);
        opacity: 0
    }
}

/* Ticker */
.ticker-wrap {
    border-block: 1px solid var(--sg-border);
    background: var(--sg-surface-2);
    margin: .5rem 0 1rem;
    overflow: hidden
}

.ticker {
    white-space: nowrap;
    overflow: hidden
}

.ticker__track {
    display: inline-block;
    padding-block: 10px;
    animation: scroll 28s linear infinite
}

.ticker__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 180px;
    padding: 0 18px;
    border-right: 1px solid var(--sg-border)
}

    .ticker__item .lbl {
        color: var(--sg-muted-strong);
        font-size: .9rem
    }

    .ticker__item .val {
        font-weight: 700
    }

.ticker:hover .ticker__track {
    animation-play-state: paused
}

@keyframes scroll {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(-50%)
    }
}

.rise {
    color: #19c37d
}

.drop {
    color: #ff6a6a
}

/* Tablo & input teması */
.sg-table {
    --bs-table-color: var(--sg-text);
    --bs-table-bg: var(--sg-surface);
    --bs-table-border-color: var(--sg-border);
    --bs-table-striped-bg: color-mix(in srgb,var(--sg-surface) 92%, black 8%);
    --bs-table-hover-bg: color-mix(in srgb,var(--sg-surface) 88%, black 12%);
}

    .sg-table thead th {
        background: var(--sg-surface-2);
        color: var(--sg-muted-strong);
        border-bottom: 1px solid var(--sg-border);
        position: sticky;
        top: 0;
        z-index: 1
    }

.sg-input .input-group-text, .sg-input .form-control, .sg-input .form-select, .sg-input textarea {
    background: var(--sg-surface-2);
    color: var(--sg-text);
    border-color: var(--sg-border);
}

    .sg-input .form-control::placeholder, .sg-input textarea::placeholder {
        color: var(--sg-muted-strong);
        opacity: .9
    }

    .sg-input .form-control:focus, .sg-input .form-select:focus, .sg-input textarea:focus {
        border-color: var(--sg-gold-2);
        box-shadow: 0 0 0 .2rem var(--sg-glow)
    }

/* FAQ koyu */
.accordion-button {
    background: var(--sg-surface-2);
    color: var(--sg-text);
    box-shadow: none !important
}

    .accordion-button:not(.collapsed) {
        background: color-mix(in srgb,var(--sg-surface-2) 85%, black 15%);
        color: var(--sg-text)
    }

.accordion-item {
    border-color: var(--sg-border)
}

.accordion-body {
    background: var(--sg-surface);
    color: var(--sg-text);
    border-top: 1px solid var(--sg-border)
}

.accordion-collapse {
    background: var(--sg-surface)
}

.accordion-button:focus {
    border-color: var(--sg-gold-2);
    box-shadow: 0 0 0 .2rem var(--sg-glow) !important
}

/* Hero & pariteler */
.sg-hero .rates-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
    gap: 12px
}

.rate-card {
    padding: 14px;
    cursor: pointer
}

    .rate-card .delta-badge {
        margin-top: 8px;
        font-size: .82rem;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: .2rem .5rem;
        border-radius: .5rem;
        border: 1px solid var(--sg-border);
        background: rgba(255,255,255,.03)
    }

/* Anchor offset */
.sg-anchor {
    scroll-margin-top: 88px
}

/* Loader */
.page-loader {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15,20,27,.35);
    backdrop-filter: blur(6px) saturate(120%);
    z-index: 2147483000;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s, visibility .2s;
}

    .page-loader.show {
        opacity: 1;
        visibility: visible
    }

    .page-loader .box {
        background: rgba(23,28,37,.92);
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 14px;
        padding: 14px 18px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #d9e1ee;
        box-shadow: 0 10px 36px rgba(0,0,0,.35)
    }

/* Toast */
.toast-seri {
    background: color-mix(in srgb, var(--sg-surface) 96%, black 4%);
    color: var(--sg-text);
    border: 1px solid var(--sg-border);
    box-shadow: 0 10px 28px rgba(0,0,0,.28)
}

    .toast-seri .toast-header {
        background: var(--sg-surface-2);
        color: var(--sg-text);
        border-bottom-color: var(--sg-border)
    }

    .toast-seri .btn-close {
        filter: invert(1) opacity(.85)
    }

/* Yasal Uyarı Bant */
.notice-bar {
    position: relative;
    background: linear-gradient(135deg, color-mix(in srgb,var(--sg-gold) 18%, transparent) 0%, transparent 55%), color-mix(in srgb, var(--sg-surface-2) 92%, black 8%);
    border-bottom: 1px solid var(--sg-border);
    color: var(--sg-text);
    opacity: 0;
    transform: translateY(-6px);
    animation: nbFade .28s ease-out forwards;
    z-index: 1035;
}

    .notice-bar .bi-exclamation-octagon-fill {
        color: color-mix(in srgb, var(--sg-gold) 85%, var(--sg-gold-2) 15%);
        font-size: 1.1rem
    }

    .notice-bar .btn-close {
        filter: invert(1) opacity(.85)
    }

@keyframes nbFade {
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

/* Tablo altı mini uyarı */
.legal-inline {
    margin-top: .35rem;
    font-size: .85rem;
    color: color-mix(in srgb, var(--sg-text) 88%, var(--sg-bg) 12%)
}

    .legal-inline i {
        color: color-mix(in srgb, var(--sg-gold) 85%, var(--sg-gold-2) 15%)
    }

/* Reveal & Tilt */
.reveal {
    opacity: 0;
    transform: translateY(10px) scale(.98);
    transition: opacity .5s ease, transform .5s ease
}

    .reveal.show {
        opacity: 1;
        transform: none
    }

.tilt {
    transform-style: preserve-3d;
    perspective: 600px
}

    .tilt:hover {
        transition: transform .12s ease-out
    }

/* Mobil tablo kompakt */
@media (max-width:576px) {
    table.market-table {
        table-layout: fixed
    }

        table.market-table th, table.market-table td {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: .92rem
        }

            table.market-table th:nth-child(1), table.market-table td:nth-child(1) {
                width: 42%
            }

            table.market-table th:nth-child(2), table.market-table td:nth-child(2) {
                width: 22%;
                text-align: right
            }

            table.market-table th:nth-child(3), table.market-table td:nth-child(3) {
                width: 22%;
                text-align: right
            }

            table.market-table th:nth-child(4), table.market-table td:nth-child(4) {
                width: 14%;
                text-align: right
            }

            table.market-table td:first-child .ms-1 {
                display: inline-block;
                max-width: calc(100% - 22px);
                overflow: hidden;
                text-overflow: ellipsis;
                vertical-align: bottom
            }
}

/* Alt mobil tab bar (cafcaflı & “ink” animasyon) */
.sg-bottomnav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1035;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 2px;
    background: var(--sg-surface-2);
    border-top: 1px solid var(--sg-border);
    padding: 6px max(12px, env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-right));
    backdrop-filter: blur(8px);
}

    .sg-bottomnav .bn-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        padding: 6px 4px;
        text-decoration: none;
        color: var(--sg-text);
        opacity: .95;
        border-radius: 12px;
        transition: opacity .2s, background-color .2s, color .2s, transform .2s;
        position: relative;
    }

        .sg-bottomnav .bn-item i {
            font-size: 18px;
            line-height: 1
        }

        .sg-bottomnav .bn-item span {
            font-size: 11px;
            line-height: 1
        }

        .sg-bottomnav .bn-item:hover {
            opacity: 1;
            background: color-mix(in srgb, var(--sg-surface) 88%, black 12%);
            transform: translateY(-1px)
        }

        .sg-bottomnav .bn-item.active {
            color: var(--sg-gold)
        }

    .sg-bottomnav .bn-ink {
        position: absolute;
        height: 38px;
        width: calc(25% - 8px);
        bottom: 6px;
        left: 6px;
        border-radius: 12px;
        background: var(--sg-ink);
        filter: blur(8px);
        opacity: .55;
        transition: transform .25s ease, width .25s ease;
        pointer-events: none;
    }

/* Mobilde çakışma korumaları */
@media (max-width: 991.98px) {
    .to-top {
        bottom: 80px
    }

    .sg-main {
        padding-bottom: 84px
    }
    /* tab bar için boşluk */
    .sg-footer {
        padding-bottom: calc(84px + max(12px, env(safe-area-inset-bottom)))
    }
}

/* Toggle group (index) */
.toggle-group {
    --tg-bg: var(--sg-surface-2);
    --tg-bd: var(--sg-border);
    --tg-hover: color-mix(in srgb, var(--sg-surface) 92%, black 8%);
    display: inline-grid;
    grid-auto-flow: column;
    gap: 6px;
    padding: 4px;
    border: 1px solid var(--tg-bd);
    border-radius: 14px;
    background: var(--tg-bg);
    box-shadow: 0 6px 18px rgba(0,0,0,.12) inset;
}

    .toggle-group .toggle {
        appearance: none;
        border: 0;
        background: transparent;
        color: var(--sg-text);
        font-weight: 600;
        letter-spacing: .2px;
        padding: 8px 14px;
        border-radius: 10px;
        line-height: 1.1;
        transition: background-color .18s, color .18s, transform .15s, box-shadow .2s;
        position: relative;
    }

        .toggle-group .toggle:hover:not(.active) {
            background: var(--tg-hover)
        }

        .toggle-group .toggle:active:not(.active) {
            transform: translateY(1px)
        }

        .toggle-group .toggle.active {
            color: #111;
            background: linear-gradient(135deg, var(--sg-gold) 0%, var(--sg-gold-2) 100%);
            box-shadow: 0 0 0 .12rem var(--sg-glow), 0 8px 22px rgba(0,0,0,.25)
        }

        .toggle-group .toggle::after {
            content: "";
            position: absolute;
            left: 12px;
            right: 12px;
            bottom: 6px;
            height: 2px;
            border-radius: 2px;
            background: linear-gradient(90deg, var(--sg-gold), var(--sg-gold-2));
            transform: scaleX(0);
            transform-origin: left;
            transition: transform .22s ease;
            opacity: .65;
        }

        .toggle-group .toggle:hover::after {
            transform: scaleX(.6)
        }

        .toggle-group .toggle.active::after {
            transform: scaleX(1)
        }

        .toggle-group .toggle:focus-visible {
            outline: none;
            box-shadow: 0 0 0 .18rem var(--sg-glow)
        }

    .toggle-group.compact .toggle {
        padding: 6px 10px;
        font-weight: 600
    }

    .toggle-group.compact {
        gap: 4px;
        padding: 3px
    }

/* Form rahat dokunma */
.sg-input .form-control-lg, .sg-input .form-select-lg {
    min-height: 46px
}

@media (max-width:576px) {
    .sg-input .form-control-lg, .sg-input .form-select-lg {
        font-size: 1rem
    }
}

/* Modal tema uyumu */
.modal-seri .modal-content {
    background: var(--sg-surface);
    color: var(--sg-text);
    border: 1px solid var(--sg-border)
}

.modal-seri .modal-header {
    background: var(--sg-surface-2);
    border-bottom-color: var(--sg-border)
}

.modal-seri .modal-footer {
    background: var(--sg-surface-2);
    border-top-color: var(--sg-border)
}

.modal-seri .btn-close {
    filter: invert(1) opacity(.85)
}
/* === NAV: iri "pill" linkler + ekstra alt boşluk === */
:root {
    --nav-link-size: 1.15rem;
    --nav-link-pad-y: .70rem;
    --nav-link-pad-x: 1.10rem;
    --nav-gap-bottom: 24px; /* nav alt boşluk */
}

@media (min-width: 992px) {
    :root {
        --nav-link-size: 1.22rem;
        --nav-link-pad-y: .90rem;
        --nav-link-pad-x: 1.25rem;
        --nav-gap-bottom: 32px;
    }
}

/* Kapsül link görünümü */
.sg-nav .nav-link {
    font-weight: 700;
    font-size: var(--nav-link-size);
    padding: var(--nav-link-pad-y) var(--nav-link-pad-x);
    border-radius: 999px;
    border: 1px solid var(--sg-border);
    background: color-mix(in srgb, var(--sg-surface) 88%, black 12%);
    color: var(--sg-text) !important;
    opacity: 1;
    transform: translateY(0);
}

    /* Alttaki ince underline efektini kapat */
    .sg-nav .nav-link::after {
        display: none;
    }

    /* Hover/aktif hâli — gold degrade */
    .sg-nav .nav-link:hover {
        color: #111 !important;
        background: linear-gradient(135deg, var(--sg-gold) 0%, var(--sg-gold-2) 100%);
        border-color: var(--sg-gold-2);
        transform: translateY(-1px);
    }

    .sg-nav .nav-link.active {
        color: #111 !important;
        background: linear-gradient(135deg, var(--sg-gold) 0%, var(--sg-gold-2) 100%);
        border-color: var(--sg-gold-2);
        box-shadow: 0 0 0 .12rem var(--sg-glow);
    }

/* Navbar’ın altındaki dikey boşluğu artır */
.sg-navbar .navbar {
    padding-bottom: calc(var(--nav-gap-bottom) * .6);
}

@media (min-width: 992px) {
    .sg-navbar .navbar {
        padding-bottom: var(--nav-gap-bottom);
    }
}

/* İçerik üst boşluğunu, büyüyen nav’a göre artır */
.sg-main {
    padding-top: calc(var(--nav-brand-h) + var(--nav-gap-bottom) + 36px) !important;
}

@media (max-width: 991.98px) {
    .sg-main {
        padding-top: calc(var(--nav-brand-h) + var(--nav-gap-bottom) + 24px) !important;
    }
}
/* === Click-through + responsive hotfixes (global) === */

/* Ticker üstünden tıklama engeli kalksın */
.ticker__track {
    pointer-events: none;
}

/* Glow / reveal pseudo-overlay'ler tıklamayı kapatmasın */
.reveal::before,
.reveal::after,
.sg-card[data-glow]::before,
.sg-card[data-glow]::after {
    pointer-events: none !important;
}

/* Kartların içi garanti tıklanabilir olsun */
#homeList, #fxCard {
    position: relative;
    z-index: 3;
}

    #homeList .market-table i,
    #fxCard .market-table i {
        cursor: pointer;
    }

    /* Arama grupları mobile sarılsın, input genişlesin */
    #homeList .sg-input,
    #fxCard .sg-input {
        flex-wrap: wrap;
        gap: .5rem;
    }

        #homeList .sg-input .form-control,
        #fxCard .sg-input .form-control {
            flex: 1 1 220px;
            min-width: 0;
        }

    /* Tablo container taşarsa yatay kaydır */
    #homeList .table-responsive,
    #fxCard .table-responsive {
        overflow-x: auto;
    }

/* Küçük ekranlarda kolon sadeleştirme */
@media (max-width:576px){
  .price small{ font-size:.85em }
  .price .rise, .price .drop{ font-weight:600 }
}
@media (max-width:576px) {
    .price small {
        font-size: .85em
    }

    .price .rise, .price .drop {
        font-weight: 600
    }
}
@media (max-width: 390px) {
    .market-table th:nth-child(2),
    .market-table td:nth-child(2) {
        display: none;
    }
    /* Alış gizle */
    .market-table th:nth-child(3)::before {
        content: 'Fiyat';
    }
    /* Satış başlığı -> Fiyat */
}
/* Mobil tablo düzeni */
@media (max-width:576px) {
    table.market-table {
        table-layout: fixed;
    }

        /* 1: Ürün/Parite (yıldız + isim) */
        table.market-table th:nth-child(1),
        table.market-table td:nth-child(1) {
            width: 46%;
        }

        /* 2: Alış */
        table.market-table th:nth-child(2),
        table.market-table td:nth-child(2) {
            width: 22%;
            text-align: right;
        }

        /* 3: Satış (+ inline değişim) */
        table.market-table th:nth-child(3),
        table.market-table td:nth-child(3) {
            width: 32%;
            text-align: right;
        }

        /* 4. kolon xs’de tamamen gizli (başlık + hücre) */
        table.market-table th:nth-child(4),
        table.market-table td:nth-child(4) {
            display: none;
        }

    /* Satış hücresindeki inline % değişim */
    .inl-chg {
        margin-left: .25rem;
        white-space: nowrap;
        font-size: .86rem;
    }

        .inl-chg i {
            font-size: .9em;
            vertical-align: middle;
            margin-right: 2px;
        }
}
/* --- CLICK FIX: parıltı/overlay tıklamayı engellemesin --- */
.sg-card::before,
.sg-card::after,
.sg-card.gold-border::before {
    pointer-events: none !important;
}

/* --- Arama ve içerik katmanı tıklanabilir kalsın --- */
#homeList, #fxCard {
    position: relative;
    z-index: 3;
}

/* --- Ticker üstünden tıklama pasif --- */
.ticker__track {
    pointer-events: none;
}

/* --- MOBİL TABLO (≤576px): 4. kolon gizli, % değişim “Satış” içinde --- */
@media (max-width:576px) {
    table.market-table {
        table-layout: fixed;
    }

        table.market-table th,
        table.market-table td {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: .92rem;
        }

            /* 1: Ürün/Parite */
            table.market-table th:nth-child(1),
            table.market-table td:nth-child(1) {
                width: 46%;
            }

            /* 2: Alış */
            table.market-table th:nth-child(2),
            table.market-table td:nth-child(2) {
                width: 22%;
                text-align: right;
            }

            /* 3: Satış (+ inline % burada) */
            table.market-table th:nth-child(3),
            table.market-table td:nth-child(3) {
                width: 32%;
                text-align: right;
                /* yüzde etiketi kesilmesin */
                overflow: visible !important;
                text-overflow: clip !important;
            }

            /* 4. kolon xs’de tamamen gizli */
            table.market-table th:nth-child(4),
            table.market-table td:nth-child(4) {
                display: none !important;
            }

    /* Satış hücresindeki inline % görünümü */
    .inl-chg {
        margin-left: .32rem;
        white-space: nowrap;
        font-size: .86rem;
        vertical-align: baseline;
    }

        .inl-chg i {
            font-size: .9em;
            margin-right: 2px;
            vertical-align: middle;
        }
}
/* === NAV: mobile grid yerleşim fix (icons sağa yaslı, logo merkezde) === */
@media (max-width: 991.98px) {
    /* 3 sütunu koru: [1fr] [logo(auto)] [1fr] */
    .sg-navbar .container-xxl.sg-navgrid {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        gap: 12px;
    }

    /* Sol menü mobilde yok */
    .sg-navbar .sg-left {
        display: none !important;
    }

    /* LOGO her zaman 2. sütun (tam merkez) */
    .sg-navbar .sg-brand {
        grid-column: 2 / 3;
        justify-self: center;
    }

    /* SAĞ AKSİYONLAR her zaman 3. sütun (tam sağ) */
    .sg-navbar .sg-right {
        grid-column: 3 / 4;
        justify-self: end;
        display: flex;
        align-items: center;
        gap: .5rem;
    }
}