/* ============================================================
   saas.css — styles SaaS (inscription, facturation, meta-admin)
   ============================================================ */

/* Logo Orange (accueil + footer) */
.orange-logo { height: 40px; width: auto; vertical-align: middle; }
.orange-foot { display: inline-flex; align-items: center; gap: 8px; opacity: .9; }
.orange-foot img { height: 28px; }
.powered-orange { font-size: 12px; color: #6b7280; display:flex; align-items:center; gap:8px; }

/* Grille des offres */
.plan-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; margin: 18px 0; }
.plan-card { border: 1.5px solid #e5e7eb; border-radius: 16px; padding: 22px; background: #fff; position: relative; transition: .15s; }
.plan-card:hover { border-color: #FF7900; box-shadow: 0 8px 28px rgba(255,121,0,.12); transform: translateY(-2px); }
.plan-card.featured { border-color: #FF7900; }
.plan-card .plan-name { font-size: 18px; font-weight: 800; margin: 0 0 4px; }
.plan-card .plan-price { font-size: 30px; font-weight: 800; color: #111827; }
.plan-card .plan-price small { font-size: 14px; font-weight: 600; color: #6b7280; }
.plan-card .plan-year { font-size: 13px; color: #16a34a; font-weight: 600; margin-top: 4px; }
.plan-card ul.plan-feats { list-style: none; padding: 0; margin: 16px 0; }
.plan-card ul.plan-feats li { padding: 6px 0; color: #374151; font-size: 14px; }
.plan-card ul.plan-feats li i { color: #16a34a; margin-right: 8px; }
.plan-badge { position:absolute; top:-11px; right:16px; background:#FF7900; color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; }

/* Bandeau d'abonnement */
.sub-banner { display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:16px 18px; border-radius:14px; margin-bottom:18px; }
.sub-banner.ok      { background:#ecfdf5; border:1px solid #a7f3d0; }
.sub-banner.warn    { background:#fffbeb; border:1px solid #fde68a; }
.sub-banner.danger  { background:#fef2f2; border:1px solid #fecaca; }
.sub-banner .sb-title { font-weight:800; }

/* Cartes KPI meta-admin */
.adm-kpis { display:grid; grid-template-columns: repeat(auto-fit, minmax(170px,1fr)); gap:14px; margin: 14px 0 24px; }
.adm-kpi { background:#fff; border:1px solid #eef0f3; border-radius:14px; padding:16px; }
.adm-kpi .v { font-size:26px; font-weight:800; color:#111827; }
.adm-kpi .l { font-size:12px; color:#6b7280; text-transform:uppercase; letter-spacing:.04em; }

/* Tableaux SaaS */
.saas-table { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; }
.saas-table th, .saas-table td { padding:11px 14px; text-align:left; border-bottom:1px solid #f1f3f5; font-size:14px; }
.saas-table th { background:#f8fafc; font-weight:700; color:#374151; font-size:12px; text-transform:uppercase; letter-spacing:.03em; }
.saas-table tr:hover td { background:#fafbfc; }

/* Badges de statut */
.badge { display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.badge.active   { background:#dcfce7; color:#166534; }
.badge.trial    { background:#dbeafe; color:#1e40af; }
.badge.pending  { background:#fef9c3; color:#854d0e; }
.badge.suspended,.badge.cancelled,.badge.failed,.badge.expired { background:#fee2e2; color:#991b1b; }
.badge.success  { background:#dcfce7; color:#166534; }

/* Mini-sidebar meta-admin */
.adm-layout { display:flex; min-height:100vh; }
.adm-side { width:240px; background:#0f172a; color:#cbd5e1; padding:22px 14px; flex-shrink:0; }
.adm-side .adm-brand { color:#fff; font-weight:800; font-size:18px; display:flex; align-items:center; gap:10px; margin-bottom:24px; padding:0 8px; }
.adm-side .adm-brand i { color:#FF7900; }
.adm-side a { display:flex; align-items:center; gap:10px; color:#cbd5e1; text-decoration:none; padding:11px 12px; border-radius:9px; margin-bottom:4px; font-weight:600; font-size:14px; }
.adm-side a:hover, .adm-side a.active { background:#1e293b; color:#fff; }
.adm-side a i { width:18px; text-align:center; }
.adm-main { flex:1; padding:26px 30px; background:#f6f7f9; }
.adm-side-foot { margin-top:22px; padding:12px 8px; border-top:1px solid #1e293b; }

@media (max-width: 760px) {
  .adm-layout { flex-direction:column; }
  .adm-side { width:auto; }
}

/* ============================================================
   Auth — refonte professionnelle (override de auth.css)
   Active uniquement quand <body class="auth-pro">
   ============================================================ */
.auth-pro { background: #0b1220; }
.auth-pro .auth-bg { display: none !important; }              /* retire les blobs flottants */
.auth-pro .auth-wrap {
    grid-template-columns: 1.05fr .95fr;
    min-height: 100vh;
}

/* ---- Colonne gauche : présentation sobre ---- */
.auth-pro .auth-illustration {
    align-items: center;
    justify-content: flex-start;
    padding: 60px clamp(36px, 5vw, 84px);
    color: #e5e9f2;
    background:
        radial-gradient(900px 480px at 8% -8%, rgba(37,99,235,.22), transparent 60%),
        radial-gradient(760px 460px at 96% 112%, rgba(124,58,237,.20), transparent 55%),
        linear-gradient(165deg, #0f172a 0%, #15203b 55%, #0b1220 100%);
    position: relative;
}
/* fine ligne d'accent en haut */
.auth-pro .auth-illustration::before {
    content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
    background: linear-gradient(90deg, #2563eb, #7c3aed 55%, #ff7900);
    opacity: .9;
}
.auth-pro .auth-illustration::after { display: none; }
.auth-pro .ill-card { max-width: 460px; width: 100%; }

/* Lockup de marque */
.auth-pro .brand-lockup { display: flex; align-items: center; gap: 14px; margin-bottom: 48px; }
.auth-pro .brand-badge {
    width: 52px; height: 52px; border-radius: 14px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px; color: #fff;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    box-shadow: 0 8px 24px rgba(37,99,235,.35);
}
.auth-pro .brand-name { font-size: 22px; font-weight: 800; letter-spacing: -.01em; color: #fff; line-height: 1.1; }
.auth-pro .brand-name span { color: #93c5fd; }
.auth-pro .brand-sub { font-size: 12.5px; color: #93a4c4; margin-top: 2px; }

/* Accroche */
.auth-pro .pitch-title {
    font-size: clamp(28px, 3vw, 40px); font-weight: 800; line-height: 1.12;
    letter-spacing: -.02em; color: #fff; margin: 0 0 18px;
}
.auth-pro .pitch-lead { font-size: 16px; line-height: 1.6; color: #aab6d2; margin: 0 0 30px; max-width: 40ch; }

/* Liste de fonctionnalités */
.auth-pro .pitch-feats { list-style: none; padding: 0; margin: 0 0 40px; display: grid; gap: 13px; }
.auth-pro .pitch-feats li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: #d4dcee; }
.auth-pro .pitch-feats li i {
    width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; color: #6ee7b7; background: rgba(16,185,129,.14);
}

/* Bandeau partenaire (Orange Sonatel) */
.auth-pro .partner-strip {
    display: flex; align-items: center; gap: 14px;
    padding-top: 24px; border-top: 1px solid rgba(255,255,255,.10);
}
.auth-pro .partner-label {
    font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
    color: #8595b8; font-weight: 600;
}
.auth-pro .partner-logo {
    height: 40px; width: auto; background: #fff; padding: 6px 10px;
    border-radius: 10px; box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

/* ---- Colonne droite : formulaire ---- */
.auth-pro .auth-panel {
    background: #f7f8fb;
    display: flex; align-items: center; justify-content: center;
    padding: 40px 24px;
}
.auth-pro .auth-panel-inner { width: 100%; max-width: 408px; }

.auth-pro .auth-card {
    background: #fff; border: 1px solid #eceef3; border-radius: 18px;
    padding: 36px 34px; box-shadow: 0 18px 50px rgba(15,23,42,.07);
}
.auth-pro .auth-title { font-size: 24px; font-weight: 800; letter-spacing: -.01em; margin: 0 0 6px; color: #0f172a; }
.auth-pro .auth-subtitle { margin: 0 0 26px; color: #64748b; font-size: 14.5px; }

/* Champs */
.auth-pro .form .field { margin-bottom: 16px; }
.auth-pro .form label { font-size: 13px; font-weight: 600; color: #334155; display: block; margin-bottom: 7px; }
.auth-pro .input-icon { position: relative; display: flex; align-items: center; }
.auth-pro .input-icon > i {
    position: absolute; left: 14px; color: #94a3b8; font-size: 14px; pointer-events: none;
}
.auth-pro .input-icon input {
    width: 100%; padding: 12px 14px 12px 40px; font-size: 14.5px;
    border: 1.5px solid #e2e8f0; border-radius: 11px; background: #fff;
    transition: border-color .15s, box-shadow .15s; color: #0f172a;
}
.auth-pro .input-icon input:focus {
    outline: none; border-color: #2563eb; box-shadow: 0 0 0 4px rgba(37,99,235,.12);
}
.auth-pro .btn-eye {
    position: absolute; right: 8px; border: none; background: transparent;
    color: #94a3b8; cursor: pointer; padding: 8px; font-size: 14px;
}

/* Bouton */
.auth-pro .btn-primary {
    background: linear-gradient(135deg, #2563eb, #4f46e5);
    border: none; border-radius: 11px; padding: 13px 18px;
    font-size: 15px; font-weight: 700; color: #fff; cursor: pointer;
    transition: transform .12s, box-shadow .12s, filter .12s;
    box-shadow: 0 8px 22px rgba(37,99,235,.28);
}
.auth-pro .btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: 0 12px 28px rgba(37,99,235,.34); }
.auth-pro .btn-block { width: 100%; }

.auth-pro .link { color: #2563eb; text-decoration: none; font-weight: 600; font-size: 13.5px; }
.auth-pro .link:hover { text-decoration: underline; }
.auth-pro .row-between { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.auth-pro .muted { color: #64748b; }

.auth-pro .auth-foot { text-align: center; margin-top: 22px; color: #94a3b8; }
.auth-pro .auth-foot small { font-size: 12px; }

/* Séparateur "ou" + bloc inscription */
.auth-pro .auth-alt {
    margin-top: 22px; padding-top: 20px; border-top: 1px solid #eceef3;
    text-align: center; font-size: 14px; color: #64748b;
}
.auth-pro .auth-alt .btn-outline {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 12px;
    padding: 11px 18px; border: 1.5px solid #d7dce6; border-radius: 11px;
    background: #fff; color: #1e293b; font-weight: 700; font-size: 14px;
    text-decoration: none; transition: border-color .15s, background .15s;
}
.auth-pro .auth-alt .btn-outline:hover { border-color: #2563eb; background: #f5f8ff; color: #2563eb; }

/* Responsive : on masque la colonne de présentation sur mobile */
@media (max-width: 900px) {
    .auth-pro .auth-wrap { grid-template-columns: 1fr; }
    .auth-pro .auth-illustration { display: none; }
    .auth-pro .auth-panel { min-height: 100vh; }
}

/* La page d'inscription (cartes d'offres) a besoin de plus de largeur */
.auth-pro .auth-panel-inner:has(.auth-card-wide) { max-width: 760px; }
.auth-pro .auth-card-wide .plan-grid { grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 14px; }
.auth-pro .auth-card-wide .grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width: 560px){ .auth-pro .auth-card-wide .grid-2 { grid-template-columns:1fr; } }

/* ---- Page d'inscription : sections, indices, options ---- */
.auth-pro .grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width: 560px){ .auth-pro .grid-2 { grid-template-columns:1fr; } }

.reg-section { margin-bottom: 22px; }
.reg-section-title {
    font-size: 13px; font-weight: 800; letter-spacing: .02em; color: #1e293b;
    text-transform: uppercase; margin: 0 0 12px; padding-bottom: 8px;
    border-bottom: 1px solid #eef0f4;
}
.field .opt { color: #94a3b8; font-weight: 500; font-size: 12px; }

.field-hint {
    margin: 6px 2px 0; font-size: 12px; line-height: 1.45; color: #64748b;
    display: flex; gap: 6px; align-items: flex-start;
}
.field-hint i { color: #93a4c4; margin-top: 2px; flex-shrink: 0; }

.radio-inline { display:flex; align-items:center; gap:7px; font-weight:600; font-size:14px; color:#334155; cursor:pointer; }

.trial-note {
    display:flex; align-items:center; gap:8px; font-size:13.5px; color:#166534;
    background:#ecfdf5; border:1px solid #bbf7d0; border-radius:11px; padding:11px 14px; margin:4px 0 18px;
}
.trial-note i { color:#16a34a; }

/* ============================================================
   Inscription pleine largeur & compacte (.auth-fullform)
   Tout tient sur une page, bouton "Créer mon espace" visible.
   ============================================================ */
.auth-pro.auth-fullform { background:#f1f3f7; }
.auth-pro.auth-fullform .auth-wrap { display:block; grid-template-columns:1fr; min-height:100vh; }
.auth-pro.auth-fullform .auth-illustration { display:none !important; }
.auth-pro.auth-fullform .auth-panel { background:transparent; padding:24px 18px; min-height:auto; }
.auth-pro.auth-fullform .auth-panel-inner { max-width:1020px; margin:0 auto; }

.reg-card { padding:24px 26px !important; }

/* En-tête compact */
.reg-head { display:flex; align-items:center; gap:14px; padding-bottom:16px; margin-bottom:18px; border-bottom:1px solid #eceef3; }
.reg-head .brand-badge { width:46px; height:46px; font-size:21px; border-radius:12px; }
.reg-head-name { font-size:19px; font-weight:800; color:#0f172a; line-height:1.1; }
.reg-head-name span { color:#2563eb; }
.reg-head-sub { font-size:12.5px; color:#64748b; margin-top:2px; }
.reg-head-login { margin-left:auto; font-size:13.5px; color:#475569; text-decoration:none; white-space:nowrap; }
.reg-head-login strong { color:#2563eb; }
.reg-head-login:hover strong { text-decoration:underline; }

/* Deux colonnes : infos | offre */
.reg-split { display:grid; grid-template-columns:1.05fr .95fr; gap:28px; align-items:start; }
.reg-split .reg-section { margin-bottom:18px; }
.reg-split .reg-col:last-child { display:flex; flex-direction:column; }

/* Compacter les indices et champs en mode plein écran */
.auth-fullform .field { margin-bottom:13px; }
.auth-fullform .field-hint { font-size:11.5px; margin-top:4px; }
.auth-fullform .input-icon input { padding-top:10px; padding-bottom:10px; }

/* Offres compactes côte à côte */
.auth-fullform .plan-grid { grid-template-columns:1fr 1fr; gap:12px; margin:0; }
.auth-fullform .plan-card { padding:14px 14px 14px 34px; border-radius:13px; position:relative; }
.auth-fullform .plan-card input[type=radio] { position:absolute; top:15px; left:13px; }
.auth-fullform .plan-card .plan-name { margin:0 0 2px; font-size:15px; }
.auth-fullform .plan-card .plan-price { font-size:21px; }
.auth-fullform .plan-card .plan-price small { font-size:12px; }
.auth-fullform .plan-card .plan-year { font-size:11.5px; }
.auth-fullform .plan-card ul.plan-feats { margin:10px 0 0; }
.auth-fullform .plan-card ul.plan-feats li { padding:3px 0; font-size:12px; }
.auth-fullform .plan-card ul.plan-feats li i { margin-right:6px; }
.auth-fullform .plan-badge { font-size:10px; padding:2px 8px; top:-9px; right:10px; }

.cycle-row { display:flex; gap:18px; flex-wrap:wrap; }
.auth-fullform .trial-note { margin:4px 0 14px; padding:9px 12px; font-size:13px; }
.auth-fullform .btn-primary { margin-top:auto; }

/* Responsive : on repasse en une colonne sous 860px */
@media (max-width: 860px) {
    .reg-split { grid-template-columns:1fr; gap:8px; }
    .reg-head-login { display:none; }
}
@media (max-width: 420px) {
    .auth-fullform .plan-grid { grid-template-columns:1fr; }
    .auth-fullform .grid-2 { grid-template-columns:1fr; }
}

/* Évite le rognage du haut quand le formulaire dépasse la hauteur d'écran */
.auth-pro.auth-fullform .auth-panel { justify-content: flex-start; align-items: center; }

/* ============================================================
   Réduction globale des polices (hors pages d'authentification)
   ============================================================ */
body:not(.auth-body) { font-size: 13px; line-height: 1.5; }
body:not(.auth-body) h1 { font-size: 21px; }
body:not(.auth-body) h2 { font-size: 18px; }
body:not(.auth-body) h3 { font-size: 15px; }
body:not(.auth-body) h4 { font-size: 13.5px; }
body:not(.auth-body) .topbar-title { font-size: 15px; }
body:not(.auth-body) .table th,
body:not(.auth-body) .table td { font-size: 12.5px; }
body:not(.auth-body) .btn { font-size: 13px; }
body:not(.auth-body) .nav-item { font-size: 13px; }
body:not(.auth-body) .saas-table th,
body:not(.auth-body) .saas-table td { font-size: 12.5px; }
body:not(.auth-body) .adm-kpi .v { font-size: 22px; }

/* IMPORTANT : lever le plafond .auth-card{max-width:400px} d'auth.css
   pour la page d'inscription pleine largeur, sinon les 2 colonnes sont écrasées. */
.auth-pro.auth-fullform .auth-card { max-width: 100% !important; width: 100% !important; }
.auth-pro.auth-fullform .auth-panel-inner { width: 100%; }
/* Sécurité : les champs ne doivent jamais se réduire à quelques pixels */
.auth-pro.auth-fullform .input-icon { min-width: 0; }
.auth-pro.auth-fullform .input-icon input { min-width: 0; width: 100%; }

/* ============================================================
   CHARTE ORANGE SONATEL — orange clair sur bleu foncé
   Propagée à toute l'application (surcharge finale).
   ============================================================ */
:root{
    --primary:       #ff7900;   /* Orange Sonatel */
    --primary-dark:  #e56e00;
    --primary-light: #fff3e8;
    --secondary:     #ff9e3d;   /* orange clair (dégradés) */
}

/* Barre latérale principale : bleu foncé */
.sidebar{ background:linear-gradient(180deg,#0c2546 0%,#081a33 100%) !important; }
.brand-name{ color:#fff !important; }
.nav-item.active{ background:linear-gradient(135deg,#ff7900,#ff9e3d) !important; color:#fff !important; }
.nav-item.active i{ color:#fff !important; }

/* Barre latérale méta-admin : même bleu foncé */
.adm-side{ background:linear-gradient(180deg,#0c2546 0%,#081a33 100%); }
.adm-side a.active, .adm-side a:hover{ background:rgba(255,121,0,.16); color:#fff; }
.adm-brand i{ color:#ff9e3d; }

/* ---- Authentification : orange sur bleu foncé ---- */
.auth-pro .auth-illustration{
    background:
        radial-gradient(900px 480px at 12% -10%, rgba(255,121,0,.18), transparent 60%),
        radial-gradient(760px 460px at 95% 112%, rgba(255,121,0,.12), transparent 55%),
        linear-gradient(160deg,#0c2546 0%, #0e2d54 55%, #08182f 100%) !important;
}
.auth-pro .auth-illustration::before{ background:linear-gradient(90deg,#ff7900,#ff9e3d) !important; }
.auth-pro .brand-badge{ background:linear-gradient(135deg,#ff7900,#ff9e3d) !important; box-shadow:0 8px 24px rgba(255,121,0,.35) !important; }
.auth-pro .brand-name span{ color:#ff9e3d !important; }

/* Titre héros en orange (style MPAY) */
.auth-pro .pitch-title{ color:#ff8a1e !important; font-size:clamp(30px,3.2vw,46px) !important; letter-spacing:.5px; margin-bottom:10px !important; }
.auth-pro .pitch-lead{ color:#aebdd8 !important; margin-bottom:30px !important; }

/* Cartes de fonctionnalités (style MPAY) */
.feat-cards{ display:grid; gap:12px; margin:0 0 32px; }
.feat-card{ display:flex; gap:14px; align-items:center; padding:13px 15px; border-radius:14px;
    background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); }
.feat-ic{ width:44px; height:44px; border-radius:11px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    font-size:18px; color:#fff; background:linear-gradient(135deg,#ff7900,#ff9e3d); box-shadow:0 6px 16px rgba(255,121,0,.30); }
.feat-t{ color:#fff; font-weight:700; font-size:14px; }
.feat-s{ color:#9fb0cc; font-size:12px; margin-top:2px; }

/* Champs & boutons orange */
.auth-pro .input-icon > i{ color:#ff7900; }
.auth-pro .input-icon input:focus{ border-color:#ff7900 !important; box-shadow:0 0 0 4px rgba(255,121,0,.15) !important; }
.auth-pro .btn-primary{ background:linear-gradient(135deg,#ff7900,#ff8f25) !important; box-shadow:0 8px 22px rgba(255,121,0,.30) !important; }
.auth-pro .btn-primary:hover{ box-shadow:0 12px 28px rgba(255,121,0,.38) !important; }
.auth-pro .link{ color:#e56e00 !important; }
.auth-pro .auth-alt .btn-outline:hover{ border-color:#ff7900 !important; background:#fff7ef !important; color:#e56e00 !important; }
.reg-head-name span{ color:#ff7900 !important; }
.reg-head-login strong{ color:#e56e00 !important; }
.auth-pro .plan-card.featured{ border-color:#ff7900 !important; }
.auth-pro .plan-card:hover{ border-color:#ff7900 !important; box-shadow:0 8px 28px rgba(255,121,0,.14) !important; }

/* ============================================================
   Réduction supplémentaire des polices sur les vues (hors auth)
   ============================================================ */
body:not(.auth-body){ font-size:12.5px; line-height:1.5; }
body:not(.auth-body) h1{ font-size:19px; }
body:not(.auth-body) h2{ font-size:16px; }
body:not(.auth-body) h3{ font-size:14px; }
body:not(.auth-body) h4{ font-size:12.5px; }
body:not(.auth-body) .topbar-title{ font-size:14px; }
body:not(.auth-body) .btn{ font-size:12.5px; }
body:not(.auth-body) .nav-item{ font-size:12.5px; }
body:not(.auth-body) .table th, body:not(.auth-body) .table td,
body:not(.auth-body) .saas-table th, body:not(.auth-body) .saas-table td{ font-size:12px; }
body:not(.auth-body) .card-body{ padding:16px; }
body:not(.auth-body) .adm-kpi .v{ font-size:21px; }
body:not(.auth-body) .nav-section{ font-size:10.5px; }

/* Bannière d'accueil (tableau de bord) : bleu foncé + halo orange */
.welcome-card{
    background:
        radial-gradient(620px 320px at 92% -25%, rgba(255,121,0,.24), transparent 60%),
        linear-gradient(135deg,#0c2546 0%,#0e2d54 55%,#08182f 100%) !important;
    box-shadow:0 14px 36px -12px rgba(8,24,51,.55) !important;
}
.welcome-card .btn-primary,
.welcome-card .btn-light{ color:#0c2546; }

/* Accent "ATLAS AO" du sous-titre de connexion en orange (au lieu du bleu) */
.auth-pro .auth-subtitle strong{ color:#e56e00; }

/* Logos animés (sidebar + topbar) : passage à l'orange Sonatel */
.brand-mark-animated, .topbrand-mark{
    background:linear-gradient(135deg,#ff7900,#ff9e3d) !important;
    box-shadow:0 4px 14px rgba(255,121,0,.35) !important;
}
.brand-mark-halo, .topbrand-halo{
    background:radial-gradient(circle,rgba(255,158,61,.55) 0%,rgba(255,121,0,.22) 50%,transparent 75%) !important;
}
.topbrand-ring{
    background:conic-gradient(from 0deg,
        rgba(255,158,61,.75), rgba(255,121,0,.6),
        rgba(255,158,61,.75), rgba(255,121,0,0),
        rgba(255,158,61,.75)) !important;
}
.topbrand-name em{ color:#ff7900 !important; }

/* Champs verrouillés (nom du cabinet & sigle — définis à l'inscription) */
.field input.is-locked,
.field textarea.is-locked{
    background:#eef1f4 !important;
    color:#7a8699 !important;
    cursor:not-allowed;
    border-color:#e2e6ec !important;
}
.lock-tag{
    font-size:10.5px; font-weight:600; color:#9aa3b2; margin-left:6px;
    background:#eef1f4; border:1px solid #e2e6ec; padding:1px 7px; border-radius:999px;
    white-space:nowrap;
}
.lock-tag i{ font-size:9px; margin-right:3px; }

/* ============================================================
   Polices plus fines & légèrement plus petites (toutes les vues)
   ============================================================ */
body:not(.auth-body){ font-size:12px; font-weight:400; letter-spacing:.1px; -webkit-font-smoothing:antialiased; }
body:not(.auth-body) h1{ font-size:17px; font-weight:650; }
body:not(.auth-body) h2{ font-size:15px; font-weight:650; }
body:not(.auth-body) h3{ font-size:13.5px; font-weight:600; }
body:not(.auth-body) h4{ font-size:12.5px; font-weight:600; }

/* Navigation latérale plus fine */
body:not(.auth-body) .nav-item{ font-size:12px; font-weight:500; }
body:not(.auth-body) .nav-section{ font-size:10px; }
body:not(.auth-body) .brand-name{ font-size:16px; font-weight:700; }

/* Barre du haut */
body:not(.auth-body) .topbar-title{ font-size:13.5px; font-weight:600; }
body:not(.auth-body) .topbrand-name{ font-size:14px; }
body:not(.auth-body) .topbrand-tag{ font-size:10px; }

/* Champs de formulaire */
body:not(.auth-body) .field label{ font-size:11.5px; font-weight:500; }
body:not(.auth-body) .field .hint{ font-size:11px; }
body:not(.auth-body) input, body:not(.auth-body) select, body:not(.auth-body) textarea{ font-size:12px; }
body:not(.auth-body) .filters .field label,
body:not(.auth-body) .filters-pro .field label{ font-size:10.5px; letter-spacing:.2px; }

/* Boutons */
body:not(.auth-body) .btn{ font-size:12px; font-weight:600; }
body:not(.auth-body) .btn-lg{ font-size:12.5px; }

/* Tableaux */
body:not(.auth-body) .table th{ font-size:10.5px; font-weight:600; letter-spacing:.2px; }
body:not(.auth-body) .table td,
body:not(.auth-body) .saas-table td{ font-size:11.5px; }
body:not(.auth-body) .saas-table th{ font-size:10.5px; }

/* Cartes statistiques / KPI */
body:not(.auth-body) .stat-value,
body:not(.auth-body) .stat-pro .stat-value{ font-size:22px; font-weight:700; }
body:not(.auth-body) .stat-label,
body:not(.auth-body) .stat-pro .stat-label{ font-size:11px; }
body:not(.auth-body) .adm-kpi .v{ font-size:20px; }
body:not(.auth-body) .badge{ font-size:11px; }

/* En-têtes de page */
body:not(.auth-body) .page-head h1,
body:not(.auth-body) .page-head-pro h1{ font-size:17px; font-weight:650; }

/* ============================================================
   Alerte d'abonnement dans le header (≤ 15 jours) — rouge + effet
   ============================================================ */
.sub-alert{
    display:inline-flex; align-items:center; gap:8px;
    background:#dc2626; color:#fff !important; font-weight:700; font-size:12px;
    padding:7px 14px; border-radius:999px; text-decoration:none; white-space:nowrap;
    margin:0 14px; line-height:1; flex-shrink:0;
    box-shadow:0 0 0 0 rgba(220,38,38,.6);
    animation:subAlertPulse 1.6s ease-in-out infinite;
}
.sub-alert i{ font-size:12px; animation:subAlertShake 1.6s ease-in-out infinite; }
.sub-alert:hover{ background:#b91c1c; color:#fff !important; }
.sub-alert.expired{ background:#b91c1c; animation-duration:1.05s; }
@keyframes subAlertPulse{
    0%   { box-shadow:0 0 0 0 rgba(220,38,38,.55); transform:scale(1); }
    70%  { box-shadow:0 0 0 11px rgba(220,38,38,0); transform:scale(1.02); }
    100% { box-shadow:0 0 0 0 rgba(220,38,38,0); transform:scale(1); }
}
@keyframes subAlertShake{
    0%,88%,100%{ transform:rotate(0); }
    91%{ transform:rotate(-12deg); }
    95%{ transform:rotate(10deg); }
}
@media (prefers-reduced-motion: reduce){
    .sub-alert, .sub-alert i{ animation:none; }
}
/* Sur petit écran : on garde la pastille mais on masque le texte long */
@media (max-width:820px){
    .sub-alert .lbl{ display:none; }
    .sub-alert{ padding:8px 11px; }
}