/*
 * Revinum — Admin Panel Theme
 * Thème visuel cohérent pour le panel administrateur
 * Teintes amber/orange/slate
 */

/* ═══════════════════════════════════════════════════════
   TOPBAR
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-topbar nav {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

/* ═══════════════════════════════════════════════════════
   FOND DE PAGE — léger gris chaud
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-main {
    background-color: #faf9f7 !important;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER — Titre + Actions
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-header {
    padding-bottom: 1rem !important;
}

:root:not(.dark) .fi-header-heading {
    color: #1c1917 !important;
    font-weight: 800 !important;
}

:root:not(.dark) .fi-header-subheading {
    color: #78716c !important;
}

/* Header actions — boutons arrondis */
:root:not(.dark) .fi-header-actions .fi-btn {
    border-radius: 0.75rem !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.15s ease !important;
}

:root:not(.dark) .fi-header-actions .fi-btn:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    transform: translateY(-1px) !important;
}

/* ═══════════════════════════════════════════════════════
   BREADCRUMBS
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-breadcrumbs {
    color: #78716c !important;
}

:root:not(.dark) .fi-breadcrumbs a {
    color: #b45309 !important;
    font-weight: 500 !important;
}

:root:not(.dark) .fi-breadcrumbs a:hover {
    color: #92400e !important;
}

/* ═══════════════════════════════════════════════════════
   TABS — Navigation par onglets (dégradé admin)
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-tabs {
    background: linear-gradient(to right, #1e293b, #78350f, #1e293b) !important;
    border: none !important;
    border-radius: 1rem !important;
    padding: 0.35rem 0.35rem !important;
    box-shadow: 0 4px 15px rgba(30, 41, 59, 0.3) !important;
    position: relative;
    overflow: hidden;
}

:root:not(.dark) .fi-tabs-item {
    border-radius: 0.65rem !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.65) !important;
    transition: all 0.2s ease !important;
    border: none !important;
    padding: 0.5rem 0.85rem !important;
}

:root:not(.dark) .fi-tabs-item .fi-tabs-item-label {
    color: rgba(255, 255, 255, 0.65) !important;
}

:root:not(.dark) .fi-tabs-item .fi-tabs-item-icon {
    color: rgba(255, 255, 255, 0.45) !important;
}

:root:not(.dark) .fi-tabs-item:hover {
    background: rgba(255, 255, 255, 0.1) !important;
}

:root:not(.dark) .fi-tabs-item:hover .fi-tabs-item-label {
    color: rgba(255, 255, 255, 0.9) !important;
}

:root:not(.dark) .fi-tabs-item:hover .fi-tabs-item-icon {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Onglet actif */
:root:not(.dark) .fi-tabs-item.fi-active,
:root:not(.dark) .fi-tabs-item[aria-selected="true"] {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

:root:not(.dark) .fi-tabs-item.fi-active .fi-tabs-item-label,
:root:not(.dark) .fi-tabs-item[aria-selected="true"] .fi-tabs-item-label {
    color: #ffffff !important;
    font-weight: 600 !important;
}

:root:not(.dark) .fi-tabs-item.fi-active .fi-tabs-item-icon,
:root:not(.dark) .fi-tabs-item[aria-selected="true"] .fi-tabs-item-icon {
    color: #fde68a !important;
}

:root:not(.dark) .fi-tabs-item.fi-active:hover,
:root:not(.dark) .fi-tabs-item[aria-selected="true"]:hover {
    background: rgba(255, 255, 255, 0.2) !important;
}

/* Badges dans les tabs */
:root:not(.dark) .fi-tabs-item .fi-badge {
    background: rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.8) !important;
}

:root:not(.dark) .fi-tabs-item.fi-active .fi-badge {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

/* ═══════════════════════════════════════════════════════
   SECTIONS FILAMENT
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-section {
    border-radius: 1rem !important;
    border: 1px solid #e7e5e4 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden;
    background: #ffffff !important;
}

:root:not(.dark) .fi-section-header {
    border-bottom: none !important;
    background: linear-gradient(135deg, #b45309, #78350f) !important;
    padding: 1rem 1.5rem !important;
    border-radius: 1rem 1rem 0 0 !important;
}

:root:not(.dark) .fi-section-header-heading {
    font-weight: 700 !important;
    color: #ffffff !important;
    font-size: 0.95rem !important;
}

:root:not(.dark) .fi-section-header-description {
    color: #fde68a !important;
}

/* Icônes des sections */
:root:not(.dark) .fi-section-header .fi-section-header-icon {
    color: #fde68a !important;
}

/* Boutons dans les headers de section */
:root:not(.dark) .fi-section-header button {
    color: #fde68a !important;
}

:root:not(.dark) .fi-section-header button:hover {
    color: #ffffff !important;
}

:root:not(.dark) .fi-section-content {
    padding: 1.25rem 1.5rem !important;
}

/* ═══════════════════════════════════════════════════════
   INFOLISTS — Labels + Valeurs
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-in-entry-wrp {
    margin-bottom: 0.25rem !important;
}

:root:not(.dark) .fi-in-entry-wrp label,
:root:not(.dark) .fi-in-text .fi-in-entry-wrp-label {
    color: #78716c !important;
    font-weight: 600 !important;
    font-size: 0.78rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
}

:root:not(.dark) .fi-in-text-item {
    color: #1c1917 !important;
    font-weight: 500 !important;
}

:root:not(.dark) .fi-in-placeholder {
    color: #d6d3d1 !important;
    font-style: normal !important;
}

/* ═══════════════════════════════════════════════════════
   BADGES
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-badge {
    border-radius: 0.5rem !important;
    font-weight: 600 !important;
    font-size: 0.75rem !important;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-ta-ctn {
    border-radius: 1rem !important;
    overflow: hidden;
    border: 1px solid #e7e5e4 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

/* Barre d'outils de la table — sobre */
:root:not(.dark) .fi-ta-header-toolbar {
    background: #fafaf9 !important;
    padding: 0.75rem 1rem !important;
    border-bottom: 1px solid #f5f5f4 !important;
}

:root:not(.dark) .fi-ta-header-cell {
    background-color: #fafaf9 !important;
    color: #57534e !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 0.7rem !important;
    letter-spacing: 0.05em !important;
}

/* Header de table avec section heading */
:root:not(.dark) .fi-ta-ctn > .fi-section-header {
    background: linear-gradient(135deg, #b45309, #78350f) !important;
    border-radius: 1rem 1rem 0 0 !important;
}

:root:not(.dark) .fi-ta-ctn > .fi-section-header .fi-section-header-heading {
    color: #ffffff !important;
}

:root:not(.dark) .fi-ta-ctn > .fi-section-header .fi-section-header-description {
    color: #fde68a !important;
}

/* Header de TableWidget (heading via $heading) */
:root:not(.dark) .fi-ta-header-ctn:has(.fi-ta-header) {
    background: linear-gradient(135deg, #b45309, #78350f) !important;
    border-radius: 1rem 1rem 0 0 !important;
}

:root:not(.dark) .fi-ta-header-ctn .fi-ta-header {
    padding: 1rem 1.5rem !important;
}

:root:not(.dark) .fi-ta-header-ctn .fi-ta-header-heading {
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
}

:root:not(.dark) .fi-ta-header-ctn .fi-ta-header-description {
    color: #fde68a !important;
}

:root:not(.dark) .fi-ta-row {
    transition: background-color 0.1s ease !important;
}

:root:not(.dark) .fi-ta-row:hover {
    background-color: #fafaf9 !important;
}

:root:not(.dark) .fi-ta-row td {
    border-bottom-color: #f5f5f4 !important;
}

/* ═══════════════════════════════════════════════════════
   CARDS / WIDGETS
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-wi-stats-overview-stat {
    border-radius: 1rem !important;
    border: 1px solid #e7e5e4 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    transition: box-shadow 0.15s ease !important;
}

:root:not(.dark) .fi-wi-stats-overview-stat:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
}

:root:not(.dark) .fi-wi-chart {
    border-radius: 1rem !important;
    border: 1px solid #e7e5e4 !important;
}

/* ═══════════════════════════════════════════════════════
   FORMULAIRES
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-fo-field-wrp .fi-input,
:root:not(.dark) .fi-input-wrp {
    border-radius: 0.75rem !important;
    border-color: #e7e5e4 !important;
    transition: all 0.15s ease !important;
}

:root:not(.dark) .fi-fo-field-wrp .fi-input:focus-within,
:root:not(.dark) .fi-input-wrp:focus-within {
    border-color: #f59e0b !important;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.12) !important;
}

:root:not(.dark) .fi-fo-field-wrp label {
    font-weight: 600 !important;
    color: #44403c !important;
}

:root:not(.dark) .fi-select-wrp,
:root:not(.dark) .fi-date-time-picker-wrp {
    border-radius: 0.75rem !important;
}

/* ═══════════════════════════════════════════════════════
   BOUTONS
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-btn {
    border-radius: 0.75rem !important;
    font-weight: 600 !important;
    transition: all 0.15s ease !important;
}

/* ═══════════════════════════════════════════════════════
   PAGINATION
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-pagination-item {
    border-radius: 0.5rem !important;
}

/* ═══════════════════════════════════════════════════════
   MODALS
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-modal-content {
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden !important;
    margin-bottom:.75rem;
}

:root:not(.dark) .fi-modal-header {
    border-bottom: none !important;
    background: linear-gradient(135deg, #b45309, #78350f) !important;
    border-radius: .75rem .75rem 0 0 !important;
}

:root:not(.dark) .fi-modal-header .fi-modal-heading {
    color: #ffffff !important;
}

:root:not(.dark) .fi-modal-header .fi-modal-description {
    color: #fde68a !important;
}

:root:not(.dark) .fi-modal-close-btn {
    color: #fde68a !important;
}

:root:not(.dark) .fi-modal-close-btn:hover {
    color: #ffffff !important;
}

:root:not(.dark) .fi-modal-footer {
    border-top: 1px solid #f5f5f4 !important;
}

/* Sections à l'intérieur des modals : neutraliser le style section */
:root:not(.dark) .fi-modal-content .fi-section {
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
}

:root:not(.dark) .fi-modal-content .fi-section-header {
    border-radius: 0 !important;
    background: #f8f7f6 !important;
    border-bottom: 1px solid #e7e5e4 !important;
}

:root:not(.dark) .fi-modal-content .fi-section-header-heading {
    color: #78350f !important;
    font-size: 0.9rem !important;
}

:root:not(.dark) .fi-modal-content .fi-section-header-description {
    color: #92400e !important;
}

/* ═══════════════════════════════════════════════════════
   NOTIFICATIONS
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-no-notification {
    border-radius: 1rem !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
}

/* Panel notifications slide-over : pas de border-radius */
.fi-modal-slide-over-window {
    border-radius: 0 !important;
}

.fi-modal-slide-over .fi-modal-window {
    border-radius: 0 !important;
}

.fi-modal-slide-over .fi-modal-header {
    border-radius: 0 !important;
}

/* Slide-over (notifications) : fond neutre au lieu du gradient */
:root:not(.dark) .fi-modal-slide-over .fi-modal-header {
    background: #fafaf9 !important;
    border-bottom: 1px solid #e7e5e4 !important;
}

:root:not(.dark) .fi-modal-slide-over .fi-modal-header .fi-modal-heading {
    color: #292524 !important;
}

:root:not(.dark) .fi-modal-slide-over .fi-modal-header .fi-modal-description {
    color: #78716c !important;
}

/* ═══════════════════════════════════════════════════════
   REPEATABLE ENTRIES
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-in-repeatable-item {
    border: 1px solid #f5f5f4 !important;
    border-radius: 0.75rem !important;
    background: #fafaf9 !important;
    transition: background 0.1s ease !important;
}

:root:not(.dark) .fi-in-repeatable-item:hover {
    background: #f5f5f4 !important;
}

/* ═══════════════════════════════════════════════════════
   TOGGLE / SWITCH
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-toggle-on {
    background-color: #f59e0b !important;
}

/* ═══════════════════════════════════════════════════════
   DROPDOWN / ACTIONS MENU
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-dropdown-panel {
    border-radius: 0.75rem !important;
    border: 1px solid #e7e5e4 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-ta-empty-state-icon {
    color: #fde68a !important;
}

:root:not(.dark) .fi-ta-empty-state-heading {
    color: #57534e !important;
}

/* ═══════════════════════════════════════════════════════
   SCROLLBAR
   ═══════════════════════════════════════════════════════ */

:root:not(.dark) .fi-main-ctn ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

:root:not(.dark) .fi-main-ctn ::-webkit-scrollbar-track {
    background: transparent;
}

:root:not(.dark) .fi-main-ctn ::-webkit-scrollbar-thumb {
    background: #d6d3d1;
    border-radius: 3px;
}

:root:not(.dark) .fi-main-ctn ::-webkit-scrollbar-thumb:hover {
    background: #a8a29e;
}

/* ═══════════════════════════════════════════════════════
   SIDEBAR — Override indigo → amber pour l'admin
   (dark-sidebar.css est partagé, ici on surcharge)
   ═══════════════════════════════════════════════════════ */

/* Item actif — background amber au lieu d'indigo */
:root:not(.dark) .fi-sidebar-item.fi-active a,
:root:not(.dark) .fi-sidebar-item.fi-active button {
    background-color: rgba(245, 158, 11, 0.18) !important;
}

/* Icône hover — amber clair au lieu d'indigo */
:root:not(.dark) .fi-sidebar-item a:hover svg,
:root:not(.dark) .fi-sidebar-item button:hover svg {
    color: #fbbf24 !important;
}

/* Icône active — amber au lieu d'indigo */
:root:not(.dark) .fi-sidebar-item.fi-active svg,
:root:not(.dark) .fi-sidebar-item.fi-active .fi-sidebar-item-icon {
    color: #f59e0b !important;
}