/* ============================================================
   MERITAG — Skin WOW du tableau de bord membre (/mon-espace/)
   v1 · 2026-06-12
   ------------------------------------------------------------
   Override ADDITIF de assets/css/frontend-issuer.css :
   ce fichier ne modifie jamais l'original — il se charge APRES
   et harmonise la coquille .mrt-* vers la palette claire-premium.
   Palette : fond #fafbff · sidebar degrade de marque · indigo/violet
   · or #fde047 (parcimonie) · Space Grotesk (titres) + Inter (corps).
   Reversible : retirez ce bloc et le dashboard revient a l'identique.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

/* — Variables de marque exposees a la coquille — */
.mrt-app{
  --mrt-accent:#6366f1;
  --mrt-accent-2:#8b5cf6;
  --mrt-ink:#0f172a;
  --mrt-line:#e7e9f4;
  --mrt-paper:#fafbff;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--mrt-ink);
}

/* ============ TYPOGRAPHIE — titres en Space Grotesk ============ */
.mrt-sidebar-logo .mrt-brand,
.mrt-topbar-title,
.mrt-card-title,
.mrt-stat-card .mrt-stat-val,
.mrt-badge-card-name,
.mrt-quota-numbers,
.mrt-empty-title,
.mrt-nav-section{
  font-family:'Space Grotesk','Inter',sans-serif !important;
  letter-spacing:-.2px;
}

/* ============ FOND GENERAL ============ */
.mrt-layout{ background:var(--mrt-paper); }

/* ============ SIDEBAR — degrade de marque ============ */
.mrt-sidebar{
  background:linear-gradient(160deg,#0d0d2b 0%,#1a103d 55%,#0d1a3b 100%);
  border-right:1px solid rgba(129,140,248,.12);
}
/* Wordmark en degrade indigo->violet */
.mrt-sidebar-logo .mrt-brand{
  background:linear-gradient(90deg,#a5b4fc,#c4b5fd);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:#c4b5fd;
  font-weight:700; font-size:21px;
}
/* Avatar issuer : teinte indigo par defaut (l'inline issuer-color reste prioritaire) */
.mrt-sidebar-issuer-avatar{
  background:rgba(99,102,241,.2);
  border-color:rgba(99,102,241,.35);
  color:#c7d2fe;
}
.mrt-sidebar-issuer-plan{ color:rgba(199,205,240,.5); }

/* ============ NAVIGATION — actif en indigo (or reserve aux accents) ============ */
.mrt-nav-item{ color:rgba(199,205,240,.68); }
.mrt-nav-item:hover{ background:rgba(129,140,248,.08); color:#fff; }
.mrt-nav-item.active{
  color:#e0e7ff;
  background:rgba(129,140,248,.14);
  border-left-color:#818cf8;
}
.mrt-nav-badge{
  background:rgba(129,140,248,.22);
  color:#c7d2fe;
}
.mrt-nav-section{ color:rgba(199,205,240,.3); }

/* ============ TOPBAR ============ */
.mrt-topbar{ border-bottom:1px solid var(--mrt-line); }
.mrt-topbar-title{ color:var(--mrt-ink); }

/* ============ CARTES — coins plus doux, bordure claire, hover premium ============ */
.mrt-quota-bar,
.mrt-stat-card,
.mrt-badge-card,
.mrt-table-wrap,
.mrt-card{
  border:1px solid var(--mrt-line);
  border-radius:16px;
}
.mrt-card{ box-shadow:0 1px 2px rgba(13,13,43,.04); }
.mrt-stat-card{
  border-top:3px solid var(--mrt-accent);
  transition:transform .2s, box-shadow .2s;
}
.mrt-stat-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px -22px rgba(13,13,43,.28);
}
.mrt-stat-card .mrt-stat-val{
  background:linear-gradient(120deg,var(--mrt-accent),var(--mrt-accent-2));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:var(--mrt-accent);
}
.mrt-badge-card{ border-radius:18px; }
.mrt-badge-card:hover{
  box-shadow:0 18px 40px -22px rgba(13,13,43,.22);
  transform:translateY(-3px);
  border-color:#d6dafc;
}

/* ============ BOUTONS ============ */
.mrt-btn{ border-radius:9px; }
.mrt-btn-primary{ background:var(--badge-color,var(--mrt-accent)); }
.mrt-btn-ghost{ background:#eef2ff; color:#4338ca; }
.mrt-btn-lg{ border-radius:12px; }
.mrt-quota-upgrade{
  background:linear-gradient(135deg,var(--mrt-accent),var(--mrt-accent-2));
  border-radius:10px;
}

/* ============ CHAMPS — focus indigo (deja proche, on harmonise) ============ */
.mrt-field input:focus,
.mrt-field select:focus,
.mrt-field textarea:focus{
  border-color:var(--mrt-accent);
  box-shadow:0 0 0 3px rgba(99,102,241,.12);
}

/* ============ TABLE ============ */
.mrt-table th{ background:#f7f8ff; color:#475569; }
.mrt-table tr:hover td{ background:#fbfcff; }

/* ============ BARRES SOMBRES (mobile + admin) → degrade de marque ============ */
.mrt-mobile-bar,
.mrt-admin-banner{
  background:linear-gradient(160deg,#0d0d2b,#1a103d);
}
.mrt-mobile-bar span{ color:#c4b5fd !important; }

/* ============ MODALE ============ */
.mrt-modal{ border-radius:20px; }