/* ═════════════ Cartes blanches sur fond gris-lilas (pages du tableau de bord) ═════════════
   Même esprit que la connexion et que « Renforcez votre protection » : un fond gris chaud uni (#f6f5f3), des cartes d'un blanc pur à
   fine bordure lilas et ombre douce. Chargé EN DERNIER sur chaque page du tableau de bord : il remplace les dégradés
   translucides propres à chaque page par des cartes blanches.

   Ce qui ne change pas : les bandeaux violets en haut de page, la carte rose « Aide d'urgence » (c'est une urgence), les
   liserés verts des tuiles « protection active », et les accents de couleur qui disent un état (pastilles, icônes).
   Plus de fond doré : l'assistance passe au violet de la marque. */

:root {
  --carte-bord: #e6e3de;
  --carte-sep: #ece9e5;
  --carte-ombre: 0 1px 2px rgba(30, 28, 40, .05), 0 22px 40px -30px rgba(30, 28, 40, .30);
}

/* ── Le fond de page ── */
.app { background: #f6f5f3 !important; }
.app::before { opacity: 0 !important; }

/* ── Cartes : blanches ── */
.promo__carte, .checklist, .articles-carte,                               /* vue d'ensemble, contacts */
.cpt-avoirs, .cpt-infos, .cpt-activite, .cpt-categories, .cpt-banques, .cpt-etape, /* comptes */
.cc-ligne--place, .cc-faq,                                                /* contacts de confiance */
.vg-console, .vg-liste, .vg-visuel, .vg-pro, .vg-futur, .vg-ligne,       /* score de vigilance */
.fd-adresse, .fd-fuite, .fuites-ajout,                                    /* Sentinelle Dark Web */
.sim-explication__item,                                                   /* carte SIM */
.immo-situation, .immo-suivi__bloc, .immo-constat, .immo-explication__item, /* immobilier */
.rp-prot, .rp-postes, .rp-ops,                                            /* rapport mensuel */
.assist-urgence, .assist-urgence__etapes li,                              /* assistance */
.reglages__carte {                                                        /* réglages */
  background: #fff !important;
  background-image: none !important;
  box-shadow: var(--carte-ombre) !important;
  backdrop-filter: none !important;
}
.promo__carte:not(.promo__carte--fait), .checklist, .articles-carte,
.cpt-avoirs, .cpt-infos, .cpt-activite, .cpt-categories, .cpt-banques, .cpt-etape,
.cc-ligne--place, .cc-faq,
.vg-console, .vg-liste, .vg-visuel, .vg-pro, .vg-futur,
.fd-adresse, .fd-fuite, .fuites-ajout,
.sim-explication__item,
.immo-situation, .immo-suivi__bloc, .immo-constat, .immo-explication__item,
.rp-prot, .rp-postes, .rp-ops,
.assist-urgence, .reglages__carte {
  border: 1px solid var(--carte-bord) !important;
}
.assist-urgence__etapes li { border: 1px solid var(--carte-bord) !important; box-shadow: none !important; }
.fd-adresse::before, .fd-adresse::after, .fd-fuite::before, .fd-fuite::after { display: none !important; }

/* ── Assistance : plus d'or. Les accents ambre passent au violet de la marque ── */
.assist-urgence { --signal-vigilance: #4b3f8f; --signal-vigilance-tint: #f3f0fc; }
.assist-urgence__icone { box-shadow: 0 0 0 5px rgba(75, 63, 143, .10), 0 8px 18px -10px rgba(75, 63, 143, .45) !important; animation: none !important; }

/* ── Alertes : « Ce que SentinelleFin surveille » en UNE carte, une ligne par domaine ── */
#al-cov {
  display: block !important;
  padding: 6px 22px;
  background: #fff;
  border: 1px solid var(--carte-bord);
  border-radius: 26px;
  box-shadow: var(--carte-ombre);
}
#al-cov .al-cov__carte {
  display: grid !important;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 4px 16px;
  min-height: 0 !important;
  padding: 16px 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
#al-cov .al-cov__carte + .al-cov__carte { border-top: 1px solid var(--carte-sep) !important; }
#al-cov .al-cov__filigrane { display: none !important; }
#al-cov .al-cov__haut { display: contents; }
#al-cov .al-tuile { grid-row: 1 / span 2; }
#al-cov .al-cov__id { grid-column: 2; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#al-cov .al-cov__detail { grid-column: 2; margin: 0 !important; font-size: 13px; color: #5d5878; }
#al-cov .al-cov__lien { grid-column: 3; grid-row: 1 / span 2; align-self: center; }

/* ── Alertes : cartes d'alerte blanches. La gravité tient dans l'icône teintée et l'étiquette, jamais dans une bande ── */
.al-carte {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--carte-bord) !important;
  box-shadow: var(--carte-ombre) !important;
  color: var(--brand-1) !important;
}
.al-carte::before, .al-carte::after, .al-carte__aura { display: none !important; }
.al-carte :is(p, span, time, b, strong, li, h3, h4, div, ul, em):not(.al-badge):not(.al-badge *):not(.al-tuile *):not(.al-choix__num) {
  color: var(--brand-1);
  text-shadow: none;
}
.al-carte .al-carte__cat { color: var(--ink-muted-80); }
.al-carte .al-tuile {
  color: var(--ton) !important;
  background: color-mix(in srgb, var(--ton) 12%, #fff) !important;
  box-shadow: none !important;
  border-color: transparent !important;
}
.al-carte .al-pourquoi, .al-carte .al-resume {
  background: #f6f5f3 !important;
  background-image: none !important;
  border-color: var(--carte-bord) !important;
  box-shadow: none !important;
}
.al-carte .al-choix__bouton {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--carte-bord) !important;
  box-shadow: none !important;
  color: var(--brand-1) !important;
}
.al-carte .al-choix__bouton :is(span, b) { color: var(--brand-1); }
.al-carte .al-puce { background: none !important; border-color: var(--carte-bord) !important; }
.al-carte .al-puce, .al-carte .al-puce * { color: var(--ink-muted-80); }
.al-carte .al-badge {
  color: var(--ton) !important;
  background: color-mix(in srgb, var(--ton) 12%, #fff) !important;
  border-color: color-mix(in srgb, var(--ton) 35%, #fff) !important;
}
.al-carte .al-badge * { color: inherit; }
.al-carte .al-choix__num { color: var(--brand-1) !important; }

/* Assistance : liserés et halos dorés des trois étapes et de l'icône → neutres */
.assist-urgence__etapes li::before, .assist-urgence__etapes li::after, .assist-urgence::before, .assist-urgence::after { display: none !important; }
.assist-urgence__etapes li { border-left: 1px solid var(--carte-bord) !important; }
.assist-urgence__icone { background: #f3f0fc !important; color: #4b3f8f !important; }

/* ── Alertes, « Ce que SentinelleFin surveille », sur téléphone ──
   Trois colonnes (icône, texte, bouton) laissaient au texte une colonne de 200 px : « Aucune / banque reliée. / Sans elle, / les opérations / ne peuvent / pas… »,
   sept lignes pour une phrase. Sur téléphone, l'icône et le titre restent sur la première ligne, la phrase prend toute la largeur dessous, le bouton passe en dernier. */
@media (max-width: 640px) {
  #al-cov { padding: 2px 18px; }
  #al-cov .al-cov__carte { grid-template-columns: auto minmax(0, 1fr); gap: 10px 14px; padding: 18px 0 !important; }
  #al-cov .al-tuile { grid-row: 1; }
  #al-cov .al-cov__id { grid-column: 2; grid-row: 1; }
  #al-cov .al-cov__detail { grid-column: 1 / -1; grid-row: 2; font-size: 14px; line-height: 1.5; }
  #al-cov .al-cov__lien { grid-column: 1 / -1; grid-row: 3; align-self: start; justify-self: start; }
  #al-cov .al-cov__carte:not([data-etat="off"]) .al-cov__lien { width: 100%; }
}