/* ============================================================
   SymbioMail — pieds de page légaux et fenêtre des textes juridiques
   ------------------------------------------------------------
   Chargé partout par legal/assets.blade.php : site public, parcours
   Clean Inbox, onboarding, application, AppAdmin, connexion.
   Tout est préfixé .sm-legal pour ne jamais toucher au thème hôte.
   ============================================================ */

.sm-legal-modal {
    --sm-legal-bg: #fdfcfa;
    --sm-legal-head: #f8f6f1;
    --sm-legal-border: #e8e0d0;
    --sm-legal-text: #2c2c2e;
    --sm-legal-muted: #5d6470;
    --sm-legal-title: #060b18;
    --sm-legal-accent: #184989;
    --sm-legal-hover: #efe9dc;
    --sm-legal-ring: rgba(24, 73, 137, .35);
    --sm-legal-veil: rgba(6, 11, 24, .58);

    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    font-family: var(--sm-font-text, Nunito, "Segoe UI", Arial, sans-serif);
}
.sm-legal-modal[hidden] { display: none; }

html[data-sm-theme="dark"] .sm-legal-modal {
    --sm-legal-bg: #0c1424;
    --sm-legal-head: #101a2e;
    --sm-legal-border: #22304a;
    --sm-legal-text: #e6e9ef;
    --sm-legal-muted: #a7b0c0;
    --sm-legal-title: #f5f7fb;
    --sm-legal-accent: #8fb4ec;
    --sm-legal-hover: #18243c;
    --sm-legal-ring: rgba(143, 180, 236, .45);
    --sm-legal-veil: rgba(0, 0, 0, .66);
}
@media (prefers-color-scheme: dark) {
    html[data-sm-theme="system"] .sm-legal-modal {
        --sm-legal-bg: #0c1424;
        --sm-legal-head: #101a2e;
        --sm-legal-border: #22304a;
        --sm-legal-text: #e6e9ef;
        --sm-legal-muted: #a7b0c0;
        --sm-legal-title: #f5f7fb;
        --sm-legal-accent: #8fb4ec;
        --sm-legal-hover: #18243c;
        --sm-legal-ring: rgba(143, 180, 236, .45);
        --sm-legal-veil: rgba(0, 0, 0, .66);
    }
}

.sm-legal-modal__veil {
    position: absolute;
    inset: 0;
    background: var(--sm-legal-veil);
    backdrop-filter: blur(3px);
}

.sm-legal-modal__box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(860px, 100%);
    height: min(86vh, 920px);
    overflow: hidden;
    border: 1px solid var(--sm-legal-border);
    border-radius: 18px;
    background: var(--sm-legal-bg);
    box-shadow: 0 30px 90px rgba(0, 0, 0, .42);
}

.sm-legal-modal__head {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 8px 8px 22px;
    border-bottom: 1px solid var(--sm-legal-border);
    background: var(--sm-legal-head);
}

.sm-legal-modal__title {
    flex: 1;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: var(--sm-legal-title);
    font-family: var(--sm-font-title, "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sm-legal-modal__tab,
.sm-legal-modal__close {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--sm-legal-muted);
    cursor: pointer;
    text-decoration: none;
}
.sm-legal-modal__tab:hover,
.sm-legal-modal__close:hover {
    background: var(--sm-legal-hover);
    color: var(--sm-legal-title);
}
.sm-legal-modal__tab:focus-visible,
.sm-legal-modal__close:focus-visible {
    outline: 3px solid var(--sm-legal-ring);
    outline-offset: 1px;
}

.sm-legal-modal__body {
    position: relative;
    flex: 1;
    min-height: 0;
}

.sm-legal-modal__frame {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--sm-legal-bg);
}

.sm-legal-modal__loading {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    margin: 0;
    color: var(--sm-legal-muted);
    font-size: 15px;
}
.sm-legal-modal.is-loading .sm-legal-modal__loading { display: flex; }
.sm-legal-modal.is-loading .sm-legal-modal__frame,
.sm-legal-modal.is-failed .sm-legal-modal__frame { visibility: hidden; }

/* Le texte n'a pas répondu : on le dit, et l'onglet reste le recours */
.sm-legal-modal__failed {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    color: var(--sm-legal-text);
    font-size: 15px;
    text-align: center;
}
.sm-legal-modal__failed[hidden] { display: none; }
.sm-legal-modal__failed p { margin: 0; }
.sm-legal-modal__failed a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--sm-legal-border);
    border-radius: 10px;
    color: var(--sm-legal-accent);
    font-weight: 700;
    text-decoration: none;
}
.sm-legal-modal__failed a:hover { background: var(--sm-legal-hover); }
.sm-legal-modal__failed a:focus-visible { outline: 3px solid var(--sm-legal-ring); outline-offset: 1px; }

/* Entrée : fondu de 200 ms en courbe ease-out forte ; le léger glissement
   n'est joué que si l'utilisateur n'a pas demandé moins d'animations.
   Sortie : immédiate, la fenêtre répond au geste sans délai. */
.sm-legal-modal .sm-legal-modal__veil,
.sm-legal-modal .sm-legal-modal__box {
    opacity: 0;
    transition: opacity 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.sm-legal-modal.is-open .sm-legal-modal__veil,
.sm-legal-modal.is-open .sm-legal-modal__box { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
    .sm-legal-modal .sm-legal-modal__box {
        transform: translateY(8px) scale(.98);
        transition: opacity 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }
    .sm-legal-modal.is-open .sm-legal-modal__box { transform: none; }
}

@media (max-width: 600px) {
    .sm-legal-modal { padding: 12px; }
    .sm-legal-modal__box { height: calc(100dvh - 24px); border-radius: 14px; }
    .sm-legal-modal__head { padding-left: 16px; }
}

/* ------------------------------------------------------------
   Pied de page légal (legal/footer.blade.php)
   Hérite la couleur de son conteneur : lisible sur fond clair,
   sombre ou en dégradé, sans connaître le thème hôte.
   ------------------------------------------------------------ */

.sm-legal-footer {
    padding: 18px 16px 22px;
    color: inherit;
    font-family: var(--sm-font-text, Nunito, "Segoe UI", Arial, sans-serif);
    font-size: 13px;
    line-height: 1.6;
    text-align: center;
}
.sm-legal-footer--bar {
    margin-top: 28px;
    border-top: 1px solid currentColor;
    border-top-color: color-mix(in srgb, currentColor 18%, transparent);
}

.sm-legal-footer__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px 4px;
    margin: 0 0 6px;
}
.sm-legal-footer__nav a {
    padding: 6px 8px;
    border-radius: 6px;
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.sm-legal-footer__nav a:hover { text-decoration-thickness: 2px; }
.sm-legal-footer__nav a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 1px;
}
.sm-legal-footer__sep { padding: 6px 0; opacity: .5; }

.sm-legal-footer__line {
    max-width: 46rem;
    margin: 0 auto;
    /* Atténué sur fond sombre seulement : sur fond clair, le gris porte déjà
       la hiérarchie et une opacité ferait passer le contraste sous 4,5:1. */
    opacity: var(--sm-legal-soft-opacity, .85);
}
.sm-legal-footer__meta {
    max-width: 46rem;
    margin: 6px auto 0;
    font-size: 12px;
    opacity: var(--sm-legal-soft-opacity, .78);
}

/* Dans la carte des écrans de connexion et d'inscription (auth-shell) */
.sm-legal-footer--card {
    --sm-legal-soft-opacity: 1;
    margin-top: 26px;
    padding: 16px 0 0;
    border-top: 1px solid var(--sm-border, rgba(0, 0, 0, .1));
    color: var(--sm-text-muted, inherit);
    font-size: 12.5px;
}

/* Pages de l'application et d'AppAdmin : discret, sous le contenu */
.sm-legal-footer--muted {
    --sm-legal-soft-opacity: 1;
    color: var(--sm-text-muted, #5d6470);
    font-size: 12.5px;
}

/* Mention d'information sous un formulaire d'inscription */
.sm-legal-notice {
    margin: 14px 0 0;
    color: var(--sm-text-muted, inherit);
    font-size: 12.5px;
    line-height: 1.55;
}
.sm-legal-notice a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
