/* ============================================================================
   diffusionis-theme.css — thème de marque Diffusionis (défaut)
   ----------------------------------------------------------------------------
   Ambiance charte graphique : « contraste fort entre l'obscurité de la salle de
   spectacle et la lumière dorée de la scène ». Overrides ciblés SB Admin 2 /
   Bootstrap 3.3.7, tous scopés sous body.theme-diffusionis (classe posée par
   core/App.Theme.pas, sans reload). Mêmes groupes de sélecteurs que
   theme-dark.css pour rester itérables écran par écran.

   Palette (charte) :
     Bleu Nuit  #0B1325  fonds principaux
     Anthracite #1C2541  cartes, surfaces surélevées
     Or Lumineux#D4AF37  accents, boutons importants, éléments actifs
     Or Ambré   #AA7C11  survols, états actifs secondaires
     Blanc Cassé#F4F5F7  textes principaux
   ============================================================================ */

body.theme-diffusionis {
  /* variables locales pour ajuster la palette en un seul endroit */
  --df-bg:        #0B1325;   /* fond page (bleu nuit) */
  --df-surface:   #111B36;   /* panneaux / navbar */
  --df-surface-2: #1C2541;   /* surfaces surélevées (heading, hover) — anthracite */
  --df-sidebar:   #1C2541;   /* sidebar : anthracite (fond de menu retenu en v1) */
  --df-border:    #2B3757;   /* bordures neutres */
  --df-gold:      #D4AF37;   /* or lumineux : accents, actifs */
  --df-gold-hov:  #E9C34D;   /* or éclairci : survol de liens */
  --df-gold-dim:  #AA7C11;   /* or ambré : états secondaires */
  --df-gold-veil: rgba(212, 175, 55, 0.14);  /* voile doré (survols discrets) */
  --df-text:      #F4F5F7;   /* texte principal (blanc cassé) */
  --df-text-dim:  #9FA8BC;   /* texte secondaire */

  background-color: var(--df-bg);
  color: var(--df-text);
}

/* ---- conteneurs principaux ---------------------------------------------- */
body.theme-diffusionis #wrapper,
body.theme-diffusionis #page-wrapper {
  background-color: var(--df-bg);
  color: var(--df-text);
}

/* ---- navbar / barre du haut --------------------------------------------- */
body.theme-diffusionis .navbar-default,
body.theme-diffusionis .navbar-static-top {
  background-color: var(--df-surface);
  border-color: var(--df-border);
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);   /* filet doré signature */
}
body.theme-diffusionis .navbar-default .navbar-brand,
body.theme-diffusionis .navbar-top-links > li > a {
  color: var(--df-text);
}
body.theme-diffusionis .navbar-top-links > li > a:hover,
body.theme-diffusionis .navbar-top-links > li > a:focus {
  background-color: var(--df-gold-veil);
  color: var(--df-gold-hov);
}

/* ---- sidebar / menu latéral ----------------------------------------------
   Comme la maquette : items en BLANC, seul l'item SÉLECTIONNÉ est doré
   (classe .df-active posée par View.Main au clic), le survol est un doré
   discret sans déplacement. ------------------------------------------------ */
body.theme-diffusionis .sidebar,
body.theme-diffusionis .navbar-default.sidebar {
  background-color: var(--df-sidebar);
  border-color: var(--df-border);
  border-right: 1px solid rgba(212, 175, 55, 0.18);
}
/* NOTE : TMS pose des styles INLINE (dont la couleur) sur les <a>/<span> liés
   -> il faut du !important jusque dans les spans, et on ne peut PAS utiliser
   a[style] pour reconnaître les en-têtes de section (tous les items liés ont
   un style inline au runtime). Les en-têtes gardent leur inline d'origine
   (border DodgerBlue) : on les cible par a[style*="DodgerBlue"]. */
body.theme-diffusionis .sidebar ul li a,
body.theme-diffusionis .sidebar .nav-second-level li a {
  border-color: var(--df-border);
  background-color: var(--df-sidebar);
}
body.theme-diffusionis .sidebar ul li a,
body.theme-diffusionis .sidebar ul li a span {
  color: var(--df-text) !important;   /* items en blanc cassé */
}
body.theme-diffusionis .sidebar ul li a span {
  background-color: transparent !important;   /* le fond est porté par le <a>, jamais le <span> */
}
body.theme-diffusionis .sidebar ul li a:hover,
body.theme-diffusionis .sidebar ul li a:focus {
  background-color: var(--df-gold-veil);
}
body.theme-diffusionis .sidebar ul li a:hover,
body.theme-diffusionis .sidebar ul li a:hover span,
body.theme-diffusionis .sidebar ul li a:focus,
body.theme-diffusionis .sidebar ul li a:focus span {
  color: var(--df-gold-hov) !important;
}
/* item sélectionné : texte doré en gras, sans surlignage de fond */
body.theme-diffusionis .sidebar ul li a.df-active,
body.theme-diffusionis .sidebar ul li a.df-active span,
body.theme-diffusionis .sidebar ul li.active > a {
  color: var(--df-gold) !important;
  font-weight: 600;
}
/* en-têtes de section (classe .df-menu-section posée par View.Main.AddMenuSection ;
   auparavant repérés par leur style inline « DodgerBlue ») :
   petites capitales dorées, filet ambré, sans boîte */
body.theme-diffusionis .sidebar a.df-menu-section,
body.theme-diffusionis .sidebar a.df-menu-section span {
  background-color: transparent !important;
  color: var(--df-gold) !important;
  border: none !important;
  border-left: 3px solid var(--df-gold-dim) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 12px;
  font-weight: 700;
}
body.theme-diffusionis .sidebar a.df-menu-section span {
  border: none !important;   /* le filet ambré est porté par le <a>, pas le <span> */
}

/* ---- menu latéral généré : valable pour TOUS les thèmes -------------------
   Le menu est construit en DOM (View.Main.BuildSideMenu) ; ces deux classes
   remplacent les styles inline d'autrefois. Le bloc .theme-diffusionis
   ci-dessus ne fait que les redécorer en doré. -------------------------------- */
.sidebar a.df-menu-section {
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 12px;
  font-weight: 700;
}
/* item dont le module n'est pas encore écrit : présent, mais visiblement inerte */
.sidebar a.df-menu-soon {
  opacity: 0.55;
  font-style: italic;
}

/* ---- panneaux ------------------------------------------------------------ */
body.theme-diffusionis .panel {
  background-color: var(--df-surface);
  border-color: var(--df-border);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);   /* cartes légèrement détachées, comme la maquette */
}
body.theme-diffusionis .panel-default > .panel-heading {
  background-color: var(--df-surface-2);
  color: var(--df-gold);
  border-color: var(--df-border);
}
body.theme-diffusionis .panel-body {
  color: var(--df-text);
}
body.theme-diffusionis .well,
body.theme-diffusionis .jumbotron {
  background-color: var(--df-surface-2);
  border-color: var(--df-border);
}

/* ---- menus déroulants ---------------------------------------------------- */
body.theme-diffusionis .dropdown-menu {
  background-color: var(--df-surface-2);
  border-color: var(--df-border);
}
body.theme-diffusionis .dropdown-menu > li > a {
  color: var(--df-text);
}
body.theme-diffusionis .dropdown-menu > li > a:hover,
body.theme-diffusionis .dropdown-menu > li > a:focus,
body.theme-diffusionis .dropdown-menu > .active > a {
  background-color: var(--df-gold);
  color: #0B1325;
}
body.theme-diffusionis .dropdown-menu .divider {
  background-color: var(--df-border);
}

/* ---- titres, textes, liens ---------------------------------------------- */
body.theme-diffusionis h1, body.theme-diffusionis h2, body.theme-diffusionis h3,
body.theme-diffusionis h4, body.theme-diffusionis h5, body.theme-diffusionis h6 {
  color: var(--df-text);
}
body.theme-diffusionis .text-muted,
body.theme-diffusionis small {
  color: var(--df-text-dim);
}
body.theme-diffusionis a {
  color: var(--df-gold);
}
body.theme-diffusionis a:hover,
body.theme-diffusionis a:focus {
  color: var(--df-gold-hov);
}
body.theme-diffusionis hr {
  border-color: var(--df-border);
}

/* ---- formulaires --------------------------------------------------------- */
body.theme-diffusionis .form-control {
  background-color: #0E1730;
  border-color: var(--df-border);
  color: var(--df-text);
}
body.theme-diffusionis .form-control:focus {
  border-color: var(--df-gold);
  box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.25);
}
body.theme-diffusionis .form-control::placeholder {
  color: var(--df-text-dim);
}
body.theme-diffusionis .input-group-addon {
  background-color: var(--df-surface-2);
  border-color: var(--df-border);
  color: var(--df-text);
}
body.theme-diffusionis label {
  color: var(--df-text);
}

/* ---- tableaux + DataTables ---------------------------------------------- */
body.theme-diffusionis .table {
  color: var(--df-text);
}
body.theme-diffusionis .table > thead > tr > th {
  border-color: var(--df-gold-dim);
  color: var(--df-gold);
}
body.theme-diffusionis .table > tbody > tr > td,
body.theme-diffusionis .table > tbody > tr > th,
body.theme-diffusionis .table > tfoot > tr > td {
  border-color: var(--df-border);
}
body.theme-diffusionis .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(212, 175, 55, 0.04);
}
body.theme-diffusionis .table-hover > tbody > tr:hover {
  background-color: var(--df-gold-veil);
}
body.theme-diffusionis .dataTables_wrapper,
body.theme-diffusionis .dataTables_wrapper .dataTables_info,
body.theme-diffusionis .dataTables_wrapper .dataTables_length,
body.theme-diffusionis .dataTables_wrapper .dataTables_filter {
  color: var(--df-text);
}
body.theme-diffusionis .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: var(--df-text) !important;
}
body.theme-diffusionis .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--df-gold);
  border-color: var(--df-gold-dim);
  color: #0B1325 !important;
}

/* ---- boutons -------------------------------------------------------------
   Le bouton primaire devient OR (charte : « boutons importants ») avec texte
   bleu nuit ; le bouton par défaut devient une surface anthracite. ----------- */
body.theme-diffusionis .btn-primary {
  background-color: var(--df-gold);
  border-color: var(--df-gold-dim);
  color: #0B1325;
  font-weight: 600;
}
body.theme-diffusionis .btn-primary:hover,
body.theme-diffusionis .btn-primary:focus,
body.theme-diffusionis .btn-primary:active {
  background-color: var(--df-gold-hov);
  border-color: var(--df-gold);
  color: #0B1325;
}
body.theme-diffusionis .btn-default {
  background-color: var(--df-surface-2);
  border-color: var(--df-border);
  color: var(--df-text);
}
body.theme-diffusionis .btn-default:hover,
body.theme-diffusionis .btn-default:focus {
  background-color: #253055;
  border-color: var(--df-gold-dim);
  color: var(--df-gold-hov);
}

/* ---- listes / alerts ----------------------------------------------------- */
body.theme-diffusionis .list-group-item {
  background-color: var(--df-surface);
  border-color: var(--df-border);
  color: var(--df-text);
}

/* ---- page de connexion --------------------------------------------------- */
body.theme-diffusionis .login-panel {
  border-color: rgba(212, 175, 55, 0.30);
  box-shadow: 0 6px 30px rgba(0, 0, 0, 0.45);
}

/* ============================================================================
   CORRECTIF GLOBAL (tous thèmes, volontairement NON scopé) : deux filets
   verticaux se superposaient entre menu et contenu — le border-right de la
   sidebar (hauteur du MENU) et le border-left de #page-wrapper (hauteur du
   CONTENU). Le plus long des deux dépassait, d'où le fragment de « barre »
   sous le coin du menu. On ne garde que celui de la sidebar : la séparation
   s'arrête exactement au dernier item du menu.
   ============================================================================ */
#page-wrapper {
  border-left: none !important;
}

/* SB Admin 2 code en dur `.sidebar { margin-top: 51px }`, calé sur sa navbar
   standard de 50px. Notre barre de titre est plus haute (logo) : on ancre
   plutôt la sidebar au BAS RÉEL de la navbar (top: 100% de son parent <nav>),
   quelle que soit la taille du logo. */
@media (min-width: 768px) {
  .navbar.navbar-static-top {
    position: relative;
  }
  .navbar-default.sidebar {
    position: absolute;
    top: 100%;
    margin-top: 0;
  }
}

/* ---- barres de défilement assorties (WebKit/Chromium) --------------------- */
body.theme-diffusionis ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
body.theme-diffusionis ::-webkit-scrollbar-track {
  background: var(--df-bg);
}
body.theme-diffusionis ::-webkit-scrollbar-thumb {
  background: var(--df-border);
  border-radius: 5px;
}
body.theme-diffusionis ::-webkit-scrollbar-thumb:hover {
  background: var(--df-gold-dim);
}


/* ============================================================================
   BANDEAU VIDE AU-DESSUS DU TITRE DE PAGE (correctif global, tous themes)
   ----------------------------------------------------------------------------
   D'ou venait-il : de deux marges heritees du gabarit, qui s'additionnaient
   entre le bas de la barre de titre et le haut du <h1> :
     15 px  padding haut de « <div class="row panel-body"> » dans View.Main.html
            (Bootstrap : .panel-body { padding: 15px })
     40 px  marge haute du titre (Bootstrap : .page-header { margin: 40px 0 20px })
     ------
     55 px  de vide, sur TOUTES les pages (View.Crud.Container + View.Home).
   On ramene l'ensemble a 28 px, soit la moitie. On ne touche QUE le vertical :
   le padding lateral de 15 px annule les marges negatives de la .row, le retirer
   decalerait tout le contenu vers la gauche.
   Meme traitement SOUS le titre : le filet est ramene pres du texte (9 -> 5)
   et l'ecart avant le contenu passe de 20 a 10 px, soit 29 px -> 15 px.
   ============================================================================ */
#page-wrapper > .row.panel-body {
  padding-top: 8px;
  padding-bottom: 8px;
}
.page-header {
  margin-top: 20px;
  margin-bottom: 10px;
  padding-bottom: 5px;
}

/* ============================================================================
   NUMERO D'ENREGISTREMENT (.df-record-id) — correctif global, tous themes
   ----------------------------------------------------------------------------
   Le # d'un evenement est une cle technique : elle se lit, elle ne se saisit
   jamais. Elle est donc rendue par un <span> pilote par un TWebDBLabel, et non
   par un <input disabled> qui gardait l'apparence d'un champ. On la distingue
   des valeurs saisies par la couleur d'accent du theme courant.
   Theme clair (aucune classe sur <body>) : gris ardoise, il n'y a pas de
   variable de palette a reprendre.
   ============================================================================ */
.df-record-id {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.5px;
  color: #4a6079;
}
body.theme-diffusionis .df-record-id { color: var(--df-gold); }
body.theme-dark        .df-record-id { color: var(--dk-link); }

/* Variante pour les barres d'outils qui alignent des controles .input-sm (30 px
   de haut) : form-control-static est cale sur un .form-control normal (34 px),
   la valeur depasserait la ligne. Utilisee par View.Timesheets.Edit. */
.df-record-id.df-record-id-sm {
  min-height: 30px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}

/* ============================================================================
   ENTETE D'IDENTITE D'UNE FICHE (.df-fiche-identite) — global, tous themes
   ----------------------------------------------------------------------------
   Le bloc qui nomme l'enregistrement en cours, place AU-DESSUS de la barre
   d'onglets pour rester visible quel que soit l'onglet actif. La bordure basse
   le raccroche aux onglets ; on serre les marges pour ne pas repousser le
   contenu vers le bas.
   ============================================================================ */
.df-fiche-identite {
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(128, 128, 128, 0.25);
}
.df-fiche-identite .form-group {
  margin-bottom: 6px;
}
body.theme-diffusionis .df-fiche-identite { border-bottom-color: rgba(212, 175, 55, 0.30); }
body.theme-dark        .df-fiche-identite { border-bottom-color: var(--dk-border); }

/* ============================================================================
   FEUILLE D AFFECTATION — BANDEAU DE JOURNEE (.asg-jour) — tous themes
   ----------------------------------------------------------------------------
   Un evenement peut s etaler sur deux semaines : la grille des postes est alors
   decoupee en journees, chacune precedee d une ligne pleine largeur. Le bandeau
   doit se distinguer des postes SANS voler l attention — c est un separateur,
   pas un titre de page.
   Il est pose sur le <td> et non sur le <tr> : .table-striped colorie deja le
   <tr>, et le <td> gagne.
   Theme clair : gris ardoise, la palette n a pas de variable a reprendre.
   ============================================================================ */
.asg-jour td {
  background-color: #eceff1;
  border-top: 2px solid #b0bec5 !important;
  color: #37474f;
  font-weight: 700;
  padding: 6px 8px !important;
}
.asg-jour .asg-jour-info {
  font-weight: 400;
  opacity: 0.75;
  margin-left: 10px;
}
.asg-jour .asg-jour-chiffres {
  float: right;
  font-weight: 400;
  opacity: 0.85;
}
body.theme-diffusionis .asg-jour td {
  background-color: var(--df-gold-veil);
  border-top-color: var(--df-gold-dim) !important;
  color: var(--df-gold);
}
body.theme-dark .asg-jour td {
  background-color: rgba(255, 255, 255, 0.06);
  border-top-color: var(--dk-border) !important;
  color: var(--dk-link);
}

/* Un jour HORS de la fenetre d occupation de l evenement. Le selecteur de date
   les GRISAIT (min/max) : un evenement d une soiree rendait alors le montage de
   la veille impossible a saisir. On signale au lieu d interdire — la fenetre
   dit quand la salle est reservee, le travail deborde des deux cotes.
   Ambre : lisible sur le theme clair comme sur les deux sombres. */
.asg-fld.asg-hors {
  border-color: #e0a800;
  box-shadow: inset 0 0 0 1px rgba(224, 168, 0, 0.35);
}