/* ══════════════════════════════════════════════════════════════════════════════
   Arsenal Productions — En-tête (logo, recherche en direct, menu burger)
   Repris du thème TT4 (css/menu.css), même en-tête que lmformentin.com ;
   l'en-tête est la template part <header class="aps-header">.
   ══════════════════════════════════════════════════════════════════════════════ */

:root {
    --aph-h:       64px;
    --aph-blanc:   #ffffff;
    --aph-noir:    #0d0d0d;
    --aph-panneau: #111111;
    --aph-accent:  #c0392b;
    --aph-sans:    'DM Sans', system-ui, sans-serif;
    --aph-serif:   'Fraunces', Georgia, serif;
    --aph-ease:    .35s cubic-bezier(.4,0,.2,1);
}

/* ── Header fixe ──────────────────────────────────────────────────────────── */
.aps-header {
    position:      fixed !important;
    top:           0;
    left:          0 !important;
    right:         0 !important;
    z-index:       9000 !important;
    height:        var(--aph-h) !important;
    overflow:      visible !important;
    background:    transparent !important;
    border-bottom: 1px solid transparent !important;
    transition:    background var(--aph-ease), border-color var(--aph-ease) !important;
}
.aps-header.is-solid,
body:not(.home):not(.single-film):not(.single-spectacle) .aps-header {
    background:          rgba(255,255,255,.97) !important;
    border-bottom-color: rgba(0,0,0,.08) !important;
    box-shadow:          0 1px 12px rgba(0,0,0,.06) !important;
}
body:not(.home):not(.single-film):not(.single-spectacle) .wp-site-blocks > main {
    /* + décalage propre au gabarit (--aps-main-offset, voir aps.css) */
    padding-top: calc(var(--aph-h) + var(--aps-main-offset, 0px)) !important;
}

/* ── Contenu header ───────────────────────────────────────────────────────── */
.ap-header__inner {
    max-width:       1400px;
    margin:          0 auto;
    height:          var(--aph-h);
    padding:         0 clamp(20px, 4vw, 48px);
    display:         flex;
    align-items:     center;
    justify-content: space-between;
}
.ap-header__actions {
    display:     flex;
    align-items: center;
    gap:         20px;
}

/* Logo */
.ap-header__logo {
    font-family:     var(--aph-serif);
    font-size:       15px;
    font-weight:     300;
    letter-spacing:  .04em;
    text-decoration: none;
    color:           var(--aph-blanc);
    transition:      color var(--aph-ease);
    white-space:     nowrap;
}
.aps-header.is-solid .ap-header__logo,
body:not(.home):not(.single-film):not(.single-spectacle) .ap-header__logo {
    color: var(--aph-noir);
}

/* ── Loupe ────────────────────────────────────────────────────────────────── */
.ap-search__toggle {
    background:  none;
    border:      none;
    cursor:      pointer;
    color:       var(--aph-blanc);
    padding:     4px;
    display:     flex;
    align-items: center;
    transition:  color var(--aph-ease), opacity .2s;
    opacity:     .85;
}
.ap-search__toggle:hover { opacity: 1; }
.aps-header.is-solid .ap-search__toggle,
body:not(.home):not(.single-film):not(.single-spectacle) .ap-search__toggle {
    color: var(--aph-noir);
}
.ap-search__toggle:focus:not(:focus-visible) { outline: none; }

/* ── Barre de recherche ───────────────────────────────────────────────────── */
.ap-search {
    position:   fixed;
    top:        calc(var(--aph-h) + 12px);
    right:      clamp(20px, 4vw, 48px);
    left:       auto;
    width:      min(480px, calc(100vw - 40px));
    z-index:    8999;
    /* background: #ffffff; */
    background: rgba(255, 255, 255, 0.75);
    border:     1px solid rgba(0,0,0,.1);
    border-radius: 6px;
    box-shadow: 0 8px 32px rgba(0,0,0,.12);
    transform:  translateY(-8px);
    opacity:    0;
    pointer-events: none;
    transition: transform var(--aph-ease), opacity var(--aph-ease);
}
.ap-search.is-open {
    transform:      translateY(0);
    opacity:        1;
    pointer-events: auto;
}
.ap-search__inner {
    padding:     12px 16px;
    display:     flex;
    align-items: center;
    gap:         10px;
    border-bottom: 1px solid rgba(0,0,0,.06);
}
.ap-search__input {
    flex:        1;
    border:      none;
    outline:     none;
    background:  transparent;
    font-family: var(--aph-sans);
    font-size:   15px;
    font-weight: 300;
    color:       var(--aph-noir);
    padding:     4px 0;
}
.ap-search__results {
    padding: 8px 16px 12px;
}

/* Blanc 100% quand il y a des résultats */
.ap-search.has-data {
    background: #ffffff !important;
}
.ap-search.has-data .ap-search__input {
    background-color: transparent !important;
}

.ap-search__input {
    flex:        1;
    border:      none;
    outline:     none;
    /* background:  transparent; */
    background-color: rgba(255, 255, 255, 0.25)!important;
    font-family: var(--aph-sans);
    font-size:   16px;
    font-weight: 300;
    color:       var(--aph-noir);
    padding:     0;
    font-size: 14px;
    padding: 5px!important;
    border-radius: 3px;
}
.ap-search__input::placeholder { color: rgba(0,0,0,.3); }
.ap-search__close {
    background:  none;
    border:      none;
    cursor:      pointer;
    color:       rgba(0,0,0,.4);
    padding:     4px;
    display:     flex;
    align-items: center;
    transition:  color .15s;
    flex-shrink: 0;
}
.ap-search__close:hover { color: var(--aph-noir); }
.ap-search__close:focus:not(:focus-visible) { outline: none; }

/* ── Résultats ────────────────────────────────────────────────────────────── */
.ap-search__results {
    max-width:  1400px;
    margin:     0 auto;
    padding: 10px 0; /* 1. On garde le padding haut/bas mais on met 0 sur les côtés */
    display:    none;
}
.ap-search__results.has-results { display: block; }

.ap-search__group-title {
    font-family:    var(--aph-sans);
    font-size:      10px;
    font-weight:    500;
    text-transform: uppercase;
    letter-spacing: .18em;
    color:          rgba(0,0,0,.3);
    padding:        12px 0 6px;
    border-top:     1px solid rgba(0,0,0,.06);
    margin-top:     4px;
  margin-left:19px;
}
.ap-search__group-title:first-child { border-top: none; margin-top: 0; }

.ap-search__item {
    display:         block;
    padding: 12px clamp(20px, 4vw, 48px); /* 2. On remet ici le padding que vous aviez sur le conteneur */
    font-family:     var(--aph-sans);
    font-size:       14px;
    font-weight:     300;
    color:           var(--aph-noir);
    text-decoration: none;
    /* border-bottom:   1px solid rgba(0,0,0,.04); */
    border-bottom: none;
    transition:      color .15s, padding-left .15s;
}
.ap-search__item:last-child { border-bottom: none; }

.ap-search__item:hover, /* 3. On donne au survol clavier le même aspect que le survol souris */
.ap-search__item.is-selected {
    /* color:        var(--aph-accent); */
    background-color: #f0f0f0;
    outline: none;
    padding-left: calc(clamp(20px, 4vw, 48px) + 6px); /* 4. On utilise calc() pour ajouter 6px au padding existant */
    transition: padding-left 0.2s ease, background-color 0.2s ease; /* 5. */
}

.ap-search__item mark {
    background:  transparent;
    color:       var(--aph-accent);
    font-weight: 500;
}
.ap-search__empty {
    font-family:  var(--aph-sans);
    font-size:    13px;
    font-weight:  300;
    color:        rgba(0,0,0,.4);
    font-style:   italic;
    padding:      12px 0;
}

/* ── Burger ───────────────────────────────────────────────────────────────── */
.ap-header__burger {
    display:     flex;
    align-items: center;
    gap:         10px;
    background:  none;
    border:      none;
    cursor:      pointer;
    padding:     8px 0;
    color:       var(--aph-blanc);
    transition:  color var(--aph-ease);
}
.aps-header.is-solid .ap-header__burger,
body:not(.home):not(.single-film):not(.single-spectacle) .ap-header__burger {
    color: var(--aph-noir);
}
.ap-header__burger:focus-visible {
    outline:        2px solid var(--aph-accent);
    outline-offset: 4px;
    border-radius:  2px;
}
.ap-header__burger:focus:not(:focus-visible) { outline: none; }
.ap-burger__barres {
    display:        flex;
    flex-direction: column;
    gap:            5px;
    width:          22px;
}
.ap-burger__bar {
    display:    block;
    width:      22px;
    height:     1.5px;
    background: currentColor;
    transition: transform .3s, opacity .3s;
}
.ap-header__burger[aria-expanded="true"] .ap-burger__bar:nth-child(1) {
    transform: translateY(3.25px) rotate(45deg);
}
.ap-header__burger[aria-expanded="true"] .ap-burger__bar:nth-child(2) {
    transform: translateY(-3.25px) rotate(-45deg);
}
.ap-burger__label {
    font-family:    var(--aph-sans);
    font-size:      11px;
    font-weight:    500;
    text-transform: uppercase;
    letter-spacing: .14em;
}

/* ── Panneau nav ──────────────────────────────────────────────────────────── */
.ap-nav {
    position:        fixed;
    top: 0; left: 0;
    width:           min(380px, 85vw);
    height:          100dvh;
    background:      var(--aph-panneau);
    z-index:         9100;
    display:         flex;
    flex-direction:  column;
    justify-content: center;
    padding:         var(--aph-h) 48px 48px;
    transform:       translateX(-100%);
    transition:      transform var(--aph-ease);
    overflow-y:      auto;
}
.ap-nav.is-open { transform: translateX(0); }
.ap-nav__close {
    position:        absolute;
    top: 18px; right: 18px;
    width: 40px; height: 40px;
    background: none; border: none;
    cursor:          pointer;
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    justify-content: center;
    opacity: .5;
    transition: opacity .2s;
}
.ap-nav__close:hover { opacity: 1; }
.ap-nav__close span {
    display:    block;
    width:      18px;
    height:     1px;
    background: var(--aph-blanc);
}
.ap-nav__close span:first-child { transform: rotate(45deg); margin-bottom: -1px; }
.ap-nav__close span:last-child  { transform: rotate(-45deg); }
.ap-nav__liste {
    list-style: none;
    margin: 0; padding: 0;
    display:        flex;
    flex-direction: column;
    gap:            4px;
}
.ap-nav__lien {
    display:         block;
    font-family:     var(--aph-serif);
    font-size:       clamp(28px, 5vw, 40px);
    font-weight:     300;
    line-height:     1.2;
    color:           rgba(255,255,255,.85);
    text-decoration: none;
    padding:         10px 0;
    border-bottom:   1px solid rgba(255,255,255,.06);
    transition:      color .2s, padding-left .2s;
    letter-spacing:  -.01em;
}
.ap-nav__lien:hover { color: var(--aph-blanc); padding-left: 8px; }
.ap-nav__lien--ext::after {
    content:        ' ↗';
    font-size:      .6em;
    opacity:        .5;
    vertical-align: super;
}
.ap-nav__lien--email {
    font-family:  var(--aph-sans);
    font-size:    14px;
    font-weight:  300;
    letter-spacing: .04em;
    color:        rgba(255,255,255,.4);
    border-bottom: none;
    padding-top:  24px;
}
.ap-nav__lien--email:hover { color: rgba(255,255,255,.7); padding-left: 0; }
.ap-nav__footer {
    margin-top:     auto;
    padding-top:    32px;
    font-family:    var(--aph-sans);
    font-size:      11px;
    color:          rgba(255,255,255,.25);
    letter-spacing: .08em;
}
@media (max-width: 768px) {
    .ap-nav__lien--ext::after { display: none; }
}

/* ── Overlay nav ──────────────────────────────────────────────────────────── */
.ap-nav__overlay {
    position:        fixed;
    inset:           0;
    z-index:         9050;
    background:      rgba(0,0,0,.6);
    opacity:         0;
    pointer-events:  none;
    transition:      opacity var(--aph-ease);
    backdrop-filter: blur(2px);
}
.ap-nav__overlay.is-visible { opacity: 1; pointer-events: auto; }

/* ══════════════════════════════════════════════════════════════════════════════
   Ajustements FSE
   ══════════════════════════════════════════════════════════════════════════════ */

/* Barre d'administration */
.admin-bar .aps-header { top: 32px !important; }
@media screen and (max-width: 782px) {
    .admin-bar .aps-header { top: 46px !important; }
}

/* Le pied de page du panneau : <p> sans marge par défaut du thème */
.ap-nav__footer p { margin: 0; }

/* Fiche sans photo d'en-tête (classe no-hero, functions.php) : en-tête opaque d'emblée.
   Arsenal Opus le prévoit pour l'en-tête Divi ; ici, même règle pour l'en-tête FSE. */
body.single-film.no-hero .aps-header,
body.single-spectacle.no-hero .aps-header {
    background:          rgba(255,255,255,.97) !important;
    border-bottom-color: rgba(0,0,0,.08) !important;
}

/* Croix et éléments du panneau focalisés par script à l'ouverture :
   anneau seulement en navigation clavier (classe posée par header.js) */
html:not(.aps-clavier) .ap-nav__close:focus-visible,
html:not(.aps-clavier) .ap-header__burger:focus-visible,
html:not(.aps-clavier) .ap-search__input:focus-visible {
    outline: none;
}