/* ============================================================
   Incent — theme back-office « Comptoir »
   Terracotta #B4441F / #8A3115, ambre #E8A13C, encres brunes,
   fonds creme chauds, sidebar brun cacao en degrade.
   Boutons pilule, coins 16px (cartes) / 10px (champs),
   pas d'ombres lourdes.
   ============================================================ */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../fonts/montserrat-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
}

:root {
  /* Charte « Comptoir » */
  --inc-primary: #B4441F;
  --inc-primary-rgb: 180, 68, 31;
  --inc-primary-dark: #8A3115;
  --inc-accent: #E8A13C;
  --inc-accent-rgb: 232, 161, 60;
  --inc-ink: #33241A;
  --inc-ink-2: #6E5C4B;
  --inc-bg: #FAF4EA;          /* fond app */
  --inc-bg-soft: #F1E3CF;
  --inc-bg-dark: #2E2015;     /* sidebar (degrade vers #3A2B1D) */
  --inc-bg-dark-2: #3A2B1D;
  --inc-cream: #F7EFE2;
  --inc-success: #4E6B33;
  --inc-success-rgb: 78, 107, 51;
  --inc-border: rgba(51, 36, 26, .12);

  /* Rampe de neutres chauds — UI denses (tableaux, formulaires) */
  --inc-n0: #FFFFFF;
  --inc-n1: #FAF4EA;
  --inc-n2: #F1E3CF;
  --inc-n3: #E2D3BC;
  --inc-n4: #B9A992;
  --inc-n5: #8B7B69;
  --inc-n6: #6E5C4B;
  --inc-n7: #52443A;
  --inc-n8: #33241A;

  /* Rayons */
  --inc-radius-carte: 16px;
  --inc-radius-champ: 10px;

  /* Bootstrap bridge */
  --bs-primary: #B4441F;
  --bs-primary-rgb: 180, 68, 31;
  --bs-link-color: #B4441F;
  --bs-link-hover-color: #8A3115;
  --bs-body-font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
  --bs-body-color: #33241A;
  --bs-border-radius: 10px;
}

body {
  background: var(--inc-bg);
  color: var(--inc-ink);
  font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
  font-family: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  font-weight: 700;
  color: var(--inc-ink);
}
::selection { background: var(--inc-primary); color: #fff; }

/* ---------- Boutons (pilule) ---------- */
.btn { border-radius: 999px; font-weight: 600; }
.btn-primary { --bs-btn-bg: var(--inc-primary); --bs-btn-border-color: var(--inc-primary); --bs-btn-hover-bg: var(--inc-primary-dark); --bs-btn-hover-border-color: var(--inc-primary-dark); --bs-btn-active-bg: var(--inc-primary-dark); --bs-btn-active-border-color: var(--inc-primary-dark); }
.btn-outline-primary { --bs-btn-color: var(--inc-primary); --bs-btn-border-color: var(--inc-primary); --bs-btn-hover-bg: var(--inc-primary); --bs-btn-hover-border-color: var(--inc-primary); --bs-btn-active-bg: var(--inc-primary-dark); --bs-btn-active-border-color: var(--inc-primary-dark); }
.btn-success, .btn-accent { --bs-btn-bg: var(--inc-success); --bs-btn-border-color: var(--inc-success); --bs-btn-hover-bg: #3D5528; --bs-btn-hover-border-color: #3D5528; --bs-btn-active-bg: #3D5528; --bs-btn-active-border-color: #3D5528; color: #fff; }
.btn-warning { --bs-btn-bg: var(--inc-accent); --bs-btn-border-color: var(--inc-accent); --bs-btn-hover-bg: #CE8A26; --bs-btn-hover-border-color: #CE8A26; color: var(--inc-ink); }

/* ---------- Topbar ---------- */
.inc-topbar {
  background: var(--inc-n0);
  border-bottom: 1px solid var(--inc-border);
}
.inc-logo-app svg, .inc-logo-app img { height: 34px; width: auto; display: block; }

/* ---------- Sidebar cacao ---------- */
.sidebar {
  min-height: calc(100vh - 56px);
  background: linear-gradient(180deg, var(--inc-bg-dark) 0%, var(--inc-bg-dark-2) 100%);
  border-right: none;
}
.sidebar .nav-link {
  color: var(--inc-n4);
  border-radius: 10px;
  margin: 0 .5rem;
  padding: .45rem .75rem;
}
.sidebar .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .07); }
.sidebar .nav-link.active {
  background: rgba(var(--inc-primary-rgb), .55);
  color: #fff;
  font-weight: 600;
}
.sidebar .nav-link.active i { color: var(--inc-accent); }
.sidebar h6 {
  color: var(--inc-n5);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 1.1rem;
  padding-left: 1.25rem;
}
.sidebar i { color: var(--inc-n4); margin-right: .35rem; }

/* ---------- Cartes / tableaux ---------- */
.card {
  background: var(--inc-n0);
  border: 1px solid var(--inc-border);
  border-radius: var(--inc-radius-carte);
  box-shadow: none;
}
.card-header { background: transparent; border-bottom-color: var(--inc-border); font-weight: 600; }
.table { --bs-table-bg: transparent; }
.table thead th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--inc-n6);
  border-bottom: 2px solid var(--inc-n3);
  background: var(--inc-n1);
}
.table tbody tr:hover { background: var(--inc-n1); }
.table tbody td { border-color: var(--inc-n2); }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--inc-n1); }

/* KPI cards */
.inc-kpi { border-top: 3px solid var(--inc-n3); background: var(--inc-n0); transition: border-color .15s ease; }
.inc-kpi:hover { border-top-color: var(--inc-n4); }
.inc-kpi .inc-kpi-icon { font-size: 1rem; margin-right: .25rem; }
.inc-kpi-neutre    { border-top-color: var(--inc-n5); }
.inc-kpi-neutre    .inc-kpi-icon { color: var(--inc-n5); }
.inc-kpi-info      { border-top-color: var(--inc-primary); }
.inc-kpi-info      .inc-kpi-icon { color: var(--inc-primary); }
.inc-kpi-success   { border-top-color: var(--inc-success); }
.inc-kpi-success   .inc-kpi-icon { color: var(--inc-success); }
.inc-kpi-attention { border-top-color: var(--inc-accent); }
.inc-kpi-attention .inc-kpi-icon { color: var(--inc-accent); }
.inc-kpi-danger    { border-top-color: #A3341B; }
.inc-kpi-danger    .inc-kpi-icon { color: #A3341B; }
.inc-kpi-brand     { border-top-color: var(--inc-primary); background: var(--inc-cream); }
.inc-kpi-brand     .inc-kpi-icon { color: var(--inc-primary); }
.inc-kpi-brand     .display-6   { color: var(--inc-primary-dark); }

/* Pills de niveau */
.alerte-niv-info      { background: var(--inc-bg-soft);  color: var(--inc-n7); }
.alerte-niv-ok        { background: #E4EBD8; color: #3D5528; }
.alerte-niv-attention { background: #F8E8CB; color: #8a5a00; }
.alerte-niv-danger    { background: #F5DAD2; color: #8A3115; }
.alerte-niv-critique  { background: #EFC9BE; color: #6E2610; }

/* Pills */
.pill {
  display: inline-block;
  padding: .125rem .5rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 600;
  white-space: nowrap;
  line-height: 1.4;
}

/* ---------- Formulaires ---------- */
.form-control, .form-select {
  background: var(--inc-n0);
  border-color: var(--inc-n3);
  border-radius: var(--inc-radius-champ);
}
.form-control:focus, .form-select:focus {
  border-color: var(--inc-primary);
  box-shadow: 0 0 0 .2rem rgba(var(--inc-primary-rgb), .12);
  background: #fff;
}
.form-label { color: var(--inc-n7); font-weight: 600; }
.form-text  { color: var(--inc-n5); }
.input-group-text { background: var(--inc-n1); border-color: var(--inc-n3); color: var(--inc-n6); border-radius: var(--inc-radius-champ); }

/* ---------- Badges / progression ---------- */
.progress { background: var(--inc-n2); }
.progress-bar { background-color: var(--inc-primary); }
.progress-bar.bg-warning { background-color: var(--inc-accent) !important; }
.badge.bg-primary { background-color: var(--inc-primary) !important; }
.badge.bg-success { background-color: var(--inc-success) !important; }

/* ---------- Ecrans publics (connexion) ---------- */
.inc-auth {
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, #3A2B1D 0%, #2E2015 55%, #241910 100%);
}
.inc-auth .card { border: none; border-radius: var(--inc-radius-carte); box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .5); }
.inc-auth .inc-logo-app svg, .inc-auth .inc-logo-app img { height: 44px; margin-inline: auto; }

/* Utilitaires */
.text-primary { color: var(--inc-primary) !important; }
.bg-primary { background-color: var(--inc-primary) !important; }
.border-primary { border-color: var(--inc-primary) !important; }
.text-ink-2 { color: var(--inc-ink-2) !important; }
.bg-cream { background-color: var(--inc-cream) !important; }
.bg-soft  { background-color: var(--inc-bg-soft) !important; }
a { text-decoration: none; }