/* ═══ Mes documents — côté famille ═══
   Public : parents souvent sur téléphone, parfois peu à l'aise avec l'informatique.
   Règles tenues partout ici : cibles ≥ 44 px, champs en 16 px (sinon l'iPhone zoome),
   contraste élevé, une seule action visible par écran. */

/* ── La carte dans l'espace parent ──
   Elle est la première carte : c'est elle qui remonte sur le bandeau vert
   (.lift dans parent.html), et plus celle qui la suit. */
#docsCarte{margin-top:-1.6rem;}
#docsCarte ~ .card.lift{margin-top:0;}
.docs{border-left:4px solid #b45309;}
.docs.ok{border-left-color:var(--green);}
.docs-h{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;}
.docs-h h2{margin:0;flex:1;}
.docs-pastille{background:#dc2626;color:#fff;font-size:.78rem;font-weight:800;line-height:1;
  min-width:22px;height:22px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;
  padding:0 .4rem;flex:0 0 auto;}
.docs-titre{font-size:1.02rem;font-weight:700;line-height:1.35;margin:0 0 .15rem;}
.docs-info{font-size:.88rem;color:#4b5563;line-height:1.5;margin:0 0 .8rem;}
.docs-l{border-top:1px solid var(--line);padding:.75rem 0 .2rem;}
.docs-l:first-of-type{border-top:none;}
.docs-l .n{font-size:.98rem;font-weight:700;}
.docs-l .s{font-size:.84rem;color:var(--muted);margin:.1rem 0 .5rem;}
.docs-l .s.att{color:#b45309;font-weight:600;}
.docs-l .s.fait{color:var(--green);font-weight:600;}
.docs-b{display:flex;gap:.5rem;flex-wrap:wrap;}
.docs-b .btn-msg{flex:1;justify-content:center;min-width:140px;min-height:48px;}
.docs-b .btn-rep{flex:1;justify-content:center;min-width:140px;min-height:48px;}

/* ── L'écran plein de signature ── */
.dov{position:fixed;inset:0;z-index:900;background:#fff;display:flex;flex-direction:column;}
.dov[hidden]{display:none;}
.dov-top{display:flex;align-items:center;gap:.6rem;padding:calc(.6rem + env(safe-area-inset-top)) .8rem .6rem;
  background:var(--green);color:#fff;flex:0 0 auto;box-shadow:0 2px 10px rgba(16,24,40,.18);}
.dov-top b{flex:1;min-width:0;font-size:1rem;line-height:1.3;}
.dov-top button{background:rgba(255,255,255,.16);border:none;color:#fff;border-radius:12px;
  min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;font-family:inherit;font-size:1rem;flex:0 0 auto;}
.dov-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1rem .95rem 1.2rem;}
.dov-foot{flex:0 0 auto;padding:.7rem .95rem calc(.7rem + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);background:#fff;box-shadow:0 -4px 16px rgba(16,24,40,.07);}
.dov-foot .btn-msg{width:100%;justify-content:center;font-size:1.05rem;padding:.9rem 1rem;min-height:54px;}
.dov-foot .hint{font-size:.84rem;color:#b45309;text-align:center;margin-bottom:.5rem;font-weight:600;}
.dov-step{font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#8a93a3;margin-bottom:.3rem;}
.dov-body h3{font-size:1.22rem;line-height:1.3;margin:0 0 .7rem;}
.dov-qui{font-size:.95rem;color:#4b5563;background:#f6f8fb;border-radius:10px;padding:.5rem .7rem;margin-bottom:.9rem;}
.dov-lire{font-size:1rem;line-height:1.65;color:#1f2937;}
.dov-lire p{margin:0 0 .8rem;}
.dov-lire h4{font-size:1rem;margin:1.2rem 0 .35rem;color:var(--green);}
.dov-lire li{margin:0 0 .4rem 1.1rem;}
.dov-fin{text-align:center;font-size:.86rem;color:var(--muted);border-top:1px dashed var(--line);
  margin-top:1.2rem;padding-top:.9rem;}

/* ── Les questions oui/non : deux gros boutons, jamais une case ambiguë ── */
.dq{border:1.5px solid var(--line);border-radius:14px;padding:.9rem;margin-bottom:.9rem;background:#fbfcfd;}
.dq .q{font-size:1rem;line-height:1.5;margin-bottom:.75rem;}
.dq .q b{display:block;margin-bottom:.2rem;}
.dq-b{display:flex;gap:.6rem;}
.dq-b button{flex:1;min-height:58px;border-radius:14px;font-family:inherit;font-size:1.05rem;font-weight:700;
  cursor:pointer;background:#fff;border:2px solid #cbd5e1;color:#374151;display:inline-flex;
  align-items:center;justify-content:center;gap:.35rem;}
.dq-b button[aria-pressed="true"][data-v="1"]{background:var(--green);border-color:var(--green);color:#fff;}
.dq-b button[aria-pressed="true"][data-v="0"]{background:#b91c1c;border-color:#b91c1c;color:#fff;}
.dq.manque{border-color:#dc2626;background:#fef2f2;}
.dq .err{font-size:.86rem;color:#b91c1c;font-weight:600;margin-top:.5rem;}

.dpers{border-top:1px solid var(--line);padding-top:.9rem;}
.dpers .t{font-size:1rem;font-weight:700;}
.dpers .f{font-size:.86rem;color:var(--muted);margin:.15rem 0 .7rem;line-height:1.5;}
.dpers-l{display:grid;gap:.4rem;margin-bottom:.7rem;border:1px solid var(--line);border-radius:14px;padding:.7rem;background:#fff;}
.dpers-n{font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#8a93a3;}
.dpers-l input{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:.7rem .8rem;
  font-family:inherit;font-size:1rem;background:#fff;min-height:48px;}
.dpers-l input:focus{outline:none;border-color:var(--green-2);box-shadow:0 0 0 3px rgba(42,157,92,.15);}
.dpers-add{background:#fff;border:1.5px dashed #9aa4b2;color:var(--green);border-radius:12px;
  min-height:48px;width:100%;font-family:inherit;font-size:.95rem;font-weight:700;cursor:pointer;}

/* ── La signature ── */
.dsig label{display:block;font-size:.9rem;font-weight:700;color:#374151;margin:0 0 .3rem;}
.dsig input[type=text]{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:.75rem .85rem;
  font-family:inherit;font-size:1.05rem;background:#fff;min-height:50px;}
.dsig input[type=text]:focus{outline:none;border-color:var(--green-2);box-shadow:0 0 0 3px rgba(42,157,92,.15);}
.dsig-zone{margin-top:1rem;}
.dsig-cadre{position:relative;border:2px dashed #9aa4b2;border-radius:14px;background:#fff;overflow:hidden;}
.dsig-cadre canvas{display:block;width:100%;height:190px;touch-action:none;cursor:crosshair;}
.dsig-cadre .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#9aa4b2;font-size:.95rem;pointer-events:none;text-align:center;padding:0 1rem;}
.dsig-cadre.plein{border-style:solid;border-color:var(--green-2);}
.dsig-cadre.plein .ph{display:none;}
.dsig-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.5rem;}
.dsig-eff{background:#fff;border:1.5px solid var(--line);border-radius:12px;min-height:44px;padding:0 1rem;
  font-family:inherit;font-size:.92rem;font-weight:700;color:#374151;cursor:pointer;}
.dsig-alt{display:block;background:none;border:none;color:var(--green);font-family:inherit;font-size:.95rem;
  font-weight:700;text-decoration:underline;cursor:pointer;padding:.7rem .2rem;min-height:44px;text-align:left;width:100%;}
.dsig-coche{display:flex;align-items:flex-start;gap:.7rem;background:#f6f8fb;border-radius:12px;
  padding:.8rem;margin-top:.8rem;font-size:1rem;line-height:1.45;cursor:pointer;}
/* marge explicite plutôt que `gap` : la case native se colle au texte sinon */
.dsig-coche input{width:26px;height:26px;flex:0 0 auto;margin:.1rem .8rem 0 0;accent-color:#166b3a;}
.dsig-note{font-size:.86rem;color:var(--muted);line-height:1.5;margin-top:.5rem;}

/* ── Le papier : impression, photo, envoi ── */
.dpap ol{margin:0 0 1rem 1.2rem;font-size:1rem;line-height:1.6;}
.dpap ol li{margin-bottom:.5rem;}
.dpap .btn-rep{width:100%;justify-content:center;min-height:50px;font-size:.98rem;margin-bottom:.6rem;}
.dpap-fichier{border:2px dashed #9aa4b2;border-radius:14px;padding:1.1rem .9rem;text-align:center;background:#fbfcfd;}
/* Le champ fichier natif ne fait que 24 px de haut : on le recouvre d'un grand
   bouton-étiquette. Le champ reste là (clavier, lecteurs d'écran, capture photo). */
.dpap-prendre{position:relative;display:flex;align-items:center;justify-content:center;gap:.4rem;
  min-height:56px;border-radius:12px;background:var(--green);color:#fff;font-weight:700;font-size:1rem;
  cursor:pointer;overflow:hidden;}
.dpap-prendre input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:16px;}
.dpap-apercu{margin-top:.8rem;text-align:center;}
.dpap-apercu img{max-width:100%;max-height:260px;border-radius:12px;border:1px solid var(--line);}
.dpap-apercu .nom{font-size:.9rem;color:#374151;font-weight:600;margin-top:.4rem;word-break:break-all;}
.dpap-barre{height:10px;background:#eef2f5;border-radius:99px;overflow:hidden;margin-top:.7rem;}
.dpap-barre i{display:block;height:100%;background:var(--green-2);border-radius:99px;width:0;transition:width .2s;}

/* ── « C'est fait, merci » ── */
.dok{text-align:center;padding:1.6rem .5rem;}
.dok .rond{width:84px;height:84px;border-radius:50%;background:var(--green-light);color:var(--green);
  display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;}
.dok .rond .ic{width:44px;height:44px;stroke-width:2.5;}
.dok h3{font-size:1.5rem;margin-bottom:.5rem;}
.dok p{font-size:1rem;color:#4b5563;line-height:1.6;max-width:34ch;margin:0 auto 1.2rem;}
.dok .btn-rep{min-height:50px;padding:.8rem 1.1rem;font-size:.95rem;}

.dov-etat{font-size:.95rem;margin-top:.6rem;min-height:1.2em;text-align:center;font-weight:600;}
.dov-etat.err{color:#b91c1c;}
.dov-etat.ok{color:var(--green);}

/* Sur ordinateur, une ligne de 1200 px est illisible : on garde la colonne du site */
@media (min-width:640px){
  .dov-body,.dov-foot,.dov-top{padding-left:calc((100% - 600px) / 2);padding-right:calc((100% - 600px) / 2);}
}

/* Écrans très étroits (360 px) : on garde les cibles, on resserre les marges */
@media (max-width:370px){
  .dov-body{padding:.9rem .75rem 1.1rem;}
  .dq{padding:.75rem;}
  .dq-b button{font-size:1rem;}
  .docs-b .btn-msg,.docs-b .btn-rep{min-width:0;}
}

/* La feuille à remplir au stylo : invisible à l'écran, elle n'existe que sur papier */
.dpap-print{display:none;}
.dpap-print h2{font-size:1.3rem;margin-bottom:.3rem;}
.dpap-print h3{font-size:1.05rem;margin:1.1rem 0 .4rem;}
.dpap-print .dpp-id{font-size:.9rem;color:#333;margin-bottom:1rem;}
.dpap-print .dpp-q{margin-bottom:.9rem;line-height:1.6;}
.dpap-print .dpp-l,.dpap-print .dpp-s{margin:.7rem 0;line-height:2;}
.dpap-print .dpp-box{border:1px solid #000;height:110px;border-radius:4px;max-width:360px;}
.dpap-print .dpp-f{margin-top:1rem;font-size:.85rem;font-style:italic;}

/* Impression : seul le document part à l'imprimante, jamais l'interface */
@media print{
  body>*:not(.dov){display:none!important;}
  .dov{position:static;}
  .dov-top,.dov-foot,.dsig-alt{display:none!important;}
  .dov-body{overflow:visible;padding:0;}
  .dpap{display:none!important;}
  .dpap-print{display:block!important;color:#000;font-size:11pt;line-height:1.5;}
}
