/* Thèmes ERP — variables globales, palettes, composants */
html {
  --font-scale: 1;
}

:root, [data-theme="dark"] {
  --bg: #0f1410;
  --bg-2: #161c17;
  --panel: #1c2420;
  --panel-2: #232b26;
  --border: #2a342e;
  --border-2: #3a463f;
  --text: #e8efe9;
  --text-dim: #8c9b91;
  --text-faint: #5b6962;
  --accent: #7dd87f;
  --accent-2: #f5c542;
  --accent-3: #e8704a;
  --danger: #e8554a;
  --info: #5ab1e8;
  --warn: #e8a64a;
  --chart-grid: rgba(255,255,255,0.06);
  --shadow: rgba(0,0,0,0.35);
  --input-bg: #0f1410;
  --overlay: rgba(15,20,16,0.75);
  --sidebar-bg: var(--bg-2);
  --topbar-bg: var(--bg);
  --card-bg: var(--panel);
  --table-head-bg: var(--bg-2);
  --btn-text: #0f1410;
  --btn-primary-hover: #8ee090;
  --notif-unread: rgba(125,216,127,0.06);
}

[data-theme="light"] {
  --bg: #f4f1ea;
  --bg-2: #ebe6dc;
  --panel: #fffcf7;
  --panel-2: #f7f3eb;
  --border: #ddd5c8;
  --border-2: #c9bfb0;
  --text: #2c2419;
  --text-dim: #5c5348;
  --text-faint: #8a8075;
  --accent: #2d8a45;
  --accent-2: #c97a18;
  --accent-3: #c45a2a;
  --danger: #c0392b;
  --info: #2874a6;
  --warn: #b7791f;
  --chart-grid: rgba(0,0,0,0.08);
  --shadow: rgba(61,40,23,0.12);
  --input-bg: #fff;
  --overlay: rgba(44,36,25,0.45);
  --sidebar-bg: var(--bg-2);
  --topbar-bg: var(--bg);
  --card-bg: var(--panel);
  --table-head-bg: var(--bg-2);
  --btn-text: #fff;
  --btn-primary-hover: #256b38;
  --notif-unread: rgba(45,138,69,0.08);
}

/* Sidebar / topbar thématisés */
.sidebar { background: var(--sidebar-bg); }
.topbar { background: var(--topbar-bg); }
.kpi, .panel, .project-card, .deal-card, .export-card, .quick-card { background: var(--card-bg); }
.table th { background: var(--table-head-bg); }
.modal-overlay { background: var(--overlay); }
.modal-footer { background: var(--bg-2); }
.field input, .field select, .field textarea, .search-input { background: var(--input-bg); color: var(--text); }
.notif-card.unread { background: var(--notif-unread); }

[data-theme="light"] .btn-primary { color: var(--btn-text); }
[data-theme="light"] .user-avatar { color: var(--btn-text); }
[data-theme="light"] .sidebar { box-shadow: 2px 0 12px var(--shadow); }
[data-theme="dark"] .btn-primary { color: var(--btn-text); }
.btn-primary:hover { background: var(--btn-primary-hover); }

/* Connexion / vitrine */
[data-theme="dark"] body.landing.login-page {
  background: linear-gradient(160deg, var(--bg) 0%, var(--bg-2) 50%, var(--panel) 100%);
  color: var(--text);
}
[data-theme="dark"] body.landing.login-page .login-card {
  background: var(--panel);
  border-color: var(--border);
  color: var(--text);
}
[data-theme="dark"] body.landing.login-page .login-card h1,
[data-theme="dark"] body.landing.login-page .login-card .field label { color: var(--text); }
[data-theme="dark"] body.landing.login-page .login-card .field input {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text);
}
[data-theme="dark"] body.landing.login-page .login-sub { color: var(--text-dim); }
[data-theme="dark"] body.landing.login-page .login-err {
  background: rgba(232,85,74,0.15);
  border-color: var(--danger);
  color: var(--danger);
}

[data-theme="light"] body.landing.login-page {
  background: linear-gradient(160deg, var(--bg) 0%, var(--bg-2) 50%, #e8dfd0 100%);
}

[data-theme="dark"] body.landing:not(.login-page) {
  background: var(--bg);
  color: var(--text);
}
[data-theme="dark"] body.landing:not(.login-page) .landing-header {
  background: var(--panel);
  border-bottom: 1px solid var(--border);
}
[data-theme="dark"] body.landing:not(.login-page) .landing-features,
[data-theme="dark"] body.landing:not(.login-page) .landing-hero {
  color: var(--text);
}
[data-theme="dark"] body.landing:not(.login-page) .landing-footer {
  background: var(--bg-2);
  border-top: 1px solid var(--border);
  color: var(--text-dim);
}

/* CMS admin */
[data-theme="dark"] .cms-logo-preview,
[data-theme="dark"] .cms-media-thumb { background: var(--bg); }
[data-theme="light"] .cms-logo-preview.light-bg { background: var(--panel-2); }
[data-theme="dark"] .cms-rich-editor { background: var(--input-bg); color: var(--text); border-color: var(--border); }
[data-theme="light"] .cms-rich-editor { background: var(--input-bg); color: var(--text); }

.chart-wrap { position: relative; height: 260px; padding: 12px; }
.chart-wrap-sm { height: 180px; }
.chart-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
@media (max-width: 900px) { .chart-row { grid-template-columns: 1fr; } }

.search-global {
  width: 220px; padding: 7px 12px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--input-bg);
  color: var(--text); font-size: 12px;
}
.search-global:focus { outline: none; border-color: var(--accent); }

.theme-toggle {
  width: 36px; height: 36px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--panel);
  cursor: pointer; font-size: 16px; display: grid; place-items: center;
  color: var(--text);
}
.theme-toggle:hover { border-color: var(--accent); }

.notif-bell { position: relative; }
.notif-badge {
  position: absolute; top: -4px; right: -4px;
  background: var(--danger); color: #fff; font-size: 9px;
  min-width: 16px; height: 16px; border-radius: 8px;
  display: grid; place-items: center; font-weight: 700;
}

.toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* Flex uniquement sur le conteneur interne — jamais sur <td> (casse les Actions) */
div.data-table-actions,
.row-actions-bar.data-table-actions {
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
}
td.data-table-actions,
td.col-actions {
  display: table-cell;
  text-align: right;
  vertical-align: middle;
  white-space: nowrap;
}

.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 768px) { .settings-grid { grid-template-columns: 1fr; } }
.settings-section {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: 10px; padding: 20px;
}
.settings-section h3 {
  font-family: 'Fraunces', serif; font-size: 15px; margin-bottom: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--border);
}

.widget-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.widget-chip {
  padding: 6px 12px; border-radius: 20px; font-size: 11px;
  border: 1px solid var(--border); cursor: pointer; user-select: none;
  color: var(--text-dim);
}
.widget-chip.on { background: var(--accent); color: var(--btn-text); border-color: var(--accent); font-weight: 600; }

.stat-mini-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 8px; margin-bottom: 12px; }
.stat-mini { background: var(--bg-2); border-radius: 8px; padding: 10px; text-align: center; }
.stat-mini .v { font-size: 16px; font-weight: 700; font-family: 'JetBrains Mono', monospace; }
.stat-mini .l { font-size: 10px; color: var(--text-faint); margin-top: 2px; }

.search-item { padding: 10px 14px; cursor: pointer; font-size: 12px; border-bottom: 1px solid var(--border); color: var(--text); }
.search-item:hover { background: var(--panel-2); }
.notif-item { padding: 12px 14px; border-bottom: 1px solid var(--border); cursor: pointer; }
.notif-item.unread { background: var(--bg-2); }
.notif-title { font-weight: 600; font-size: 12px; }
.notif-msg { font-size: 11px; color: var(--text-dim); margin-top: 4px; }

.filter-chip.active { background: color-mix(in srgb, var(--accent) 12%, transparent); border-color: var(--accent); color: var(--accent); }

/* ── Composants ERP — thème unifié ── */
body { background: var(--bg); color: var(--text); }
.content { background: var(--bg); }
.modal { background: var(--panel); color: var(--text); border-color: var(--border); }
.modal-header { border-bottom-color: var(--border); background: var(--panel); }
.modal-body { background: var(--panel); color: var(--text); }
.modal-title { color: var(--text); }
.modal .close { color: var(--text-dim); }
.modal .close:hover { color: var(--text); background: var(--panel-2); }

select, textarea, input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="date"], input[type="search"], input[type="url"] {
  background: var(--input-bg);
  color: var(--text);
  border-color: var(--border);
}
select option { background: var(--panel); color: var(--text); }

.field label { color: var(--text-dim); }
.field--error input, .field--error select, .field--error textarea {
  border-color: var(--danger) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--danger) 15%, transparent);
}

.btn.is-saving { opacity: 0.85; pointer-events: none; position: relative; }
.btn.is-saving::after {
  content: '';
  width: 14px; height: 14px;
  border: 2px solid color-mix(in srgb, currentColor 30%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: theme-spin 0.65s linear infinite;
  margin-left: 6px;
}
@keyframes theme-spin { to { transform: rotate(360deg); } }

.toast {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--border);
  box-shadow: 0 8px 32px var(--shadow);
}
.toast.err { border-color: var(--danger); color: var(--danger); }

.badge { color: inherit; }
.badge-gray { background: var(--bg-2); color: var(--text-dim); }
.badge-green { background: color-mix(in srgb, var(--accent) 18%, var(--panel)); color: var(--accent); }
.badge-red { background: color-mix(in srgb, var(--danger) 15%, var(--panel)); color: var(--danger); }
.badge-orange { background: color-mix(in srgb, var(--accent-3) 15%, var(--panel)); color: var(--accent-3); }
.badge-gold { background: color-mix(in srgb, var(--accent-2) 18%, var(--panel)); color: var(--accent-2); }
.badge-info { background: color-mix(in srgb, var(--info) 15%, var(--panel)); color: var(--info); }

.kanban-col { background: var(--panel-2); border-color: var(--border); }
.kanban-col-head { color: var(--text-dim); border-bottom-color: var(--border); }
.deal-card { background: var(--panel); border-color: var(--border); color: var(--text); }
.deal-card:hover { border-color: var(--accent); }
.kanban-empty { color: var(--text-faint); }

.empty, .empty-title, .empty-text { color: var(--text-dim); }
.dl dt { color: var(--text-faint); }
.dl dd { color: var(--text); }

.toolbar { border-color: var(--border); }
.text-mini { color: var(--text-faint); }

/* FullCalendar — variables texte */
.fc {
  --fc-button-text-color: var(--text);
  --fc-neutral-text-color: var(--text-dim);
}
[data-theme="light"] .fc .fc-button-primary:not(:disabled).fc-button-active {
  color: var(--btn-text);
}

/* Site vitrine — pont thème */
[data-theme="dark"] body.landing:not(.login-page) {
  --peya-cream: var(--bg);
  --peya-cream-2: var(--bg-2);
  --peya-white: var(--panel);
  --peya-brown: var(--text);
  --peya-text: var(--text);
  --peya-text-dim: var(--text-dim);
  --peya-green: var(--accent);
  --peya-orange: var(--accent-2);
  --peya-orange-dark: var(--accent-3);
  --peya-shadow: var(--shadow);
}
[data-theme="light"] body.landing:not(.login-page) {
  --peya-cream: var(--bg);
  --peya-cream-2: var(--bg-2);
  --peya-white: var(--panel);
  --peya-brown: var(--text);
  --peya-text: var(--text);
  --peya-text-dim: var(--text-dim);
  --peya-green: var(--accent);
  --peya-orange: var(--accent-2);
  --peya-orange-dark: var(--accent-3);
  --peya-shadow: var(--shadow);
}

/* Paramètres / médiathèque CMS */
.settings-section, .cms-block-card, .cms-faq-item, .cms-media-item {
  background: var(--panel);
  border-color: var(--border);
  color: var(--text);
}
.cms-admin-tabs button, .cms-tab {
  background: var(--panel-2);
  color: var(--text-dim);
  border-color: var(--border);
}
.cms-admin-tabs button.active, .cms-tab.active {
  background: color-mix(in srgb, var(--accent) 12%, var(--panel));
  color: var(--accent);
  border-color: var(--accent);
}

/* Graphiques Chart.js tooltip fix */
.chart-wrap { background: transparent; }

/* Pages d'erreur */
.error-page, .server-error {
  background: var(--bg);
  color: var(--text);
}