/* ===================================================================== premium.css — Composants premium Maktoub (badges, thèmes, mise en avant) Fichier ADDITIF : à charger APRÈS css/style.css. N'écrase rien. Inclure dans header.php : ===================================================================== */ /* ---------- Badges ---------- */ .mk-badge{display:inline-flex;align-items:center;gap:.28rem;font-size:.68rem;font-weight:800; padding:.14rem .55rem;border-radius:20px;line-height:1.3;vertical-align:middle;white-space:nowrap} .mk-badge svg{width:.8em;height:.8em} .mk-badge.badge-serieux {background:#dcfce7;color:#166534} .mk-badge.badge-verifie {background:#dbeafe;color:#1e40af} .mk-badge.badge-vip {background:linear-gradient(90deg,#fde68a,#f59e0b);color:#7c2d12} .mk-badge.badge-famille {background:#ede9fe;color:#5b21b6} .mk-badge.badge-diaspora{background:#cffafe;color:#155e75} [data-theme="dark"] .mk-badge.badge-serieux{background:#0f3d24;color:#86efac} [data-theme="dark"] .mk-badge.badge-verifie{background:#11244d;color:#93c5fd} /* pastille de vérification (coche) */ .mk-verified{display:inline-flex;width:16px;height:16px;border-radius:50%;background:#1e40af;color:#fff; align-items:center;justify-content:center;font-size:.62rem;vertical-align:middle;margin-left:.25rem} /* ---------- Mise en avant (profils premium / boostés) ---------- */ .is-featured{position:relative} .is-featured::before{content:"★ À la une";position:absolute;top:8px;left:8px;z-index:2; background:var(--gold,#d4af37);color:#3a2f12;font-size:.62rem;font-weight:800; padding:.12rem .5rem;border-radius:20px} .mk-ring-premium{padding:2px;border-radius:50%;background:linear-gradient(45deg,var(--gold,#d4af37),var(--emerald,#0b7a4b))} /* ---------- Thèmes (skins) appliqués via une classe sur ou conteneur ---------- */ .theme-gold {--emerald:#bfa14a;--emerald-dark:#8a6d1f;--gold:#8a6d1f} .theme-bleu {--emerald:#2563eb;--emerald-dark:#1e40af;--gold:#1e40af} .theme-rouge {--emerald:#dc2626;--emerald-dark:#991b1b;--gold:#991b1b} .theme-vip_noir {--emerald:#d4af37;--emerald-dark:#bfa14a;--gold:#ffffff} .theme-maroc {--emerald:#c1272d;--emerald-dark:#006233;--gold:#006233} .theme-premium_mariage{--emerald:#b76e79;--emerald-dark:#9d5563;--gold:#d4af37} /* ---------- Cartes profil modernisées (optionnel) ---------- */ .mk-card{border-radius:16px;overflow:hidden;transition:transform .15s ease,box-shadow .15s ease} .mk-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.12)} /* ---------- Bandeau "Passez Premium" ---------- */ .mk-upsell{background:linear-gradient(120deg,var(--emerald-dark,#0b3d2a),#1a4a35);color:#fff; border-radius:14px;padding:1.25rem 1.5rem;text-align:center} .mk-upsell a{display:inline-block;background:var(--gold,#d4af37);color:#3a2f12;font-weight:800; text-decoration:none;padding:.5rem 1.2rem;border-radius:10px;margin-top:.5rem} /* ===== Badge de confiance (vérification d'identité) — ajout couche confiance ===== */ .mk-vbadge{display:inline-flex;align-items:center;gap:.2em;font-size:.72em;font-weight:700;padding:.12em .5em;border-radius:20px;vertical-align:middle;line-height:1.4;white-space:nowrap} .mk-vbadge-id{background:#dcfce7;color:#15803d;border:1px solid #86efac} .mk-vbadge-wa{background:#e0f2fe;color:#0369a1;border:1px solid #7dd3fc} [data-theme="dark"] .mk-vbadge-id{background:rgba(22,163,74,.18);color:#4ade80;border-color:rgba(74,222,128,.4)} [data-theme="dark"] .mk-vbadge-wa{background:rgba(3,105,161,.2);color:#38bdf8;border-color:rgba(56,189,248,.4)} /* ===== Badges gamification ===== */ .mk-gbadge{display:inline-flex;align-items:center;gap:.15em;font-size:.72rem;font-weight:700;padding:.14em .55em;border-radius:20px;background:var(--emerald-pale);color:var(--emerald-dark);white-space:nowrap} [data-theme="dark"] .mk-gbadge{background:rgba(22,163,74,.16);color:#4ade80}