/* responsive.css — passe mobile transverse.
   Complète theme.css / landing.css sans dépendre de GSAP ni renommer de classes. */

/* ------------------------------------------------------------------ */
/* Garde anti-débordement horizontal                                   */
/* ------------------------------------------------------------------ */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Les médias ne dépassent jamais leur conteneur.
   Les SVG sont volontairement exclus: la timeline et la carte astrale posent une
   largeur naturelle supérieure au viewport et défilent horizontalement dans leur
   conteneur (overflow-x: auto). Un max-width global les compresserait. */
img, video, canvas {
    max-width: 100%;
}

/* ------------------------------------------------------------------ */
/* Zones sûres (encoche / mode standalone PWA)                         */
/* ------------------------------------------------------------------ */
@supports (padding: max(0px)) {
    .ad-main-nav {
        padding-top: env(safe-area-inset-top);
    }

    .container,
    .for-footer {
        padding-left: max(var(--bs-gutter-x, 0.75rem), env(safe-area-inset-left));
        padding-right: max(var(--bs-gutter-x, 0.75rem), env(safe-area-inset-right));
    }

    .ad-site-footer {
        padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
    }
}

/* ------------------------------------------------------------------ */
/* En-tête et navigation mobile                                        */
/* ------------------------------------------------------------------ */
.ad-main-nav .btn.d-md-none {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 575.98px) {
    header.container {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    /* La marque reste lisible mais cède la priorité au bouton menu. */
    .ad-main-nav .brand.fs-2 {
        font-size: 1.5rem;
    }

    .ad-main-nav .logo-wrap {
        width: 44px;
        height: 44px;
    }

    .ad-main-nav .logo-wrap img {
        width: 66px;
        height: 66px;
        top: -11px;
    }

    /* La tagline d'en-tête surcharge inutilement les très petits écrans. */
    .ad-main-nav .tagline {
        display: none;
    }
}

/* ------------------------------------------------------------------ */
/* Menu déroulant mobile (offcanvas)                                   */
/* ------------------------------------------------------------------ */
.offcanvas.offcanvas-end {
    width: min(88vw, 22rem);
}

.offcanvas-body .btn,
.offcanvas-body .link-secondary {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

.offcanvas-body .link-secondary {
    justify-content: center;
}

/* ------------------------------------------------------------------ */
/* Cibles tactiles génériques                                          */
/* ------------------------------------------------------------------ */
@media (pointer: coarse) {
    .btn,
    .nav-link,
    .ad-nav-link {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .footer-socials .social-link {
        min-width: 44px;
        min-height: 44px;
    }
}

/* ------------------------------------------------------------------ */
/* Infobulles de la carte astrale: largeur fixe -> adaptative          */
/* La position reste pilotée par le JS; seule la largeur est bornée.   */
/* ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
    .astral-chart .chart-tooltip,
    .astral-chart .chart-popup {
        min-width: 0;
        max-width: min(420px, calc(100vw - 1.5rem));
        width: min(420px, calc(100vw - 1.5rem));
    }
}

/* ------------------------------------------------------------------ */
/* Tableaux larges: défilement horizontal contenu, pas de casse layout */
/* ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
    .table-responsive {
        -webkit-overflow-scrolling: touch;
    }
}

/* ------------------------------------------------------------------ */
/* Bouton d'installation PWA: masqué tant que non révélé par le JS.    */
/* ------------------------------------------------------------------ */
.ad-footer-install-panel[hidden] {
    display: none !important;
}

/* Évite le zoom iOS au focus des champs (<16px déclenche le zoom). */
@media (max-width: 575.98px) {
    .form-control,
    .form-select,
    .ad-login-input,
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="date"],
    input[type="number"],
    textarea {
        font-size: 16px;
    }
}