/* =========================================================================
   Life OS — "Koyu Premium" teması v6.
   Koyu-öncelikli, zümrüt vurgulu, editoryal (Newsreader serif) başlıklı.
   Üst navigasyon + panel kartları + zümrüt aksan. Filament CSS'inden SONRA
   yüklenir (HEAD_END) → varsayılanları ezer.
   Panel varsayılan teması KOYU (defaultThemeMode Dark) — .dark yıldızdır.
   ========================================================================= */

:root {
    --lo-font: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --lo-serif: 'Newsreader', Georgia, 'Times New Roman', serif;

    /* Zümrüt vurgu — her iki modda ortak */
    --lo-accent: #10B981;
    --lo-accent-hover: #059669;
    --lo-accent-ink: #06281c;        /* vurgu üzeri metin (koyu) */

    /* AÇIK mod paleti (yedek) */
    --lo-bg: #f7f8f7;
    --lo-card: #ffffff;
    --lo-ink: #14201b;
    --lo-body: #3f4a45;
    --lo-muted: #6b756f;
    --lo-faint: #9aa39d;
    --lo-border: #e6e9e7;
    --lo-border-strong: #d6dbd8;
    --lo-hover: #eef1ef;
    --lo-accent-tint: #e4f5ee;
    --lo-radius: 16px;
    --lo-shadow: 0 1px 1px rgba(20, 32, 27, .03), 0 2px 8px -2px rgba(20, 32, 27, .05);

    --lo-amber: #F0B429;
    --lo-rose: #F26D6D;
}

/* KOYU mod paleti — konseptin gerçek değerleri */
.dark {
    --lo-bg: #0E0F12;
    --lo-card: #141619;
    --lo-card-2: #16191d;
    --lo-ink: #EDEFF2;
    --lo-body: #C7CCD2;
    --lo-muted: #AAB0B8;
    --lo-faint: #6B7178;
    --lo-border: rgba(255, 255, 255, .07);
    --lo-border-strong: rgba(255, 255, 255, .12);
    --lo-hover: rgba(255, 255, 255, .04);
    --lo-accent-tint: rgba(16, 185, 129, .14);
    --lo-accent-line: rgba(16, 185, 129, .35);
    --lo-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 20px 40px -24px rgba(0, 0, 0, .8);
}

/* --- Tipografi & zemin --------------------------------------------------- */
.fi-body,
.fi-body input,
.fi-body button,
.fi-body select,
.fi-body textarea {
    font-family: var(--lo-font);
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
    -webkit-font-smoothing: antialiased;
}
.fi-body {
    background: var(--lo-bg);
    color: var(--lo-body);
    letter-spacing: -.006em;
}
/* Koyu modda ince atmosferik ışıltı — zümrüt + mor sızıntı */
.dark .fi-body {
    background:
        radial-gradient(1200px 620px at 82% -8%, rgba(16, 185, 129, .07), transparent 55%),
        radial-gradient(900px 520px at -5% 0%, rgba(139, 147, 248, .05), transparent 50%),
        var(--lo-bg);
    background-attachment: fixed;
}

/* Editoryal başlık — sayfa başlığı serif + hafif */
.fi-header-heading {
    font-family: var(--lo-serif);
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: -.01em;
    color: var(--lo-ink);
}
.fi-header-subheading { color: var(--lo-muted); }

.fi-section-header-heading {
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--lo-ink);
}
.fi-section-header-description { color: var(--lo-muted); }

.fi-breadcrumbs { font-size: .8rem; color: var(--lo-faint); }

/* İnce kaydırma çubuğu */
.fi-body ::-webkit-scrollbar { width: 8px; height: 8px; }
.fi-body ::-webkit-scrollbar-thumb { background: var(--lo-border-strong); border-radius: 8px; }
.dark .fi-body ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .12); }

/* --- Üst navigasyon (top navigation) ------------------------------------ */
.fi-topbar > *,
.fi-topbar-ctn {
    background: rgba(247, 248, 247, .82);
    border-bottom: 1px solid var(--lo-border);
    box-shadow: none;
    backdrop-filter: blur(10px);
}
.dark .fi-topbar > *,
.dark .fi-topbar-ctn {
    background: rgba(14, 15, 18, .72);
    border-bottom-color: var(--lo-border);
}

/* Nav öğeleri — hap tarzı, kompakt (tek satıra sığsın) */
.fi-topbar-item-btn {
    border-radius: 9px;
    font-weight: 500;
    font-size: .82rem;
    color: var(--lo-muted);
    padding: .38rem .6rem;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.fi-topbar-item-btn:hover { color: var(--lo-ink); background: var(--lo-hover); }
.fi-topbar-item-btn .fi-icon svg { color: var(--lo-faint); }
/* ikonu gizleyip yatay yeri koru — sadece etiketler */
.fi-topbar-item-btn > .fi-icon { display: none; }
.fi-topbar-group-toggle-icon { margin-left: .1rem; }

.fi-topbar-item.fi-active .fi-topbar-item-btn {
    color: var(--lo-ink);
    background: var(--lo-hover);
    box-shadow: inset 0 0 0 1px var(--lo-border-strong);
}
.fi-topbar-item.fi-active .fi-topbar-item-btn .fi-icon svg { color: var(--lo-accent); }

/* Nav grupları TEK SATIR: sarma yok, taşarsa yatay kaydır */
.fi-topbar-nav-groups {
    gap: .1rem;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    min-width: 0;
    scrollbar-width: none;
}
.fi-topbar-nav-groups::-webkit-scrollbar { display: none; }
/* Üst barın kendisi de sarmasın */
.fi-topbar > *,
.fi-topbar-ctn { flex-wrap: nowrap; }

/* Global aramayı daralt ki nav'a yer kalsın */
.fi-topbar .fi-global-search { max-width: 220px; }
.fi-topbar .fi-global-search .fi-input-wrp { min-width: 0; }

/* Global arama: koyu hap — odakta zümrüt halka */
.fi-global-search .fi-input-wrp {
    background: var(--lo-hover);
    border: 1px solid transparent;
    border-radius: 10px;
    box-shadow: none;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.fi-global-search .fi-input-wrp:focus-within {
    background: var(--lo-card);
    border-color: var(--lo-accent-line, var(--lo-border-strong));
    box-shadow: 0 0 0 3px rgba(16, 185, 129, .12);
}

/* --- Marka (özel logo) --------------------------------------------------- */
.fi-logo {
    display: flex;
    align-items: center;
    flex: none;
}
/* Logo görseli: net dursun, açık modda da görünsün diye hafif gölge */
.fi-logo img {
    width: auto;
    max-width: none;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35));
}

/* --- Kartlar / bölümler -------------------------------------------------- */
.fi-section,
.fi-wi-stats-overview-stat,
.fi-ta-ctn {
    border-radius: var(--lo-radius) !important;
    border: 1px solid var(--lo-border) !important;
    box-shadow: var(--lo-shadow) !important;
    background: var(--lo-card);
}
.dark .fi-section,
.dark .fi-wi-stats-overview-stat,
.dark .fi-ta-ctn {
    background: var(--lo-card);
    border-color: var(--lo-border) !important;
}

/* --- İstatistik kartları — sol zümrüt kenar --------------------------------- */
.fi-wi-stats-overview-stat {
    padding: 1.15rem 1.3rem !important;
    position: relative;
    overflow: hidden;
    transition: box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}
.fi-wi-stats-overview-stat::after {
    content: "";
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(var(--lo-accent), transparent);
    opacity: .9;
}
.fi-wi-stats-overview-stat:hover {
    border-color: var(--lo-border-strong) !important;
    transform: translateY(-1px);
}
.fi-wi-stats-overview-stat-label {
    font-size: .72rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--lo-faint);
}
.fi-wi-stats-overview-stat-value {
    font-size: 2rem !important;
    font-weight: 600 !important;
    letter-spacing: -.03em;
    font-variant-numeric: tabular-nums;
    color: var(--lo-ink);
}
.fi-wi-stats-overview-stat-description { font-weight: 500; color: var(--lo-muted); }

/* --- Tablolar ------------------------------------------------------------ */
.fi-ta-header-cell {
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: .66rem;
    font-weight: 600;
    color: var(--lo-faint);
    background: transparent;
}
.dark .fi-ta-header-cell { background: rgba(255, 255, 255, .015); }
.fi-ta-row { transition: background .1s ease; }
.fi-ta-row:hover { background: var(--lo-hover); }
.fi-ta-cell { font-size: .875rem; }

/* --- Butonlar: kompakt, minimal, zümrüt ---------------------------------- */
.fi-btn {
    border-radius: 9px;
    font-weight: 550;
    font-size: .8125rem;
    letter-spacing: -.005em;
    padding: .44rem .85rem !important;
    gap: .375rem;
    box-shadow: none;
    transition: background .12s ease, border-color .12s ease, opacity .12s ease, box-shadow .12s ease;
}
.fi-btn .fi-icon svg { width: 1rem; height: 1rem; }

/* Birincil: zümrüt, koyu metin, hafif ışık gölgesi */
.fi-btn.fi-color-primary {
    background: var(--lo-accent);
    border: 1px solid var(--lo-accent);
    color: var(--lo-accent-ink);
    box-shadow: 0 6px 16px -8px rgba(16, 185, 129, .6);
}
.fi-btn.fi-color-primary:hover { background: var(--lo-accent-hover); border-color: var(--lo-accent-hover); }

/* Gri: hayalet — ince hat, şeffaf zemin */
.fi-btn.fi-color-gray {
    background: transparent;
    border: 1px solid var(--lo-border-strong);
    color: var(--lo-body);
    box-shadow: none;
}
.fi-btn.fi-color-gray:hover { background: var(--lo-hover); }

.fi-ta-actions .fi-btn,
.fi-btn.fi-size-sm { padding: .32rem .62rem !important; font-size: .78rem; }
.fi-btn.fi-link { padding: .2rem .3rem !important; font-weight: 500; }

/* --- Badge & avatar ------------------------------------------------------ */
.fi-badge { border-radius: 6px; font-weight: 600; letter-spacing: .02em; }
.fi-avatar { box-shadow: 0 0 0 1px var(--lo-border-strong); }

/* --- Girdi alanları ------------------------------------------------------ */
.fi-input-wrp {
    border-radius: 10px;
    background: var(--lo-card);
    border-color: var(--lo-border-strong);
}
.dark .fi-input-wrp { background: var(--lo-card-2, var(--lo-card)); }
.fi-input-wrp:focus-within {
    box-shadow: 0 0 0 3px rgba(16, 185, 129, .12);
    border-color: var(--lo-accent-line, var(--lo-accent));
}

/* --- Dropdown / modal / arama sonuçları ---------------------------------- */
.fi-dropdown-panel,
.fi-modal-window,
.fi-global-search-results-ctn {
    border-radius: 14px;
    border: 1px solid var(--lo-border-strong);
    box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .7);
    background: var(--lo-card);
}

/* --- Giriş ekranı -------------------------------------------------------- */
.fi-simple-layout {
    background-color: var(--lo-bg);
}
.dark .fi-simple-layout {
    background-color: var(--lo-bg);
    background-image:
        radial-gradient(1000px 500px at 80% -10%, rgba(16, 185, 129, .10), transparent 55%),
        radial-gradient(800px 460px at 0% 100%, rgba(139, 147, 248, .06), transparent 50%);
}
.fi-simple-main {
    border-radius: 18px !important;
    border: 1px solid var(--lo-border-strong) !important;
    box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .7) !important;
    background: var(--lo-card);
}
.fi-simple-header-heading {
    font-family: var(--lo-serif);
    font-weight: 500;
    letter-spacing: -.01em;
    font-size: 1.6rem;
    color: var(--lo-ink);
}

/* --- Yardımcı: serif vurgu sınıfı (blade içinden kullanılabilir) ---------- */
.lo-serif { font-family: var(--lo-serif); }
.lo-accent { color: var(--lo-accent); }
