/* ============ PALETTE ARDOISE + MERS DU SUD ============ */
:root {
  --slate-900: #0f172a;
  --slate-800: #1e293b;
  --slate-700: #334155;
  --slate-600: #475569;
  --slate-500: #64748b;
  --slate-400: #94a3b8;
  --slate-300: #cbd5e1;
  --slate-200: #e2e8f0;
  --slate-100: #f1f5f9;
  --slate-50:  #f8fafc;

  --sea-900: #082f49;   /* mers du sud très foncé */
  --sea-800: #0c4a6e;   /* mers du sud foncé */
  --sea-700: #075985;
  --sea-600: #0284c7;   /* bleu mers du sud */
  --sea-500: #0ea5e9;
  --sea-400: #38bdf8;
  --sea-300: #7dd3fc;
  --sea-200: #bae6fd;
  --sea-100: #e0f2fe;

  --teal-500: #14b8a6;
  --emerald-500: #10b981;
  --amber-500: #f59e0b;
  --rose-500:  #f43f5e;
}

* { box-sizing: border-box; }
body {
  background: var(--slate-100);
  color: var(--slate-800);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, sans-serif;
  font-size: 14px;
}

/* ===== Navbar ardoise ===== */
.navbar {
  background: linear-gradient(135deg, var(--slate-900), var(--slate-700)) !important;
  border-bottom: 3px solid var(--sea-600);
  box-shadow: 0 2px 8px rgba(15,23,42,0.15);
}
.navbar .navbar-brand,
.navbar .nav-link,
.navbar span,
.navbar .btn {
  color: #fff !important;
}
.navbar .btn-light {
  background: var(--sea-500) !important;
  color: #fff !important;
  border: none;
}
.navbar .btn-light:hover { background: var(--sea-600) !important; }
.navbar .btn-outline-light {
  border-color: rgba(255,255,255,0.3);
}

/* ===== Cartes ===== */
.card {
  border: 1px solid var(--slate-200);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}
.card-header {
  background: var(--slate-50) !important;
  border-bottom: 1px solid var(--slate-200);
  font-weight: 600;
  color: var(--slate-700);
}
.card-header.bg-success { background: var(--emerald-500) !important; color: #fff; }
.card-header.bg-primary { background: var(--sea-700) !important; color: #fff; }
.card-header.bg-light { background: var(--slate-50) !important; }

/* ===== Boutons ===== */
.btn-primary {
  background: var(--sea-700) !important;
  border-color: var(--sea-700) !important;
}
.btn-primary:hover { background: var(--sea-800) !important; border-color: var(--sea-800) !important; }
.btn-success { background: var(--emerald-500) !important; border-color: var(--emerald-500) !important; }
.btn-outline-secondary {
  color: var(--slate-600) !important;
  border-color: var(--slate-300) !important;
}
.btn-outline-secondary:hover { background: var(--slate-100) !important; color: var(--slate-800) !important; }
.btn-outline-primary {
  color: var(--sea-700) !important;
  border-color: var(--sea-300) !important;
}
.btn-outline-primary:hover { background: var(--sea-700) !important; color: #fff !important; }

/* ===== Arborescence ===== */
details > summary {
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
  user-select: none;
  list-style: none;
  transition: background 0.12s;
}
details > summary::-webkit-details-marker { display: none; }
details > summary::before {
  content: "▶";
  display: inline-block;
  margin-right: 8px;
  font-size: 9px;
  transition: transform 0.15s;
  color: var(--slate-400);
}
details[open] > summary::before { transform: rotate(90deg); }
details > summary:hover { background: var(--slate-100); }

.tree-matiere > summary {
  font-size: 0.95rem;
  color: var(--sea-800);
  font-weight: 600;
}
.tree-dossier > summary {
  font-size: 0.88rem;
  color: var(--slate-600);
}
.fiche-cb { transform: scale(1.15); accent-color: var(--sea-600); }

/* ===== Onglets fiche ===== */
.nav-tabs {
  border-bottom: 2px solid var(--slate-200);
}
.nav-tabs .nav-link {
  color: var(--slate-500);
  border: none;
  border-bottom: 3px solid transparent;
  padding: 12px 18px;
  font-weight: 500;
  background: none;
}
.nav-tabs .nav-link:hover {
  color: var(--sea-700);
  background: var(--slate-50);
  border-bottom-color: var(--slate-200);
}
.nav-tabs .nav-link.active {
  color: var(--sea-800);
  background: #fff;
  border-bottom-color: var(--sea-600);
  font-weight: 600;
}

/* ===== Badges ===== */
.badge.bg-info { background: var(--sea-100) !important; color: var(--sea-800) !important; }
.badge.bg-success { background: var(--emerald-500) !important; }
.badge.bg-warning { background: var(--amber-500) !important; color: #fff !important; }
.badge.bg-secondary { background: var(--slate-500) !important; }
.badge.bg-primary { background: var(--sea-700) !important; }
.badge.bg-light { background: var(--slate-200) !important; color: var(--slate-700) !important; }

/* ===== Alerts ===== */
.alert { border-radius: 8px; border: none; }
.alert-success { background: #d1fae5; color: #065f46; }
.alert-info { background: var(--sea-100); color: var(--sea-800); }
.alert-warning { background: #fef3c7; color: #92400e; }
.alert-danger { background: #fee2e2; color: #991b1b; }

/* ===== Forms ===== */
.form-control:focus, .form-select:focus {
  border-color: var(--sea-500);
  box-shadow: 0 0 0 3px var(--sea-100);
}

/* ===== Tableau élèves ===== */
.table thead th {
  background: var(--slate-50);
  color: var(--slate-700);
  font-weight: 600;
  border-bottom: 2px solid var(--slate-200);
}
.table-hover tbody tr:hover { background: var(--sea-100); }

/* ===== Login ===== */
.login-bg {
  min-height: 100vh;
  background: linear-gradient(135deg, var(--slate-900) 0%, var(--sea-800) 100%);
  display: flex; align-items: center; justify-content: center;
}

/* Couleurs custom */
.text-purple { color: #8e44ad; }
.text-sea { color: var(--sea-700); }
.bg-sea { background: var(--sea-700); color: #fff; }
.bg-slate { background: var(--slate-800); color: #fff; }

/* Titres */
h1, h2, h3, h4, h5 { color: var(--slate-800); }

/* Préview fichiers */
.file-card-preview {
  background: var(--slate-50);
  border: 1px dashed var(--slate-300);
  border-radius: 6px;
}

.btn-outline-warning {
  color: var(--amber-500) !important;
  border-color: var(--amber-500) !important;
}
.btn-outline-warning:hover { background: var(--amber-500) !important; color: white !important; }