/* WW ElectricalXShop v3.2.1 — User-Friendly UI/UX refinement */
:root{
  --wwx-ui-container:1440px;
  --wwx-ui-pad:clamp(16px,2.2vw,32px);
  --wwx-ui-space-1:4px;
--wwx-ui-space-2:8px;
--wwx-ui-space-3:12px;
--wwx-ui-space-4:16px;
  --wwx-ui-space-5:24px;
--wwx-ui-space-6:32px;
--wwx-ui-space-7:48px;
  --wwx-ui-radius-sm:8px;
--wwx-ui-radius-md:12px;
--wwx-ui-radius-lg:16px;
  --wwx-ui-border:#dfe5ec;
--wwx-ui-muted:#65758a;
--wwx-ui-surface:#fff;
--wwx-ui-soft:#f7f9fc;
  --wwx-ui-shadow:0 10px 30px rgba(7,22,46,.08);
}
.wwt-shell{
width:min(var(--wwx-ui-container),calc(100% - (var(--wwx-ui-pad)*2)))}

/* Typography: stop essential information from becoming microcopy. */
body{
font-size:15px;
line-height:1.55;
text-rendering:optimizeLegibility}
p,li,label,input,select,textarea{
font-size:14px}
small{
line-height:1.4}
.wwx-topline,.wwx-trending{
font-size:14px}
.wwx-actions small{
font-size:14px}
.wwx-account-dropdown a,.wwx-account-dropdown p{
font-size:14px}

/* Header: clearer hierarchy, less visual noise. */
.wwx-topline-inner{
min-height:38px}
.wwx-topline-left,.wwx-topline-right{
gap:12px}
.wwx-business-benefits{
font-weight:750;
color:#004ca2}
.wwx-utility-menu-toggle,.wwx-utility-button,.wwx-theme-toggle{
  min-height:36px;
padding:0 9px;
border-radius:8px
}
.wwx-header-main{
  grid-template-columns:minmax(210px,260px) minmax(420px,1fr) minmax(170px,190px) auto;
  gap:18px;
padding:13px 0
}
.wwx-brand-logo img,.custom-logo{
max-height:64px}
.wwx-smart-search{
  height:50px;
border-color:#cfd8e3;
border-radius:10px;
box-shadow:none
}
.wwx-smart-search:focus-within{
border-color:#004ca2;
box-shadow:0 0 0 3px rgba(0,76,162,.10)}
.wwx-smart-search input{
font-size:14px}
.wwx-smart-search select{
font-size:14px;
background:#f8fafc}
.wwx-smart-search button{
font-size:20px;
width:56px}
.wwx-trending{
margin-top:6px;
gap:6px}
.wwx-trending a{
padding:2px 8px;
background:#f5f7fa}
.wwx-support strong{
font-size:15px}
.wwx-actions{
gap:10px}
.wwx-action-btn{
  min-width:58px!important;
min-height:48px!important;
padding:4px 7px!important;
border-radius:9px!important
}
.wwx-action-btn:hover{
background:#f5f8fb}
.wwx-ui-icon{
font-size:16px!important;
font-weight:800;
line-height:1}
.wwx-cart-open .wwx-ui-icon{
font-size:14px!important;
padding:3px 5px;
border-radius:5px;
background:#07162e;
color:#fff}
.wwx-actions i{
top:-3px;
right:1px}
.wwx-account-toggle{
  min-width:150px;
padding:6px 10px!important;
border-radius:9px!important;
text-align:left
}
.wwx-account-toggle:hover,.wwx-account-menu:focus-within .wwx-account-toggle{
background:#f5f8fb}
.wwx-account-toggle small{
display:block;
color:#66778a;
max-width:145px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap}
.wwx-account-toggle b{
display:block;
color:#0b1d36;
font-size:14px}
.wwx-navrow{
background:#142337;
color:#fff;
border:0}
.wwx-amazon-nav-inner{
min-height:50px;
gap:0}
.wwx-amazon-nav-inner>a,.wwx-all-open{
  min-height:50px;
display:flex;
align-items:center;
padding:0 13px;
color:#fff;
font-size:14px;
font-weight:700
}
.wwx-amazon-nav-inner>a:hover,.wwx-all-open:hover{
background:rgba(255,255,255,.10)}

/* Account dropdown: three understandable groups. */
.wwx-account-dropdown{
  width:min(760px,calc(100vw - 32px))!important;
  right:0!important;
padding:0!important;
border:1px solid #dce3eb!important;
border-radius:14px!important;
  overflow:hidden!important;
box-shadow:0 20px 55px rgba(7,22,46,.17)!important
}
.wwx-account-dropdown-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:14px 16px;
background:#f7f9fc;
border-bottom:1px solid #e1e7ee}
.wwx-account-dropdown-head strong{
color:#102944;
font-size:14px}
.wwx-account-dropdown-head>p{
margin:0;
color:#63758a}
.wwx-account-dropdown-head>a:not(.wwx-account-signin){
font-weight:800;
color:#004ca2}
.wwx-account-signin{
display:inline-flex!important;
align-items:center;
justify-content:center;
min-width:120px;
min-height:38px;
border-radius:8px;
background:#004ca2;
color:#fff!important;
font-weight:850}
.wwx-account-columns{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0!important}
.wwx-account-columns>div{
padding:16px;
border-right:1px solid #e6ebf0}
.wwx-account-columns>div:last-child{
border-right:0}
.wwx-account-columns h4{
margin:0 0 8px;
color:#132c47;
font-size:14px}
.wwx-account-columns a{
display:block;
padding:7px 8px;
border-radius:7px;
color:#42566d}
.wwx-account-columns a:hover{
background:#f1f6fb;
color:#004ca2}
.wwx-account-link-primary{
font-weight:850;
color:#004ca2!important}

/* Forms/buttons: one coherent system. */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.button,button[type=submit],input[type=submit]{
  min-height:42px;
border-radius:9px!important;
font-size:14px!important;
font-weight:800!important;
  line-height:1.2!important;
padding:10px 16px!important
}
.woocommerce .button.alt,.button-primary,button[type=submit]{
  background:#004ca2!important;
color:#fff!important;
border:1px solid #004ca2!important
}
.woocommerce .button.alt:hover,.button-primary:hover,button[type=submit]:hover{
background:#003f87!important;
border-color:#003f87!important}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=search],
input[type=number],input[type=url],select,textarea{
  min-height:44px;
border:1px solid #cfd9e4;
border-radius:9px;
padding:10px 12px;
background:#fff;
color:#172f49
}
textarea{
min-height:110px;
resize:vertical}
label{
color:#30485f;
font-weight:650}
input::placeholder,textarea::placeholder{
color:#8794a3;
opacity:1}

/* WooCommerce notices: cleaner and easier to understand. */
.woocommerce-error,.woocommerce-info,.woocommerce-message{
  border-radius:10px!important;
border:1px solid #dbe3eb!important;
padding:14px 16px 14px 46px!important;
  box-shadow:none!important;
font-size:14px!important
}
.woocommerce-error{
background:#fff4f5!important;
border-color:#f1c7cc!important}
.woocommerce-message{
background:#f1faf4!important;
border-color:#c9e7d2!important}

/* Cart and Checkout CRO hierarchy. */
body.woocommerce-cart .woocommerce,
body.wwx-quality-checkout .entry-content,
body.wwx-quality-checkout .wp-block-woocommerce-checkout{
  max-width:1240px;
margin-inline:auto
}
body.woocommerce-cart .cart_totals{
  padding:20px;
border:1px solid #dce4ec;
border-radius:14px;
background:#fff;
box-shadow:var(--wwx-ui-shadow)
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button{
  display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:52px!important;
  font-size:15px!important;
border-radius:10px!important
}
body.wwx-quality-checkout{
background:#f7f9fc}
body.wwx-quality-checkout main,
body.wwx-quality-checkout .site-main{
padding-top:24px;
padding-bottom:48px}
body.wwx-quality-checkout .wp-block-woocommerce-checkout{
  padding:20px;
background:#fff;
border:1px solid #e0e6ed;
border-radius:14px;
box-shadow:0 12px 34px rgba(7,22,46,.07)
}
body.wwx-quality-checkout .wc-block-components-checkout-step{
  padding-bottom:20px;
margin-bottom:20px;
border-bottom:1px solid #edf1f5
}
body.wwx-quality-checkout .wc-block-components-title{
font-size:20px!important;
color:#102944}
body.wwx-quality-checkout .wc-block-components-checkout-place-order-button{
  min-height:54px!important;
font-size:15px!important;
font-weight:850!important;
border-radius:10px!important;
background:#004ca2!important
}
body.wwx-quality-checkout .wc-block-components-order-summary{
border-radius:12px}
body.wwx-quality-checkout .wp-block-woocommerce-checkout-order-summary-block{
  border:1px solid #e1e7ee;
border-radius:12px;
padding:16px;
background:#fafbfd
}

/* Account dashboard: tasks before tools. */
.wwx-account-dashboard-v321{
display:grid;
gap:30px}
.wwx-account-welcome{
padding:24px;
border:1px solid #dfe6ed;
border-radius:14px;
background:linear-gradient(180deg,#fff,#f8fafc)}
.wwx-account-welcome>span{
font-size:14px}
.wwx-account-welcome h2{
margin:5px 0 7px;
font-size:clamp(26px,3vw,36px)}
.wwx-account-welcome p{
margin:0;
color:#64768a;
font-size:14px}
.wwx-account-section-head{
display:flex;
align-items:end;
justify-content:space-between;
gap:16px;
margin-bottom:12px}
.wwx-account-section-head h3{
margin:0;
color:#102944;
font-size:18px}
.wwx-account-section-head span{
color:#718195;
font-size:14px}
.wwx-account-cards{
display:grid!important;
gap:12px!important}
.wwx-account-cards-priority{
grid-template-columns:repeat(3,minmax(0,1fr))!important}
.wwx-account-cards-secondary{
grid-template-columns:repeat(3,minmax(0,1fr))!important}
.wwx-account-card{
  position:relative;
min-height:138px;
padding:18px!important;
border:1px solid #dfe6ed!important;
border-radius:12px!important;
  background:#fff!important;
box-shadow:none!important;
transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease
}
.wwx-account-card:hover{
transform:translateY(-2px);
border-color:#bfd0e3!important;
box-shadow:0 10px 24px rgba(7,22,46,.07)!important}
.wwx-account-card-index{
display:inline-grid!important;
place-items:center;
width:30px;
height:30px;
border-radius:8px;
background:#eef5fc;
color:#004ca2;
font-size:14px!important;
font-weight:900}
.wwx-account-card strong{
display:block!important;
margin-top:12px;
color:#112c47;
font-size:14px!important}
.wwx-account-card small{
display:block!important;
margin-top:5px;
color:#708095;
font-size:14px!important;
line-height:1.45}
.wwx-account-card i{
position:absolute;
right:16px;
bottom:14px;
color:#004ca2;
font-style:normal;
font-size:18px}
.wwx-account-card-secondary{
min-height:105px}
.wwx-account-card-secondary strong{
margin-top:0}

/* Floating assistance: one visual priority, not two competing banners. */
.wwx-floating-dock{
box-shadow:0 10px 30px rgba(7,22,46,.12)}
.wwx-chat-bubble{
min-height:58px!important;
padding:0 18px!important;
border-radius:999px!important;
box-shadow:0 12px 30px rgba(0,76,162,.18)!important}
.wwx-chat-bubble small{
font-size:14px!important}
body.woocommerce-cart .wwx-floating-dock,
body.woocommerce-cart .wwx-chat-bubble{
opacity:.92}

/* Footer: lighter information hierarchy. */
.wwt-footer{
margin-top:56px}
.wwt-footer-grid{
gap:34px}
.wwt-footer h3{
font-size:14px}
.wwt-footer p,.wwt-footer li,.wwt-footer a{
font-size:14px;
line-height:1.65}
.wwt-footer-bottom{
font-size:14px}

/* Responsive: deliberate collapse, not shrink-only. */
@media(max-width:1180px){
  .wwx-header-main{
grid-template-columns:210px minmax(360px,1fr) auto;
gap:14px}
  .wwx-support{
display:none!important}
  .wwx-account-columns{
grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .wwx-account-columns>div:last-child{
grid-column:1/-1;
border-top:1px solid #e6ebf0;
border-right:0}
  .wwx-account-columns>div{
border-right:1px solid #e6ebf0}
  .wwx-account-cards-priority,.wwx-account-cards-secondary{
grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:900px){
  .wwx-topline .wwx-business-benefits,.wwx-view-tools{
display:none!important}
  .wwx-actions [data-wwx-compare]{
display:none!important}
  .wwx-header-main{
grid-template-columns:190px 1fr auto}
  .wwx-brand-logo img,.custom-logo{
max-height:56px}
  .wwx-amazon-nav-inner>a:nth-of-type(n+7){
display:none}
}
@media(max-width:760px){
  .wwt-shell{
width:calc(100% - 28px)}
  .wwx-header-main{
display:grid!important;
grid-template-columns:1fr auto!important;
gap:10px!important;
padding:10px 0!important}
  .wwx-brand{
align-self:center}
  .wwx-actions{
justify-self:end}
  .wwx-search-wrap{
grid-column:1/-1;
order:3}
  .wwx-smart-search{
grid-template-columns:minmax(0,1fr) 48px;
height:46px}
  .wwx-smart-search select{
display:none}
  .wwx-actions [data-wwx-wishlist]{
display:none!important}
  .wwx-account-toggle{
min-width:112px}
  .wwx-account-toggle b{
font-size:14px}
  .wwx-account-toggle small{
font-size:14px;
max-width:108px}
  .wwx-account-dropdown{
position:fixed!important;
left:10px!important;
right:10px!important;
top:72px!important;
width:auto!important;
max-height:78vh;
overflow:auto!important}
  .wwx-account-columns{
grid-template-columns:1fr!important}
  .wwx-account-columns>div,.wwx-account-columns>div:last-child{
grid-column:auto;
border-right:0;
border-top:1px solid #e6ebf0}
  .wwx-account-columns>div:first-child{
border-top:0}
  .wwx-amazon-nav-inner>a:nth-of-type(n+4){
display:none}
  .wwx-account-section-head{
align-items:flex-start;
flex-direction:column;
gap:3px}
  .wwx-account-cards-priority,.wwx-account-cards-secondary{
grid-template-columns:1fr!important}
  .wwx-account-card{
min-height:112px}
  body.wwx-quality-checkout .wp-block-woocommerce-checkout{
padding:14px;
border-radius:10px}
}
@media(max-width:480px){
  .wwx-brand-logo img,.custom-logo{
max-width:165px;
max-height:48px}
  .wwx-account-toggle{
display:none!important}
  .wwx-actions{
gap:5px}
  .wwx-action-btn{
min-width:46px!important}
  .wwx-mobile-menu-open{
display:grid!important;
place-items:center}
  .wwx-amazon-nav-inner{
min-height:46px}
  .wwx-amazon-nav-inner>a,.wwx-all-open{
min-height:46px;
padding:0 10px;
font-size:14px}
  .wwx-chat-bubble{
width:52px;
height:52px;
min-width:52px!important;
padding:0!important}
  .wwx-chat-bubble b,.wwx-chat-bubble small{
display:none!important}
  .wwx-account-welcome{
padding:18px}
}

/* Dark theme compatibility for new layer. */
html.wwx-dark .wwx-account-dropdown,
html.wwx-dark .wwx-account-dropdown-head,
html.wwx-dark .wwx-account-columns>div,
html.wwx-dark .wwx-account-welcome,
html.wwx-dark .wwx-account-card,
html.wwx-dark .wwx-feedback-form{
  background:#101b2b;
color:#e8eef6;
border-color:#2a3a4f!important
}
html.wwx-dark .wwx-account-columns h4,
html.wwx-dark .wwx-account-card strong,
html.wwx-dark .wwx-account-section-head h3,
html.wwx-dark .wwx-account-welcome h2{
color:#f5f8fc}
html.wwx-dark .wwx-account-columns a,
html.wwx-dark .wwx-account-card small,
html.wwx-dark .wwx-account-section-head span{
color:#b2bfd0}


/* ============================================================
   v3.2.2 — HEADER COLLISION FIX + READABILITY SYSTEM
   ============================================================ */

/* True 3-zone header: Logo | Search | Account/Actions. */
.wwx-header-main{
  display:grid!important;
  grid-template-columns:minmax(180px,230px) minmax(280px,1fr) max-content!important;
  align-items:center!important;
  column-gap:20px!important;
  row-gap:6px!important;
}
.wwx-brand{
min-width:0!important}
.wwx-search-wrap{
min-width:0!important;
width:100%!important;
position:relative!important}
.wwx-actions{
  min-width:max-content!important;
  width:max-content!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
}
.wwx-account-menu{
flex:0 0 auto!important;
min-width:0!important}
.wwx-account-toggle{
width:154px!important;
min-width:154px!important;
max-width:154px!important}
.wwx-smart-search{
width:100%!important;
min-width:0!important}
.wwx-smart-search input{
min-width:0!important;
width:100%!important}
.wwx-search-popover{
left:0!important;
right:0!important;
width:auto!important;
max-width:none!important}

/* Hide lower-priority header actions BEFORE they can collide. */
@media(max-width:1320px){
  .wwx-actions [data-wwx-compare]{
display:none!important}
  .wwx-header-main{
grid-template-columns:190px minmax(260px,1fr) max-content!important;
column-gap:14px!important}
}
@media(max-width:1120px){
  .wwx-actions [data-wwx-wishlist]{
display:none!important}
  .wwx-account-toggle{
width:142px!important;
min-width:142px!important;
max-width:142px!important}
}
@media(max-width:940px){
  .wwx-header-main{
grid-template-columns:170px minmax(230px,1fr) max-content!important}
  .wwx-actions .wwx-action-btn small{
display:none!important}
  .wwx-action-btn{
min-width:46px!important;
width:46px!important}
  .wwx-account-toggle{
width:128px!important;
min-width:128px!important;
max-width:128px!important}
}
@media(max-width:760px){
  .wwx-header-main{
    grid-template-columns:minmax(150px,1fr) max-content!important;
    column-gap:10px!important;
  }
  .wwx-search-wrap{
grid-column:1/-1!important}
  .wwx-account-toggle{
width:118px!important;
min-width:118px!important;
max-width:118px!important}
}
@media(max-width:520px){
  .wwx-account-toggle{
display:none!important}
  .wwx-header-main{
grid-template-columns:1fr max-content!important}
}

/* Universal readability: comfortable for younger and older users. */
body{
font-size:16px!important;
line-height:1.62!important}
p,li,dt,dd,label,input,select,textarea{
font-size:15px!important}
button,.button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{
font-size:14px!important}
.wwx-topline,.wwx-trending,.wwx-actions small,.wwx-account-dropdown a,.wwx-account-dropdown p{
font-size:14px!important}
.wwx-amazon-nav-inner>a,.wwx-all-open{
font-size:14px!important}
.wwx-smart-search input{
font-size:15px!important}
.wwx-smart-search select{
font-size:14px!important}
.wwx-product-card-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title{
font-size:15px!important;
line-height:1.4!important}
.price,.woocommerce div.product p.price,.woocommerce div.product span.price{
font-size:18px!important}
.wwx-account-card small,.wwx-account-section-head span{
font-size:14px!important}
.wwx-account-card strong{
font-size:15px!important}
.wwx-order-item-info>a,.wwx-buy-again-info>a{
font-size:14px!important}
.wwx-order-item-info small,.wwx-buy-again-info small{
font-size:14px!important}
.wwt-footer p,.wwt-footer li,.wwt-footer a{
font-size:14px!important}
.wwt-footer-bottom{
font-size:14px!important}

/* Keep line length readable. */
.wwx-drawer-card>p,.wwx-modal-card>p,.wwx-account-welcome p{
line-height:1.65!important}

/* ============================================================
   ELYSIA — CONVERSATIONAL CUSTOMER SUPPORT UI
   ============================================================ */
#wwx-ai-drawer .wwx-drawer-card{
  top:10vh!important;
  height:min(82vh,760px)!important;
  width:min(470px,calc(100% - 28px))!important;
  padding:0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
  border-radius:18px!important;
}
.wwx-elysia-header{
  padding:18px 20px 14px!important;
  border-bottom:1px solid #e5eaf0!important;
  background:linear-gradient(180deg,#fff,#f8fbff)!important;
}
.wwx-elysia-identity{
display:flex;
align-items:center;
gap:11px;
padding-right:38px}
.wwx-elysia-avatar{
  width:42px;
height:42px;
display:grid;
place-items:center;
border-radius:50%;
  background:#004ca2;
color:#fff;
font-size:17px;
font-weight:900;
flex:0 0 auto
}
.wwx-elysia-identity strong{
display:block;
color:#0d2945;
font-size:16px;
line-height:1.25}
.wwx-elysia-identity small{
display:flex;
align-items:center;
gap:5px;
color:#5c7085;
font-size:14px!important;
margin-top:3px}
.wwx-elysia-status-dot{
width:8px;
height:8px;
border-radius:50%;
background:#28a745}
.wwx-elysia-messages{
  min-height:0;
overflow-y:auto;
padding:18px;
background:#f5f7fa;
scroll-behavior:smooth;
  display:flex;
flex-direction:column;
gap:12px
}
.wwx-elysia-message{
display:flex;
gap:8px;
align-items:flex-end;
max-width:90%}
.wwx-elysia-message.is-user{
align-self:flex-end;
flex-direction:row-reverse}
.wwx-elysia-message.is-assistant{
align-self:flex-start}
.wwx-elysia-mini-avatar{
width:28px;
height:28px;
display:grid;
place-items:center;
border-radius:50%;
background:#004ca2;
color:#fff;
font-size:14px;
font-weight:900;
flex:0 0 auto}
.wwx-elysia-message.is-user .wwx-elysia-mini-avatar{
display:none}
.wwx-elysia-bubble{
  padding:11px 13px;
border-radius:14px 14px 14px 4px;
background:#fff;
border:1px solid #dde5ed;
  color:#263b51;
font-size:14px;
line-height:1.55;
box-shadow:0 2px 7px rgba(7,22,46,.04)
}
.wwx-elysia-message.is-user .wwx-elysia-bubble{
  background:#004ca2;
border-color:#004ca2;
color:#fff;
border-radius:14px 14px 4px 14px
}
.wwx-elysia-bubble p{
margin:0 0 6px;
font-size:14px!important}
.wwx-elysia-bubble p:last-child{
margin-bottom:0}
.wwx-elysia-time{
display:block;
margin-top:5px;
color:#8996a4;
font-size:14px!important}
.wwx-elysia-message.is-user .wwx-elysia-time{
color:rgba(255,255,255,.7)}
.wwx-elysia-typing .wwx-elysia-bubble{
display:flex;
gap:4px;
align-items:center;
height:36px}
.wwx-elysia-typing i{
width:6px;
height:6px;
border-radius:50%;
background:#7890a8;
animation:wwxTyping 1.2s infinite}
.wwx-elysia-typing i:nth-child(2){
animation-delay:.18s}
.wwx-elysia-typing i:nth-child(3){
animation-delay:.36s}
@keyframes wwxTyping{
0%,60%,100%{
transform:translateY(0);
opacity:.45}
30%{
transform:translateY(-4px);
opacity:1}
}
.wwx-elysia-suggestions{
display:flex;
flex-wrap:wrap;
gap:7px;
margin-top:8px}
.wwx-elysia-suggestion{
  min-height:34px!important;
padding:7px 10px!important;
border:1px solid #cfe0f3!important;
border-radius:999px!important;
  background:#f6faff!important;
color:#004ca2!important;
font-size:14px!important;
font-weight:750!important;
cursor:pointer
}
.wwx-elysia-products{
display:grid;
gap:8px;
margin-top:9px}
.wwx-elysia-product{
  display:grid;
grid-template-columns:56px minmax(0,1fr) auto;
gap:9px;
align-items:center;
padding:8px;
  border:1px solid #e0e6ed;
border-radius:10px;
background:#fff;
text-decoration:none!important
}
.wwx-elysia-product img{
width:56px;
height:56px;
object-fit:contain;
background:#f8fafc;
border-radius:7px}
.wwx-elysia-product strong{
display:block;
color:#12304d;
font-size:14px;
line-height:1.35}
.wwx-elysia-product small{
display:block;
color:#718096;
font-size:14px!important;
margin-top:3px}
.wwx-elysia-product-price{
color:#004ca2;
font-size:14px;
font-weight:900;
white-space:nowrap}
.wwx-elysia-composer{
  padding:12px 14px 14px;
background:#fff;
border-top:1px solid #e1e7ed
}
#wwx-ai-form{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:8px!important;
align-items:end!important}
#wwx-ai-form textarea{
  min-height:46px!important;
max-height:120px!important;
height:46px;
padding:11px 12px!important;
  border:1px solid #cbd7e4!important;
border-radius:12px!important;
font-size:14px!important;
line-height:1.45!important;
  resize:none!important;
overflow-y:auto!important
}
#wwx-ai-form textarea:focus{
border-color:#004ca2!important;
box-shadow:0 0 0 3px rgba(0,76,162,.11)!important}
#wwx-ai-form .wwx-ai-actions{
display:flex!important;
gap:7px!important;
align-items:center!important}
#wwx-ai-form .wwx-elysia-send{
  width:46px!important;
height:46px!important;
min-width:46px!important;
padding:0!important;
margin:0!important;
  display:grid!important;
place-items:center!important;
border-radius:12px!important;
background:#004ca2!important;
color:#fff!important;
  font-size:18px!important
}
.wwx-ai-whatsapp{
  width:42px!important;
height:42px!important;
min-width:42px!important;
border-radius:12px!important
}
.wwx-elysia-composer-note{
display:block;
margin-top:7px;
color:#7a8999;
font-size:14px!important}
.wwx-chat-bubble b{
font-size:14px!important}
.wwx-chat-bubble small{
font-size:14px!important}

/* Dark mode */
html.wwx-dark .wwx-elysia-header,html.wwx-dark .wwx-elysia-composer{
background:#101b2b!important;
border-color:#2c3b50!important}
html.wwx-dark .wwx-elysia-messages{
background:#0b1523!important}
html.wwx-dark .wwx-elysia-bubble{
background:#142236!important;
border-color:#2b3d54!important;
color:#edf3f9!important}
html.wwx-dark .wwx-elysia-product{
background:#101b2b!important;
border-color:#2b3d54!important}
html.wwx-dark .wwx-elysia-product strong{
color:#f2f6fb!important}

@media(max-width:600px){
  #wwx-ai-drawer .wwx-drawer-card{
    top:auto!important;
right:0!important;
bottom:0!important;
width:100%!important;
height:88vh!important;
    border-radius:18px 18px 0 0!important
  }
  .wwx-elysia-header{
padding:15px 16px 12px!important}
  .wwx-elysia-messages{
padding:14px!important}
  .wwx-elysia-message{
max-width:95%}
}


/* ============================================================
   v3.2.3 — SCREENSHOT-BASED HEADER + ELYSIA CORRECTIONS
   ============================================================ */

/* Header: guarantee physical separation between logo/search/account. */
.wwx-header-main{
  display:grid!important;
  grid-template-columns:260px minmax(360px,1fr) 390px!important;
  align-items:center!important;
  gap:24px!important;
  width:100%!important;
}
.wwx-brand{
  width:260px!important;
  max-width:260px!important;
  min-width:260px!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
}
.wwx-brand-logo,
.wwx-brand-logo a{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  max-width:100%!important;
}
.wwx-brand-logo img,
.wwx-brand .custom-logo{
  display:block!important;
  width:auto!important;
  max-width:250px!important;
  height:auto!important;
  max-height:70px!important;
  object-fit:contain!important;
  object-position:left center!important;
}
.wwx-search-wrap{
  min-width:0!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  align-self:center!important;
}
.wwx-smart-search{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}
.wwx-actions{
  width:390px!important;
  max-width:390px!important;
  min-width:390px!important;
  display:grid!important;
  grid-template-columns:170px 92px 92px!important;
  gap:12px!important;
  align-items:center!important;
  justify-content:end!important;
}
.wwx-account-menu{
  width:170px!important;
  max-width:170px!important;
  min-width:170px!important;
}
.wwx-account-toggle{
  width:170px!important;
  max-width:170px!important;
  min-width:170px!important;
  overflow:hidden!important;
}
.wwx-account-toggle small,
.wwx-account-toggle b{
  max-width:148px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.wwx-action-btn{
  width:92px!important;
  max-width:92px!important;
  min-width:92px!important;
}

/* Earlier breakpoints could still create collisions; redefine decisively. */
@media(max-width:1500px){
  .wwx-header-main{
grid-template-columns:230px minmax(320px,1fr) 330px!important;
gap:18px!important}
  .wwx-brand,.wwx-brand-logo{
width:230px!important;
max-width:230px!important;
min-width:230px!important}
  .wwx-brand-logo img,.wwx-brand .custom-logo{
max-width:220px!important}
  .wwx-actions{
width:330px!important;
max-width:330px!important;
min-width:330px!important;
grid-template-columns:160px 76px 76px!important;
gap:9px!important}
  .wwx-account-menu,.wwx-account-toggle{
width:160px!important;
min-width:160px!important;
max-width:160px!important}
  .wwx-action-btn{
width:76px!important;
min-width:76px!important;
max-width:76px!important}
}
@media(max-width:1280px){
  .wwx-header-main{
grid-template-columns:210px minmax(300px,1fr) 245px!important;
gap:14px!important}
  .wwx-brand,.wwx-brand-logo{
width:210px!important;
max-width:210px!important;
min-width:210px!important}
  .wwx-brand-logo img,.wwx-brand .custom-logo{
max-width:200px!important}
  .wwx-actions{
width:245px!important;
max-width:245px!important;
min-width:245px!important;
grid-template-columns:155px 78px!important}
  .wwx-actions [data-wwx-wishlist]{
display:none!important}
  .wwx-account-menu,.wwx-account-toggle{
width:155px!important;
min-width:155px!important;
max-width:155px!important}
}
@media(max-width:1060px){
  .wwx-header-main{
grid-template-columns:190px minmax(250px,1fr) 205px!important;
gap:12px!important}
  .wwx-brand,.wwx-brand-logo{
width:190px!important;
max-width:190px!important;
min-width:190px!important}
  .wwx-brand-logo img,.wwx-brand .custom-logo{
max-width:180px!important}
  .wwx-actions{
width:205px!important;
max-width:205px!important;
min-width:205px!important;
grid-template-columns:145px 50px!important}
  .wwx-account-menu,.wwx-account-toggle{
width:145px!important;
min-width:145px!important;
max-width:145px!important}
  .wwx-action-btn{
width:50px!important;
min-width:50px!important;
max-width:50px!important}
  .wwx-action-btn small{
display:none!important}
}
@media(max-width:860px){
  .wwx-header-main{
    grid-template-columns:minmax(170px,1fr) auto!important;
    gap:10px!important;
  }
  .wwx-brand,.wwx-brand-logo{
    width:auto!important;
max-width:210px!important;
min-width:0!important
  }
  .wwx-brand-logo img,.wwx-brand .custom-logo{
max-width:205px!important}
  .wwx-actions{
    width:auto!important;
max-width:none!important;
min-width:0!important;
    display:flex!important;
gap:7px!important
  }
  .wwx-account-menu,.wwx-account-toggle{
    width:128px!important;
min-width:128px!important;
max-width:128px!important
  }
  .wwx-search-wrap{
grid-column:1/-1!important}
}
@media(max-width:560px){
  .wwx-account-menu{
display:none!important}
  .wwx-brand,.wwx-brand-logo{
max-width:185px!important}
  .wwx-brand-logo img,.wwx-brand .custom-logo{
max-width:180px!important}
}

/* Search field readability + breathing room. */
.wwx-smart-search{
height:54px!important;
border-radius:12px!important}
.wwx-smart-search input{
font-size:16px!important;
padding-inline:16px!important}
.wwx-smart-search select{
font-size:14px!important;
padding-inline:14px!important}
.wwx-smart-search button{
min-width:58px!important}
.wwx-trending{
margin-top:10px!important;
font-size:14px!important}

/* Elysia overlay should own the interaction while open. */
body.wwx-elysia-open{
  overflow:hidden!important;
}
body.wwx-elysia-open .wwx-chat-bubble{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(10px)!important;
}
body.wwx-elysia-open .wwx-floating-dock{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
#wwx-ai-drawer{
  z-index:99990!important;
  padding:24px!important;
  align-items:center!important;
  justify-content:center!important;
}
#wwx-ai-drawer .wwx-drawer-card{
  position:relative!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  width:min(520px,calc(100vw - 32px))!important;
  height:min(760px,calc(100vh - 48px))!important;
  max-height:calc(100vh - 48px)!important;
  margin:auto!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
  border-radius:20px!important;
}
.wwx-elysia-header{
  min-height:104px!important;
  padding:20px 24px 18px!important;
  position:relative!important;
  z-index:3!important;
}
.wwx-drawer-close.wwx-ai-close{
  top:22px!important;
  right:22px!important;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  min-height:48px!important;
  z-index:20!important;
  background:#fff!important;
  border:1px solid #e1e6eb!important;
  box-shadow:0 4px 14px rgba(7,22,46,.07)!important;
}
.wwx-elysia-messages{
  position:relative!important;
  min-height:0!important;
  height:auto!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  padding:22px 20px 28px!important;
  scroll-padding-top:24px!important;
  scroll-padding-bottom:24px!important;
}
.wwx-elysia-message:first-child{
  margin-top:0!important;
}
.wwx-elysia-message:last-child{
  margin-bottom:0!important;
}
.wwx-elysia-bubble{
  font-size:15px!important;
  line-height:1.6!important;
  padding:13px 15px!important;
}
.wwx-elysia-bubble p{
  font-size:15px!important;
  line-height:1.6!important;
}
.wwx-elysia-suggestions{
  margin-top:12px!important;
  gap:8px!important;
}
.wwx-elysia-suggestion{
  min-height:38px!important;
  font-size:14px!important;
  line-height:1.25!important;
  white-space:normal!important;
  text-align:center!important;
}
.wwx-elysia-composer{
  position:relative!important;
  z-index:4!important;
  padding:14px 16px 16px!important;
  background:#fff!important;
}
#wwx-ai-form{
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:end!important;
}
#wwx-ai-form textarea{
  min-height:54px!important;
  height:54px!important;
  max-height:132px!important;
  font-size:15px!important;
  padding:14px 15px!important;
  border-radius:14px!important;
  line-height:1.45!important;
}
#wwx-ai-form .wwx-ai-actions{
  flex:0 0 auto!important;
  gap:8px!important;
}
#wwx-ai-form .wwx-elysia-send{
  width:54px!important;
height:54px!important;
min-width:54px!important;
min-height:54px!important;
  border-radius:14px!important;
}
.wwx-ai-whatsapp{
  width:54px!important;
height:54px!important;
min-width:54px!important;
min-height:54px!important;
  border-radius:14px!important;
  font-size:14px!important;
}
.wwx-elysia-composer-note{
  display:block!important;
  margin:9px 2px 0!important;
  font-size:14px!important;
  line-height:1.45!important;
  color:#66798d!important;
  max-width:100%!important;
}

/* Prevent giant fixed launcher overlapping modal even during transition. */
#wwx-ai-drawer[aria-hidden="false"] ~ .wwx-chat-bubble,
#wwx-ai-drawer.is-open ~ .wwx-chat-bubble{
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Mobile Elysia: true bottom sheet with safe composer. */
@media(max-width:620px){
  #wwx-ai-drawer{
    padding:0!important;
    align-items:flex-end!important;
  }
  #wwx-ai-drawer .wwx-drawer-card{
    width:100%!important;
    max-width:none!important;
    height:min(92vh,820px)!important;
    max-height:92vh!important;
    margin:0!important;
    border-radius:20px 20px 0 0!important;
  }
  .wwx-elysia-header{
min-height:92px!important;
padding:16px 18px 14px!important}
  .wwx-drawer-close.wwx-ai-close{
top:16px!important;
right:16px!important;
width:44px!important;
height:44px!important}
  .wwx-elysia-identity{
padding-right:54px!important}
  .wwx-elysia-identity strong{
font-size:16px!important}
  .wwx-elysia-messages{
padding:18px 14px 22px!important}
  .wwx-elysia-message{
max-width:94%!important}
  .wwx-elysia-composer{
padding:12px 12px max(14px,env(safe-area-inset-bottom))!important}
  #wwx-ai-form textarea{
font-size:16px!important}
  .wwx-elysia-composer-note{
font-size:14px!important}
}


/* ============================================================
   v3.2.4 — ELYSIA: RESTORE v2.7 RIGHT-SIDE SLIDE BEHAVIOUR
   ============================================================ */
#wwx-ai-drawer{
  display:block!important;
  position:fixed!important;
  inset:0!important;
  padding:0!important;
  background:rgba(3,10,22,.48)!important;
  opacity:0!important;
  visibility:hidden!important;
  transition:opacity .25s ease,visibility .25s ease!important;
  z-index:99990!important;
}
#wwx-ai-drawer.is-open{
  opacity:1!important;
  visibility:visible!important;
}
#wwx-ai-drawer .wwx-drawer-card{
  position:absolute!important;
  right:18px!important;
  left:auto!important;
  top:7vh!important;
  bottom:auto!important;
  margin:0!important;
  width:min(480px,calc(100vw - 36px))!important;
  height:86vh!important;
  max-height:86vh!important;
  transform:translateX(calc(100% + 44px))!important;
  transition:transform .32s cubic-bezier(.22,.8,.32,1)!important;
  border-radius:18px!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
}
#wwx-ai-drawer.is-open .wwx-drawer-card{
  transform:translateX(0)!important;
}
body.wwx-elysia-open .wwx-chat-bubble{
  display:none!important;
}
body:not(.wwx-elysia-open) .wwx-chat-bubble{
  display:grid!important;
}
body.wwx-elysia-open .wwx-floating-tools{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Keep launcher away from product purchase controls. */
body.single-product .wwx-chat-bubble{
  right:22px!important;
  bottom:26px!important;
  max-width:270px!important;
  z-index:170!important;
}
body.single-product .wwx-product-buy-column,
body.single-product .wwx-buy-box{
  position:relative!important;
  z-index:1!important;
}
body.single-product .wwx-chat-bubble{
  box-shadow:0 14px 32px rgba(0,84,184,.24)!important;
}
@media(max-width:1024px){
  body.single-product .wwx-chat-bubble{
    width:54px!important;
height:54px!important;
right:14px!important;
bottom:18px!important;
padding:0!important;
    display:grid!important;
place-items:center!important
  }
  body.single-product .wwx-chat-bubble b,
  body.single-product .wwx-chat-bubble small{
display:none!important}
  body.wwx-elysia-open.single-product .wwx-chat-bubble{
display:none!important}
}
@media(max-width:620px){
  #wwx-ai-drawer .wwx-drawer-card{
    right:0!important;
top:auto!important;
bottom:0!important;
    width:100%!important;
height:92vh!important;
max-height:92vh!important;
    border-radius:20px 20px 0 0!important;
    transform:translateY(102%)!important;
  }
  #wwx-ai-drawer.is-open .wwx-drawer-card{
transform:translateY(0)!important}
}

/* Conversation readability. */
.wwx-elysia-bubble,.wwx-elysia-bubble p{
font-size:16px!important;
line-height:1.62!important}
.wwx-elysia-identity strong{
font-size:18px!important}
.wwx-elysia-identity small{
font-size:14px!important}
#wwx-ai-form textarea{
font-size:16px!important}
.wwx-elysia-composer-note{
font-size:14px!important;
line-height:1.5!important}