/* AyarLine unified mobile controls — v5.0.24
   Menu open, menu close and theme toggle share one visual language in both themes.
   Open state only changes placement and which icon is visible. */
@media(max-width:767px){
  .ayar-pixel-root{
    --ayar-mobile-control-size:10.5vw;
    --ayar-mobile-control-radius:50%;
    --ayar-mobile-control-bg:rgba(247,245,240,.72);
    --ayar-mobile-control-border:rgba(32,32,32,.08);
    --ayar-mobile-control-color:#202020;
    --ayar-mobile-control-shadow:0 1.1vw 2.8vw rgba(32,32,32,.09);
    --ayar-mobile-control-hover-bg:rgba(239,178,26,.10);
    --ayar-mobile-control-hover-border:rgba(239,178,26,.28);
    --ayar-mobile-control-hover-shadow:0 1.2vw 3vw rgba(32,32,32,.11);
  }

  html[data-ayar-theme="dark"] .ayar-pixel-root{
    --ayar-mobile-control-bg:rgba(30,29,25,.76);
    --ayar-mobile-control-border:rgba(255,255,255,.11);
    --ayar-mobile-control-color:var(--ayar-dark-text,#f7f3ec);
    --ayar-mobile-control-shadow:0 1.3vw 3.8vw rgba(0,0,0,.24);
    --ayar-mobile-control-hover-bg:rgba(38,36,31,.88);
    --ayar-mobile-control-hover-border:rgba(255,255,255,.16);
    --ayar-mobile-control-hover-shadow:0 1.4vw 4vw rgba(0,0,0,.28);
  }

  /* Shared appearance for Menu/Close and Theme toggle, closed or open. */
  .ayar-pixel-root .mobile-header .mobile-menu-toggle,
  .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile,
  .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle,
  .ayar-pixel-root .mobile-header.is-stuck .ayar-theme-toggle-mobile,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle[aria-expanded="true"],
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle[aria-expanded="true"],
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .ayar-theme-toggle-mobile{
    width:var(--ayar-mobile-control-size)!important;
    height:var(--ayar-mobile-control-size)!important;
    padding:0!important;
    border:1px solid var(--ayar-mobile-control-border)!important;
    border-radius:var(--ayar-mobile-control-radius)!important;
    background:var(--ayar-mobile-control-bg)!important;
    background-color:var(--ayar-mobile-control-bg)!important;
    color:var(--ayar-mobile-control-color)!important;
    box-shadow:var(--ayar-mobile-control-shadow)!important;
    -webkit-backdrop-filter:blur(10px)!important;
    backdrop-filter:blur(10px)!important;
  }

  /* Force every actual glyph to inherit the exact same color. */
  .ayar-pixel-root .mobile-header .mobile-menu-toggle>.mobile-menu-open-icon,
  .ayar-pixel-root .mobile-header .mobile-menu-toggle>.mobile-menu-close-icon,
  .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile .ayar-theme-fa,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle>.mobile-menu-open-icon,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle>.mobile-menu-close-icon,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile .ayar-theme-fa,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-toggle[aria-expanded="true"]>.mobile-menu-close-icon{
    color:var(--ayar-mobile-control-color)!important;
  }

  /* Hover/focus is identical across all four semantic button states. */
  .ayar-pixel-root .mobile-header .mobile-menu-toggle:hover,
  .ayar-pixel-root .mobile-header .mobile-menu-toggle:focus-visible,
  .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:hover,
  .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:focus-visible{
    background:var(--ayar-mobile-control-hover-bg)!important;
    background-color:var(--ayar-mobile-control-hover-bg)!important;
    border-color:var(--ayar-mobile-control-hover-border)!important;
    color:var(--ayar-mobile-control-color)!important;
    box-shadow:var(--ayar-mobile-control-hover-shadow)!important;
  }

  /* Open menu placement: both buttons remain on one fixed row. */
  html.ayar-mobile-menu-open{
    --ayar-mobile-open-control-top:17.2vw;
    --ayar-mobile-open-close-right:8.25vw;
    --ayar-mobile-open-control-gap:2.75vw;
  }
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle[aria-expanded="true"],
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle[aria-expanded="true"]{
    position:fixed!important;
    top:var(--ayar-mobile-open-control-top)!important;
    right:var(--ayar-mobile-open-close-right)!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    z-index:134!important;
  }
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .ayar-theme-toggle-mobile{
    position:fixed!important;
    top:var(--ayar-mobile-open-control-top)!important;
    right:calc(var(--ayar-mobile-open-close-right) + var(--ayar-mobile-control-size) + var(--ayar-mobile-open-control-gap))!important;
    left:auto!important;
    margin:0!important;
    opacity:1!important;
    transform:none!important;
    z-index:133!important;
  }

  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle:hover,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle:focus-visible,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:hover,
  html.ayar-mobile-menu-open .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:focus-visible{
    transform:none!important;
  }

  /* Keep the brand logo transparent in dark mobile menu. */
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo:hover,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo:focus,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo:focus-visible,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo img{
    background:transparent!important;
    background-color:transparent!important;
    border:0!important;
    box-shadow:none!important;
    outline:none!important;
  }
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo::before,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-menu-panel .mobile-menu-brand-logo::after{
    content:none!important;
    display:none!important;
  }
}

/* Dark-mode specificity guard: neutralize legacy yellow expanded-state rules. */
@media(max-width:767px){
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header.is-stuck .ayar-theme-toggle-mobile,
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle[aria-expanded="true"],
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile,
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle[aria-expanded="true"],
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .ayar-theme-toggle-mobile{
    background:var(--ayar-mobile-control-bg)!important;
    background-color:var(--ayar-mobile-control-bg)!important;
    border-color:var(--ayar-mobile-control-border)!important;
    color:var(--ayar-mobile-control-color)!important;
    box-shadow:var(--ayar-mobile-control-shadow)!important;
  }

  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle[aria-expanded="true"]>.mobile-menu-close-icon,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle:not([aria-expanded="true"])>.mobile-menu-open-icon,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile .ayar-theme-fa{
    color:var(--ayar-mobile-control-color)!important;
  }

  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle:hover,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .mobile-menu-toggle:focus-visible,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:hover,
  html[data-ayar-theme="dark"] .ayar-pixel-root .mobile-header .ayar-theme-toggle-mobile:focus-visible{
    background:var(--ayar-mobile-control-hover-bg)!important;
    background-color:var(--ayar-mobile-control-hover-bg)!important;
    border-color:var(--ayar-mobile-control-hover-border)!important;
    color:var(--ayar-mobile-control-color)!important;
    box-shadow:var(--ayar-mobile-control-hover-shadow)!important;
  }
}

/* v5.0.25 — final dark close color guard. */
@media(max-width:767px){
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header .mobile-menu-toggle[aria-expanded="true"]>.mobile-menu-close-icon,
  html[data-ayar-theme="dark"].ayar-mobile-menu-open .ayar-pixel-root .mobile-header.is-stuck .mobile-menu-toggle[aria-expanded="true"]>.mobile-menu-close-icon{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
  }
}
