/*
 * Kènè — mode sombre propriétaire
 * Une ambiance de terrain sous projecteurs : surfaces vert-noir,
 * informations financières très lisibles et accents métier conservés.
 */

.dark {
    --kene-dark-canvas: #07110d;
    --kene-dark-surface: #0d1c16;
    --kene-dark-raised: #13261d;
    --kene-dark-border: #294438;
    --kene-dark-ink: #edf7f0;
    --kene-dark-muted: #9db3a7;
    --kene-dark-green: #65d991;
    --kene-dark-amber: #ffc96b;
    --kene-dark-red: #ff8e8e;
}

.dark .fi-body {
    color: var(--kene-dark-ink) !important;
    background:
        radial-gradient(circle at 88% 4%, rgb(22 131 65 / 14%), transparent 26rem),
        linear-gradient(145deg, #07110d 0%, #0a1711 52%, #07110d 100%) !important;
}

.dark .fi-topbar nav {
    background: rgb(8 19 14 / 94%) !important;
    border-color: var(--kene-dark-border) !important;
    box-shadow: 0 12px 32px rgb(0 0 0 / 18%) !important;
    backdrop-filter: blur(18px);
}

.dark .fi-sidebar {
    background: linear-gradient(180deg, #062b1d 0%, #08261b 58%, #061b13 100%) !important;
    border-inline-end: 1px solid rgb(101 217 145 / 13%);
}

.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background: rgb(101 217 145 / 13%) !important;
    box-shadow:
        inset 0 0 0 1px rgb(140 235 174 / 16%),
        0 8px 24px rgb(0 0 0 / 16%) !important;
}

.dark .fi-main h1,
.dark .fi-main h2,
.dark .fi-main h3,
.dark .fi-main h4,
.dark .fi-main label {
    color: var(--kene-dark-ink);
}

.dark .fi-section,
.dark .fi-wi-stats-overview-stat,
.dark .fi-wi-chart {
    color: var(--kene-dark-ink) !important;
    background: linear-gradient(145deg, rgb(19 38 29 / 98%), rgb(12 27 21 / 98%)) !important;
    border-color: var(--kene-dark-border) !important;
    box-shadow: 0 18px 44px rgb(0 0 0 / 16%) !important;
}

.dark .fi-section-header,
.dark .fi-ta-header,
.dark .fi-ta-header-toolbar,
.dark .fi-ta-ctn,
.dark .fi-fo-field-wrp {
    border-color: var(--kene-dark-border) !important;
}

.dark .kene-card {
    color: var(--kene-dark-ink);
    background:
        linear-gradient(145deg, rgb(19 38 29 / 98%), rgb(12 27 21 / 98%));
    border-color: var(--kene-dark-border);
    box-shadow: 0 20px 52px rgb(0 0 0 / 18%);
}

.dark .kene-card-heading h3 {
    color: var(--kene-dark-ink);
}

.dark .kene-card-heading p,
.dark .kene-table th,
.dark .kene-table small,
.dark .kene-heatmap > strong {
    color: var(--kene-dark-muted);
}

.dark .kene-table td,
.dark .kene-table th {
    color: var(--kene-dark-ink);
    border-color: rgb(157 179 167 / 14%);
}

.dark .kene-table tbody tr {
    transition: background-color 140ms ease;
}

.dark .kene-table tbody tr:hover {
    background: rgb(101 217 145 / 6%);
}

.dark .kene-table .positive,
.dark .positive {
    color: var(--kene-dark-green);
}

.dark .kene-table .due,
.dark .due {
    color: var(--kene-dark-amber);
}

.dark .negative {
    color: var(--kene-dark-red);
}

.dark .kene-status.ok {
    color: #89edac;
    background: rgb(45 169 91 / 20%);
    box-shadow: inset 0 0 0 1px rgb(101 217 145 / 16%);
}

.dark .kene-status.pending {
    color: #ffd58a;
    background: rgb(247 166 25 / 18%);
    box-shadow: inset 0 0 0 1px rgb(255 201 107 / 14%);
}

.dark .kene-status.error {
    color: #ffaaaa;
    background: rgb(220 71 71 / 18%);
    box-shadow: inset 0 0 0 1px rgb(255 142 142 / 14%);
}

.dark .kene-closing-list > div {
    color: var(--kene-dark-ink);
    background: rgb(255 255 255 / 2%);
    border-color: var(--kene-dark-border);
}

.dark .kene-heat {
    border: 1px solid rgb(101 217 145 / 10%);
    box-shadow: inset 0 0 12px rgb(0 0 0 / 12%);
}

.dark .kene-heat:hover {
    border-color: rgb(101 217 145 / 45%);
    box-shadow: 0 0 18px rgb(101 217 145 / 13%);
}

.dark .fi-input-wrp,
.dark .fi-select-input,
.dark .fi-fo-textarea,
.dark .fi-dropdown-panel,
.dark .fi-modal-window {
    color: var(--kene-dark-ink) !important;
    background-color: var(--kene-dark-surface) !important;
    border-color: var(--kene-dark-border) !important;
}

.dark .fi-ta-table thead,
.dark .fi-ta-table tbody,
.dark .fi-ta-row,
.dark .fi-ta-cell {
    border-color: rgb(157 179 167 / 14%) !important;
}

.dark .fi-ta-row:hover {
    background-color: rgb(101 217 145 / 5%) !important;
}

.dark ::selection {
    color: #041009;
    background: #7de2a2;
}

@media (prefers-reduced-motion: no-preference) {
    .dark .kene-card,
    .dark .fi-section,
    .dark .fi-wi-chart,
    .dark .fi-wi-stats-overview-stat {
        animation: kene-dark-rise 280ms ease-out both;
    }
}

@keyframes kene-dark-rise {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

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