/* ============================================================
   IAMSHIBA – Apple MacBook Air skin (overrides only)
   FICHIER 1/2 : THEME GLOBAL (SANS NAVBAR GAUCHE)
   À charger APRÈS theme.css et AVANT iamshiba-navbar-left.css
   ============================================================ */

/* --------- 1. Tokens globaux (couleurs / ambiance) --------- */
/* 
   Ces variables CSS sont utilisées partout :
   - fonds
   - panels
   - texte
   - bordures & hover
*/
:root {
  --bg: #f5f5f7;              /* Fond gris très clair "Apple" */
  --panel: #ffffff;           /* Cartes blanches */
  --brand: #1d1d1f;           /* Texte principal */
  --title: #1d1d1f;           /* Titres */
  --line: rgba(0,0,0,.06);    /* Traits de séparation très légers */
  --head: #f5f5f7;            /* En-têtes de tableaux */
  --zebra: #f5f5f7;           /* Lignes zébrées */
  --hover: #f2f2f7;           /* Hover sur lignes de tableau */
  --accent: #0071e3;          /* Bleu "Apple" pour les accents */
}

/* --------- 2. Fond global & typographie (sans layout navbar) --------- */

/* 
   On applique le fond gris clair sur tout le container de la SPA :
   html, body, layout, content…
*/
html,
body,
.container.content,
.layout-content,
.content,
.view-container {
  background-color: var(--bg) !important;
}

/* 
   BODY :
   - police "SF Pro / système" + fallback Inter
   - couleur principale du texte
   - lissage pour un rendu doux
   (La gestion du padding-left pour la NAVBAR est dans iamshiba-navbar-left.css)
*/
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text",
               system-ui, -webkit-system-font, "Inter", sans-serif !important;
  color: var(--brand) !important;
  -webkit-font-smoothing: antialiased !important;
}

/* --------- 3. Cartes / panneaux --------- */
/* 
   Applique le style "carte" sur :
   - panels généraux
   - dashlets
   - record-panel, main-panel, modals
*/
.panel,
.panel.panel-default,
.dashlet .panel,
.record-panel,
.main-panel,
.modal-content {
  background: var(--panel) !important;
  border-radius: 22px !important;                    /* bords bien arrondis */
  border: 1px solid var(--line) !important;          /* fine bordure */
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06) !important; /* ombre douce */
  margin-bottom: 18px !important;
}

/* 
   Corps de panel / dashlet :
   - fond transparent, on laisse la carte gérer le fond
*/
.panel > .panel-body,
.panel .panel-body,
.dashlet-body,
.dashlet .panel-body {
  background: transparent !important;
}

/* --------- 3.b Titres de panneaux, sections, headers --------- */
/*
   Harmonise les titres (H1-H4, sections, headers de panel & dashlet) :
   - même police, même taille
   - fond transparent
   - pas de bordure / ombre
*/
h1, h2, h3, h4,
.section-header,
.section-title,
.panel > .panel-heading,
.panel-heading,
.dashlet .panel-heading,
.panel-default > .panel-heading,
.dashlet .dashlet-header,
.dashlet-header {
  color: var(--title) !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 0 4px !important;
  padding: 4px 10px 0 !important;
}

/* ============================================================
   7. HEADER HORIZONTAL – transparent & "Apple-like"
   (barre du haut, globale – pas la navbar gauche en dock)
   ============================================================ */

/* 
   Header fixe en haut (#header + .navbar.navbar-fixed-top) :
   - fond transparent (on voit le bg gris)
   - pas de bordure ni ombre
*/
body #header,
body .navbar.navbar-fixed-top {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--brand) !important;
}

/* 
   Liens du header (menus, brand, dropdown toggle) :
   - fond transparent
   - aspect "pill" léger avec padding horizontal
*/
.navbar .nav > li > a,
.navbar .navbar-brand,
.navbar .dropdown-toggle {
  background: transparent !important;
  color: var(--brand) !important;
  border-radius: 999px !important;      /* pilule */
  padding-inline: 10px !important;
}

/* 
   Hover / dropdown ouvert :
   - léger gris en fond
*/
.navbar .nav > li > a:hover,
.navbar .dropdown.open > a {
  background: rgba(0,0,0,0.04) !important;
  color: var(--brand) !important;
}

/* 
   Champ de recherche global :
   - fond blanc translucide
   - bord arrondi "pill"
   - fine bordure claire
*/
.navbar.navbar-inverse input.form-control.global-search-input {
  background: rgba(255,255,255,0.9) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  color: var(--brand) !important;
  padding-inline: 14px !important;
  box-shadow: none !important;
}

/* Placeholder du champ de recherche : gris doux */
.navbar.navbar-inverse
input.form-control.global-search-input::placeholder {
  color: #6e6e73 !important;
}

/* ============================================================
   8. TABLES – listes zébrées "Apple-like"
   ============================================================ */

/* En-têtes de colonnes (listes & panels) */
.list-container th,
.main-panel th,
.panel .list-container th,
.record-panel .list-container th {
  background: var(--head) !important;             /* fond gris clair */
  color: var(--brand) !important;                 /* texte foncé */
  border-bottom: 1px solid var(--line) !important;
}

/* Lignes paires : fond blanc */
.list-container tr:nth-child(even),
.main-panel tr:nth-child(even),
.panel .list-container tr:nth-child(even),
.record-panel .list-container tr:nth-child(even) {
  background: #ffffff !important;
}

/* Lignes impaires : fond zébré gris très clair */
.list-container tr:nth-child(odd),
.main-panel tr:nth-child(odd),
.panel .list-container tr:nth-child(odd),
.record-panel .list-container tr:nth-child(odd) {
  background: var(--zebra) !important;
}

/* Hover : fond hover plus marqué */
.list-container tr:hover,
.main-panel tr:hover,
.panel .list-container tr:hover,
.record-panel .list-container tr:hover {
  background: var(--hover) !important;
}

/* Bouton chevron de repli des panneaux de la fiche */
.panel-heading [data-action="toggleCollapse"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;

  border-radius: 999px;
  padding: 2px 6px !important;
}

/* Icône chevron dans ces boutons */
.panel-heading [data-action="toggleCollapse"] .fa {
  color: #6e6e73 !important;
}

/* Hover "pilule" doux */
.panel-heading [data-action="toggleCollapse"]:hover {
  background: rgba(0,0,0,0.04) !important;
}