/*
 * "Liquid glass" katmanı (app.css'ten sonra yüklenir, sadece oturum açık sayfalar: body.app-page).
 * Sabit, yumuşak renkli bir zemin üstünde yarı saydam + bulanık (backdrop-filter) yüzeyler, üst kenarda ışık çizgisi,
 * kapsül düğmeler, yüzen yan menü ve üst çubuk. Rakam/tablo okunurluğu için kartlar menülerden daha opak.
 * Saydamlığı azalt (prefers-reduced-transparency) ve yazdırmada düz yüzeye döner.
 */
.app-page {
    --glass-blur: saturate(180%) blur(22px);
    --glass-surface: rgba(255, 255, 255, .62);
    --glass-surface-strong: rgba(255, 255, 255, .8);
    --glass-float: rgba(255, 255, 255, .9);
    --glass-input: rgba(255, 255, 255, .72);
    --glass-tint: rgba(255, 255, 255, .45);
    --glass-border: rgba(255, 255, 255, .75);
    --glass-edge: rgba(15, 23, 42, .06);
    --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(255, 255, 255, .25);
    --glass-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 28px -6px rgba(49, 46, 129, .14);
    --glass-shadow-lg: 0 24px 60px -12px rgba(30, 27, 75, .28);
    --glass-bg-base: #eef1fb;
    --glass-blob-1: rgba(129, 140, 248, .42);
    --glass-blob-2: rgba(56, 189, 248, .3);
    --glass-blob-3: rgba(244, 114, 182, .22);
    --glass-blob-4: rgba(251, 191, 36, .2);

    --app-canvas: transparent;
    --bs-body-bg: var(--glass-surface);
    --bs-tertiary-bg: rgba(241, 245, 249, .6);
    --bs-secondary-bg: rgba(226, 232, 240, .6);
    --bs-border-color: rgba(15, 23, 42, .09);
    background: var(--glass-bg-base);
}

[data-bs-theme="dark"] .app-page {
    --glass-surface: rgba(23, 32, 51, .55);
    --glass-surface-strong: rgba(23, 32, 51, .74);
    --glass-float: rgba(23, 32, 51, .94);
    --glass-input: rgba(11, 17, 32, .5);
    --glass-tint: rgba(255, 255, 255, .06);
    --glass-border: rgba(255, 255, 255, .12);
    --glass-edge: rgba(0, 0, 0, .3);
    --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, .12), inset 0 -1px 0 rgba(255, 255, 255, .03);
    --glass-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 30px -8px rgba(0, 0, 0, .5);
    --glass-shadow-lg: 0 24px 60px -12px rgba(0, 0, 0, .7);
    --glass-bg-base: #080d1a;
    --glass-blob-1: rgba(99, 102, 241, .38);
    --glass-blob-2: rgba(14, 165, 233, .2);
    --glass-blob-3: rgba(192, 38, 211, .18);
    --glass-blob-4: rgba(245, 158, 11, .1);

    --bs-tertiary-bg: rgba(255, 255, 255, .04);
    --bs-secondary-bg: rgba(255, 255, 255, .07);
    --bs-border-color: rgba(255, 255, 255, .09);
}

/* Zemin: sabit renk lekeleri, kaydırınca camın arkasında akar. iOS fixed arka planı desteklemediği için sahte öğe. */
.app-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    transform: translateZ(0); /* kendi katmanında: kaydırmada yeniden boyanmaz */
    background:
        radial-gradient(42rem 32rem at 8% 4%, var(--glass-blob-1), transparent 70%),
        radial-gradient(38rem 30rem at 96% 8%, var(--glass-blob-2), transparent 70%),
        radial-gradient(36rem 30rem at 4% 96%, var(--glass-blob-3), transparent 70%),
        radial-gradient(40rem 32rem at 92% 92%, var(--glass-blob-4), transparent 70%),
        var(--glass-bg-base);
}

/* Cam yüzeyler */
.app-page .card,
.app-page .modal-content,
.app-page .dropdown-menu,
.app-page .toast,
.app-page .popover,
.app-page .tour-card,
.app-page .report-tip {
    border: 1px solid var(--glass-border) !important;
    background-color: var(--glass-surface);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    box-shadow: var(--glass-highlight), var(--glass-shadow) !important;
}

.app-page .card {
    --bs-card-bg: var(--glass-surface);
    --bs-card-border-radius: 1.25rem;
    --bs-card-inner-border-radius: calc(1.25rem - 1px);
    --bs-card-cap-bg: transparent;
}

/* Kart başlık/altlıklarındaki bg-body / bg-white düz şeridi camı bozmasın */
.app-page .card > .bg-body,
.app-page .card > .bg-white {
    background-color: transparent !important;
}

/* Rakam yoğun kartlar biraz daha opak */
.app-page .card:has(.table) {
    background-color: var(--glass-surface-strong);
}

.app-page .modal-content,
.app-page .dropdown-menu,
.app-page .toast,
.app-page .popover,
.app-page .tour-card,
.app-page .report-tip {
    --bs-modal-bg: var(--glass-float);
    --bs-dropdown-bg: var(--glass-float);
    background-color: var(--glass-float);
    box-shadow: var(--glass-highlight), var(--glass-shadow-lg) !important;
}

.app-page .modal-content {
    border-radius: 1.5rem;
}

.app-page .modal-header,
.app-page .modal-footer {
    border-color: var(--bs-border-color);
}

.app-page .modal-backdrop.show {
    opacity: .25;
}

.app-page .dropdown-menu {
    padding: .375rem;
    border-radius: 1rem;
}

.app-page .dropdown-item {
    border-radius: .625rem;
}

.app-page .list-group {
    --bs-list-group-bg: transparent;
    --bs-list-group-border-color: var(--bs-border-color);
}

/* Form alanları: hafif buzlu */
.app-page .form-control,
.app-page .form-select,
.app-page .input-group-text {
    border-color: var(--bs-border-color);
    background-color: var(--glass-input);
}

.app-page .form-control:focus,
.app-page .form-select:focus {
    background-color: var(--glass-surface-strong);
}

.app-page .form-check-input:not(:checked) {
    background-color: var(--glass-input);
}

/* Düğmeler: kapsül, cam ve ışık çizgisi (giriş gruplarındakiler hariç) */
.app-page .btn:not(.input-group > .btn, .btn-group > .btn, .btn-close, .btn-link) {
    --bs-btn-border-radius: 999px;
    --bs-btn-padding-x: 1rem;
}

.app-page .btn-sm:not(.input-group > .btn, .btn-group > .btn) {
    --bs-btn-padding-x: .75rem;
}

.app-page .btn-primary,
.app-page .btn-danger,
.app-page .btn-success {
    border-color: transparent;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 55%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 6px 16px -6px rgba(var(--bs-primary-rgb), .6);
}

.app-page .btn-danger {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 6px 16px -6px rgba(220, 38, 38, .55);
}

.app-page .btn-success {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 6px 16px -6px rgba(5, 150, 105, .55);
}

.app-page [class*="btn-outline-"],
.app-page .btn-light {
    --bs-btn-bg: var(--glass-tint);
    border-color: var(--glass-border);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: var(--glass-highlight), 0 1px 2px rgba(15, 23, 42, .05);
}

.app-page .btn-outline-danger {
    --bs-btn-border-color: rgba(220, 38, 38, .45);
    border-color: rgba(220, 38, 38, .45);
}

.app-page .btn-outline-primary {
    border-color: rgba(var(--bs-primary-rgb), .4);
}

/* Yüzen yan menü: koyu cam */
.app-page .app-sidebar {
    --bs-offcanvas-bg: transparent;
    border: 0 !important;
}

.app-page .app-sidebar-inner {
    border: 1px solid rgba(255, 255, 255, .1);
    background: linear-gradient(180deg, rgba(15, 23, 42, .8) 0%, rgba(30, 27, 75, .74) 100%);
    -webkit-backdrop-filter: saturate(160%) blur(28px);
    backdrop-filter: saturate(160%) blur(28px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), var(--glass-shadow-lg);
}

.app-page .app-nav-link.active {
    background: linear-gradient(180deg, rgba(129, 140, 248, .95), rgba(79, 70, 229, .95));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 6px 18px -4px rgba(99, 102, 241, .7);
}

.app-page .app-ledger {
    background: rgba(255, 255, 255, .06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

/* Telefonda menü içeriğin üstüne açılır: yazılar arkadan okunmasın diye neredeyse opak */
@media (max-width: 991.98px) {
    .app-page .app-sidebar-inner {
        background: linear-gradient(180deg, rgba(15, 23, 42, .96) 0%, rgba(30, 27, 75, .94) 100%);
    }
}

@media (min-width: 992px) {
    .app-page .app-sidebar {
        flex-basis: 276px;
        padding: .75rem 0 .75rem .75rem;
    }

    .app-page .app-sidebar-inner {
        min-height: 0;
        border-radius: 1.5rem;
    }
}

/* Yüzen üst çubuk */
.app-page .app-topbar {
    top: .5rem;
    margin: .5rem .5rem 0;
    border: 1px solid var(--glass-border);
    border-radius: 1.25rem;
    background: var(--glass-surface);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    box-shadow: var(--glass-highlight), var(--glass-shadow);
}

@media (min-width: 992px) {
    .app-page .app-topbar {
        top: .75rem;
        margin: .75rem .75rem 0;
    }
}

.app-page .app-pill {
    border-color: var(--glass-border);
    background: var(--glass-tint);
    box-shadow: var(--glass-highlight);
}

.app-page .app-pill-primary {
    border-color: var(--app-primary-soft-border);
    background: var(--app-primary-soft);
}

.app-page .app-icon-btn:hover,
.app-page .app-icon-btn.active {
    background: var(--glass-tint);
    box-shadow: var(--glass-highlight);
}

.app-page .app-dot {
    border-color: transparent;
}

/* Sekme / segment seçiciler ve rozetler cam kapsül */
.app-page .segmented,
.app-page .nav-pills {
    border: 1px solid var(--glass-border);
    border-radius: 999px;
    background: var(--glass-tint);
    box-shadow: var(--glass-highlight);
}

.app-page .tag,
.app-page .chip {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}

[data-bs-theme="dark"] .app-page .tag,
[data-bs-theme="dark"] .app-page .chip {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

/*
 * Telefon / tablet: her kartın arkasını ayrı ayrı bulanıklaştırmak mobil GPU'da kaydırmayı ağırlaştırıyor.
 * Kartlar ve düğmeler bulanıklık yerine daha opak düz cam; bulanıklık sadece üst çubukta (tek öğe) ve
 * kısa süre açık kalan menü/pencerelerde kalır.
 */
@media (max-width: 991.98px) {
    .app-page {
        --glass-surface: rgba(255, 255, 255, .8);
        --glass-surface-strong: rgba(255, 255, 255, .88);
    }

    [data-bs-theme="dark"] .app-page {
        --glass-surface: rgba(23, 32, 51, .8);
        --glass-surface-strong: rgba(23, 32, 51, .88);
    }

    .app-page .card,
    .app-page .toast,
    .app-page .report-tip,
    .app-page .app-sidebar-inner,
    .app-page [class*="btn-outline-"],
    .app-page .btn-light {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .app-page .app-topbar {
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
    }
}

/* Erişilebilirlik ve çıktı: düz yüzey */
@media (prefers-reduced-transparency: reduce) {
    .app-page {
        --glass-surface: #fff;
        --glass-surface-strong: #fff;
        --glass-float: #fff;
        --glass-input: #fff;
    }

    [data-bs-theme="dark"] .app-page {
        --glass-surface: #111827;
        --glass-surface-strong: #111827;
        --glass-float: #172033;
        --glass-input: #0b1120;
    }
}

@media print {
    .app-page::before {
        display: none;
    }

    .app-page .card,
    .app-page .app-topbar {
        background: #fff !important;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        box-shadow: none !important;
    }
}
