/* ════════════════════════════════════════════════════════════════════ dark-mode.css — Dark mode overrides (Cleaned & Optimized) Chargé en dernier dans le head pour garantir la cascade. ════════════════════════════════════════════════════════════════════ */ /* ─── FONDS & CONTENEURS PRINCIPAUX ────────────────────────────────── */ [data-theme="dark"] .pf-card, [data-theme="dark"] .pf-modal-content, [data-theme="dark"] .budget-tabs-container, [data-theme="dark"] .fc-header-row, [data-theme="dark"] .fc-month-nav-row, [data-theme="dark"] .fc-month-calendar-wrapper, [data-theme="dark"] .fc-month-balances, [data-theme="dark"] .hol-idea-card, [data-theme="dark"] .pf-holidays__titlebar, [data-theme="dark"] .hol-filters-row, [data-theme="dark"] .cl-titlebar, [data-theme="dark"] .pf-child-section, [data-theme="dark"] .pf-child-totals-bar, [data-theme="dark"] .pf-gift-card-compact, [data-theme="dark"] .epargne-grid-table, [data-theme="dark"] .sticky-col { background: var(--bg-panel) !important; border-color: var(--border-light) !important; color: var(--text-main) !important; } [data-theme="dark"] .owner-tabs, [data-theme="dark"] .fc-view-controls, [data-theme="dark"] .fc-day--other-month, [data-theme="dark"] .fc-minimal-balance-card, [data-theme="dark"] .pf-summary-pill, [data-theme="dark"] .pf-filter-bar { background: var(--bg-page) !important; border-color: var(--border-light) !important; color: var(--text-muted) !important; } /* ─── TYPOGRAPHIE GLOBALE ──────────────────────────────────────────── */ [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] .pf-modal-title, [data-theme="dark"] .pf-card-title, [data-theme="dark"] .hol-main-title, [data-theme="dark"] .pf-gift-title, [data-theme="dark"] .budget-view h2, [data-theme="dark"] .view-header h2, [data-theme="dark"] .month-header-container { color: var(--text-main) !important; } [data-theme="dark"] .pf-card-desc, [data-theme="dark"] .tab-item { color: var(--text-muted); } /* ─── INPUTS & SÉLECTEURS ──────────────────────────────────────────── */ [data-theme="dark"] .pf-input, [data-theme="dark"] .pf-filter-select, [data-theme="dark"] .hol-year-select, [data-theme="dark"] .budget-view input, [data-theme="dark"] .budget-view select, [data-theme="dark"] .budget-view textarea, [data-theme="dark"] .hol-idea-card input, [data-theme="dark"] .hol-idea-card textarea, [data-theme="dark"] .hol-idea-card select { background: #1c2128 !important; border-color: var(--border-light) !important; color: var(--text-main) !important; } [data-theme="dark"] .pf-input::placeholder { color: #484f58 !important; } /* ─── BOUTONS & ÉTATS ACTIFS ───────────────────────────────────────── */ [data-theme="dark"] .pf-btn.btn-secondary, [data-theme="dark"] .fc-nav-button, [data-theme="dark"] .fc-view-button, [data-theme="dark"] .hol-map-toggle, [data-theme="dark"] .cl-view-btn, [data-theme="dark"] .pf-btn-icon-text, [data-theme="dark"] .owner-tab { background: var(--bg-panel) !important; color: var(--text-muted) !important; border-color: var(--border-light) !important; } [data-theme="dark"] .pf-btn.btn-secondary:hover, [data-theme="dark"] .fc-nav-button:hover, [data-theme="dark"] .hol-map-toggle:hover, [data-theme="dark"] .pf-btn-icon-text:hover { background: rgba(255, 255, 255, 0.06) !important; color: var(--text-main) !important; } [data-theme="dark"] .tab-item.active, [data-theme="dark"] .fc-view-button--active, [data-theme="dark"] .cl-view-btn.is-active { background: rgba(59, 130, 246, 0.15) !important; color: var(--primary) !important; border-color: rgba(59, 130, 246, 0.3) !important; } [data-theme="dark"] .owner-tab.active { background: var(--primary) !important; color: #fff !important; } /* ─── TABLES ───────────────────────────────────────────────────────── */ [data-theme="dark"] .pf-table, [data-theme="dark"] .fc-month-table, [data-theme="dark"] #planningTable-wrapper { background: var(--bg-panel) !important; color: var(--text-main); border-color: var(--border-light) !important; } [data-theme="dark"] .pf-table thead th, [data-theme="dark"] .fc-month-table th, [data-theme="dark"] #planningTable thead th, [data-theme="dark"] th.sticky-col, [data-theme="dark"] .pf-child-header { background: #1c2128 !important; color: var(--text-muted) !important; border-color: var(--border-light) !important; } [data-theme="dark"] .pf-table tbody td, [data-theme="dark"] .fc-month-table td, [data-theme="dark"] #planningTable tbody td { border-color: rgba(48, 54, 61, 0.5) !important; } [data-theme="dark"] .pf-table tbody tr:hover td, [data-theme="dark"] .fc-month-table td:hover:not(.fc-day--other-month) { background: rgba(255, 255, 255, 0.04) !important; } [data-theme="dark"] .pf-table tfoot td { background: #1c2128 !important; border-color: rgba(48, 54, 61, 0.5) !important; } /* ─── MODULES SPÉCIFIQUES ──────────────────────────────────────────── */ /* Accueil */ [data-theme="dark"] body[data-page="home"] .pf-module-card { background: rgba(22, 27, 34, 0.92) !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; } [data-theme="dark"] body[data-page="home"] .pf-module-card:hover { border-color: var(--primary) !important; } /* Épargne & Grilles */ [data-theme="dark"] .eg-header-row { background: #111827 !important; border-color: #30363d !important; color: #e6edf3 !important; } [data-theme="dark"] .eg-row:nth-child(even) { background: rgba(255, 255, 255, 0.02); } [data-theme="dark"] .eg-row:hover { background: rgba(255, 255, 255, 0.05); } /* Éléments colorés spécifiques */ [data-theme="dark"] .savings-table .row-extres td, [data-theme="dark"] .eg-extres-row { background: rgba(245, 158, 11, 0.08) !important; } [data-theme="dark"] .nens-title.theme-pol { background: rgba(30, 58, 138, 0.2) !important; color: #93c5fd !important; border-color: #3b82f6 !important; } [data-theme="dark"] .nens-table.theme-pol thead th { background: rgba(30, 58, 138, 0.15) !important; color: #93c5fd !important; } [data-theme="dark"] .nens-title.theme-pep { background: rgba(20, 83, 45, 0.2) !important; color: #86efac !important; border-color: #22c55e !important; } [data-theme="dark"] .nens-table.theme-pep thead th { background: rgba(20, 83, 45, 0.15) !important; color: #86efac !important; } [data-theme="dark"] .sum-selected { background: rgba(59, 130, 246, 0.1) !important; } [data-theme="dark"] .fc-burn-alert { background: rgba(239, 68, 68, 0.1) !important; color: #f87171 !important; } [data-theme="dark"] .month-actions .btn-icon-small { background: #1c2128 !important; border-color: var(--border-light) !important; color: var(--text-main) !important; } [data-theme="dark"] .month-actions .btn-icon-small:hover { background: rgba(255, 255, 255, 0.06) !important; }