/* =====================================================================
   Gemba Walk – système de design (industriel / professionnel)
   Chargé APRES le CSS propre à chaque page : il surcharge couleurs,
   typographie, boutons, cartes, formulaires, tableaux, navigation.
   Règle : sur le dashboard (.gw-dashboard) aucune propriété de mise en
   page (display, taille, marge, position) n'est modifiée.
   ===================================================================== */

/* ---------- 1. Jetons ---------- */
:root {
  color-scheme: light;   /* refuse l'assombrissement automatique des navigateurs (Samsung Internet, Chrome...) */
  --gw-font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --gw-steel-950: #0b1220; --gw-steel-900: #111c2e; --gw-steel-800: #1e293b; --gw-steel-700: #334155;
  --gw-steel-600: #475569; --gw-steel-500: #64748b; --gw-steel-400: #94a3b8; --gw-steel-300: #cbd5e1;
  --gw-steel-200: #e2e8f0; --gw-steel-100: #f1f5f9; --gw-steel-50: #f8fafc;
  --gw-accent: #f5a300; --gw-accent-600: #d98e00; --gw-accent-soft: #fff3d1;
  --gw-primary: #1d4ed8; --gw-success: #15803d; --gw-danger: #dc2626; --gw-warning: #d97706; --gw-info: #0e7490;
  --gw-radius: 12px; --gw-radius-sm: 8px;
  --gw-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06), 0 2px 8px rgba(15, 23, 42, .06);
  --gw-shadow-md: 0 4px 12px rgba(15, 23, 42, .10), 0 12px 32px rgba(15, 23, 42, .08);
  --gw-ring: 0 0 0 3px rgba(245, 163, 0, .35);

  /* variables historiques des pages -> nouvelle palette */
  --primary-color: var(--gw-primary); --secondary-color: var(--gw-steel-500); --success-color: var(--gw-success);
  --warning-color: var(--gw-accent); --danger-color: var(--gw-danger); --info-color: var(--gw-info);
  --orange-color: #ea580c; --light-bg: var(--gw-steel-100); --head-bg: var(--gw-steel-100);
  --header-bg: var(--gw-steel-900); --hover-color: var(--gw-accent-soft); --card-shadow: var(--gw-shadow-sm);
  --primary-bg: var(--gw-steel-100); --accent: var(--gw-accent); --accent-dark: var(--gw-accent-600);
  --accent-glow: rgba(245, 163, 0, .35);
}

/* ---------- 2. Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body.gw { font-family: var(--gw-font) !important; color: var(--gw-steel-800); background-color: var(--gw-steel-100) !important;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body.gw h1, body.gw h2, body.gw h3, body.gw h4, body.gw h5, body.gw h6 { font-family: var(--gw-font); letter-spacing: -.01em; }
body.gw a { color: var(--gw-primary); }
body.gw :focus-visible { outline: 2px solid var(--gw-accent); outline-offset: 2px; }
body.gw ::selection { background: var(--gw-accent-soft); color: var(--gw-steel-900); }
body.gw ::-webkit-scrollbar { width: 8px; height: 8px; }
body.gw ::-webkit-scrollbar-track { background: var(--gw-steel-100); border-radius: 8px; }
body.gw ::-webkit-scrollbar-thumb { background: var(--gw-steel-300); border-radius: 8px; }
body.gw ::-webkit-scrollbar-thumb:hover { background: var(--gw-steel-400); }
@media (prefers-reduced-motion: reduce) { body.gw *, body.gw *::before, body.gw *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; } }

/* ---------- 3. En-tête et navigation ---------- */
body.gw .title-section {
  background: linear-gradient(180deg, var(--gw-steel-900), var(--gw-steel-950)) !important; color: #fff;
  border-bottom: 3px solid transparent;
  border-image: repeating-linear-gradient(-45deg, var(--gw-accent) 0 10px, var(--gw-steel-950) 10px 20px) 1;
  box-shadow: var(--gw-shadow-sm);
}
body.gw .title-section h3, body.gw .title-section h4, body.gw .title-section h5 { color: #fff; font-weight: 800; letter-spacing: .04em; }
body.gw .navbar-container { background: #fff !important; border-bottom: 1px solid var(--gw-steel-200); box-shadow: var(--gw-shadow-sm); }
body.gw .navbar-container .user-info { color: var(--gw-steel-700); }
body.gw .navbar-container nav a { color: var(--gw-steel-700); font-weight: 700; letter-spacing: .03em; border-radius: 0; }
body.gw .navbar-container nav a:hover { background: var(--gw-accent-soft); color: var(--gw-steel-900); }
body.gw .navbar-container nav a.active { background: var(--gw-accent-soft); color: var(--gw-steel-900); border-bottom: 3px solid var(--gw-accent); }
body.gw .settings-btn a { background: #fff; border: 1px solid var(--gw-steel-200); box-shadow: var(--gw-shadow-sm); }

/* ---------- 4. Boutons ---------- */
body.gw .btn { border-radius: var(--gw-radius-sm); font-weight: 600; letter-spacing: .01em;
  transition: background-color .15s, border-color .15s, box-shadow .15s, transform .15s; }
body.gw .btn:active { transform: translateY(1px); }
body.gw .btn:disabled, body.gw .btn.disabled { opacity: .55; cursor: not-allowed; }
body.gw .btn-primary { background-color: var(--gw-primary); border-color: var(--gw-primary); color: #fff; }
body.gw .btn-primary:hover { background-color: #1e40af; border-color: #1e40af; }
body.gw .btn-success { background-color: var(--gw-success); border-color: var(--gw-success); color: #fff; }
body.gw .btn-success:hover { background-color: #166534; border-color: #166534; }
body.gw .btn-danger { background-color: var(--gw-danger); border-color: var(--gw-danger); color: #fff; }
body.gw .btn-danger:hover { background-color: #b91c1c; border-color: #b91c1c; }
body.gw .btn-warning { background-color: var(--gw-accent); border-color: var(--gw-accent); color: var(--gw-steel-950); }
body.gw .btn-warning:hover { background-color: var(--gw-accent-600); border-color: var(--gw-accent-600); }
body.gw .btn-secondary { background-color: var(--gw-steel-700); border-color: var(--gw-steel-700); color: #fff; }
body.gw .btn-secondary:hover { background-color: var(--gw-steel-800); border-color: var(--gw-steel-800); }
body.gw .btn-outline-secondary { color: var(--gw-steel-700); border-color: var(--gw-steel-300); background: #fff; }
body.gw .btn-outline-secondary:hover { background: var(--gw-steel-100); border-color: var(--gw-steel-500); color: var(--gw-steel-900); }
body.gw .btn-outline-danger { color: var(--gw-danger); border-color: #fca5a5; background: #fff; }
body.gw .btn-outline-danger:hover { background: var(--gw-danger); border-color: var(--gw-danger); color: #fff; }

/* ---------- 5. Cartes ---------- */
body.gw .card { border: 1px solid var(--gw-steel-200); border-radius: var(--gw-radius); box-shadow: var(--gw-shadow-sm); background: #fff; }
body.gw .card-header { background: #fff; border-bottom: 1px solid var(--gw-steel-200); }
body.gw .card-header h5, body.gw .card-header h4 { font-weight: 700; color: var(--gw-steel-900); }

/* ---------- 6. Formulaires ---------- */
body.gw .form-label, body.gw label { color: var(--gw-steel-700); font-weight: 600; }
body.gw .form-control, body.gw .form-select, body.gw select.form-control, body.gw textarea.form-control {
  border: 1.5px solid var(--gw-steel-300) !important; border-radius: var(--gw-radius-sm) !important;
  background-color: #fff !important; color: var(--gw-steel-900) !important; transition: border-color .15s, box-shadow .15s; }
body.gw .form-control:focus, body.gw .form-select:focus {
  border-color: var(--gw-accent) !important; box-shadow: var(--gw-ring) !important; outline: none !important; }
body.gw .form-control::placeholder { color: var(--gw-steel-400); }
body.gw .form-control:disabled, body.gw .form-control[disabled] { background-color: var(--gw-steel-100) !important; color: var(--gw-steel-500) !important; }

/* ---------- 7. Tableaux ---------- */
body.gw .table { --bs-table-bg: transparent; color: var(--gw-steel-800); }
body.gw .table thead th, body.gw .report-table thead th {
  background: var(--gw-steel-100) !important; color: var(--gw-steel-600) !important; font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; border-bottom: 2px solid var(--gw-steel-200); }
body.gw .table-dark th, body.gw thead.table-dark th { background: var(--gw-steel-800) !important; color: #fff !important; }
body.gw thead.table-success th { background: #e6f4ea !important; color: #14532d !important; }
body.gw thead.table-warning th { background: var(--gw-accent-soft) !important; color: #7c4a03 !important; }
body.gw .table tbody tr:hover { background-color: rgba(245, 163, 0, .06); }
body.gw .table-container, body.gw .report-table-wrapper { -webkit-overflow-scrolling: touch; }
body.gw .img-thumbnail { border: 1px solid var(--gw-steel-200); border-radius: var(--gw-radius-sm); background: #fff; }

/* ---------- 8. Badges, alertes, modales ---------- */
body.gw .badge { font-weight: 700; letter-spacing: .02em; border-radius: 999px; }
body.gw .alert { border-radius: var(--gw-radius-sm); border-width: 1px; font-weight: 500; box-shadow: var(--gw-shadow-sm); }
body.gw .alert-success { background: #ecfdf3; border-color: #a7f3d0; color: #14532d; }
body.gw .alert-danger { background: #fef2f2; border-color: #fecaca; color: #7f1d1d; }
body.gw .alert-warning { background: var(--gw-accent-soft); border-color: #fcd34d; color: #78350f; }
body.gw .alert-info { background: #ecfeff; border-color: #a5f3fc; color: #164e63; }
body.gw .modal-content, body.gw .task-modal-content, body.gw .confirm-card, body.gw .message-box {
  border-radius: var(--gw-radius); box-shadow: var(--gw-shadow-md); }
body.gw .task-modal-header, body.gw .modal-header { border-bottom: 1px solid var(--gw-steel-200); }
body.gw .empty-state { color: var(--gw-steel-400); }

/* ---------- 9. Pages d'authentification / erreurs ---------- */
body.gw-auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px 16px;
  background: radial-gradient(circle at 80% 0%, rgba(245,163,0,.12), transparent 45%),
              radial-gradient(circle at 0% 100%, rgba(29,78,216,.10), transparent 45%), var(--gw-steel-100) !important; }
body.gw-auth .card { border: none !important; border-radius: 16px !important; box-shadow: var(--gw-shadow-md) !important; }
.gw-auth-card { width: 100%; max-width: 440px; }
.gw-brand { font-weight: 800; letter-spacing: .06em; font-size: 1.6rem; color: var(--gw-steel-900); }
.gw-brand span { color: var(--gw-accent); }
.gw-error-code { font-size: 4rem; font-weight: 800; line-height: 1; color: var(--gw-accent); margin: .5rem 0; }
body.gw .card-header::before { background: linear-gradient(90deg, var(--gw-accent) 0%, #ffd166 100%) !important; }

/* ---------- 10. Menu, saisie, confirmation ---------- */
body.gw-menu .menu-button { box-shadow: var(--gw-shadow-sm); text-transform: uppercase; letter-spacing: .06em; }
body.gw-menu .menu-button:hover { box-shadow: var(--gw-shadow-md); transform: translateY(-1px); }
body.gw-menu .welcome-badge { background: var(--gw-steel-100); border-color: var(--gw-steel-200); }
body.gw-form .preview-container, body.gw-form .photo-container { background: var(--gw-steel-50); border-radius: var(--gw-radius); }
body.gw-form .btn-send, body.gw-form .btn-save, body.gw-form .btn-upload, body.gw-form .btn-photo { box-shadow: var(--gw-shadow-sm); }
body.gw-form .btn-send { background: linear-gradient(135deg, var(--gw-accent), #ffb83b) !important; color: var(--gw-steel-950) !important; }
body.gw-form select[multiple] option:checked { background: var(--gw-accent) linear-gradient(0deg, var(--gw-accent), var(--gw-accent)) !important; color: var(--gw-steel-950) !important; }

/* ---------- 11. Pages d'administration (manage / Poste / Parametrage) ---------- */
body.gw-app .content-section { max-width: 1600px; margin: 0 auto; }
body.gw-app .planingOperation:hover { transform: none; scale: 1.002; }
body.gw-app .btn-validate { background: var(--gw-success); border-radius: var(--gw-radius-sm); font-weight: 600; }
body.gw-app .btn-reject { background: var(--gw-danger); border-radius: var(--gw-radius-sm); font-weight: 600; }
body.gw-settings .section-card-custom, body.gw-settings .export-section { background: var(--gw-steel-50); border-color: var(--gw-steel-200); border-radius: var(--gw-radius); }
body.gw-settings .btn-primary-custom { background: var(--gw-primary); }
body.gw-settings .btn-success-custom { background: var(--gw-success); }
body.gw-settings .btn-export { background: var(--gw-steel-800); }
body.gw-settings .btn-export:hover { background: var(--gw-steel-950); }

/* ---------- 12. Dashboard : couleurs, typographie, cartes uniquement ---------- */
body.gw-dashboard .metric-card, body.gw-dashboard .section-card, body.gw-dashboard .overview-card,
body.gw-dashboard .kpi-banner, body.gw-dashboard .reports-card {
  border: 1px solid var(--gw-steel-200); border-radius: var(--gw-radius); box-shadow: var(--gw-shadow-sm); }
body.gw-dashboard .metric-card:hover, body.gw-dashboard .section-card:hover { box-shadow: var(--gw-shadow-md); }
body.gw-dashboard .kpi-banner-title, body.gw-dashboard .DataRep { color: var(--gw-steel-500); }
body.gw-dashboard .kpi-pill { background: var(--gw-steel-50); border-radius: var(--gw-radius-sm); }
body.gw-dashboard .kpi-pill-label, body.gw-dashboard .kpi-metric-label { color: var(--gw-steel-500); }
body.gw-dashboard .kpi-pill-value, body.gw-dashboard .metric-value, body.gw-dashboard .task-count { font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
body.gw-dashboard .metric-title { color: var(--gw-steel-700); text-transform: uppercase; letter-spacing: .05em; font-size: .85rem; }
body.gw-dashboard .section-title { letter-spacing: .06em; text-transform: uppercase; }
body.gw-dashboard .kpi-bar-track { background: var(--gw-steel-200); }
body.gw-dashboard .kpi-dep-tab { background: var(--gw-steel-100); color: var(--gw-steel-700); }
body.gw-dashboard .kpi-dep-tab.active { background: var(--gw-steel-800); border-color: var(--gw-steel-800); color: #fff; }
body.gw-dashboard .filter-date-pair input[type="date"] { border-color: var(--gw-steel-300); border-radius: var(--gw-radius-sm); background: #fff; }
body.gw-dashboard .btn-compress { border-color: var(--gw-steel-300); border-radius: var(--gw-radius-sm); }
body.gw-dashboard .switch-track.on { background: var(--gw-success); }
body.gw-dashboard .report-card-item { border-radius: var(--gw-radius-sm); }
body.gw-dashboard .card-avatar { background: linear-gradient(135deg, var(--gw-steel-700), var(--gw-primary)); }

/* ---------- 13. Responsive (hors dashboard : sa mise en page est conservée) ---------- */
@media (max-width: 991px) {
  body.gw-app .content-section, body.gw-settings .card-body-custom { padding-left: 12px; padding-right: 12px; }
  body.gw-app .table-container { overflow-x: auto; }
}
@media (max-width: 575px) {
  body.gw .btn { min-height: 44px; }                 /* cibles tactiles */
  body.gw-form .card-body { padding: 16px !important; }
  body.gw-auth .card-body { padding: 20px !important; }
}
@media print { body.gw .navbar-container, body.gw .settings-btn, body.gw .btn { display: none !important; } }
