/* ==========================================================
   Version mobile du site (chargée sur toutes les pages)
   ========================================================== */

/* Libellés courts du menu : seulement sur mobile */
.navbar .nav-lib { display: none; }

@media (max-width: 700px) {
    html { -webkit-text-size-adjust: 100%; }
    body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); overflow-x: hidden; }

    /* --- Barre du haut : logo + Gestion --- */
    body .navbar { padding: 10px 16px; padding-top: max(10px, env(safe-area-inset-top)); flex-wrap: nowrap; }
    body .navbar .logo { height: 36px; margin-right: 0; }
    body .navbar .logo2 { display: none; }
    body .navbar .login-button, body .navbar .username { font-size: .85rem; padding: 7px 12px; border-radius: 8px; font-family: 'Barlow', system-ui, sans-serif; font-weight: 700; }
    body .navbar #myform { margin: 0; }
    body .navbar-right { gap: 6px; }

    /* --- Menu en barre d'onglets en bas de l'écran --- */
    body .navbar .navbar-center {
        position: fixed; z-index: 40; left: 0; right: 0; bottom: 0;
        display: grid; grid-template-columns: repeat(5, 1fr);
        padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
        background: rgba(10, 12, 15, .96); border-top: 1px solid #1d2026;
        backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
        font-family: 'Barlow', system-ui, sans-serif;
    }
    body .navbar .navbar-center a {
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
        min-height: 52px; margin: 0; padding: 4px 2px; border-radius: 10px;
        color: #9da1a8; font-size: .72rem; font-weight: 600; letter-spacing: .01em;
        -webkit-tap-highlight-color: transparent;
    }
    body .navbar .navbar-center a .icon-mobile { display: block; font-size: 1.45rem; line-height: 1; }
    body .navbar .navbar-center a .text-desktop { display: none; }
    body .navbar .navbar-center a .nav-lib { display: block; }
    body .navbar .navbar-center a.nav-bureau { display: none; }
    body .navbar .navbar-center a.is-actif { color: #daf37c; }
    body .navbar .navbar-center a.is-actif .icon-mobile { transform: translateY(-1px); }
    body .navbar .navbar-center a:active { background: #14171c; }

    /* Notifications au-dessus de la barre d'onglets */
    body .tnk-toast { bottom: calc(82px + env(safe-area-inset-bottom)); width: calc(100% - 32px); }

    /* --- Bandeau du prochain match --- */
    body .tnk-bandeau__inner { padding: 10px 12px 12px; }
    body .tnk-bandeau__label { font-size: .72rem; }
    body .tnk-bandeau__btn { min-height: 40px; }

    /* --- Calendrier : date visible, espaces resserrés --- */
    body .cal-match > span#contextMatch { display: block !important; margin-bottom: 4px; color: #d4d6da; font-size: .9rem; }
    body .cal-match #containerMatch1 { padding: 6px 4px; gap: 6px; }
    body .cal-titre { margin-top: 28px !important; margin-bottom: 4px; }
    body .tnk-bilan--cal { margin: 10px auto 18px; padding: 0; }
    body #containerMatchCenter { padding-bottom: 8px; }
    body .cal-plus { margin: 20px 0 6px; }

    /* --- Footer : pas sous la barre d'onglets --- */
    body .tnk-footer { margin-top: 24px; }

    /* --- Fenêtre de connexion : plein écran confortable --- */
    body .tnk-login { width: calc(100% - 24px); padding: 26px 20px 22px; }
    body .tnk-login__saisie input { font-size: 16px; } /* évite le zoom auto sur iPhone */

    /* Champs de formulaire : 16px minimum pour éviter le zoom iOS */
    body input[type="text"], body input[type="email"], body input[type="password"], body input[type="number"],
    body input[type="date"], body input[type="url"], body input[type="search"], body select, body textarea { font-size: 16px; }
}

@media (max-width: 400px) {
    body .tnk-bandeau__equipes { gap: 6px; }
    body .tnk-bandeau__equipe { font-size: .8rem; gap: 5px; }
    body .tnk-bandeau__equipe img { width: 26px; height: 26px; }
    body .tnk-bandeau__score { font-size: 1.1rem; }
    body .tnk-bandeau__pastille { padding: 3px 7px; font-size: .74rem; }
    body .navbar .navbar-center a { font-size: .68rem; }
}

@media (max-width: 360px) {
    body .tnk-bandeau__equipes .tnk-bandeau__score { display: none; }
    body .tnk-bandeau__equipe { font-size: .76rem; }
    body .tnk-bandeau__equipe img { width: 24px; height: 24px; }
}

/* Actualités « À la une » : pas de débordement sur tablette */
@media (max-width: 900px) {
    body .tnk-une { aspect-ratio: auto; min-height: 400px; }
}

@media (max-width: 700px) {
    /* Accueil : bloc YouTube, les mots PLAY restent dans le cadre */
    body .tnk-yt__visuel { overflow: hidden; }
    /* Actualités : champ de recherche pleine largeur */
    body .tnk-actus__recherche { box-sizing: border-box; min-width: 0; width: 100%; }
}

/* Bandeau du prochain match : masqué sur mobile */
@media (max-width: 700px) {
    body .tnk-bandeau { display: none; }
}

/* Bandeau sur tablette : le bouton ne dépasse plus */
@media (min-width: 701px) and (max-width: 1000px) {
    body .tnk-bandeau__btn { min-width: 0; padding: 9px 14px; }
    body .tnk-bandeau__equipe { font-size: 1.1rem; }
    body .tnk-bandeau__equipe img { width: 40px; height: 40px; }
    body .tnk-bandeau__equipes { gap: 12px; }
}

/* Barre du haut sur petits téléphones : icônes plus compactes, pseudo remplacé par son initiale */
.navbar .username__init { display: none; }
@media (max-width: 520px) {
    body .navbar { padding-left: 10px; padding-right: 10px; }
    body .navbar .logo { height: 32px; }
    body .navbar-right { gap: 4px; }
    body .navbar .tnk-nav-icone, body .navbar .tnk-theme { width: 32px; height: 32px; margin-right: 0; font-size: 1.05rem; }
    body .navbar .tnk-nav-icone em { top: -5px; right: -5px; min-width: 16px; height: 16px; font-size: .62rem; line-height: 16px; }
    body .navbar .username { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; border-radius: 50%; border: 1px solid #daf37c; background: #daf37c; color: #0a0c0f; font: 800 .95rem 'Barlow', system-ui, sans-serif; }
    body .navbar .username__nom { display: none; }
    body .navbar .username__init { display: inline; }
    body .navbar .login-button { margin-left: 0; padding: 6px 8px; }
    body .navbar .tnk-nav-tdb { padding: 4px 7px; font-size: 18px; }
    body .navbar #buttonco i { font-size: 1.1rem; }
}
@media (max-width: 350px) {
    body .navbar .tnk-theme { display: none; }
}
@media (max-width: 700px) {
    .tnk-palm__titre { flex-wrap: wrap; }
    code { overflow-wrap: anywhere; word-break: break-word; }
}
