/* ══════════════════════════════════════════════════════════════════════════════
   Arsenal Productions TT5 — styles du site
   1. Structure FSE    2. Pages    3. Accueil    4. Pied de page
   5. Accessibilité    6. Surcharges Arsenal Opus    7. Page 404
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── 1. Structure FSE ──────────────────────────────────────────────────────── */

/* Lissage typographique (repris du thème TT4) */
body {
    -webkit-font-smoothing:  antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering:          optimizeLegibility;
}

/* Pas d'espace TT5 entre en-tête, contenu et pied de page */
.wp-site-blocks > main,
.wp-site-blocks > footer,
.wp-site-blocks > * + * { margin-block-start: 0; }

/* Pied de page collé en bas sur les pages courtes */
.wp-site-blocks {
    min-height:     100vh;
    display:        flex;
    flex-direction: column;
}
.wp-site-blocks > main { flex: 1 0 auto; }

/* ── 2. Pages (Films, Théâtre, boutique, panier, compte…) ─────────────────── */

/* Comme le thème TT4 : contenu à 100px du haut (64px d'en-tête fixe + 36px), 50px avant le pied */
.aps-main--page {
    --aps-main-offset: 36px;  /* ajouté aux 64px de l'en-tête fixe (header.css) */
    padding-top:       36px;
    padding-bottom:    50px;
}
.aps-main--page h1 {
    margin-top:    0;
    margin-bottom: 30px;
}

.aps-date {
    font-size: 15px;
    color:     var(--wp--preset--color--accent-2);
}

/* Fiches film / spectacle : Opus gère tout, en pleine largeur, sous l'en-tête fixe */
.aps-main--fiche > * { margin: 0; }

/* ── 3. Accueil : image plein écran et texte de présentation ──────────────── */
/* (repris d'opus-arsenal ; l'image est réglée dans le bloc Groupe « hero » de la page) */

.hero {
    background-image: url('/wp-content/uploads/2016/11/fond-venise-1920.jpg');
    background-size:  cover;
    min-height:       100vh;
    display:          flex;
    flex-direction:   column;
    justify-content:  center;
    align-items:      flex-start;
    color:            #ffffff;
}
.hero .slogan {
    width:  50%;
    margin: 0 !important;
}
@media (max-width: 782px) {
    .hero .slogan { width: auto; }
}
.aps-main--accueil .wp-block-post-content > * { margin-block-start: 0; }

/* ── 4. Pied de page ───────────────────────────────────────────────────────── */

.aps-footer__bas {
    display:         flex;
    justify-content: space-between;
    gap:             1rem;
    padding:         20px 5%;
    background:      var(--wp--preset--color--contrast);
    color:           #ffffff;
}
.aps-footer__bas p {
    margin:    0;
    font-size: 0.8rem;
}
.aps-footer__bas a {
    color:           #ffffff;
    text-decoration: none;
}
.aps-footer__bas a:hover { text-decoration: underline; }

/* ── 5. Accessibilité : anneau de focus au clavier uniquement ──────────────── */

a, button, summary, input, textarea, select, .wp-block-button__link { outline: none; }
a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible,
.wp-block-button__link:focus-visible {
    outline:        2px solid var(--wp--preset--color--accent-1);
    outline-offset: 2px;
}
.ap-nav a:focus-visible, .ap-nav button:focus-visible,
.aps-footer a:focus-visible {
    outline-color: #ffffff;
}

/* ── 6. Surcharges Arsenal Opus (ex-plugin opus-arsenal) ───────────────────── */

/* Paragraphes des pages Opus : espacement de Divi (comme lmformentin.com).
   :where() garde la règle faible : les règles de classe d'Opus gardent la priorité. */
:where(.apf) p {
    margin-top:     0;
    margin-bottom:  0;
    padding-bottom: 1em;
}
:where(.apf) p:last-of-type { padding-bottom: 0; }

/* ── 7. Page 404 « hors champ. » ──────────────────────────────────────────── */

.aps-404 { min-height: 60vh; }
.aps-404 .aps-404__surtitre {
    margin:         0 0 16px;
    font-size:      11px;
    font-weight:    500;
    text-transform: uppercase;
    letter-spacing: .18em;
    color:          var(--wp--preset--color--accent-1);
}
.aps-404 h1.aps-404__titre {
    margin-block-start: 0;
    font-size:          clamp(44px, 6vw, 86px);
    line-height:        1.05;
}
.aps-404 .aps-404__texte {
    margin-block-start: 24px;
    font-family:        var(--wp--preset--font-family--fraunces);
    font-size:          clamp(20px, 2.2vw, 25px);
    font-weight:        300;
}
.aps-404 .aps-404__liens {
    list-style: none;
    margin:     40px 0 0;
    padding:    0;
    display:    flex;
    flex-wrap:  wrap;
    gap:        12px 32px;
}
.aps-404__liens a {
    font-size:       15px;
    font-weight:     500;
    letter-spacing:  .02em;
    color:           var(--wp--preset--color--contrast);
    text-decoration: none;
    border-bottom:   1px solid currentColor;
    padding-bottom:  2px;
    transition:      color .2s;
}
.aps-404__liens a::after { content: ' →'; }
.aps-404__liens a:hover  { color: var(--wp--preset--color--accent-1); }

/* Ancres (#…) : ne pas arriver sous l'en-tête fixe */
html { scroll-padding-top: 90px; }

/* Barre d'administration : icône du site à sa taille normale.
   WooCommerce ajoute la classe « woocommerce » sur <body> partout et applique
   « .woocommerce img { height: auto; max-width: 100% } », qui fait grandir l'icône. */
#wpadminbar #wp-admin-bar-root-default img {
    width:      20px !important;
    height:     20px !important;
    max-width:  none !important;
    max-height: 20px !important;
    display:        inline-block !important;
    vertical-align: middle !important;
    margin:         -2px 6px 0 0 !important;
}