/* =========================================================
   CEECI-UE — Administration (style diplomatique)
   ========================================================= */
:root{
  --brand:#123a72; --brand-dark:#0d2b56; --gold:#c8a227; --gold-dark:#8a6c10;
  --accent:#0a2249; --ink:#16233a; --muted:#6b7280; --line:#e8ecef; --paper:#f5f7fa;
  --radius:14px; --shadow:0 10px 30px rgba(18,58,114,.12);
  --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --serif:'Playfair Display',Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font);background:var(--paper);color:var(--ink);font-size:15px;line-height:1.6}
img{max-width:100%}
a{color:var(--brand);text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif)}
.ic{vertical-align:-2px}

/* --------- Login --------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:linear-gradient(135deg,#0a2249,#123a72)}
.login-card{background:#fff;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.35);max-width:420px;width:100%;padding:2.6rem 2.2rem;text-align:center}
.login-card img{width:74px;height:74px;margin:0 auto .8rem}
.login-card h1{font-size:1.4rem;color:var(--brand);margin:.2rem 0 .1rem}
.login-card p{font-size:.85rem;color:var(--muted);margin:0 0 1.4rem}
.login-card form{text-align:left}

/* --------- Layout --------- */
.admin{display:flex;min-height:100vh}
.sidebar{width:264px;background:linear-gradient(180deg,var(--accent),var(--brand-dark));color:#c9d6e8;position:fixed;inset:0 auto 0 0;overflow-y:auto;z-index:100;display:flex;flex-direction:column;transition:transform .3s}
.sidebar .sb-brand{display:flex;align-items:center;gap:.7rem;padding:1.2rem 1.3rem;border-bottom:1px solid #ffffff14}
.sidebar .sb-brand img{width:42px;height:42px}
.sidebar .sb-brand strong{display:block;font-family:var(--serif);color:#fff;font-size:1.05rem;line-height:1.1}
.sidebar .sb-brand small{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#8fa4c2}
.sb-nav{padding:1rem .8rem;flex:1}
.sb-label{font-size:.64rem;text-transform:uppercase;letter-spacing:.14em;color:#7e93b5;padding:.9rem .7rem .35rem}
.sb-link{display:flex;align-items:center;gap:.7rem;color:#c9d6e8;padding:.62rem .8rem;border-radius:10px;font-size:.9rem;font-weight:500;margin-bottom:.15rem;transition:.18s}
.sb-link:hover{background:#ffffff12;color:#fff}
.sb-link.active{background:var(--gold);color:#1b1b1b;font-weight:700}
.sb-link .ic{flex:0 0 auto}
.sb-badge{margin-left:auto;background:#e85d5d;color:#fff;font-size:.66rem;font-weight:700;border-radius:999px;padding:.08rem .5rem}
.sb-foot{padding:1rem 1.2rem;border-top:1px solid #ffffff14;font-size:.74rem;color:#7e93b5}
.content{flex:1;margin-left:264px;min-width:0;display:flex;flex-direction:column}
.topbar-adm{background:#fff;border-bottom:1px solid var(--line);padding:.75rem 1.4rem;display:flex;align-items:center;gap:1rem;position:sticky;top:0;z-index:50}
.topbar-adm h2{font-size:1.15rem;color:var(--brand);margin:0}
.topbar-adm .spacer{flex:1}
.topbar-adm .who{display:flex;align-items:center;gap:.55rem;font-size:.85rem;color:var(--muted)}
.topbar-adm .who b{color:var(--brand)}
.main-adm{padding:1.6rem 1.4rem 3rem;max-width:1200px;width:100%}
.sb-toggle{display:none;background:none;border:none;color:var(--brand);padding:.4rem;cursor:pointer}
.sb-scrim{display:none}

/* --------- Cards / stats --------- */
.cards{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));margin-bottom:1.6rem}
.acard{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:12px;padding:1rem 1.1rem;display:flex;align-items:center;gap:.9rem}
.acard .a-ic{width:46px;height:46px;flex:0 0 46px;border-radius:10px;background:rgba(18,58,114,.08);color:var(--brand);display:flex;align-items:center;justify-content:center}
.acard .num{font-family:var(--serif);font-size:1.5rem;font-weight:800;color:var(--brand);line-height:1}
.acard .lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem 1.4rem;margin-bottom:1.4rem}
.panel > h3{margin:0 0 1rem;color:var(--brand);font-size:1.08rem;display:flex;align-items:center;gap:.5rem}
.panel > h3 .ic{color:var(--gold)}

/* --------- Tables --------- */
.tbl-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
table.tbl{width:100%;border-collapse:collapse;font-size:.88rem;min-width:640px}
.tbl th{background:#f0f4f9;color:var(--brand);text-align:left;padding:.75rem .9rem;font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.tbl td{padding:.7rem .9rem;border-top:1px solid var(--line);vertical-align:middle}
.tbl tr:hover td{background:#fafbfd}
.tbl .thumb{width:58px;height:40px;object-fit:cover;border-radius:8px}
.badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.7rem;font-weight:700;border-radius:999px;padding:.18rem .65rem}
.badge-ok{background:#e7f6ec;color:#166534}
.badge-off{background:#f3f4f6;color:#6b7280}
.badge-gold{background:rgba(200,162,39,.16);color:var(--gold-dark)}
.badge-blue{background:rgba(18,58,114,.1);color:var(--brand)}
.badge-red{background:#fde8e8;color:#9b1c1c}

/* --------- Actions / boutons --------- */
.btn{display:inline-flex;align-items:center;gap:.45rem;border-radius:999px;font-weight:600;padding:.55rem 1.3rem;border:1px solid transparent;cursor:pointer;font-size:.87rem;transition:.2s;font-family:var(--font)}
.btn-brand{background:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-dark);color:#fff}
.btn-gold{background:var(--gold);color:#1b1b1b}
.btn-gold:hover{background:#b18f1d}
.btn-ghost{background:#fff;border-color:#dbe2ea;color:var(--muted)}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand)}
.btn-danger{background:#fde8e8;color:#9b1c1c}
.btn-danger:hover{background:#f9c9c9}
.btn-sm{padding:.34rem .8rem;font-size:.78rem}
.ibtn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;border:1px solid #dbe2ea;background:#fff;color:var(--muted);cursor:pointer;transition:.18s}
.ibtn:hover{border-color:var(--brand);color:var(--brand)}
.ibtn.red:hover{border-color:#e85d5d;color:#e85d5d}
.toolbar{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:1.2rem}
.toolbar h3{margin:0;font-size:1.08rem;color:var(--brand)}
.toolbar .spacer{flex:1}

/* --------- Formulaires --------- */
.form-grid{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:720px){.form-grid{grid-template-columns:1fr 1fr}.form-grid .span-2{grid-column:span 2}}
.f-label{font-size:.8rem;font-weight:600;color:var(--brand);display:block;margin-bottom:.3rem}
.f-input,.f-textarea,.f-select{width:100%;border:1px solid #dbe2ea;border-radius:10px;padding:.62rem .9rem;font-size:.9rem;font-family:var(--font);background:#fbfcfe;color:var(--ink)}
.f-input:focus,.f-textarea:focus,.f-select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(18,58,114,.12);background:#fff}
.f-textarea{min-height:170px;resize:vertical}
.f-help{font-size:.74rem;color:var(--muted);margin-top:.25rem}
.f-check{display:flex;align-items:center;gap:.55rem;font-size:.9rem;font-weight:500}
.f-check input{width:18px;height:18px;accent-color:var(--brand)}
.img-preview{max-width:220px;border-radius:10px;border:1px solid var(--line);margin-top:.5rem}

/* --------- Flash --------- */
.flash{margin:0 0 1.1rem;padding:.8rem 1.1rem;border-radius:10px;font-size:.9rem;font-weight:500}
.flash-success{background:#e7f6ec;color:#166534;border:1px solid #b9e4c7}
.flash-error{background:#fde8e8;color:#9b1c1c;border:1px solid #f5c6c6}
.flash-info{background:#e8f0fb;color:#1e429f;border:1px solid #c3d8f5}

/* --------- Messages --------- */
.msg-item{border:1px solid var(--line);border-radius:12px;background:#fff;padding:1.1rem 1.2rem;margin-bottom:.9rem}
.msg-item.unread{border-left:4px solid var(--gold);background:#fffdf5}
.msg-head{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;margin-bottom:.4rem}
.msg-head b{color:var(--brand)}
.msg-head .m-meta{font-size:.76rem;color:var(--muted)}
.msg-body{font-size:.9rem;white-space:pre-line;color:#26333f}

/* --------- Pagination --------- */
.pagination{display:flex;gap:.35rem;margin-top:1.2rem;flex-wrap:wrap}
.pagination a,.pagination span{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:.84rem;font-weight:600;color:var(--brand);padding:0 .55rem}
.pagination span.current{background:var(--brand);color:#fff;border-color:var(--brand)}

/* --------- Responsive --------- */
@media(max-width:979px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .content{margin-left:0}
  .sb-toggle{display:inline-flex}
  .sb-scrim{display:block;position:fixed;inset:0;background:rgba(10,34,73,.45);z-index:90;opacity:0;visibility:hidden;transition:.3s}
  body.sb-open .sb-scrim{opacity:1;visibility:visible}
  .main-adm{padding:1.1rem .9rem 2.6rem}
}