/* ======================================================================================================
   Charte Sybil = charte du site Conciergerie Alliance (2026-10-26)
   « Adapte Sybil, toutes les plateformes (prestataires, staff, propriétaires), aux couleurs du site web. Il faut que ce soit
   responsive et lisible sur téléphone. »
   Couleurs et police repris du site (logo + plaquette) : marine #003078, orange #F04830 / #F07830, crème #FFF6F1, bleu nuit #0A1B3F,
   police Poppins. La palette Tailwind est remappée dans sybil-theme.js (le « bleu » devient le marine, le « violet » l'orange).
   ====================================================================================================== */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/static/fonts/poppins-400.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('/static/fonts/poppins-500.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/static/fonts/poppins-600.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('/static/fonts/poppins-700.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; font-display: swap; src: url('/static/fonts/poppins-800.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --sybil-navy: #003078; --sybil-navy-600: #0B3E8F; --sybil-deep: #0A1B3F;
  --sybil-orange: #F04830; --sybil-amber: #F07830; --sybil-cream: #FFF6F1;
  --sybil-cta: linear-gradient(135deg, #F03030, #F07830);
}

html { -webkit-text-size-adjust: 100%; }
body { font-family: 'Poppins', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans Arabic', 'Noto Naskh Arabic', sans-serif; }
button, input, select, textarea { font-family: inherit; }
::selection { background: rgba(240, 120, 48, .25); }
:focus-visible { outline: 2px solid var(--sybil-amber); outline-offset: 2px; }
input:focus, select:focus, textarea:focus { border-color: var(--sybil-navy-600); --tw-ring-color: rgba(11, 62, 143, .35); }

/* menu latéral de l'administration : bleu nuit de la marque, repère actif en orange */
#sidebar { background-color: var(--sybil-deep); }
#sidebar .nav-item.active { background-color: rgba(240, 120, 48, .16); box-shadow: inset 3px 0 0 var(--sybil-amber); color: #fff; font-weight: 600; }
/* le logo est un tracé marine sur fond transparent : illisible sur le bleu nuit -> affiché en blanc dans le menu */
#sidebar img[src*="sybil-logo"] { filter: brightness(0) invert(1); }
#sidebar .nav-group-header[aria-expanded="true"] { background-color: rgba(255, 255, 255, .06); color: #fff; }
.scrollbar-thin::-webkit-scrollbar-track { background: var(--sybil-deep); }
.scrollbar-thin::-webkit-scrollbar-thumb { background: #26407a; }
.scrollbar-thin::-webkit-scrollbar-thumb:hover { background: #3a5aa5; }

/* appels à l'action : le dégradé orange du site (connexion, bouton flottant de ticket) */
#login-btn { background-image: var(--sybil-cta) !important; box-shadow: 0 12px 28px -12px rgba(240, 72, 48, .6); }
#login-btn:hover { filter: brightness(1.06); }
button.fixed.bottom-6.right-6.rounded-full { background-image: var(--sybil-cta); box-shadow: 0 12px 28px -10px rgba(240, 72, 48, .6); }
button.fixed.bottom-6.right-6.rounded-full:hover { filter: brightness(1.06); }

/* ---------- téléphone ---------- */
@media (max-width: 767px) {
  /* le pied de page fixe mangeait ~12 % de l'écran et le bouton de ticket le chevauchait : il suit désormais le contenu */
  .sybil-footer { position: static !important; padding-bottom: 4.75rem; }
  /* 16 px minimum dans les champs : sinon le téléphone zoome tout seul au toucher */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]), select, textarea { font-size: 16px; }
  /* un tableau trop large défile sur lui-même au lieu de déborder de la page */
  table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* petits textes un peu plus lisibles */
  .text-xs { font-size: .8125rem; line-height: 1.2rem; }
  .text-\[10px\] { font-size: .6875rem; line-height: 1rem; }
}
/* cibles tactiles confortables (doigt) */
@media (pointer: coarse) {
  button, select { min-height: 40px; }
  td button, th button { min-width: 36px; min-height: 36px; }
}
