/* =========================================================
   Dr Fresh — WooCommerce styling (brand match)
   Relies on CSS variables from assets/styles.css
   ========================================================= */

.site-main { min-height: 40vh; }

/* Header cart icon + count */
.nav-cart{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%; font-size:18px;
  border:1.5px solid rgba(255,255,255,0.25); color:var(--cream);
  transition:all .2s ease; text-decoration:none;
}
.nav-cart:hover{ background:rgba(255,255,255,0.1); border-color:var(--cream); }
.nav-cart .drfresh-cart-count{
  position:absolute; top:-6px; right:-6px; min-width:18px; height:18px;
  background:var(--orange); color:#fff; border-radius:999px;
  font-family:var(--font-mono); font-size:10px; font-weight:700;
  display:flex; align-items:center; justify-content:center; padding:0 4px;
}

/* Page hero / titles */
.page-title{ font-size:clamp(30px,4vw,46px); margin:10px 0 18px; }
.shop-wrap{ padding-top:44px; }
.entry-content{ font-size:16px; color:var(--ink-soft); line-height:1.75; }
.entry-content h2,.entry-content h3{ color:var(--ink); margin:26px 0 12px; }
.entry-content a{ color:var(--orange-deep); text-decoration:underline; }

/* WooCommerce notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border-top-color:var(--orange)!important; border-radius:12px;
  background:var(--white); box-shadow:var(--shadow-1); font-size:14.5px;
}
.woocommerce-message::before,.woocommerce-info::before{ color:var(--orange); }

/* Result count + ordering */
.woocommerce .woocommerce-result-count{ color:var(--ink-soft); font-size:14px; }
.woocommerce .woocommerce-ordering select{
  padding:10px 14px; border-radius:10px; border:1.5px solid var(--line);
  background:var(--white); font-family:inherit;
}

/* ===== Shop archive: product cards ===== */
.woocommerce ul.products{
  display:grid !important; grid-template-columns:repeat(4,1fr); gap:24px; margin:24px 0 0;
}
.woocommerce ul.products li.product{
  width:auto!important; margin:0!important; float:none!important;
  background:var(--white); border-radius:var(--radius-md); overflow:hidden;
  box-shadow:var(--shadow-1); transition:transform .3s ease, box-shadow .3s ease;
  display:flex; flex-direction:column;
}
.woocommerce ul.products li.product:hover{ transform:translateY(-6px); box-shadow:var(--shadow-2); }
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{ display:block; }
.woocommerce ul.products li.product img{
  margin:0!important; border-radius:0; aspect-ratio:1/0.85; object-fit:cover; width:100%;
  background:linear-gradient(155deg,var(--cream-deep),var(--gold-soft));
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--font-display); font-size:17px; font-weight:600; color:var(--ink);
  padding:14px 18px 4px!important; line-height:1.2;
}
.woocommerce ul.products li.product .price{
  color:var(--ink)!important; font-family:var(--font-display); font-weight:700; font-size:17px;
  padding:0 18px; margin-bottom:8px;
}
.woocommerce ul.products li.product .price del{ color:var(--ink-soft); font-weight:400; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{
  margin:auto 18px 18px!important; background:var(--ink); color:var(--cream);
  border-radius:999px; padding:11px 18px; font-weight:600; font-size:13.5px;
  text-align:center; transition:background .25s ease, transform .25s ease;
}
.woocommerce ul.products li.product .button:hover{ background:var(--orange-deep); transform:translateY(-1px); }
.woocommerce ul.products li.product .onsale{
  background:var(--red); color:#fff; border-radius:999px; font-family:var(--font-mono);
  font-size:10px; min-height:auto; min-width:auto; padding:5px 10px; top:10px; right:10px; margin:0;
}

/* ===== Single product ===== */
.woocommerce div.product{ margin-top:10px; }
.woocommerce div.product .product_title{ font-family:var(--font-display); font-size:clamp(26px,3.4vw,40px); }
.woocommerce div.product p.price,
.woocommerce div.product span.price{ color:var(--orange-deep); font-family:var(--font-display); font-weight:700; font-size:26px; }
.woocommerce div.product .woocommerce-product-details__short-description{ color:var(--ink-soft); font-size:15.5px; }
.woocommerce div.product form.cart .button,
.woocommerce div.product .single_add_to_cart_button{
  background:var(--ink)!important; color:var(--cream)!important; border-radius:999px;
  padding:14px 28px; font-weight:600; font-size:15px; text-transform:none;
}
.woocommerce div.product form.cart .button:hover,
.woocommerce div.product .single_add_to_cart_button:hover{ background:var(--orange-deep)!important; }
.woocommerce .quantity input.qty{ border:1.5px solid var(--line); border-radius:10px; padding:10px; }
.woocommerce div.product .images img{ border-radius:var(--radius-md); box-shadow:var(--shadow-1); }
.woocommerce-tabs .tabs li.active a{ color:var(--orange-deep); }
.woocommerce .related.products > h2, .woocommerce .upsells > h2{ font-family:var(--font-display); }

/* ===== Buttons everywhere (cart, checkout) ===== */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt{
  background:var(--ink); color:var(--cream); border-radius:999px; padding:13px 24px;
  font-weight:600; font-size:14.5px; text-transform:none; transition:background .25s ease;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{ background:var(--orange-deep); }

/* Cart & checkout tables */
.woocommerce table.shop_table{ border-radius:var(--radius-md); border-color:var(--line); overflow:hidden; }
.woocommerce table.shop_table th{ font-family:var(--font-display); }
.woocommerce .cart-collaterals .cart_totals h2,
.woocommerce-checkout h3{ font-family:var(--font-display); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .select2-container .select2-selection{
  border-radius:10px!important; border:1.5px solid var(--line)!important; padding:12px 14px; min-height:auto;
}
.woocommerce #payment, .woocommerce-checkout #payment{ background:var(--white); border-radius:var(--radius-md); }

/* Responsive */
@media (max-width:980px){
  .woocommerce ul.products{ grid-template-columns:repeat(2,1fr); gap:16px; }
}
@media (max-width:700px){
  .woocommerce ul.products{ grid-template-columns:1fr 1fr; gap:12px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:14px; padding:12px 12px 2px!important; }
  .woocommerce ul.products li.product .price{ font-size:14px; padding:0 12px; }
  .woocommerce ul.products li.product .button{ margin:auto 12px 12px!important; padding:10px 12px; }
}

/* =========================================================
   Stay Connected — contact cards (footer + mobile drawer)
   ========================================================= */
.connect{ padding:8px 0 26px; }
.connect-head{ text-align:center; max-width:640px; margin:0 auto 28px; }
.connect-head h2{ font-family:var(--font-display); font-size:clamp(26px,3.4vw,38px); color:var(--cream); margin:0; }
.connect-head p{ color:#C9C2B2; margin-top:12px; font-size:15px; line-height:1.6; }
.connect-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:16px; }

.connect-card{
  display:flex; align-items:center; gap:14px;
  min-height:62px; padding:12px 16px; border-radius:16px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.10);
  color:var(--cream); text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
}
.connect-card:hover,
.connect-card:focus-visible{
  transform:translateY(-4px);
  box-shadow:0 16px 36px rgba(0,0,0,0.38);
  background:rgba(255,255,255,0.09);
  border-color:rgba(198,162,76,0.55);
  outline:none;
}
.connect-ico{
  flex:none; width:48px; height:48px; border-radius:13px;
  display:flex; align-items:center; justify-content:center; line-height:1;
  background:rgba(255,255,255,0.08); color:var(--gold);
}
.connect-ico svg{ display:block; }
.connect-card.c-call .connect-ico{ background:rgba(92,138,99,0.20);  color:#7cb083; }
.connect-card.c-wa   .connect-ico{ background:rgba(40,169,104,0.20);  color:#3fce8b; }
.connect-card.c-fb   .connect-ico{ background:rgba(66,103,178,0.26);  color:#87a4e4; }
.connect-card.c-ig   .connect-ico{ background:rgba(228,113,30,0.20);  color:#f0894a; }
.connect-card.c-mail .connect-ico{ background:rgba(198,162,76,0.22);  color:#dcbf6f; }
.connect-txt{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.connect-txt b{ font-family:var(--font-display); font-size:17px; font-weight:600; color:var(--cream); }
.connect-txt small{ color:#B8B1A2; font-size:12.5px; line-height:1.45; }
.connect-arrow{ flex:none; color:rgba(233,225,211,0.5); font-size:18px; transition:transform .25s ease, color .25s ease; }
.connect-card:hover .connect-arrow{ transform:translateX(4px); color:var(--gold); }

/* Mobile drawer: compact social icon row (icons only) */
.mdrawer-social{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:14px; margin-top:22px; padding-top:20px;
  border-top:1px solid rgba(255,255,255,0.1);
}
.msoc{
  width:48px; height:48px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.16);
  color:var(--cream);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.msoc svg{ width:22px; height:22px; display:block; }
.msoc:hover{ transform:scale(1.05); box-shadow:0 8px 20px rgba(0,0,0,0.35); }
.msoc:focus-visible{ transform:scale(1.05); box-shadow:0 8px 20px rgba(0,0,0,0.35); outline:2px solid var(--gold); outline-offset:3px; }
.msoc-call:hover, .msoc-call:focus-visible{ background:rgba(92,138,99,0.95); border-color:var(--green); color:#fff; }
.msoc-wa:hover,   .msoc-wa:focus-visible{   background:#28A968; border-color:#28A968; color:#fff; }
.msoc-fb:hover,   .msoc-fb:focus-visible{   background:#1877F2; border-color:#1877F2; color:#fff; }
.msoc-ig:hover,   .msoc-ig:focus-visible{   background:#E4711E; border-color:#E4711E; color:#fff; }
.msoc-mail:hover, .msoc-mail:focus-visible{ background:var(--gold); border-color:var(--gold); color:var(--olive); }

@media (max-width:700px){
  .connect-grid{ grid-template-columns:1fr; }
  .connect-card{ min-height:58px; border-radius:14px; padding:11px 14px; gap:13px; }
  .connect-ico{ width:46px; height:46px; }
  .connect-head{ margin-bottom:20px; }
}
