/* ============================================================
 *  RU ACCRÉDITATIONS - CSS de la modale « Présenter »
 * ============================================================
 *  Fichier    : assets/css/modales.css
 *  Version    : 2.2 (2026-09-02) - claire, logo RU, mobile d'abord
 *  Plugin     : RU Accréditations (MU-plugin)
 *  Chargé par : includes/assets.php (wp_enqueue_style)
 *  Site       : reseauunderground.com · Réseau Underground
 * ============================================================
 *
 *  CE QUI CHANGE (v2.2)
 *    - Logo Réseau Underground en haut a gauche de la modale.
 *    - Surface blanche moderne (aucun fond fonce, aucun jaune de
 *      fond). Or uniquement en fin lisere et petits accents.
 *    - Marges laterales confortables : plus rien de colle au bord,
 *      sur mobile comme sur ordi. Zero debordement horizontal.
 *    - Mobile : panneau plein largeur qui monte du bas, poignee.
 *    - Ordi : carte centree, espacement resserre (moins de vide).
 *    - Look « billet » (encoche + perforation) retire d'ici : garde
 *      pour les evenements. Balisage et donnees inchanges.
 *    - Aucune police web chargee : pile systeme, rapide.
 * ============================================================ */

/* ===== Largeur sur ordi ===== */
.mhh-acc-modal-inner.ru-acc-modal-wrap{ max-width:420px; }

/* ===== Carte (racine) - blanc moderne ===== */
.ru-acc-modal{
    --ru-gold:#FFD000;
    --ru-gold-ink:#FFD941;
    --ink:#17171B;
    --muted:#3A3A40;
    --line:#D5D6DA;
    --surface-2:#F6F7F8;
    --ok:#1E9E57;
    --accent:#FFD000;
    --gut:24px;               /* gouttiere laterale unique */
    position:relative;width:100%;
    background:#FFFFFF;
    border:1px solid var(--line);border-radius:20px;overflow:hidden;
    box-shadow:0 24px 62px -22px rgba(12,12,16,.30);
    color:var(--ink);
    font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;
}

/* Encoche + perforation : retirees de la carte de membre (gardees pour les evenements) */
.ru-acc-modal__notch,
.ru-acc-modal__perf{ display:none !important; }

/* ===== Bouton fermer ===== */
.ru-acc-modal__close{
    position:absolute;top:14px;right:14px;z-index:5;
    width:34px;height:34px;border:1px solid var(--line);border-radius:50%;
    background:#fff;color:#6B6B73;font-size:19px;line-height:1;
    cursor:pointer;display:flex;align-items:center;justify-content:center;
    transition:background .15s,color .15s;
}
.ru-acc-modal__close:hover{background:#F2F3F5;color:var(--ink);}

/* ===== Bandeau (entete) : logo a gauche, fin lisere or ===== */
.ru-acc-modal__band{
    background:#fff;color:var(--ink);
    padding:20px var(--gut) 15px;position:relative;
    border-bottom:2px solid var(--ru-gold);
}
.ru-acc-modal__logo{
    height:40px;width:auto;max-width:62%;display:block;object-fit:contain;
}
/* garde le vieux titre texte fonctionnel si jamais le logo ne charge pas */
.ru-acc-modal__brand{font-size:14px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);}
.ru-acc-modal__kind{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:11px;}
.ru-acc-modal__access{
    position:absolute;right:60px;top:22px;
    font-size:8.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
    color:var(--ink);border:1.5px solid var(--ru-gold);border-radius:99px;padding:5px 11px;
}

/* ===== Ligne technique (numero de laissez-passer) ===== */
.ru-acc-modal__tech{
    background:var(--surface-2);color:var(--muted);
    font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;
    font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
    padding:9px var(--gut);display:flex;justify-content:space-between;align-items:center;
    border-bottom:1px solid var(--line);
}
.ru-acc-modal__tech .numero{color:var(--ink);font-weight:600;letter-spacing:.08em;}

/* ===== Corps ===== */
.ru-acc-modal__body{padding:20px var(--gut) 6px;text-align:center;}
.ru-acc-modal__photo{width:82px;height:82px;margin:0 auto;}
.ru-acc-modal__photo-img,
.ru-acc-modal__photo-pl{
    width:82px;height:82px;border-radius:18px;object-fit:cover;
    border:2px solid var(--ru-gold);
}
.ru-acc-modal__photo-pl{
    display:flex;align-items:center;justify-content:center;
    font-weight:800;font-size:27px;color:var(--ink);
    background:#EEF0F2 !important;
}
.ru-acc-modal__name{font-weight:700;font-size:21px;letter-spacing:-.01em;margin-top:13px;color:var(--ink);}
.ru-acc-modal__org{font-size:12.5px;color:var(--muted);margin-top:4px;}
.ru-acc-modal__role{margin-top:12px;}
.ru-acc-modal__role span{
    display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
    color:var(--ink);background:#fff;border:1.5px solid var(--ru-gold);border-radius:99px;padding:6px 15px;
}

/* ===== Bande d'infos : Statut · Verification (horloge) · Expiration ===== */
.ru-acc-modal__meta{
    display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
    margin:18px 0 0;padding:14px 14px;background:var(--surface-2);
    border:1px solid var(--line);border-radius:14px;
}
.ru-acc-modal__meta-c{flex:1;text-align:left;min-width:0;}
.ru-acc-modal__meta-verif{text-align:center;}
.ru-acc-modal__meta-r{text-align:right;}
.ru-acc-modal__meta-lbl{font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.ru-acc-modal__meta-val{font-weight:600;font-size:13px;font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;color:var(--ink);margin-top:5px;}
.ru-acc-modal__meta-val[data-statut]{color:var(--ok);text-transform:uppercase;letter-spacing:.05em;}
.ru-acc-modal__clock-wrap{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:5px;}
.ru-acc-modal__clock-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 7px rgba(30,158,87,.6);flex:none;}
.ru-acc-modal .mhh-acc-modal-clock{font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-size:14px;font-weight:600;color:var(--ink);}
.ru-acc-modal__clock-tag{display:block;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ok);margin-top:4px;}

/* ===== Acces accordes (rempli par le JS) ===== */
.ru-acc-modal__perms{margin:12px 0 0;padding:14px;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;text-align:left;}
.ru-acc-modal__perms-titre{font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:9px;}
.ru-acc-modal__perms-tags{display:flex;flex-wrap:wrap;gap:7px;}
.ru-acc-modal__perms-tags span{
    font-size:10.5px;font-weight:600;padding:5px 12px;border-radius:99px;
    color:var(--ink);background:var(--surface-2);border:1px solid var(--line);
}

/* ===== v2.6 - Section activite (fierte membre) ===== */
.ru-acc-modal__activite{margin:12px 0 0;text-align:left;}
.ru-acc-modal__badge-fondateur{
    display:inline-flex;align-items:center;gap:7px;margin-bottom:12px;
    padding:7px 14px;border-radius:99px;
    background:#FFD941;border:1.5px solid #111214;
    font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;
    font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#111214;
}
.ru-acc-modal__badge-fondateur-ico{font-size:13px;line-height:1;}
.ru-acc-modal__stats{display:flex;gap:9px;}
.ru-acc-modal__stat{
    flex:1;min-width:0;padding:12px 10px;background:var(--surface-2);
    border:1px solid var(--line);border-radius:14px;text-align:center;
}
.ru-acc-modal__stat-val{
    font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;
    font-size:16px;font-weight:700;color:var(--ink);line-height:1.15;
}
.ru-acc-modal__stat-lbl{
    font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:5px;
}

/* ===== Zone QR : grand, centre ===== */
.ru-acc-modal__qr-zone{padding:16px var(--gut) 24px;text-align:center;}
.ru-acc-modal__qr{
    width:168px;height:168px;border-radius:16px;margin:0 auto;
    background:#fff;border:1px solid var(--line);padding:11px;
    box-shadow:0 6px 20px -8px rgba(12,12,16,.14);
}
.ru-acc-modal__qr-img{width:100%;height:100%;display:block;object-fit:contain;}
.ru-acc-modal__hint{font-size:11px;color:var(--muted);margin-top:13px;letter-spacing:.01em;}

/* ============================================================
 *  MOBILE - carte centree qui FLOTTE, marge tout le tour
 *  (on voit les cotes et le bas de la carte, jamais colle au bord)
 * ============================================================ */
@media (max-width:560px){
    .mhh-acc-modal-overlay{
        align-items:flex-start !important;   /* part du haut : si la carte depasse, on scrolle pour voir le bas */
        padding:16px !important;             /* marge visible tout le tour de la carte */
    }
    .mhh-acc-modal-inner.ru-acc-modal-wrap{ max-width:100%; }
    .mhh-acc-modal-inner{ margin:0 auto !important; }
    .ru-acc-modal{ --gut:20px; }             /* carte ronde sur tous les coins, tous les bords visibles */
    .ru-acc-modal__logo{ height:34px; }
    .ru-acc-modal__qr{ width:178px;height:178px; }
    .ru-acc-modal__name{ font-size:20px; }
}