/* Palette (contrastes WCAG AA vérifiés) :
   blanc sur violet #7040D8 = 6,2:1 · blanc sur framboise #B52668 = 6,1:1
   texte #27213C sur turquoise #83DFD0 = 9,8:1 · sur lavande #F6F2FF = 14:1
   texte doux #5E5873 sur blanc = 6,7:1, sur lavande = 6:1
   Le turquoise ne sert jamais de couleur de texte (trop clair). */
:root{
  --violet:#7040D8; --violet-fonce:#5A2FBF; --violet-doux:#EEE7FD;
  --turq:#83DFD0; --turq-doux:#E3F7F3;
  --framb:#B52668; --framb-doux:#FBE7F0;
  --fond:#F6F2FF; --carte:#ffffff; --texte:#27213C; --doux:#5E5873; --ligne:#E9E3F5;
  --accent:var(--violet); --accent-doux:var(--violet-doux);
  --vert:#157A52; --vert-doux:#E1F4EC;
  --orange:#A3540A; --orange-doux:#FDF0E1;
  --rouge:var(--framb); --rouge-doux:var(--framb-doux);
  --rayon:14px; --ombre:0 1px 2px rgba(39,33,60,.04),0 6px 18px rgba(112,64,216,.07);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fond);color:var(--texte);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-text-size-adjust:100%}
[hidden]{display:none!important}
.doux{color:var(--doux)}
.app{max-width:760px;margin:0 auto;padding:calc(14px + env(safe-area-inset-top)) 16px 110px}

/* Bandeau d'accueil violet */
header.tete{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;margin:4px 0 18px;padding:22px 20px 24px;background:var(--violet);color:#fff;border-radius:18px;box-shadow:0 10px 24px rgba(112,64,216,.25)}
header.tete::before,header.tete::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
header.tete::before{width:150px;height:150px;right:-40px;top:-60px;background:var(--turq);opacity:.9}
header.tete::after{width:90px;height:90px;right:70px;bottom:-55px;background:var(--framb)}
header.tete>*{position:relative;z-index:1}
header.tete h1{font-size:1.5rem;margin:0;letter-spacing:-.01em;color:#fff}
header.tete small{display:block;color:#EDE6FF;font-size:.88rem;margin-top:3px}
header.tete small::first-letter{text-transform:uppercase}
.sync{font-size:.8rem;background:#fff;border-radius:999px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;align-self:flex-start;color:var(--vert)}
.sync.attente{color:var(--orange)}.sync.erreur{color:var(--framb)}

.carte{background:var(--carte);border-radius:var(--rayon);box-shadow:var(--ombre);padding:18px;margin-bottom:14px}
.carte h2{font-size:1.02rem;margin:0 0 12px;display:flex;align-items:center;justify-content:flex-start;gap:8px}
.carte h2 .lien{margin-left:auto}
/* Cartes d'action en turquoise (texte foncé) */
.carte.cta{background:var(--turq);box-shadow:none}
.carte.cta .note,.carte.cta .doux{color:var(--texte)}
.carte.cta .btn.second{background:#fff;color:var(--violet-fonce)}
.carte.cta .lien{color:var(--texte);text-decoration:underline}
/* Petite barre de couleur devant chaque titre de carte (turquoise, framboise, violet) */
#vue>.carte>h2::before{content:"";flex:none;width:4px;height:18px;border-radius:4px;background:var(--violet)}
#vue>.carte:nth-of-type(3n+1)>h2::before{background:var(--turq)}
#vue>.carte:nth-of-type(3n+2)>h2::before{background:var(--framb)}

.lien{font-size:.84rem;font-weight:600;color:var(--violet);cursor:pointer;background:none;border:0;padding:0;font-family:inherit}
.ligne{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--ligne)}
.ligne:first-child,.carte h2+.ligne{border-top:0}
.case{width:24px;height:24px;border-radius:8px;border:2px solid #CFC6E6;flex:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.85rem;background:#fff;padding:0}
.case.ok{background:var(--violet);border-color:var(--violet)}
.txt{flex:1;min-width:0;cursor:pointer}
.txt b{font-weight:600;display:block;overflow-wrap:anywhere}
.txt small{color:var(--doux);font-size:.82rem}
.fait .txt b{text-decoration:line-through;color:var(--doux);font-weight:500}
.pastille{font-size:.74rem;padding:4px 9px;border-radius:999px;white-space:nowrap;font-weight:600}
.p-bleu{background:var(--violet-doux);color:var(--violet-fonce)} .p-vert{background:var(--vert-doux);color:var(--vert)}
.p-orange{background:var(--orange-doux);color:var(--orange)} .p-rouge{background:var(--framb);color:#fff} .p-gris{background:#F0EDF6;color:var(--doux)}

/* Les trois chiffres : turquoise, framboise, blanc */
.grille{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.chiffre{background:var(--carte);border-radius:var(--rayon);box-shadow:var(--ombre);padding:14px 8px;text-align:center}
.chiffre:nth-child(1){background:var(--turq);box-shadow:none}
.chiffre:nth-child(2){background:var(--framb);box-shadow:none}
.chiffre:nth-child(1) b,.chiffre:nth-child(1) span{color:var(--texte)!important}
.chiffre:nth-child(2) b,.chiffre:nth-child(2) span{color:#fff!important}
.chiffre b{display:block;font-size:clamp(.92rem,4.3vw,1.3rem);white-space:nowrap}
.chiffre span{font-size:.76rem;color:var(--doux)}

.form{display:flex;flex-direction:column;gap:10px}
.rang{display:flex;gap:8px;flex-wrap:wrap}
.rang>*{flex:1 1 120px;min-width:0}
.rang>.btn{flex:0 0 auto!important}
input,select,textarea{border:1.5px solid var(--ligne);border-radius:10px;padding:10px 12px;font:inherit;font-size:16px;background:#FCFBFF;color:var(--texte);width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-doux)}
textarea{min-height:70px;resize:vertical}
label.cb{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--doux)}
label.cb input{width:auto;accent-color:var(--violet)}
label.champ{font-size:.8rem;color:var(--doux);display:flex;flex-direction:column;gap:4px}
.btn{border:0;border-radius:10px;padding:12px 18px;font:inherit;font-weight:600;cursor:pointer;background:var(--violet);color:#fff;white-space:nowrap}
.btn:active{background:var(--violet-fonce)}
.btn.second{background:var(--violet-doux);color:var(--violet-fonce)}
.btn.danger{background:var(--framb-doux);color:var(--framb)}
.btn:disabled{opacity:.5}
button:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.onglets{display:flex;gap:8px;overflow-x:auto;margin-bottom:12px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.onglets button{border:1.5px solid var(--ligne);background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:.86rem;cursor:pointer;white-space:nowrap;color:var(--texte)}
.onglets button.actif{background:var(--violet);color:#fff;border-color:var(--violet)}
.barre{height:8px;border-radius:99px;background:#EEEAF6;overflow:hidden;margin-top:7px}
.barre i{display:block;height:100%;background:var(--violet);border-radius:99px}
.semaine{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.jour{background:#fff;border:1.5px solid var(--ligne);border-radius:12px;padding:8px 6px;min-height:110px}
.jour h4{margin:0 0 6px;font-size:.72rem;color:var(--doux);text-transform:uppercase;letter-spacing:.04em;text-align:center}
.jour h4 b{display:block;font-size:1rem;color:var(--texte)}
.jour.auj{border-color:var(--violet);background:var(--violet-doux)}
.evt{font-size:.68rem;border-radius:8px;padding:3px 5px;margin-bottom:4px;line-height:1.25;display:block;white-space:normal}
.note{font-size:.82rem;color:var(--doux);margin:8px 2px 14px}
.vide{color:var(--doux);font-size:.9rem;padding:6px 0}
.erreur{color:var(--framb);font-size:.85rem;min-height:1em;margin:0}

nav.bas{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--ligne);display:flex;justify-content:space-around;padding:6px 2px calc(6px + env(safe-area-inset-bottom));z-index:20}
nav.bas button{background:none;border:0;font:inherit;font-size:.64rem;color:var(--doux);display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 6px;cursor:pointer;min-width:44px;border-radius:12px}
nav.bas button span{font-size:1.2rem;line-height:1}
nav.bas button.actif{color:var(--violet-fonce);background:var(--violet-doux);font-weight:700}
.menu-plus{position:fixed;right:10px;bottom:calc(76px + env(safe-area-inset-bottom));background:#fff;border-radius:16px;box-shadow:0 12px 32px rgba(39,33,60,.18);padding:6px;z-index:30;border-top:4px solid var(--framb)}
.menu-plus button{display:block;width:100%;text-align:left;border:0;background:none;font:inherit;padding:12px 14px;cursor:pointer;color:var(--texte);border-radius:10px}
.menu-plus button:hover{background:var(--fond)}
.feuille{position:fixed;inset:0;background:rgba(39,33,60,.4);z-index:40;display:flex;align-items:flex-end;justify-content:center}
.feuille-boite{background:#fff;width:min(560px,100%);max-height:88dvh;overflow:auto;border-radius:20px 20px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));border-top:5px solid var(--violet)}
.feuille-boite h3{margin:0 0 14px;font-size:1.12rem}
.actions{display:flex;gap:8px;justify-content:space-between;margin-top:14px;flex-wrap:wrap}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(88px + env(safe-area-inset-bottom));background:var(--texte);color:#fff;padding:11px 16px;border-radius:12px;font-size:.88rem;z-index:50;max-width:calc(100vw - 32px);border-left:4px solid var(--turq)}
.ecran-cnx{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:20px}
.cnx-boite{background:#fff;border-radius:20px;box-shadow:var(--ombre);padding:0 22px 26px;width:min(380px,100%);text-align:center;overflow:hidden}
.cnx-logo{isolation:isolate;font-size:2.6rem;background:var(--violet);margin:0 -22px 14px;padding:26px 0 22px;position:relative;overflow:hidden}
.cnx-logo::before{z-index:-1;content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:var(--turq);right:-30px;top:-50px}
.cnx-logo::after{z-index:-1;content:"";position:absolute;width:60px;height:60px;border-radius:50%;background:var(--framb);left:-18px;bottom:-30px}
.cnx-boite h1{margin:6px 0 4px;font-size:1.4rem}
.cnx-boite form{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.maj::first-letter{text-transform:uppercase}
@media (max-width:560px){.semaine{grid-template-columns:repeat(2,1fr)}}