/* === BASE === */
html, body {
  height: 100vh !important;
  margin: 0;
  padding: 0;
  font-size: 0.95rem;
  font-family: 'Segoe UI', sans-serif;
  color: var(--color-text);
  background: var(--color-bg);
}

/* === HEADER FIXE MODERNE === */
.navbar-fixed-top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 56px;
  z-index: 1040;
  background-color: var(--color-header-bg);
  color: var(--color-header-text);
  display: flex;
  align-items: center;
  padding: 0 1rem;
  box-shadow: var(--color-box-shadow);
}

.navbar-fixed-top .nav-link {
  color: var(--color-header-text);
}

.navbar-fixed-top .nav-link:hover {
  color: var(--color-header-link-hover);
}

/* Icône bouton ☰ */
.navbar-fixed-top .btn {
  margin-right: 1rem;
}

/* === WRAPPER PRINCIPAL === */
.page-layout {
  min-height: 0 !important;
  position: absolute;
  top: 56px;
  bottom: 40px;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: row;
  background: var(--color-bg);
}

/* === FOOTER FIXE === */
.footer-fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  background-color: var(--color-footer-bg);
  color: var(--color-footer-text);
  font-size: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1030;
  box-shadow: var(--color-box-shadow-footer);
}

/* === CONTENT Contenu du site === */
.content-scrollable {
  flex: 1 1 auto;
  min-height: 0 !important;
  overflow-y: auto;
  padding: 2rem 1.5rem;
  /*padding-bottom: 60px;*/
  background: transparent;
  box-sizing: border-box;
  color: var(--color-text);  /* Hérite du body */
}

.content-scrollable::-webkit-scrollbar {
  display: none;
}

.flex-fill {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.container-fluid {
  background: transparent;
}

/* ----------------- conges.php CSS PROPRE ----------------- */
.planning-table { table-layout: fixed; }
.month-title { background:#0d2a45; color:#fff; }

/* cellule de jour */
.daycell { position: relative; }

/* demi-journées (cachées par défaut; visibles uniquement en mode mixte) */
.daycell .slot { display: none; }
.daycell.mixed .slot {
  display: block;
  height: 31px;
  margin: 2px 0;
}
.daycell.mixed .slot.CP  { background:#4caf50; color:#fff; }
.daycell.mixed .slot.RTT { background:#ff9800; color:#fff; }
.daycell.mixed .slot.ABS { background:#e53935; color:#fff; }

/* libellé/overlay pour JOURNÉE COMPLÈTE (AM = PM) */
.daycell .cell-label{
  position: absolute;
  inset: 0;                     /* couvre 100% de la cellule */
  display: none;                /* activé ci-dessous */
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: .8rem;
  color: #fff;
  pointer-events: none;         /* ne bloque pas le clic */
  z-index: 3;                   /* AU-DESSUS du fond vacances/fériés et des slots */
}

/* activer l’overlay + couleur selon le type */
.daycell.CP  .cell-label { display:flex; background:#4caf50; }
.daycell.RTT .cell-label { display:flex; background:#ff9800; }
.daycell.ABS .cell-label { display:flex; background:#e53935; }

/* quand journée complète, cacher visuellement les demi-slots */
.daycell.CP  .slot,
.daycell.RTT .slot,
.daycell.ABS .slot { visibility: hidden; }

/* clic */
.daycell[data-editable="1"] { cursor: pointer; }
.daycell[data-editable="0"] { cursor: not-allowed; opacity:.6; }

/* ne pas bloquer par fériés/vacances (style léger uniquement si besoin) */
.ferie .slot, .vacances .slot { border: none !important; }

/**** Facultatif ********/
.month-title { 
background:#0d2a45; 
color:#fff; 
position: relative; 
}
.month-title .btn { 
border-color: rgba(255,255,255,.6); 
}
.month-title .btn:hover { 
border-color:#fff;
background:#6D788D; 
}

/*****************/
/* Donne de l'espace et décale la poignée vers l'intérieur */
.tox .tox-statusbar{
  min-height: 22px;
  padding: 2px 6px 4px 8px; /* bottom + right pour le grip */
  box-sizing: border-box;
}

.tox .tox-statusbar__resize-handle{
  margin-left: auto;        /* pousse à droite */
  margin-right: 4px;        /* évite qu'il touche la bordure */
  margin-bottom: 2px;       /* évite le rognage bas */
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  opacity: 1 !important;
}

.tox .tox-statusbar__resize-handle svg{
  width: 14px; height: 14px;
}

/* Si un parent rogne encore le bas, on désactive le clipping */
.kanban-card .card-body,
.modal .modal-body,
.tox .tox-editor-container{
  overflow: visible;
}

/* (Optionnel) petite bordure pour mieux lire la séparation en dark */
.tox .tox-statusbar{
  border-top: 1px solid rgba(255,255,255,.08);
}

.tox .tox-statusbar__path { display: none; }

/* Zone d'affichage des mémos */
.content-display img {
  max-width: 100%;
  height: auto;
}

/* Cas 1 : Tiny centre via le parent <p style="text-align:center"> */
.content-display p[style*="text-align:center"] img {
  display: inline-block;
}

/* Cas 2 : Tiny centre l'image avec des margins auto */
.content-display img[style*="margin-left:auto"][style*="margin-right:auto"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Cas 3 : Tiny met des classes d'alignement */
.content-display img.align-center,
.content-display img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.content-display .align-center img,
.content-display .aligncenter img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Cas 4 : <figure class="image ..."> de TinyMCE */
.content-display figure.image {
  display: table;
  margin: 1rem auto; /* centre le bloc figure */
}
.content-display figure.image img {
  display: block;
}