/* === Expandable Search – Core + Woo (v7.3) === */
:root { --es-icon-color: #111; }

/* Prevent label intercepting clicks */
.wp-block-search.is-style-expandable-menu .wp-block-search__label{ display:none !important; pointer-events:none !important; }

/* Core container */
.wp-block-search.is-style-expandable-menu{ display:flex; align-items:center; gap:.4rem; margin-left:.5rem; position:relative; z-index:3; }

/* Opener (left) */
.wp-block-search.is-style-expandable-menu .es-toggle{
  appearance:none; border:0; background:transparent; padding:8px; border-radius:8px;
  cursor:pointer; line-height:0; display:inline-flex; color:var(--es-icon-color);
}
.wp-block-search.is-style-expandable-menu .es-toggle:hover{ background:rgba(0,0,0,.06); }
.wp-block-search.is-style-expandable-menu .es-toggle::before{
  content:""; width:20px; height:20px; display:block; background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
  margin:auto;
}
/* Hide opener while open */
.wp-block-search.is-style-expandable-menu.es-open .es-toggle,
.wp-block-search.is-style-expandable-menu .es-toggle[hidden]{ display:none !important; visibility:hidden !important; opacity:0 !important; }

/* Inside wrapper */
.wp-block-search.is-style-expandable-menu .wp-block-search__inside-wrapper{
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:6px;
  background:#fff; border:1px solid transparent; border-radius:999px; box-shadow:none;
  width:0 !important; opacity:0; pointer-events:none; overflow:hidden;
  transition: width 220ms cubic-bezier(.2,.7,.2,1), opacity 220ms, box-shadow 180ms ease, border-color 180ms ease;
  margin-left:.5rem;
}
/* Desktop width capped at 240px; narrow vw so it stops early */
.wp-block-search.is-style-expandable-menu.es-open .wp-block-search__inside-wrapper{
  width: clamp(180px, 18vw, 240px) !important;
  opacity:1; pointer-events:auto; border-color: rgba(0,0,0,.35); box-shadow: 0 4px 16px rgba(0,0,0,.08);
}
/* Mobile drawer full width */
.wp-block-navigation__responsive-container-content 
  .wp-block-search.is-style-expandable-menu.es-open .wp-block-search__inside-wrapper{ width:100% !important; }

/* Input */
.wp-block-search.is-style-expandable-menu .wp-block-search__input{ border:0 !important; outline:0 !important; background:transparent !important; padding:2px 12px !important; min-width:0; color:inherit; }
.wp-block-search.is-style-expandable-menu .wp-block-search__input::placeholder{ color:#444; opacity:.9; text-transform:uppercase; letter-spacing:.03em; }

/* Right submit icon */
.wp-block-search.is-style-expandable-menu .wp-block-search__button{
  background:transparent !important; border:0 !important; border-radius:8px !important;
  display:inline-flex !important; align-items:center; justify-content:center; width:36px !important; min-width:36px !important; height:28px !important; padding:0 !important;
  text-indent:-9999px; white-space:nowrap; overflow:hidden; color:var(--es-icon-color);
}
.wp-block-search.is-style-expandable-menu .wp-block-search__button svg{ display:none !important; }
.wp-block-search.is-style-expandable-menu .wp-block-search__button::before{
  content:""; width:18px; height:18px; display:block; background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
  margin:auto;
}
/* Center opener in mobile drawer */
.wp-block-navigation__responsive-container-content 
  .wp-block-search.is-style-expandable-menu .es-toggle{ margin-left:auto !important; margin-right:auto !important; display:flex !important; }

@media (max-width:480px){
  .wp-block-search.is-style-expandable-menu .wp-block-search__input{ padding:2px 10px !important; }
}

/* --------------- Woo product search --------------- */
.es-woo{ position:relative; display:flex; align-items:center; gap:.4rem; z-index:3; }
.es-woo .esw-wrapper{
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:6px;
  background:#fff; border:1px solid transparent; border-radius:999px; box-shadow:none;
  width:0 !important; opacity:0; pointer-events:none; overflow:hidden;
  transition: width 220ms cubic-bezier(.2,.7,.2,1), opacity 220ms, box-shadow 180ms ease, border-color 180ms ease;
}
.es-woo.es-open .esw-wrapper{
  width: clamp(180px, 18vw, 240px) !important; opacity:1; pointer-events:auto; border-color: rgba(0,0,0,.35); box-shadow: 0 4px 16px rgba(0,0,0,.08);
}
.es-woo .search-field, .es-woo input[type="search"]{ border:0 !important; outline:0 !important; background:transparent !important; padding:2px 12px !important; min-width:0; color:inherit; }
.es-woo .search-submit, .es-woo button[type="submit"]{
  background:transparent !important; border:0 !important; border-radius:8px !important; width:36px !important; height:28px !important; padding:0 !important;
  text-indent:-9999px; overflow:hidden; white-space:nowrap; color:var(--es-icon-color);
}
.es-woo .search-submit::before, .es-woo button[type="submit"]::before{
  content:""; width:18px; height:18px; display:block; background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
  margin:auto;
}
.es-woo .esw-toggle{
  appearance:none; border:0; background:transparent; padding:8px; border-radius:8px;
  display:inline-flex; line-height:0; cursor:pointer; color:var(--es-icon-color); margin-left:.4rem;
}
.es-woo .esw-toggle:hover{ background:rgba(0,0,0,.06); }
.es-woo .esw-toggle::before{
  content:""; width:20px; height:20px; display:block; background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.94 12.11l4.22 4.22-1.42 1.42-4.22-4.22A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Z'/%3E%3C/svg%3E") no-repeat center/contain;
}
.es-woo.es-open .esw-toggle, .es-woo .esw-toggle[hidden]{ display:none !important; visibility:hidden !important; opacity:0 !important; }
.wp-block-navigation__responsive-container-content .es-woo .esw-toggle{ margin-left:auto !important; margin-right:auto !important; display:flex !important; }