/*
 * Radio Poitou 1.0 — layout stability layer.
 * Loaded last on purpose: one source of truth for viewport overflow,
 * responsive header and persistent player sizing.
 */

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip !important;
}

@supports not (overflow: clip) {
  html,
  body { overflow-x: hidden !important; }
}

.via-site,
.site-main,
.site-footer,
.site-header,
.radio-player {
  width: 100%;
  max-width: 100%;
}

.shell {
  width: min(1440px, calc(100% - 56px));
  max-width: 100%;
}

img,
video,
iframe,
svg {
  max-width: 100%;
}

/* Never let the fixed player create a wider layout than the viewport. */
.radio-player {
  left: 0 !important;
  right: 0 !important;
  inset-inline: 0 !important;
  margin: 0 !important;
  overflow: hidden;
  box-sizing: border-box;
}

.radio-player__inner {
  width: 100% !important;
  max-width: 1600px !important;
  margin-inline: auto !important;
  padding-inline: 17px;
  box-sizing: border-box;
  min-width: 0;
}

.radio-player__inner > * {
  min-width: 0;
}

/* Tablet/mobile header: fixed two-column grid. The actions are always in
   normal layout flow; logo intrinsic width can never push them off-screen. */
@media (max-width: 1024px) {
  :root { --via-header: 72px; }

  .via-site {
    padding-top: var(--via-header) !important;
  }

  .site-header {
    position: fixed !important;
    z-index: 10050 !important;
    top: 0;
    left: 0 !important;
    right: 0 !important;
    height: var(--via-header) !important;
    min-height: var(--via-header) !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background: color-mix(in srgb,var(--via-bg) 94%,transparent) !important;
    border-bottom: 1px solid var(--via-soft-line) !important;
    backdrop-filter: blur(18px) saturate(145%);
    -webkit-backdrop-filter: blur(18px) saturate(145%);
  }

  .site-header__inner.shell {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 clamp(10px, 2.4vw, 22px) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .site-header .brand {
    position: static !important;
    display: flex !important;
    grid-column: 1 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .site-header .brand img {
    display: block !important;
    width: var(--via-logo-width, 168px) !important;
    max-width: 100% !important;
    max-height: calc(var(--via-header) - 16px) !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: none !important;
    transform-origin: left center !important;
  }

  .site-header .header-actions {
    position: static !important;
    grid-column: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  .site-header .header-actions .live-pill {
    display: inline-flex !important;
    position: static !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .site-header .header-actions .menu-toggle {
    display: flex !important;
    position: relative !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: 92px !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 3px 4px 3px 13px !important;
    gap: 8px !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  .site-header .header-actions .menu-toggle__label {
    display: inline-block !important;
  }

  .site-header .header-actions .menu-toggle__disc {
    display: grid !important;
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 40px !important;
  }

  .site-header .header-actions .menu-toggle__line,
  .site-header .header-actions .live-dot {
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.admin-bar .site-header { top: 32px !important; }
  body.radio-player-top .site-header { top: var(--via-player) !important; }
  body.admin-bar.radio-player-top .site-header { top: calc(32px + var(--via-player)) !important; }
}

@media (max-width: 782px) {
  body.admin-bar .site-header { top: 46px !important; }
  body.admin-bar.radio-player-top .site-header { top: calc(46px + var(--via-player)) !important; }
}

@media (max-width: 720px) {
  .site-header__inner.shell {
    gap: 7px !important;
    padding-inline: 9px !important;
  }

  .site-header .header-actions { gap: 6px !important; }

  .site-header .header-actions .live-pill {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
  }

  .site-header .header-actions .live-pill [data-radio-live-label] {
    display: none !important;
  }

  .site-header .header-actions .menu-toggle {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    padding: 3px !important;
    justify-content: center !important;
  }

  .site-header .header-actions .menu-toggle__label {
    display: none !important;
  }

  .site-header .header-actions .menu-toggle__disc {
    flex-basis: 38px !important;
    width: 38px !important;
    height: 38px !important;
  }
}

/* Mobile player: no viewport-width math; the bar owns 100% of its fixed
   containing block and has enough vertical breathing room. */
@media (max-width: 820px) {
  :root { --via-player: 96px; }

  body.has-radio-player:not(.radio-player-top) {
    padding-bottom: calc(var(--via-player) + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player:not(.radio-player--top) {
    height: calc(var(--via-player) + env(safe-area-inset-bottom, 0px)) !important;
    padding: 11px 0 calc(11px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player--top {
    height: var(--via-player) !important;
    padding-block: 11px !important;
  }

  .radio-player__inner {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding-inline: 14px !important;
    display: grid !important;
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    overflow: hidden !important;
  }

  .player-play {
    flex: 0 0 auto;
    width: 50px !important;
    height: 50px !important;
  }

  .player-artwork {
    width: 48px !important;
    height: 48px !important;
  }

  .player-meta {
    min-width: 0 !important;
    overflow: hidden !important;
    align-content: center !important;
  }

  .player-meta strong,
  .player-meta > span,
  .player-station {
    max-width: 100% !important;
  }

  .player-visualizer,
  .player-volume,
  .player-live-return {
    display: none !important;
  }
}

@media (max-width: 560px) {
  :root { --via-player: 104px; }

  .shell {
    width: calc(100% - 20px);
  }

  .radio-player:not(.radio-player--top) {
    padding: 13px 0 calc(13px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player--top { padding-block: 13px !important; }

  .radio-player__inner {
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 12px !important;
    padding-inline: 12px !important;
  }

  .player-artwork { display: none !important; }
  .player-play { width: 52px !important; height: 52px !important; }
  .player-meta strong { font-size: .88rem !important; line-height: 1.28 !important; }
  .player-meta > span { line-height: 1.3 !important; }
}

/* ================================================================
   Radio Poitou 1.0 — responsive viewport final pass
   No fake top gap, no sideways reveal state, more player breathing room.
   ================================================================ */
:root {
  --via-admin-offset: 0px;
}

@media (max-width: 1024px) {
  /* The JS measures the real visible WP toolbar. If it is absent/hidden the
     value stays 0, so the header is physically flush with the viewport. */
  .site-header {
    top: var(--via-admin-offset, 0px) !important;
    inset-block-start: var(--via-admin-offset, 0px) !important;
    margin: 0 !important;
  }

  body.admin-bar .site-header {
    top: var(--via-admin-offset, 0px) !important;
    inset-block-start: var(--via-admin-offset, 0px) !important;
  }

  body.radio-player-top .site-header,
  body.admin-bar.radio-player-top .site-header {
    top: calc(var(--via-admin-offset, 0px) + var(--via-player)) !important;
    inset-block-start: calc(var(--via-admin-offset, 0px) + var(--via-player)) !important;
  }

  body.radio-player-top .radio-player--top,
  body.admin-bar.radio-player-top .radio-player--top {
    top: var(--via-admin-offset, 0px) !important;
  }

  /* Responsive content must never sit translated off-axis while GSAP/Barba
     finishes initialising. Left/right reveals remain desktop-only. */
  [data-reveal] {
    transform: none !important;
    translate: none !important;
    opacity: 1 !important;
    will-change: auto !important;
  }

  /* Give the persistent player real vertical and horizontal air on tablets. */
  :root { --via-player: 112px; }

  body.has-radio-player:not(.radio-player-top) {
    padding-bottom: calc(var(--via-player) + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player:not(.radio-player--top) {
    height: calc(var(--via-player) + env(safe-area-inset-bottom, 0px)) !important;
    padding-top: 16px !important;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player--top {
    height: var(--via-player) !important;
    padding-block: 16px !important;
  }

  .radio-player__inner {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: 100% !important;
    padding-inline: clamp(16px, 3vw, 28px) !important;
    gap: 14px !important;
    align-items: center !important;
  }

  .player-meta {
    min-width: 0 !important;
    padding-block: 6px !important;
    align-content: center !important;
  }

  .player-meta strong {
    line-height: 1.35 !important;
  }

  .player-meta > span,
  .player-station {
    line-height: 1.35 !important;
  }
}

@media (max-width: 560px) {
  :root { --via-player: 120px; }

  .radio-player:not(.radio-player--top) {
    padding-top: 18px !important;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .radio-player--top {
    padding-block: 18px !important;
  }

  .radio-player__inner {
    padding-inline: 16px !important;
    gap: 14px !important;
  }

  .player-meta {
    padding-block: 7px !important;
  }
}
\n\n/* ================================================================\n   Radio Poitou 1.0 — real mobile top edge\n   Never reserve WordPress toolbar space unless the toolbar actually\n   intersects the top of the visual viewport.\n   ================================================================ */\n@media (max-width: 1024px) {\n  .site-header,\n  body.admin-bar .site-header {\n    top: 0 !important;\n    inset-block-start: 0 !important;\n  }\n\n  html.via-visible-adminbar .site-header,\n  html.via-visible-adminbar body.admin-bar .site-header {\n    top: var(--via-admin-offset, 0px) !important;\n    inset-block-start: var(--via-admin-offset, 0px) !important;\n  }\n\n  body.radio-player-top .site-header,\n  body.admin-bar.radio-player-top .site-header {\n    top: var(--via-player) !important;\n    inset-block-start: var(--via-player) !important;\n  }\n\n  html.via-visible-adminbar body.radio-player-top .site-header,\n  html.via-visible-adminbar body.admin-bar.radio-player-top .site-header {\n    top: calc(var(--via-admin-offset, 0px) + var(--via-player)) !important;\n    inset-block-start: calc(var(--via-admin-offset, 0px) + var(--via-player)) !important;\n  }\n\n  .radio-player--top,\n  body.admin-bar .radio-player--top {\n    top: 0 !important;\n  }\n\n  html.via-visible-adminbar .radio-player--top,\n  html.via-visible-adminbar body.admin-bar .radio-player--top {\n    top: var(--via-admin-offset, 0px) !important;\n  }\n}\n
/* ================================================================
   Radio Poitou 1.0 — WPBakery TTA accordions / Contact
   Keep VC's white preset from punching white cards into the dark theme.
   ================================================================ */
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panels-container,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panels {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel {
  margin: 0 0 16px !important;
  overflow: hidden;
  border: 1px solid var(--via-line) !important;
  border-radius: 20px !important;
  background: color-mix(in srgb, var(--via-surface) 78%, transparent) !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.10) !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-heading,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion.vc_tta-color-white .vc_tta-panel-heading,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel.vc_active .vc_tta-panel-heading {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--via-surface-2) 82%, transparent) !important;
  color: var(--via-text) !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-title,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-title > a {
  color: var(--via-text) !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-title > a {
  display: flex !important;
  align-items: center;
  min-height: 64px;
  padding: 17px 22px !important;
  font-family: var(--via-font-head);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-controls-icon,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-controls-icon::before,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-controls-icon::after {
  border-color: currentColor !important;
  color: var(--via-accent-2) !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-body,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion.vc_tta-color-white .vc_tta-panel-body,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel.vc_active .vc_tta-panel-body {
  border: 0 !important;
  border-top: 1px solid var(--via-line) !important;
  border-radius: 0 !important;
  padding: clamp(20px, 3vw, 34px) !important;
  background: color-mix(in srgb, var(--via-bg) 68%, var(--via-surface)) !important;
  color: var(--via-text) !important;
}

.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-body > :first-child { margin-top: 0 !important; }
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-body > :last-child { margin-bottom: 0 !important; }

/* Formidable inside an accordion must inherit the panel, never a VC white fill. */
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .frm_forms,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .frm_forms fieldset,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .frm_form_fields,
.via-radio-theme .entry-content .vc_tta.vc_tta-accordion .frm_fields_container {
  color: var(--via-text) !important;
}

@media (max-width: 720px) {
  .via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-title > a {
    min-height: 58px;
    padding: 15px 17px !important;
  }

  .via-radio-theme .entry-content .vc_tta.vc_tta-accordion .vc_tta-panel-body {
    padding: 18px 15px !important;
  }
}

/* ================================================================
   Radio Poitou 1.0 — desktop header logo: absolute, option size respected
   The Themeplify logo width must be visible as entered and must not resize
   the header or push the header actions. Header only; footer is untouched.
   ================================================================ */
@media (min-width: 1025px) {
  .site-header__inner.shell {
    position: relative !important;
    overflow: visible !important;
  }

  .site-header .brand,
  body.is-menu-open .site-header .brand {
    position: absolute !important;
    z-index: 6 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter: none !important;
  }

  .site-header .brand img,
  body.is-menu-open .site-header .brand img {
    display: block !important;
    width: var(--via-logo-width, 168px) !important;
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: none !important;
  }

  /* Logo is out of flow: right-side controls keep their own geometry. */
  .site-header .header-actions {
    position: relative !important;
    z-index: 8 !important;
  }
}

/* ================================================================
   Radio Poitou 1.0 — desktop header logo: keep the complete image visible
   Large logos are anchored to the top of the header instead of vertically
   centered inside the fixed header height. They may overlap the hero below,
   but never extend above the viewport and get cropped.
   ================================================================ */
@media (min-width: 1025px) {
  .site-header,
  body.is-menu-open .site-header {
    overflow: visible !important;
  }

  .site-header .brand,
  body.is-menu-open .site-header .brand {
    top: 0 !important;
    bottom: auto !important;
    height: auto !important;
    min-height: 0 !important;
    align-items: flex-start !important;
  }

  .site-header .brand img,
  body.is-menu-open .site-header .brand img {
    width: var(--via-logo-width, 168px) !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: left top !important;
  }
}