/* ═══════════════════════════════════════════════════════
   Dark Theme — BEC Manager
   Scope sous body.dark-theme pour activation conditionnelle
   ═══════════════════════════════════════════════════════ */

/* ── Variables racine ─────────────────────────────────── */
/* Deux marqueurs : le coeur pose la classe .dark-theme, les plugins
   l'attribut [data-theme]. Seul CE bloc est double — les regles de mise en
   forme qui suivent restent sous body.dark-theme, le coeur posant les deux
   marqueurs (voir static/js/bec-theme.js).
   L'ancrage :root est necessaire : data-theme sert AUSSI d'attribut de donnee
   sur des boutons (dashboards.widgetconfig.js), qui heriteraient sinon de
   toute la palette sombre en theme clair. */
body.dark-theme,
:root[data-theme="dark"] {
    --primary-color: #3b82f6;
    --primary-dark: #2563eb;
    --primary-light: #60a5fa;
    --bg-color: #111318;
    --body-bg: #111318;
    --card-bg: #1a1d26;
    --border-color: #262a36;
    --text-primary: #e8eaef;
    --text-secondary: #8890a4;
    --text-muted: #565d73;
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.3);
    --shadow: 0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.3);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.3);
    --shadow-lg: 0 10px 25px rgba(0,0,0,0.5);
    --header-bg: #1a1d26;
    --footer-bg: #111318;
    --footer-text: #8890a4;
    --hover-bg: rgba(59,130,246,0.08);
    --focus-ring: rgba(59,130,246,0.25);
    --view-badge-bg: #7c3aed;
    --input-only-badge-bg: #059669;
    --btn-secondary-hover: #363b4a;
    --btn-danger-hover: #b91c1c;
    --danger-hover-bg: rgba(239,68,68,0.12);
    --modal-overlay: rgba(0,0,0,0.7);
    --planning-today-bg: rgba(59,130,246,0.08);
    --planning-other-bg: #14161e;
    --table-header-bg: #14161e;
}

/* ── Body & global ────────────────────────────────────── */
body.dark-theme {
    background-color: var(--body-bg);
    color: var(--text-primary);
}

/* ── Header ───────────────────────────────────────────── */
body.dark-theme header {
    background: var(--header-bg);
    box-shadow: 0 1px 0 var(--border-color);
}

/* ── Sidebar ──────────────────────────────────────────── */
body.dark-theme .sidebar {
    background: var(--card-bg);
    border-right: 1px solid var(--border-color);
}

body.dark-theme .sidebar-header {
    border-bottom-color: var(--border-color);
}

body.dark-theme .table-item {
    border-bottom-color: var(--border-color);
}

body.dark-theme .table-item:hover {
    background: var(--hover-bg);
}

body.dark-theme .table-item.active {
    background: rgba(59, 130, 246, 0.12);
}

/* ── Sidebar Profile ──────────────────────────────────── */
body.dark-theme .sidebar-profile {
    border-bottom-color: var(--border-color);
}
body.dark-theme .sidebar-user-name {
    color: var(--text-primary);
}
body.dark-theme .sidebar-avatar {
    background: #3b5998;
}

/* ── Category Separators ─────────────────────────────── */
body.dark-theme .category-separator {
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}

body.dark-theme .category-separator.collapsible:hover {
    background: rgba(255,255,255,0.06);
}

body.dark-theme .ext-table-count {
    background: var(--border-color, #374151);
    color: var(--text-secondary);
}

/* ── Welcome Screen ───────────────────────────────────── */
body.dark-theme .welcome-screen {
    color: var(--text-primary);
}

body.dark-theme .welcome-content > p {
    color: var(--text-secondary);
}

body.dark-theme .feature {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
}

body.dark-theme .feature-icon {
    background: rgba(59, 130, 246, 0.1);
}

/* ── Data Tables ──────────────────────────────────────── */
body.dark-theme .table-view {
    background: var(--card-bg);
}

body.dark-theme .table-header {
    border-bottom-color: var(--border-color);
}

body.dark-theme .table-info {
    color: var(--text-muted);
}

body.dark-theme .data-table thead {
    background: var(--table-header-bg);
}

body.dark-theme .data-table th {
    background: var(--table-header-bg);
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}

body.dark-theme .data-table td {
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-theme .data-table tbody tr:hover {
    background: var(--hover-bg);
}

body.dark-theme .data-table th.sortable-header:hover {
    background: rgba(255, 255, 255, 0.04);
}

/* ── Table Controls & Pagination ──────────────────────── */
body.dark-theme .table-controls {
    background: var(--card-bg);
    border-top-color: var(--border-color);
}

body.dark-theme .pagination-controls button {
    background: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-theme .pagination-controls button:hover:not(:disabled) {
    background: var(--hover-bg);
}

body.dark-theme .pagination-controls button:disabled {
    opacity: 0.3;
}

/* ── Tabs ─────────────────────────────────────────────── */
body.dark-theme .tabs {
    border-bottom-color: var(--border-color);
}

body.dark-theme .tab-btn {
    color: var(--text-secondary);
}

body.dark-theme .tab-btn:hover {
    color: var(--text-primary);
    background: var(--hover-bg);
}

body.dark-theme .tab-btn.active {
    color: var(--primary-color);
}

/* ── Forms & Inputs ───────────────────────────────────── */
body.dark-theme .form-control,
body.dark-theme input[type="text"],
body.dark-theme input[type="email"],
body.dark-theme input[type="password"],
body.dark-theme input[type="number"],
body.dark-theme input[type="date"],
body.dark-theme input[type="datetime-local"],
body.dark-theme input[type="search"],
body.dark-theme select,
body.dark-theme textarea {
    background: #161822;
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-theme .form-control:focus,
body.dark-theme input:focus,
body.dark-theme select:focus,
body.dark-theme textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px var(--focus-ring);
}

body.dark-theme .form-group label {
    color: var(--text-secondary);
}

body.dark-theme .form-text {
    color: var(--text-muted);
}

/* ── Modals ───────────────────────────────────────────── */
body.dark-theme .modal-content {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

body.dark-theme .modal-header {
    border-bottom-color: var(--border-color);
}

body.dark-theme .modal-header h2 {
    color: var(--text-primary);
}

body.dark-theme .modal-footer {
    border-top-color: var(--border-color);
}

body.dark-theme .close-btn {
    color: var(--text-muted);
}

body.dark-theme .close-btn:hover {
    color: var(--text-primary);
}

/* ── Detail / Record View ─────────────────────────────── */
body.dark-theme .detail-section {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .detail-item {
    background: #161822;
    border-color: var(--border-color);
}

body.dark-theme .detail-item-label {
    color: var(--text-muted);
}

body.dark-theme .detail-item-value {
    color: var(--text-primary);
}

body.dark-theme .detail-item-value em {
    color: var(--text-muted);
}

body.dark-theme .column-card {
    background: #161822;
    border-color: var(--border-color);
}

body.dark-theme .related-table th {
    background: var(--table-header-bg);
    color: var(--text-secondary);
}

body.dark-theme .related-table td {
    border-bottom-color: var(--border-color);
}

body.dark-theme .related-count {
    background: rgba(59, 130, 246, 0.15);
    color: var(--primary-color);
}

/* ── Delete Confirmation Modal ────────────────────────── */
body.dark-theme .delete-option-cascade {
    border-color: rgba(239, 68, 68, 0.3);
}

body.dark-theme .delete-option-cascade:hover {
    background: rgba(239, 68, 68, 0.1);
    border-color: #ef4444;
}

body.dark-theme .delete-option-cascade .delete-option-icon {
    background: rgba(239, 68, 68, 0.15);
}

body.dark-theme .delete-option-nullify {
    border-color: rgba(245, 158, 11, 0.3);
}

body.dark-theme .delete-option-nullify:hover {
    background: rgba(245, 158, 11, 0.1);
    border-color: #f59e0b;
}

body.dark-theme .delete-option-nullify .delete-option-icon {
    background: rgba(245, 158, 11, 0.15);
}

body.dark-theme .delete-ref-section {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .delete-ref-header {
    background: var(--card-bg);
}

body.dark-theme .delete-ref-table th {
    background: var(--card-bg);
}

/* ── Toast Notifications ──────────────────────────────── */
body.dark-theme .toast {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

body.dark-theme .toast.success {
    border-left-color: var(--success-color);
}

body.dark-theme .toast.error {
    border-left-color: var(--danger-color);
}

body.dark-theme .toast.info {
    border-left-color: var(--primary-color);
}

/* ── Tiles / Cards View ───────────────────────────────── */
body.dark-theme .tile-card {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .tile-card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

body.dark-theme .tile-title {
    color: var(--text-primary);
}

body.dark-theme .tile-subtitle {
    color: var(--text-secondary);
}

body.dark-theme .tile-field strong {
    color: var(--text-muted);
}

body.dark-theme .tile-actions {
    border-top-color: var(--border-color);
}

/* ── Planning / Calendar View ─────────────────────────── */
body.dark-theme .planning-toolbar {
    background: var(--card-bg);
    border-bottom-color: var(--border-color);
}

body.dark-theme .planning-nav button {
    background: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-theme .planning-nav button:hover {
    background: var(--hover-bg);
}

body.dark-theme .planning-view-selector button {
    background: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-theme .planning-view-selector button.active {
    background: var(--primary-color);
    color: white;
}

body.dark-theme .planning-grid {
    border-color: var(--border-color);
}

body.dark-theme .planning-header-cell {
    background: var(--table-header-bg);
    color: var(--text-secondary);
    border-color: var(--border-color);
}

body.dark-theme .planning-day-cell {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .planning-event-card {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .planning-year-month {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .planning-year-month:hover {
    border-color: var(--primary-color);
}

/* ── Buttons overrides ────────────────────────────────── */
body.dark-theme .btn {
    border-color: var(--border-color);
}

body.dark-theme .btn-icon:hover {
    background-color: rgba(255, 255, 255, 0.06);
}

/* ── Date Filters ─────────────────────────────────────── */
body.dark-theme .date-filters-container {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-theme .date-filter-row select,
body.dark-theme .date-filter-row input {
    background: #161822;
    border-color: var(--border-color);
    color: var(--text-primary);
}

/* ── Footer ───────────────────────────────────────────── */
body.dark-theme .app-footer {
    background: var(--footer-bg);
    border-top: 1px solid var(--border-color);
    color: var(--footer-text);
}

body.dark-theme .app-footer a {
    color: var(--text-muted);
}

/* ── Loading ──────────────────────────────────────────── */
body.dark-theme .loading {
    color: var(--text-muted);
}

/* ── Scrollbar ────────────────────────────────────────── */
body.dark-theme ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body.dark-theme ::-webkit-scrollbar-track {
    background: var(--bg-color);
}

body.dark-theme ::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: var(--radius);
}

body.dark-theme ::-webkit-scrollbar-thumb:hover {
    background: #3d4560;
}

/* ── Selection & Misc ─────────────────────────────────── */
body.dark-theme ::selection {
    background: rgba(59, 130, 246, 0.3);
    color: #ffffff;
}

body.dark-theme hr {
    border-color: var(--border-color);
}

body.dark-theme code {
    background: #161822;
    color: #e2e4ea;
}

body.dark-theme pre {
    background: #161822;
    border-color: var(--border-color);
}

/* ── Action Buttons (table row) ───────────────────────── */
body.dark-theme .action-buttons .btn {
    color: var(--text-secondary);
}

body.dark-theme .action-buttons .btn:hover {
    color: var(--text-primary);
    background: var(--hover-bg);
}