/* Habillage « v2 » (Sietram) : plus doux à l'œil. Posé par retour.py sur toutes les pages
   quand accueil_v2 est actif. Ne change pas la structure, seulement l'allure. */
:root{--v2-r:16px}
body{background:linear-gradient(180deg,#eef3f7 0,#f4f6f9 260px,#f4f6f9 100%) fixed !important;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif !important;
  -webkit-font-smoothing:antialiased;color:#182230}
/* En-tête : léger dégradé, titre plus aéré */
header{background-image:linear-gradient(135deg,rgba(255,255,255,.10),rgba(0,0,0,.12)) !important;
  box-shadow:0 4px 18px rgba(15,61,94,.22) !important}
header b{letter-spacing:.2px}
header .retour,header a[aria-label="Accueil"]{background:rgba(255,255,255,.18) !important;border-radius:12px !important;transition:background .15s}
header .retour:hover,header a[aria-label="Accueil"]:hover{background:rgba(255,255,255,.3) !important}
/* Cartes et tuiles : coins plus ronds, ombre douce, léger relief au survol */
.card,.carte,.tuile,.p,.compteurs a,.compteurs div,.kpi a,.principal a,.second a,.tournee,.etat a,.arret,.alerte,
.grid>a,.creer a,.tuiles a,.onglets a{border-radius:var(--v2-r) !important;
  transition:transform .16s ease,box-shadow .16s ease}
/* L'ombre douce, sauf sur ce qui est en alerte : là, c'est le clignotement rouge (effets.py) qui commande l'ombre. */
.card:not(.alerte),.carte,.tuile:not(.alerte),.p,.compteurs a:not(.rouge),.compteurs div,.kpi a:not(.rouge),.principal a,.second a,.tournee,
.etat a:not(.alerte),.arret:not(.alerte),.grid>a:not(.alerte),.creer a,.tuiles a:not(.alerte),.onglets a:not(.alerte){
  box-shadow:0 1px 2px rgba(15,61,94,.06),0 6px 18px rgba(15,61,94,.07) !important}
.kpi a.rouge,.etat a.alerte{animation:fxPulse 2s ease-out infinite}
.onglets a,.etat a{border-radius:999px !important}
@media(hover:hover){a.card:hover,a.tuile:hover,a.p:hover,.principal a:hover,.second a:hover,.kpi a:hover,.compteurs a:hover{
  transform:translateY(-2px);box-shadow:0 2px 4px rgba(15,61,94,.06),0 12px 28px rgba(15,61,94,.12) !important}}
/* Titres de groupe plus discrets et élégants */
h3.titre-groupe,.titre-groupe,.titre,main h3{letter-spacing:.08em !important;color:#5b7083 !important;font-weight:800 !important}
/* Formulaires : champs plus doux, focus visible */
input[type=text],input[type=search],input[type=tel],input[type=email],input[type=number],input[type=date],input[type=password],select:not(.choix):not(.lh-deroulant),textarea{
  border-radius:12px !important;border:1.5px solid #d7dfe6 !important;background:#fff !important;transition:border-color .15s,box-shadow .15s}
/* Les menus « Terrain… / Bureau… / Autre chose » gardent leur flèche et leur couleur. */
select.choix,select.lh-deroulant{background-color:#fff !important;cursor:pointer}
input:focus,select:focus,textarea:focus{outline:none !important;border-color:#0F3D5E !important;box-shadow:0 0 0 4px rgba(15,61,94,.12) !important}
label{color:#2b3a48}
/* Boutons */
.btn,button.btn,button[type=submit].btn,.logout,.plus{border-radius:12px !important;transition:transform .12s,filter .12s}
.btn:active,button:active{transform:scale(.98)}
.btn.vert{background:linear-gradient(135deg,#16a34a,#15803d) !important;color:#fff !important;box-shadow:0 6px 16px rgba(21,128,61,.25) !important}
/* Pastilles et badges */
.pastille,.pill,.badge,.sect,.urgence{border-radius:999px !important}
/* Listes : lignes plus respirantes */
.p{padding:14px 15px !important;margin-bottom:10px !important}
main{padding-left:16px !important;padding-right:16px !important}
/* Menus déroulants « Autre chose » / « Filtrer » */
select.lh-deroulant,.autre select,.choix{border-radius:14px !important}
/* Messages flash */
.notice,.msg{border-radius:14px !important;box-shadow:0 4px 14px rgba(15,61,94,.08)}

/* ---- Plus visible : fond, espaces, chiffres, titres ---- */
body{background:linear-gradient(180deg,#dfe9f1 0,#eef3f7 220px,#f4f6f9 100%) fixed !important}
main{padding-top:18px !important}
h2{font-size:22px !important;letter-spacing:-.2px}
h2 small{font-size:14px !important}
/* Titres de rubrique : petite barre de couleur, texte plus grand */
main h3,.titre-groupe,.titre{font-size:14px !important;color:#0F3D5E !important;text-transform:none !important;letter-spacing:0 !important;
  margin:26px 0 12px !important;padding-left:12px;border-left:4px solid #0F3D5E;line-height:1.1}
main h3::after,.titre-groupe::after{display:none !important}
/* Compteurs : chiffres plus gros, fond blanc dégradé */
.kpi a,.compteurs a,.compteurs div{background:linear-gradient(180deg,#fff,#f6f9fc) !important}
.kpi b,.compteurs b{font-size:30px !important;letter-spacing:-.5px}
.kpi span,.compteurs span{text-transform:uppercase;letter-spacing:.05em;font-size:11px !important;font-weight:700}
/* Tuiles : plus hautes, icône dans une pastille ronde teintée, titre plus lisible */
a.card,a.tuile,.second a{border-left-width:0 !important;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;border:1px solid #e3eaf0 !important}
a.card .icon,a.tuile .ico,.second a .ico{width:38px !important;height:38px;border-radius:12px;display:flex !important;align-items:center;justify-content:center;
  background:rgba(15,61,94,.08);font-size:21px !important;flex:none}
.terrain a.card .icon{background:rgba(224,49,49,.10)}.aide a.card .icon{background:rgba(46,196,182,.14)}
a.card span.s,a.tuile span.s{color:#6b7a88 !important}
/* Grandes portes du Bureau */
.principal a{border-top-width:0 !important;background:linear-gradient(180deg,#fff,#f6f9fc) !important;border:1px solid #e3eaf0 !important}
.principal a .ico{width:54px;height:54px;border-radius:16px;display:flex !important;align-items:center;justify-content:center;background:rgba(15,61,94,.08);font-size:28px !important}
.principal a.panne .ico{background:rgba(224,49,49,.12)}.principal a.parc .ico{background:rgba(46,196,182,.16)}.principal a.plan .ico{background:rgba(245,159,0,.16)}
/* Bandeau arrêt */
.alerte,.arret{border-radius:16px !important}
/* Bas de page */
.bottom,.reglages{margin-top:30px !important;padding-top:14px;border-top:1px solid #e3eaf0}

/* ---- Logo de l'entreprise en filigrane, au centre de l'écran ---- */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:var(--v2-logo,none) center 46% / min(62vmin,420px) auto no-repeat;opacity:.07;
  filter:grayscale(.2)}
@media print{body::before{display:none}}

/* ---- Accueil en trois colonnes : Terrain | Bureau | Aide & équipe ---- */
.colonnes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
.colonnes section h3{margin-top:10px !important}
.colonnes .grid{grid-template-columns:1fr !important;gap:9px !important}
@media(max-width:820px){.colonnes{grid-template-columns:1fr}}