/* ACCRED - feuille de style unique, sans etape de compilation */
:root{
  --vert:#0A6B3D; --vert-nuit:#06301C; --or:#F0B323;
  --encre:#111619; --ardoise:#1A2126; --gris:#6D7681; --gris-clair:#9AA3AC;
  --papier:#F4F5F2; --carte:#FFFFFF; --ligne:#DFE3DE; --ligne-forte:#C6CCC5;
  --rouge:#B3261E; --ambre:#B26B00; --bleu:#1D4ED8;
  --r:6px; --ombre:0 1px 2px rgba(17,22,25,.06), 0 8px 24px -16px rgba(17,22,25,.28);
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --sans:"Inter","Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--papier);color:var(--encre);font-family:var(--sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.01em}
a{color:var(--vert)}
button,input,select,textarea{font:inherit;color:inherit}
img{max-width:100%}

.topbar{background:var(--encre);color:#fff;display:flex;align-items:center;gap:14px;padding:10px 16px;flex-wrap:wrap}
.marque{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;color:#fff}
.ecusson{width:30px;height:34px;background:var(--vert);clip-path:polygon(50% 0,100% 18%,100% 70%,50% 100%,0 70%,0 18%);display:grid;place-items:center;color:var(--or);font-weight:800;font-size:11px}
.marque b{font-size:14px;letter-spacing:.06em}
.marque span{display:block;font-size:11px;color:var(--gris-clair);font-family:var(--mono)}
.qui{font-size:12px;color:var(--gris-clair);text-align:right;line-height:1.35}
.qui b{color:#fff;display:block}
nav.onglets{background:var(--ardoise);display:flex;gap:2px;padding:0 10px;overflow-x:auto}
nav.onglets a{color:var(--gris-clair);padding:11px 14px;font-size:13px;font-weight:550;text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
nav.onglets a:hover{color:#fff}
nav.onglets a[aria-current="page"]{color:#fff;border-bottom-color:var(--or)}
main{max-width:1180px;margin:0 auto;padding:22px 16px 60px;width:100%}
main.etroit{max-width:860px}

.entete{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.entete p{margin:4px 0 0;color:var(--gris);max-width:72ch}
.oeil{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--vert);margin-bottom:6px}
.entete h1{font-size:24px}
.carte{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--r);box-shadow:var(--ombre)}
.carte>h3{padding:14px 16px;border-bottom:1px solid var(--ligne);font-size:14px}
.corps{padding:16px}
.grille{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.deux-col{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:start}
@media(max-width:900px){.deux-col{grid-template-columns:1fr}}

label.champ{display:block;margin-bottom:12px}
label.champ>span{display:block;font-size:12px;font-weight:600;margin-bottom:5px;color:#39424A}
label.champ>span i{color:var(--rouge);font-style:normal}
input[type=text],input[type=date],input[type=datetime-local],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=file],select,textarea{
  width:100%;padding:9px 10px;border:1px solid var(--ligne-forte);border-radius:var(--r);background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid var(--vert);outline-offset:1px;border-color:var(--vert)}
.aide{font-size:12px;color:var(--gris);margin-top:4px}

/* Formulaire d'ajout replie : la page du referentiel sert d'abord a consulter
   et a corriger l'existant. On ne cree une rencontre ou un compte que de temps
   en temps, le formulaire n'a pas a occuper l'ecran le reste du temps. */
details.ajout{margin-top:14px;border-top:1px solid var(--ligne);padding-top:12px}
details.ajout>summary{display:inline-flex;align-items:center;gap:7px;cursor:pointer;list-style:none;
  font-size:12.5px;font-weight:600;color:var(--vert);padding:5px 9px;border:1px solid var(--ligne-forte);
  border-radius:var(--r);background:#fff;user-select:none}
details.ajout>summary::-webkit-details-marker{display:none}
details.ajout>summary::before{content:"+";font-size:15px;line-height:1;font-weight:700}
details.ajout[open]>summary{margin-bottom:12px}
details.ajout[open]>summary::before{content:"\2212"}
details.ajout>summary:hover{border-color:var(--vert)}
.err{color:var(--rouge);font-size:12px;margin-top:4px}

.btn{display:inline-flex;align-items:center;gap:7px;background:var(--vert);color:#fff;border:1px solid var(--vert);
  padding:9px 14px;border-radius:var(--r);cursor:pointer;font-weight:600;font-size:13px;text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.btn.sec{background:#fff;color:var(--encre);border-color:var(--ligne-forte)}
.btn.dgr{background:var(--rouge);border-color:var(--rouge);color:#fff}
.btn.mini{padding:5px 9px;font-size:12px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.barre-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris);padding:9px 10px;border-bottom:1px solid var(--ligne)}
td{padding:10px;border-bottom:1px solid var(--ligne);vertical-align:middle}
tbody tr:hover{background:#FAFBF9}
.num{font-family:var(--mono);font-size:12px}

.puce{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:100px}
.p-att{background:#FFF4DA;color:#7A4E00} .p-val{background:#DFF3E6;color:#0A6B3D}
.p-ref{background:#FBE3E1;color:#8E1B15} .p-prod{background:#E2ECFD;color:#17399B}
.p-del{background:#E7EBE6;color:#39424A} .p-rev{background:#2B3238;color:#fff}
.jeton{display:inline-block;font-family:var(--mono);font-size:11px;padding:2px 6px;border:1px solid var(--ligne-forte);border-radius:3px;background:#fff;margin:0 3px 3px 0}
.vide{padding:38px 16px;text-align:center;color:var(--gris)}
.vide b{display:block;color:var(--encre);margin-bottom:4px}

.kpi{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--r);padding:14px 16px}
.kpi b{display:block;font-size:28px;font-family:var(--mono);line-height:1.1}
.kpi span{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--gris)}

.zgrille{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.zbtn{border:1px solid var(--ligne-forte);background:#fff;border-radius:var(--r);padding:8px 6px;cursor:pointer;text-align:center;line-height:1.25;display:block}
.zbtn b{display:block;font-family:var(--mono);font-size:16px}
.zbtn small{font-size:10px;color:var(--gris);display:block}
.zbtn input{display:none}
.zbtn.on{background:var(--vert);border-color:var(--vert);color:#fff}
.zbtn.on small{color:#CFE7D9}
.zbtn .das{font-size:9px;color:var(--ambre);font-weight:700}
.zbtn.on .das{color:var(--or)}

.note{border-left:3px solid var(--or);background:#FFFBF0;padding:10px 12px;border-radius:0 var(--r) var(--r) 0;font-size:13px;margin-bottom:12px}
.note.dgr{border-color:var(--rouge);background:#FDF1F0}
.note.ok{border-color:var(--vert);background:#F0F7F3}
dl.fiche{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13px}
dl.fiche dt{color:var(--gris);font-size:12px}
dl.fiche dd{margin:0}
.pj{display:flex;align-items:center;gap:8px;border:1px solid var(--ligne);border-radius:var(--r);padding:8px 10px;margin-bottom:6px;font-size:12px}
.pj img{width:38px;height:38px;object-fit:cover;border-radius:3px;flex:none}
.journal{font-family:var(--mono);font-size:12px}
.journal div{padding:6px 0;border-bottom:1px dashed var(--ligne)}
.filtres{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.filtres input,.filtres select{width:auto;min-width:150px}
.pagination{display:flex;gap:4px;list-style:none;padding:14px 0 0;font-size:13px;flex-wrap:wrap}
.pagination a,.pagination span{padding:6px 10px;border:1px solid var(--ligne);border-radius:var(--r);text-decoration:none;background:#fff}

/* Le pied de page et la navigation ne s'impriment pas */
@media print{
  footer, .topbar, nav.onglets, .no-print { display:none !important }
  body { background:#fff; display:block }
  main { padding:0; max-width:none }
}
/* =====================================================================
   CORRECTIF — Taille des flèches de pagination
   Application ACCRED
   A coller a la FIN du fichier  public/css/app.css
   Date : 07/09/2026

   Cause : les vues de pagination de Laravel utilisent des classes
   utilitaires Tailwind (w-5 h-5, hidden, sm:flex...) qui n'existent pas
   dans app.css. Sans largeur ni hauteur, les <svg> des fleches
   s'etirent a la taille du conteneur (jusqu'a ~1000 px).
   ===================================================================== */

/* 1. Fleches et icones de la pagination ramenees a 20 px */
nav[role="navigation"] svg,
.pagination svg {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    display: inline-block;
    vertical-align: middle;
}

/* 2. Garde-fou general : toute icone portant une classe de taille
      Tailwind garde sa taille prevue, meme si Tailwind n'est pas compile */
svg.w-4, svg.h-4 { width: 1rem;    height: 1rem;    }
svg.w-5, svg.h-5 { width: 1.25rem; height: 1.25rem; }
svg.w-6, svg.h-6 { width: 1.5rem;  height: 1.5rem;  }

/* 3. Suppression du doublon de pagination
      (le bloc « Precedent / Suivant » destine au mobile et le bloc
      « ‹ 1 2 3 4 5 › » destine au bureau s'affichaient tous les deux) */
@media (min-width: 640px) {
    nav[role="navigation"] > div:first-child { display: none; }
}
@media (max-width: 639px) {
    nav[role="navigation"] > div:last-child  { display: none; }
}

/* Fin du correctif ---------------------------------------------------- */

