/*
Theme Name: Hello Owim
Template: hello-elementor
Description: Thème enfant Owim Boé Couverture : en-tête et pied de page Elementor globaux, menu par shortcode, design system ob-*, JSON-LD par page.
Version: 1.0.3
Author: PumpUp
Text Domain: hello-owim
*/

/* Les ancres ne passent pas sous l'en-tête collant */
html { scroll-padding-top: 112px; }
.admin-bar { scroll-padding-top: 144px; }

/* Logo d'en-tête : le widget Image prend sinon la largeur native du PNG (896 px) */
.ob-site-header .elementor-widget-image { flex: 0 0 auto; width: auto; max-width: 60vw; }
.ob-site-header .elementor-widget-image img { width: auto; height: 34px; max-width: 100%; object-fit: contain; }
@media (min-width: 1025px) { .ob-site-header .elementor-widget-image img { height: 40px; } }
.ob-site-header .ob-header-menu { min-width: 0; }
@media (max-width: 479px) {
  .ob-site-header .elementor-widget-image img { height: 30px; }
  .ob-nav-toggle__btn { width: 48px; padding: 0; justify-content: center; }
  .ob-nav-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* En-tête collant */
.ob-site-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .ob-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ob-site-header { top: 0; } }

/* Menu [owim_menu] : balisage WordPress (ul.ob-menu > li.menu-item) */
.ob-nav-toggle { position: static; }
.ob-nav-toggle__btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 18px;
  border: 2px solid var(--ob-brand, #314631); border-radius: 999px; cursor: pointer; list-style: none;
  font: 600 15px/20px var(--ob-font-body, sans-serif); color: var(--ob-brand, #314631); background: transparent;
}
.ob-nav-toggle__btn::-webkit-details-marker { display: none; }
.ob-nav-toggle__bars, .ob-nav-toggle__bars::before, .ob-nav-toggle__bars::after {
  display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative; content: "";
}
.ob-nav-toggle__bars::before { position: absolute; top: -6px; }
.ob-nav-toggle__bars::after { position: absolute; top: 6px; }
.ob-nav-toggle[open] .ob-nav-toggle__bars { background: transparent; }
.ob-nav-toggle[open] .ob-nav-toggle__bars::before { top: 0; transform: rotate(45deg); }
.ob-nav-toggle[open] .ob-nav-toggle__bars::after { top: 0; transform: rotate(-45deg); }
.ob-nav-toggle__btn:focus-visible { outline: 3px solid var(--ob-focus, #314631); outline-offset: 3px; }

.ob-nav-toggle > .ob-nav {
  display: block; position: absolute; left: 0; right: 0; top: 100%;
  max-height: calc(100dvh - 80px); overflow-y: auto;
  padding: 8px var(--ob-gutter, 16px) 24px; background: var(--ob-surface, #f9f5f2);
  border-top: 1px solid var(--ob-border, #e3d9cf); box-shadow: 0 12px 24px rgba(28, 42, 30, .12);
}
.ob-menu, .ob-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.ob-menu > li { border-bottom: 1px solid var(--ob-border, #e3d9cf); }
.ob-menu a {
  display: flex; align-items: center; min-height: 48px; padding: 0 4px;
  font: 600 16px/22px var(--ob-font-body, sans-serif); color: var(--ob-ink, #1c2a1e); text-decoration: none;
}
.ob-menu a:hover, .ob-menu .current-menu-item > a, .ob-menu .current-menu-ancestor > a {
  color: var(--ob-brand, #314631); text-decoration: underline; text-underline-offset: 6px;
}
.ob-menu .sub-menu { padding: 0 0 12px 16px; }
.ob-menu .sub-menu a { min-height: 44px; font-weight: 400; }
.ob-menu .sub-menu .sub-menu { padding-bottom: 0; }

@media (min-width: 1025px) {
  .ob-nav-toggle__btn { display: none; }
  .ob-nav-toggle > .ob-nav { position: static; padding: 0; background: none; border: 0; box-shadow: none; max-height: none; overflow: visible; }
  .ob-menu { display: flex; align-items: center; gap: 4px; }
  .ob-menu > li { position: relative; border: 0; }
  .ob-menu > li > a { padding: 0 12px; }
  .ob-menu > li.menu-item-has-children > a::after {
    content: ""; width: 7px; height: 7px; margin-left: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg);
  }
  .ob-menu > li > .sub-menu {
    position: absolute; top: 100%; left: 0; min-width: 260px; padding: 8px;
    background: var(--ob-surface-raised, #fff); border: 1px solid var(--ob-border, #e3d9cf); border-radius: 14px;
    box-shadow: 0 12px 24px rgba(28, 42, 30, .12); visibility: hidden; opacity: 0; transform: translateY(4px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
  }
  .ob-menu > li:hover > .sub-menu, .ob-menu > li:focus-within > .sub-menu { visibility: visible; opacity: 1; transform: none; }
  .ob-menu .sub-menu a { padding: 0 12px; border-radius: 8px; }
  .ob-menu .sub-menu a:hover { background: var(--ob-surface-sunken, #f0e9e2); }
  .ob-menu .sub-menu .sub-menu { padding-left: 12px; }
}

/* Repères de relecture : à retirer avant publication */
.ob-todo { background: var(--ob-sage-tint, #dfe5b4); outline: 1px dashed var(--ob-border-strong, #7c8574); padding: 0 4px; border-radius: 4px; }