/*
Theme Name: Meistroirankiai
Theme URI: https://meistroirankiai.lt
Author: Meistroirankiai.lt
Description: Profesionali WooCommerce tema įrankių el. parduotuvei. Pilna WooCommerce integracija, variabilūs produktai, AJAX krepšelis, lietuviškas checkout.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: meistroirankiai
WC requires at least: 8.0
WC tested up to: 9.0
*/

/* ──────────────────────────────────────────────────────────────
   DESIGN TOKENS
────────────────────────────────────────────────────────────── */
:root {
  --green:        #10B981;
  --green-dark:   #059669;
  --green-light:  #D1FAE5;
  --green-xlight: #ECFDF5;
  --dark:         #0F172A;
  --dark2:        #1E293B;
  --dark3:        #334155;
  --gray:         #64748B;
  --gray-light:   #94A3B8;
  --border:       #E2E8F0;
  --bg:           #F8FAFC;
  --white:        #FFFFFF;
  --red:          #EF4444;
  --blue:         #3B82F6;
  --orange:       #F59E0B;
  --radius:       8px;
  --radius-lg:    12px;
  --radius-xl:    16px;
  --shadow:       0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:    0 4px 16px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg:    0 8px 32px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
}

/* ──────────────────────────────────────────────────────────────
   RESET & BASE
────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; background: var(--white); color: var(--dark); font-size: 15px; line-height: 1.6; }
img  { max-width: 100%; height: auto; display: block; }
a    { text-decoration: none; color: inherit; }
button, input, select, textarea { font-family: inherit; }
ul, ol { list-style: none; }

/* ──────────────────────────────────────────────────────────────
   LAYOUT
────────────────────────────────────────────────────────────── */
.mi-container   { max-width: 1280px; margin: 0 auto; padding: 0 20px; }
.mi-section     { padding: 48px 0; }
.mi-section-sm  { padding: 28px 0; }
.mi-grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.mi-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.mi-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.mi-grid-5 { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; }
.mi-section-title  { font-size: 22px; font-weight: 800; color: var(--dark); letter-spacing: -.4px; }
.mi-section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.mi-see-all { font-size: 13px; font-weight: 600; color: var(--green); display: flex; align-items: center; gap: 4px; transition: gap .2s; }
.mi-see-all:hover { gap: 8px; }

/* ──────────────────────────────────────────────────────────────
   TAGS / BADGES
────────────────────────────────────────────────────────────── */
.mi-tag      { font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 4px; text-transform: uppercase; letter-spacing: .5px; display: inline-block; line-height: 1.6; }
.mi-tag-sale { background: var(--red); color: #fff; }
.mi-tag-new  { background: var(--blue); color: #fff; }
.mi-tag-best { background: var(--green); color: #fff; }
.mi-tag-kit  { background: var(--orange); color: #fff; }

/* ──────────────────────────────────────────────────────────────
   BUTTONS
────────────────────────────────────────────────────────────── */
.mi-btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; border-radius: var(--radius); font-size: 13px; font-weight: 700; border: 2px solid transparent; cursor: pointer; transition: all .18s; }
.mi-btn-primary  { background: var(--green); color: #fff; border-color: var(--green); }
.mi-btn-primary:hover { background: var(--green-dark); border-color: var(--green-dark); transform: translateY(-1px); }
.mi-btn-outline  { background: transparent; color: var(--green); border-color: var(--green); }
.mi-btn-outline:hover { background: var(--green); color: #fff; }
.mi-btn-outline-white { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.mi-btn-outline-white:hover { background: rgba(255,255,255,.1); border-color: #fff; }
.mi-btn-dark { background: var(--dark); color: #fff; border-color: var(--dark); }
.mi-btn-dark:hover { background: var(--dark2); }
.mi-btn-sm  { padding: 7px 14px; font-size: 12px; }
.mi-btn-lg  { padding: 13px 28px; font-size: 15px; }
.mi-btn-block { width: 100%; justify-content: center; }

/* ──────────────────────────────────────────────────────────────
   TOP BAR
────────────────────────────────────────────────────────────── */
.mi-topbar { background: var(--dark); color: var(--gray-light); font-size: 11px; padding: 7px 0; }
.mi-topbar-inner { display: flex; align-items: center; justify-content: space-between; }
.mi-topbar-promo { display: flex; align-items: center; gap: 20px; }
.mi-topbar-item  { display: flex; align-items: center; gap: 5px; }
.mi-topbar-links { display: flex; gap: 16px; }
.mi-topbar-links a { color: var(--gray-light); font-size: 11px; transition: color .15s; }
.mi-topbar-links a:hover { color: var(--green); }
.mi-topbar-phone { color: var(--green) !important; font-weight: 700; }

/* ──────────────────────────────────────────────────────────────
   HEADER
────────────────────────────────────────────────────────────── */
.mi-header { background: var(--white); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow); transition: box-shadow .2s; }
.mi-header.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,.1); }
.mi-header-inner { padding: 12px 0; display: flex; align-items: center; gap: 20px; }

/* Logo */
.mi-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.mi-logo-icon { width: 38px; height: 38px; background: var(--green); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mi-logo-icon svg { width: 22px; height: 22px; fill: white; }
.mi-logo-name { font-size: 18px; font-weight: 900; color: var(--dark); letter-spacing: -.5px; }
.mi-logo-tld  { font-size: 18px; font-weight: 900; color: var(--green); letter-spacing: -.5px; }
.mi-logo-sub  { font-size: 9px; font-weight: 500; color: var(--gray-light); text-transform: uppercase; letter-spacing: 1px; display: block; margin-top: 1px; }

/* Search */
.mi-search-wrap  { flex: 1; position: relative; }
.mi-search-input { width: 100%; padding: 11px 100px 11px 44px; border: 2px solid var(--border); border-radius: 10px; font-size: 14px; color: var(--dark); outline: none; transition: border-color .2s, box-shadow .2s; background: var(--bg); }
.mi-search-input:focus { border-color: var(--green); background: var(--white); box-shadow: 0 0 0 3px rgba(16,185,129,.1); }
.mi-search-icon  { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--gray-light); width: 18px; height: 18px; pointer-events: none; }
.mi-search-btn   { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); background: var(--green); color: #fff; border: none; border-radius: 7px; padding: 6px 14px; font-size: 12px; font-weight: 700; cursor: pointer; transition: background .15s; }
.mi-search-btn:hover { background: var(--green-dark); }

/* Header actions */
.mi-header-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.mi-header-btn { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 12px; border: none; background: transparent; color: var(--gray); cursor: pointer; border-radius: var(--radius); transition: all .15s; position: relative; }
.mi-header-btn:hover { background: var(--bg); color: var(--dark); }
.mi-header-btn svg { width: 22px; height: 22px; }
.mi-header-btn-label { font-size: 10px; font-weight: 500; }
.mi-cart-trigger:hover { background: var(--green-xlight) !important; color: var(--green) !important; }
.mi-cart-badge { position: absolute; top: 4px; right: 8px; background: var(--green); color: #fff; font-size: 9px; font-weight: 800; width: 17px; height: 17px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; transition: transform .2s; }

/* Mobile search bar */
.mi-mob-search-toggle { display: none !important; }

/* ──────────────────────────────────────────────────────────────
   NAV
────────────────────────────────────────────────────────────── */
.mi-nav { background: var(--white); border-bottom: 2px solid var(--border); }
.mi-nav-inner { display: flex; align-items: center; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.mi-nav-inner::-webkit-scrollbar { display: none; }
.mi-nav-all  { background: var(--green); color: #fff; padding: 12px 18px; font-size: 13px; font-weight: 700; display: flex; align-items: center; gap: 6px; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px; flex-shrink: 0; text-decoration: none; }
.mi-nav-item { display: flex; align-items: center; padding: 12px 16px; font-size: 13px; font-weight: 600; color: var(--gray); white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all .15s; text-decoration: none; }
.mi-nav-item:hover, .mi-nav-item.active { color: var(--dark); border-bottom-color: var(--green); }
.mi-nav-item-hot { color: var(--red) !important; font-weight: 700 !important; }
.mi-nav-inner li { flex-shrink: 0; list-style: none; }
.mi-nav-inner li > a { display: flex; align-items: center; padding: 12px 16px; font-size: 13px; font-weight: 600; color: var(--gray); white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all .15s; text-decoration: none; }
.mi-nav-inner li > a:hover, .mi-nav-inner li.current-menu-item > a { color: var(--dark); border-bottom-color: var(--green); }
.mi-nav-inner .sub-menu { display: none !important; }

/* ──────────────────────────────────────────────────────────────
   HERO
────────────────────────────────────────────────────────────── */
.mi-hero { background: linear-gradient(135deg, var(--dark) 0%, #1a2744 45%, #0a3d2e 100%); overflow: hidden; position: relative; min-height: 420px; display: flex; align-items: stretch; }
.mi-hero-bg { position: absolute; border-radius: 50%; background: rgba(16,185,129,.07); }
.mi-hero-bg-1 { width: 500px; height: 500px; top: -100px; right: -50px; }
.mi-hero-bg-2 { width: 300px; height: 300px; bottom: -80px; right: 200px; }
.mi-hero-inner { display: grid; grid-template-columns: 1fr 400px; align-items: center; min-height: 420px; position: relative; z-index: 1; gap: 40px; }
.mi-hero-content { padding: 48px 0; }
.mi-hero-eyebrow { display: inline-flex; align-items: center; gap: 6px; background: rgba(16,185,129,.15); border: 1px solid rgba(16,185,129,.3); color: var(--green); font-size: 11px; font-weight: 700; padding: 5px 12px; border-radius: 20px; margin-bottom: 16px; text-transform: uppercase; letter-spacing: .8px; }
.mi-hero-title { font-size: 46px; font-weight: 900; color: #fff; line-height: 1.05; letter-spacing: -1.5px; margin-bottom: 12px; }
.mi-hero-title span { color: var(--green); }
.mi-hero-sub { font-size: 15px; color: rgba(255,255,255,.6); margin-bottom: 28px; line-height: 1.6; }
.mi-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; }
.mi-hero-stats { display: flex; gap: 28px; }
.mi-hero-stat-num { font-size: 22px; font-weight: 900; color: #fff; display: block; }
.mi-hero-stat-lbl { font-size: 11px; color: rgba(255,255,255,.4); font-weight: 500; text-transform: uppercase; letter-spacing: .5px; }
.mi-hero-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-xl); padding: 24px; }
.mi-hero-card-tag { font-size: 10px; font-weight: 700; color: var(--green); text-transform: uppercase; letter-spacing: .8px; margin-bottom: 8px; }
.mi-hero-card-name { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 12px; line-height: 1.4; }
.mi-hero-price-row { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.mi-hero-price-new { font-size: 34px; font-weight: 900; color: #fff; }
.mi-hero-price-new span { color: var(--green); }
.mi-hero-price-old  { font-size: 14px; color: rgba(255,255,255,.35); text-decoration: line-through; }
.mi-hero-price-save { font-size: 11px; font-weight: 700; background: var(--red); color: #fff; padding: 2px 8px; border-radius: 4px; }
.mi-hero-chip     { background: rgba(16,185,129,.15); border: 1px solid rgba(16,185,129,.3); color: var(--green); font-size: 10px; font-weight: 600; padding: 4px 8px; border-radius: 5px; cursor: pointer; }
.mi-hero-chip.alt { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.7); }

/* ──────────────────────────────────────────────────────────────
   USP BAR
────────────────────────────────────────────────────────────── */
.mi-usp-bar   { background: var(--bg); border-bottom: 1px solid var(--border); }
.mi-usp-inner { display: grid; grid-template-columns: repeat(4,1fr); }
.mi-usp-item  { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-right: 1px solid var(--border); }
.mi-usp-item:last-child { border-right: none; }
.mi-usp-icon  { width: 36px; height: 36px; background: var(--green-xlight); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--green); }
.mi-usp-icon svg { width: 18px; height: 18px; color: var(--green); }
.mi-usp-label { font-size: 12px; font-weight: 700; color: var(--dark); }
.mi-usp-sub   { font-size: 11px; color: var(--gray-light); }

/* ──────────────────────────────────────────────────────────────
   CATEGORY GRID
────────────────────────────────────────────────────────────── */
.mi-cats-grid { display: grid; grid-template-columns: repeat(8,1fr); gap: 10px; }
.mi-cat-card { border: 1.5px solid var(--border); border-radius: var(--radius-lg); padding: 16px 8px; text-align: center; cursor: pointer; background: var(--white); transition: all .2s; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.mi-cat-card:hover { border-color: var(--green); background: var(--green-xlight); transform: translateY(-2px); }
.mi-cat-icon { width: 48px; height: 48px; background: var(--bg); border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.mi-cat-icon svg { width: 26px; height: 26px; color: var(--green); }
.mi-cat-name  { font-size: 11px; font-weight: 600; color: var(--dark); line-height: 1.3; }
.mi-cat-count { font-size: 10px; color: var(--gray-light); }

/* ──────────────────────────────────────────────────────────────
   PROMO BANNERS
────────────────────────────────────────────────────────────── */
.mi-promo-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.mi-promo-card { border-radius: var(--radius-xl); padding: 28px 24px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: 200px; cursor: pointer; }
.mi-promo-dark  { background: var(--dark2); }
.mi-promo-green { background: linear-gradient(135deg,#065F46,#059669); }
.mi-promo-mid   { background: var(--dark); }
.mi-promo-deco  { position: absolute; border-radius: 50%; background: rgba(255,255,255,.05); }
.mi-promo-deco1 { width: 180px; height: 180px; top: -40px; right: -40px; }
.mi-promo-eyebrow { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .8px; margin-bottom: 6px; }
.mi-promo-title   { font-size: 17px; font-weight: 800; color: #fff; line-height: 1.3; margin-bottom: 14px; }

/* ──────────────────────────────────────────────────────────────
   PRODUCT CARD
────────────────────────────────────────────────────────────── */
.mi-product-card { border: 1.5px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; background: var(--white); transition: all .25s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; }
.mi-product-card:hover { border-color: var(--green); box-shadow: 0 12px 40px rgba(0,0,0,.1); transform: translateY(-4px); }
.mi-product-img { background: var(--bg); aspect-ratio: 1; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.mi-product-img img { width: 100%; height: 100%; object-fit: contain; padding: 16px; transition: transform .3s; }
.mi-product-card:hover .mi-product-img img { transform: scale(1.05); }
.mi-product-tags { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; gap: 4px; }
.mi-product-wish { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; background: var(--white); border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); cursor: pointer; transition: all .15s; }
.mi-product-wish:hover { background: var(--red); border-color: var(--red); }
.mi-product-wish svg { width: 14px; height: 14px; color: var(--gray-light); }
.mi-product-wish:hover svg { color: #fff; }
.mi-product-body { padding: 12px; flex: 1; display: flex; flex-direction: column; }
.mi-product-brand { font-size: 10px; font-weight: 600; color: var(--green); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 3px; }
.mi-product-name  { font-size: 13px; font-weight: 600; color: var(--dark); line-height: 1.4; margin-bottom: 6px; flex: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mi-product-rating { display: flex; align-items: center; gap: 4px; margin-bottom: 8px; }
.mi-stars { display: flex; gap: 1px; }
.mi-star  { width: 11px; height: 11px; }
.mi-star-full  { fill: var(--orange); }
.mi-star-empty { fill: var(--border); }
.mi-product-reviews { font-size: 10px; color: var(--gray-light); }
.mi-product-variants { display: flex; gap: 4px; margin-bottom: 8px; flex-wrap: wrap; }
.mi-variant-pill { font-size: 10px; font-weight: 600; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 2px 6px; color: var(--gray); cursor: pointer; transition: all .12s; }
.mi-variant-pill:hover, .mi-variant-pill.active { border-color: var(--green); color: var(--green); background: var(--green-xlight); }
.mi-product-price-new { font-size: 18px; font-weight: 800; color: var(--dark); }
.mi-product-price-old { font-size: 12px; color: var(--gray-light); text-decoration: line-through; margin-left: 5px; }
.mi-product-save { font-size: 10px; font-weight: 700; color: var(--red); }
.mi-product-actions { display: flex; gap: 6px; margin-top: 10px; }
.mi-add-cart-btn { flex: 1; background: var(--green); color: #fff !important; border: none; padding: 9px 0; border-radius: var(--radius); font-size: 12px; font-weight: 700; cursor: pointer; transition: background .15s; display: flex; align-items: center; justify-content: center; gap: 5px; text-decoration: none !important; }
.mi-add-cart-btn:hover { background: var(--green-dark); }
.mi-add-cart-btn svg { width: 14px; height: 14px; }
.mi-quick-view-btn { background: var(--bg); border: 1.5px solid var(--border); color: var(--gray); padding: 9px 10px; border-radius: var(--radius); cursor: pointer; transition: all .15s; display: flex; align-items: center; }
.mi-quick-view-btn:hover { border-color: var(--dark); color: var(--dark); }

/* ──────────────────────────────────────────────────────────────
   SHARE+ BANNER
────────────────────────────────────────────────────────────── */
.mi-sharebanner { background: var(--dark); border-radius: var(--radius-xl); padding: 28px 32px; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; }
.mi-sharebanner-icon { width: 64px; height: 64px; background: var(--green); border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mi-sharebanner-icon svg { width: 34px; height: 34px; color: #fff; }
.mi-sharebanner-eyebrow { font-size: 10px; font-weight: 700; color: var(--green); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.mi-sharebanner-title { font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 4px; }
.mi-sharebanner-sub { font-size: 13px; color: rgba(255,255,255,.5); }
.mi-sharebanner-chips { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.mi-sharebanner-chip { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.75); font-size: 11px; font-weight: 600; padding: 4px 10px; border-radius: 6px; }

/* ──────────────────────────────────────────────────────────────
   PAYMENT BAR
────────────────────────────────────────────────────────────── */
.mi-payment-bar { background: var(--bg); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 18px 0; }
.mi-payment-inner { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.mi-payment-label { font-size: 11px; font-weight: 700; color: var(--gray); text-transform: uppercase; letter-spacing: .8px; flex-shrink: 0; }
.mi-payment-logos { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mi-payment-pill  { background: var(--white); border: 1px solid var(--border); border-radius: 6px; padding: 5px 12px; font-size: 11px; font-weight: 700; color: var(--dark); }

/* ──────────────────────────────────────────────────────────────
   BLOG
────────────────────────────────────────────────────────────── */
.mi-blog-card { border: 1.5px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; background: var(--white); transition: all .2s; }
.mi-blog-card:hover { border-color: var(--green); box-shadow: var(--shadow-md); }
.mi-blog-img { position: relative; overflow: hidden; height: 160px; background: var(--bg); }
.mi-blog-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.mi-blog-card:hover .mi-blog-img img { transform: scale(1.04); }
.mi-blog-cat  { position: absolute; top: 12px; left: 12px; background: var(--green); color: #fff; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 4px; }
.mi-blog-body { padding: 16px; }
.mi-blog-date  { font-size: 11px; color: var(--gray-light); margin-bottom: 6px; }
.mi-blog-title { font-size: 14px; font-weight: 700; color: var(--dark); line-height: 1.4; margin-bottom: 8px; }
.mi-blog-excerpt { font-size: 12px; color: var(--gray); line-height: 1.5; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mi-blog-read { font-size: 12px; font-weight: 700; color: var(--green); display: flex; align-items: center; gap: 4px; }

/* ──────────────────────────────────────────────────────────────
   REVIEWS
────────────────────────────────────────────────────────────── */
.mi-reviews-header { background: var(--dark); border-radius: var(--radius-xl); padding: 24px 28px; display: flex; align-items: center; gap: 28px; margin-bottom: 20px; flex-wrap: wrap; }
.mi-review-score-num { font-size: 52px; font-weight: 900; color: #fff; line-height: 1; display: block; }
.mi-review-score-stars { color: var(--orange); font-size: 20px; display: block; margin: 4px 0; }
.mi-review-score-count { font-size: 12px; color: rgba(255,255,255,.4); }
.mi-review-bars { flex: 1; min-width: 160px; }
.mi-review-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 5px; }
.mi-review-bar-label { font-size: 11px; color: rgba(255,255,255,.5); width: 12px; text-align: right; flex-shrink: 0; }
.mi-review-bar-track { flex: 1; height: 5px; background: rgba(255,255,255,.08); border-radius: 3px; overflow: hidden; }
.mi-review-bar-fill  { height: 100%; background: var(--orange); border-radius: 3px; }
.mi-review-card { border: 1.5px solid var(--border); border-radius: var(--radius-lg); padding: 16px; background: var(--white); }
.mi-reviewer-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff; flex-shrink: 0; }
.mi-review-verified { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; color: var(--green); font-weight: 600; margin-top: 6px; }
.mi-review-verified svg { width: 12px; height: 12px; }

/* ──────────────────────────────────────────────────────────────
   NEWSLETTER
────────────────────────────────────────────────────────────── */
.mi-newsletter { background: linear-gradient(135deg,#065F46 0%,#059669 100%); border-radius: var(--radius-xl); padding: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.mi-newsletter-title { font-size: 26px; font-weight: 900; color: #fff; margin-bottom: 8px; line-height: 1.2; }
.mi-newsletter-sub   { font-size: 14px; color: rgba(255,255,255,.7); line-height: 1.5; }
.mi-newsletter-perk  { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,.85); margin-top: 8px; }
.mi-newsletter-input { width: 100%; padding: 13px 16px; border-radius: var(--radius); border: none; font-size: 14px; outline: none; margin-bottom: 10px; }
.mi-newsletter-gdpr  { font-size: 11px; color: rgba(255,255,255,.6); display: flex; gap: 8px; align-items: flex-start; line-height: 1.4; margin-top: 10px; }

/* ──────────────────────────────────────────────────────────────
   FOOTER
────────────────────────────────────────────────────────────── */
.mi-footer { background: var(--dark); padding: 48px 0 0; }
.mi-footer-top { display: grid; grid-template-columns: 280px 1fr 1fr 1fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid var(--dark2); }
.mi-footer-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; text-decoration: none; }
.mi-footer-desc { font-size: 12px; color: rgba(255,255,255,.4); line-height: 1.7; margin-bottom: 16px; }
.mi-footer-payments { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.mi-footer-payment-pill { background: var(--dark2); border: 1px solid var(--dark3); border-radius: 5px; padding: 4px 8px; font-size: 10px; font-weight: 600; color: rgba(255,255,255,.4); }
.mi-footer-socials { display: flex; gap: 8px; margin-top: 14px; }
.mi-footer-social { width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--dark3); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .15s; text-decoration: none; }
.mi-footer-social:hover { border-color: var(--green); background: rgba(16,185,129,.1); }
.mi-footer-social svg { color: rgba(255,255,255,.5); }
.mi-footer-social:hover svg { color: var(--green); }
.mi-footer-col-title { font-size: 12px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: .8px; margin-bottom: 14px; display: block; }
.mi-footer-link { font-size: 12px; color: rgba(255,255,255,.45); transition: color .15s; display: block; margin-bottom: 8px; }
.mi-footer-link:hover { color: var(--green); }
.mi-footer-contact-item { display: flex; align-items: center; gap: 8px; font-size: 12px; color: rgba(255,255,255,.45); margin-bottom: 8px; }
.mi-footer-contact-item svg { color: var(--green); flex-shrink: 0; width: 14px; height: 14px; }
.mi-footer-contact-item a { color: rgba(255,255,255,.45); }
.mi-footer-contact-item a:hover { color: var(--green); }
.mi-footer-company-info { margin-top: 14px; }
.mi-footer-company-info span { display: block; font-size: 11px; color: rgba(255,255,255,.25); line-height: 1.9; }
.mi-footer-bottom { padding: 18px 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.mi-footer-bottom-text { font-size: 11px; color: rgba(255,255,255,.25); }
.mi-footer-bottom-links { display: flex; gap: 16px; flex-wrap: wrap; }
.mi-footer-bottom-link { font-size: 11px; color: rgba(255,255,255,.25); transition: color .15s; }
.mi-footer-bottom-link:hover { color: rgba(255,255,255,.6); }

/* ──────────────────────────────────────────────────────────────
   SIDE CART
────────────────────────────────────────────────────────────── */
.mi-cart-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 999; opacity: 0; pointer-events: none; transition: opacity .25s; }
.mi-cart-overlay.open { opacity: 1; pointer-events: all; }
.mi-side-cart { position: fixed; top: 0; right: 0; bottom: 0; width: 380px; background: var(--white); z-index: 1000; display: flex; flex-direction: column; transform: translateX(100%); transition: transform .3s cubic-bezier(.4,0,.2,1); box-shadow: -8px 0 32px rgba(0,0,0,.12); }
.mi-side-cart.open { transform: translateX(0); }
.mi-side-cart-header { padding: 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.mi-side-cart-title { font-size: 17px; font-weight: 800; color: var(--dark); }
.mi-cart-close { background: var(--bg); border: 1.5px solid var(--border); border-radius: var(--radius); padding: 7px; cursor: pointer; display: flex; align-items: center; color: var(--gray); transition: all .15s; }
.mi-cart-close:hover { background: var(--red); border-color: var(--red); color: #fff; }
.mi-side-cart-items { flex: 1; overflow-y: auto; padding: 16px; }
.mi-cart-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.mi-cart-item-img { width: 60px; height: 60px; background: var(--bg); border-radius: var(--radius); overflow: hidden; flex-shrink: 0; }
.mi-cart-item-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.mi-cart-item-name    { font-size: 12px; font-weight: 600; color: var(--dark); line-height: 1.3; margin-bottom: 3px; }
.mi-cart-item-variant { font-size: 11px; color: var(--gray-light); margin-bottom: 6px; }
.mi-cart-item-price   { font-size: 14px; font-weight: 800; color: var(--dark); }
.mi-cart-item-remove  { color: var(--gray-light); font-size: 14px; cursor: pointer; transition: color .12s; margin-left: auto; align-self: flex-start; padding: 0 4px; background: none; border: none; }
.mi-cart-item-remove:hover { color: var(--red); }
.mi-cart-qty { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.mi-cart-qty-btn { width: 24px; height: 24px; border: 1px solid var(--border); background: var(--bg); border-radius: 5px; font-size: 16px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--dark); transition: all .12s; }
.mi-cart-qty-btn:hover { border-color: var(--green); color: var(--green); }
.mi-cart-qty-num { font-size: 13px; font-weight: 700; color: var(--dark); min-width: 16px; text-align: center; }
.mi-free-ship-bar { margin-bottom: 14px; }
.mi-free-ship-text { display: flex; justify-content: space-between; font-size: 11px; color: var(--gray); margin-bottom: 6px; }
.mi-free-ship-text strong { color: var(--green); }
.mi-free-ship-track { height: 5px; background: var(--border); border-radius: 3px; overflow: hidden; }
.mi-free-ship-fill  { height: 100%; background: var(--green); border-radius: 3px; transition: width .5s; }
.mi-cart-total-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--gray); margin-bottom: 6px; }
.mi-cart-total-final { display: flex; justify-content: space-between; font-size: 16px; font-weight: 800; color: var(--dark); padding-top: 8px; border-top: 1px solid var(--border); margin-top: 4px; }

/* ──────────────────────────────────────────────────────────────
   TOAST
────────────────────────────────────────────────────────────── */
.mi-toast { position: fixed; bottom: 90px; right: 24px; background: var(--dark); color: #fff; padding: 14px 20px; border-radius: 12px; font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 10px; z-index: 2000; transform: translateY(20px); opacity: 0; transition: all .3s cubic-bezier(.4,0,.2,1); box-shadow: 0 8px 24px rgba(0,0,0,.2); border-left: 3px solid var(--green); max-width: 320px; pointer-events: none; }
.mi-toast.show { transform: translateY(0); opacity: 1; pointer-events: all; }
.mi-toast.error { border-left-color: var(--red); }

/* ──────────────────────────────────────────────────────────────
   WOOCOMMERCE — GENERAL
────────────────────────────────────────────────────────────── */
/* All WC buttons → green */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce .button {
    background: var(--green) !important; color: #fff !important; border: none !important;
    border-radius: var(--radius) !important; font-family: 'Inter',sans-serif !important;
    font-weight: 700 !important; font-size: 14px !important; padding: 10px 20px !important;
    transition: all .18s !important; cursor: pointer !important; text-decoration: none !important;
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce .button:hover { background: var(--green-dark) !important; transform: translateY(-1px) !important; }
.woocommerce .button.disabled, .woocommerce .button:disabled { background: var(--gray-light) !important; cursor: not-allowed !important; transform: none !important; }
/* WC span.onsale */
.woocommerce span.onsale { background: var(--red); border-radius: 4px; font-size: 10px; font-weight: 700; padding: 2px 7px; min-height: auto; min-width: auto; line-height: 1.6; }
/* WC notices */
.woocommerce-message, .woocommerce-info { background: var(--green-xlight) !important; border-left: 4px solid var(--green) !important; border-radius: var(--radius) !important; padding: 12px 16px !important; font-size: 13px !important; color: var(--dark) !important; margin-bottom: 16px !important; }

/* WooCommerce's own theme.css inserts an icon via ::before positioned
   for its default padding (padding-left: 3.5em). Since we override
   padding to a smaller uniform value above, that icon now overlaps
   the first letters of the text. Simplest, safest fix: remove the
   icon entirely — our boxes already have a colored left border that
   serves the same "this is a notice" signal. */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before,
.woocommerce-error li::before,
.woocommerce-no-payment-methods-notice::before,
.woocommerce-checkout .woocommerce-no-payment-methods-notice::before,
.woocommerce-notices-wrapper .woocommerce-message::before,
.woocommerce-notices-wrapper .woocommerce-info::before {
    display: none !important;
    content: none !important;
}
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-error li,
.woocommerce-no-payment-methods-notice {
    padding-left: 16px !important;
}
.woocommerce-error { background: #FEF2F2 !important; border-left: 4px solid var(--red) !important; border-radius: var(--radius) !important; padding: 12px 16px !important; font-size: 13px !important; list-style: none !important; }
/* WC breadcrumb */
.woocommerce-breadcrumb { display: none; }
/* Remove default WC content wrappers */
.woocommerce div.product { display: block !important; padding: 0 !important; }

/* ──────────────────────────────────────────────────────────────
   CATALOG / ARCHIVE
────────────────────────────────────────────────────────────── */
.mi-catalog-layout { display: grid; grid-template-columns: 240px 1fr; gap: 24px; padding: 20px 0 48px; }
.mi-catalog-sidebar .mi-filter-box { background: var(--white); border: 1.5px solid var(--border); border-radius: var(--radius-lg); margin-bottom: 12px; overflow: hidden; }
.mi-filter-box-header { padding: 14px 16px; font-size: 13px; font-weight: 700; color: var(--dark); display: flex; align-items: center; justify-content: space-between; }
.mi-catalog-topbar { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--bg); border-radius: var(--radius); border: 1px solid var(--border); margin-bottom: 16px; font-size: 13px; color: var(--gray); }
.woocommerce-ordering select { padding: 7px 12px; border: 1.5px solid var(--border); border-radius: var(--radius); font-size: 12px; font-family: inherit; color: var(--dark); outline: none; background: var(--white); cursor: pointer; }
/* Pagination */
.page-numbers { display: flex; gap: 6px; list-style: none; margin-top: 32px; flex-wrap: wrap; }
.page-numbers li a, .page-numbers li span { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1.5px solid var(--border); border-radius: var(--radius); font-size: 13px; font-weight: 600; color: var(--gray); text-decoration: none; transition: all .15s; }
.page-numbers li a:hover { border-color: var(--green); color: var(--green); }
.page-numbers li span.current { background: var(--green); border-color: var(--green); color: #fff; }

/* ──────────────────────────────────────────────────────────────
   BREADCRUMB
────────────────────────────────────────────────────────────── */
.mi-breadcrumb { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--gray-light); padding: 14px 0; flex-wrap: wrap; }
.mi-breadcrumb a { color: var(--gray-light); transition: color .15s; }
.mi-breadcrumb a:hover { color: var(--green); }
.mi-breadcrumb-sep { color: var(--border); }

/* ──────────────────────────────────────────────────────────────
   SOCIAL PROOF / TRUST
────────────────────────────────────────────────────────────── */
.mi-viewers-notice { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--gray); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 7px 12px; margin-bottom: 12px; }
.mi-viewers-notice svg { color: var(--green); }
.mi-low-stock-notice { display: flex; align-items: center; gap: 7px; background: #FEF2F2; border: 1px solid #FECACA; border-left: 3px solid var(--red); color: #991B1B; font-size: 12px; font-weight: 700; padding: 8px 12px; border-radius: 0 6px 6px 0; margin-bottom: 12px; }
.mi-low-stock-notice svg { flex-shrink: 0; }

/* ──────────────────────────────────────────────────────────────
   WHATSAPP BUTTON
────────────────────────────────────────────────────────────── */
.mi-whatsapp-btn { position: fixed; bottom: 80px; right: 24px; z-index: 500; background: #25D366; color: #fff; border-radius: 50px; padding: 12px 20px 12px 16px; display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; text-decoration: none; box-shadow: 0 4px 20px rgba(37,211,102,.4), 0 2px 8px rgba(0,0,0,.15); transition: all .2s; font-family: 'Inter', sans-serif; }
.mi-whatsapp-btn:hover { background: #128C7E; transform: translateY(-2px); color: #fff; }
@media (max-width: 600px) { .mi-whatsapp-btn { padding: 12px; border-radius: 50%; } .mi-whatsapp-btn span { display: none; } }

/* ──────────────────────────────────────────────────────────────
   ANIMATIONS
────────────────────────────────────────────────────────────── */
@keyframes fadeInUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeInLeft  { from { opacity:0; transform:translateX(-24px); } to { opacity:1; transform:translateX(0); } }
@keyframes fadeInRight { from { opacity:0; transform:translateX(24px); } to { opacity:1; transform:translateX(0); } }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.6; } }
@keyframes spin  { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
[data-animate] { opacity: 0; }
[data-animate].animated { animation: fadeInUp .6s cubic-bezier(.4,0,.2,1) both; }
[data-animate="fadeInLeft"].animated  { animation-name: fadeInLeft; }
[data-animate="fadeInRight"].animated { animation-name: fadeInRight; }
[data-animate="pulse"].animated { animation: pulse 2s ease-in-out infinite; opacity:1; }

/* ──────────────────────────────────────────────────────────────
   PAGE TEMPLATES
────────────────────────────────────────────────────────────── */
.mi-post-content { font-size: 15px; line-height: 1.85; color: var(--gray); max-width: 760px; }
.mi-post-content h2, .mi-post-content h3 { color: var(--dark); font-weight: 800; margin: 24px 0 10px; }
.mi-post-content p { margin-bottom: 14px; }
.mi-post-content img { border-radius: var(--radius-lg); }

/* ──────────────────────────────────────────────────────────────
   RESPONSIVE
────────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .mi-cats-grid { grid-template-columns: repeat(4,1fr); }
    .mi-footer-top { grid-template-columns: 1fr 1fr; gap: 24px; }
}
@media (max-width: 900px) {
    .mi-hero-inner { grid-template-columns: 1fr; }
    .mi-hero-card  { display: none; }
    .mi-grid-4 { grid-template-columns: repeat(2,1fr); }
    .mi-grid-3 { grid-template-columns: repeat(2,1fr); }
    .mi-sharebanner { grid-template-columns: 1fr; }
    .mi-newsletter  { grid-template-columns: 1fr; }
    .mi-catalog-layout { grid-template-columns: 1fr; }
    .mi-catalog-sidebar { display: none; }
    .mi-side-cart { width: 100%; }
    .mi-reviews-header { flex-direction: column; gap: 16px; }
}
@media (max-width: 700px) {
    /* Header */
    .mi-topbar { display: none; }
    .mi-header-inner { flex-wrap: nowrap; padding: 10px 0; gap: 8px; }
    .mi-logo-name, .mi-logo-tld { font-size: 15px; }
    .mi-logo-sub { display: none; }
    .mi-logo-icon { width: 32px; height: 32px; border-radius: 8px; }
    .mi-search-wrap { display: none; }
    .mi-header-actions { margin-left: auto; }
    .mi-header-btn { padding: 6px 8px; }
    .mi-header-btn-label { display: none; }
    .mi-mob-search-toggle { display: flex !important; }
    /* Nav */
    .mi-nav-all, .mi-nav-item, .mi-nav-inner li > a { padding: 10px 12px; font-size: 12px; }
    /* Grid */
    .mi-grid-2,.mi-grid-3,.mi-grid-4,.mi-grid-5 { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
    .mi-cats-grid { grid-template-columns: repeat(3,1fr) !important; gap: 8px !important; }
    /* Cards */
    .mi-product-body { padding: 8px !important; }
    .mi-product-name { font-size: 11px !important; }
    .mi-product-brand { font-size: 9px !important; }
    .mi-product-price-new { font-size: 14px !important; }
    .mi-variant-pill { font-size: 9px !important; padding: 1px 4px !important; }
    .mi-add-cart-btn { font-size: 11px !important; }
    /* Hero */
    .mi-hero-title { font-size: 30px !important; }
    .mi-hero-actions { flex-direction: column; }
    .mi-hero-actions .mi-btn { width: 100%; justify-content: center; }
    /* USP */
    .mi-usp-inner { grid-template-columns: 1fr 1fr !important; }
    .mi-usp-item { border-right: none !important; border-bottom: 1px solid var(--border) !important; }
    .mi-usp-item:nth-child(odd) { border-right: 1px solid var(--border) !important; }
    /* Promo */
    .mi-promo-grid { grid-template-columns: 1fr !important; }
    /* Share banner */
    .mi-sharebanner { padding: 20px !important; }
    .mi-sharebanner-icon { display: none; }
    /* Newsletter */
    .mi-newsletter { padding: 24px 20px !important; }
    /* Footer */
    .mi-footer-top { grid-template-columns: 1fr !important; }
    .mi-footer-bottom { flex-direction: column; align-items: flex-start; }
    /* Section */
    .mi-section { padding: 28px 0; }
    .mi-section-sm { padding: 18px 0; }
    .mi-container { padding: 0 14px; }
    .mi-section-title { font-size: 18px; }
    /* Blog */
    .mi-blog-img { height: 120px; }
    .mi-blog-excerpt { display: none; }
}

/* ============================================================
   CHECKOUT — style WC native template
   ============================================================ */

/* Page wrapper */
.woocommerce-checkout .woocommerce { max-width: 1200px; margin: 0 auto; padding: 0 20px 60px; }

/* WC default layout: col2-set (left) + order_review (right) */
.woocommerce-checkout .col2-set {
    width: 55% !important;
    float: left !important;
    margin-right: 0 !important;
    padding-right: 24px !important;
}
.woocommerce-checkout #order_review_heading { display: none !important; }
.woocommerce-checkout #order_review {
    width: 42% !important;
    float: right !important;
    position: sticky !important;
    top: 90px !important;
    background: #fff !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    padding: 0 !important;
}
/* Clearfix */
.woocommerce-checkout #customer_details::after,
.woocommerce-checkout form.checkout::after {
    content: ''; display: table; clear: both;
}

/* ── Left column: form fields ── */
.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2 {
    width: 100% !important;
    float: none !important;
    margin: 0 0 16px 0 !important;
    background: #fff;
    border: 1.5px solid #E2E8F0;
    border-radius: 14px;
    overflow: hidden;
    padding: 0 !important;
}
.woocommerce-checkout .col-1 h3,
.woocommerce-checkout .col-2 h3,
.woocommerce-checkout h3#ship-to-different-address {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0F172A !important;
    padding: 14px 20px !important;
    margin: 0 !important;
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}
.woocommerce-checkout .col-1 h3::before { content: "1"; width:24px;height:24px;border-radius:50%;background:#10B981;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.woocommerce-checkout .col-2 h3::before { content: "2"; width:24px;height:24px;border-radius:50%;background:#10B981;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0; }

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
    padding: 18px 20px !important;
}

/* WC form rows */
.woocommerce-checkout .form-row { margin-bottom: 12px !important; }
.woocommerce-checkout .form-row label {
    font-size: 10px !important; font-weight: 700 !important;
    color: #0F172A !important; margin-bottom: 4px !important;
    text-transform: uppercase !important; letter-spacing: .4px !important;
    display: block !important;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
    width: 100% !important;
    padding: 11px 14px !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: 'Inter', sans-serif !important;
    color: #0F172A !important;
    outline: none !important;
    background: #fff !important;
    -webkit-appearance: none !important;
    transition: border-color .15s !important;
    height: auto !important;
    box-shadow: none !important;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus {
    border-color: #10B981 !important;
    box-shadow: 0 0 0 3px rgba(16,185,129,.1) !important;
}
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last { width: 47% !important; }

/* ── Shipping methods section ── */
.woocommerce-checkout #shipping_method { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.woocommerce-checkout #shipping_method li {
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    margin-bottom: 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    background: #fff !important;
    transition: all .15s !important;
}
.woocommerce-checkout #shipping_method li:has(input:checked) {
    border-color: #10B981 !important;
    background: #ECFDF5 !important;
}
.woocommerce-checkout #shipping_method input[type="radio"] {
    accent-color: #10B981 !important;
    width: 16px !important; height: 16px !important;
    flex-shrink: 0 !important; cursor: pointer !important;
    margin: 0 !important;
}
.woocommerce-checkout #shipping_method label {
    font-size: 13px !important; font-weight: 600 !important;
    color: #0F172A !important; cursor: pointer !important;
    margin: 0 !important; text-transform: none !important;
    letter-spacing: 0 !important; flex: 1 !important;
}

/* ── Shipping section wrapper ── */
.woocommerce-checkout .woocommerce-shipping-fields {
    background: #fff;
    border: 1.5px solid #E2E8F0;
    border-radius: 14px;
    margin-bottom: 16px !important;
    overflow: hidden;
}
.woocommerce-checkout h3#order_comments_title,
.woocommerce-checkout .woocommerce-additional-fields > h3 {
    font-size: 14px !important; font-weight: 800 !important;
    color: #0F172A !important; padding: 14px 20px !important;
    margin: 0 !important; background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

/* Hide ship to different address checkbox (simplify) */
.woocommerce-checkout .woocommerce-shipping-fields h3#ship-to-different-address { display: none !important; }
.woocommerce-checkout #ship-to-different-address-checkbox { display: none !important; }

/* ── Payment section ── */
.woocommerce-checkout #payment {
    background: #fff !important;
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 14px !important;
    padding: 0 !important;
    overflow: hidden !important;
    margin-top: 16px !important;
}
.woocommerce-checkout #payment > h3 {
    font-size: 14px !important; font-weight: 800 !important;
    color: #0F172A !important; padding: 14px 20px !important;
    margin: 0 !important; background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
}
.woocommerce-checkout #payment ul.payment_methods {
    padding: 16px !important; margin: 0 !important;
    list-style: none !important; border: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li {
    border: 1.5px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    margin-bottom: 8px !important;
    background: #fff !important;
    transition: all .15s !important;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) {
    border-color: #10B981 !important;
    background: #ECFDF5 !important;
}
.woocommerce-checkout #payment ul.payment_methods label {
    font-size: 13px !important; font-weight: 600 !important;
    color: #0F172A !important; margin: 0 !important;
    text-transform: none !important; letter-spacing: 0 !important;
    display: flex !important; align-items: center !important; gap: 8px !important;
}
.woocommerce-checkout #payment ul.payment_methods input[type="radio"] {
    accent-color: #10B981 !important;
    width: 16px !important; height: 16px !important; flex-shrink: 0 !important;
}
.woocommerce-checkout #payment .payment_box {
    background: #F8FAFC !important;
    border-radius: 8px !important;
    padding: 10px 12px !important;
    font-size: 12px !important;
    color: #64748B !important;
    margin: 8px 0 0 !important;
    border: 1px solid #E2E8F0 !important;
}

/* ── Place order button ── */
.woocommerce-checkout #payment .place-order {
    padding: 16px 20px !important;
    background: none !important;
    border-top: 1px solid #E2E8F0 !important;
}
.woocommerce-checkout #payment #place_order {
    width: 100% !important;
    background: #10B981 !important;
    color: #fff !important;
    border: none !important;
    padding: 15px !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    font-family: 'Inter', sans-serif !important;
    box-shadow: 0 4px 14px rgba(16,185,129,.3) !important;
    transition: all .2s !important;
    letter-spacing: -.2px !important;
}
.woocommerce-checkout #payment #place_order:hover {
    background: #059669 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(16,185,129,.4) !important;
}

/* ── ORDER REVIEW (right column) ── */
.woocommerce-checkout #order_review table.shop_table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
    margin: 0 !important;
}
.woocommerce-checkout #order_review table.shop_table thead {
    background: #F8FAFC !important;
    border-bottom: 1px solid #E2E8F0 !important;
}
.woocommerce-checkout #order_review table.shop_table thead th {
    padding: 12px 16px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    text-align: left !important;
    border: none !important;
}
.woocommerce-checkout #order_review table.shop_table tbody tr {
    border-bottom: 1px solid #E2E8F0 !important;
}
.woocommerce-checkout #order_review table.shop_table td {
    padding: 10px 16px !important;
    font-size: 12px !important;
    color: #0F172A !important;
    font-weight: 600 !important;
    vertical-align: middle !important;
    border: none !important;
    word-break: break-word !important;
}
.woocommerce-checkout #order_review table.shop_table .product-name {
    line-height: 1.4 !important;
    font-weight: 600 !important;
}
.woocommerce-checkout #order_review table.shop_table tfoot tr {
    border-top: 1px solid #E2E8F0 !important;
}
.woocommerce-checkout #order_review table.shop_table tfoot td,
.woocommerce-checkout #order_review table.shop_table tfoot th {
    padding: 8px 16px !important;
    font-size: 12px !important;
    border: none !important;
}
.woocommerce-checkout #order_review table.shop_table tfoot .order-total th,
.woocommerce-checkout #order_review table.shop_table tfoot .order-total td {
    font-size: 16px !important;
    font-weight: 900 !important;
    color: #10B981 !important;
    padding-top: 12px !important;
    border-top: 2px solid #E2E8F0 !important;
}

/* Terms checkbox */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
    font-size: 11px !important;
    color: #94A3B8 !important;
    padding: 0 16px 12px !important;
}

/* ── No payment notice ── */
.woocommerce-checkout .woocommerce-no-payment-methods-notice {
    background: #FEF3C7 !important;
    border: 1px solid #FCD34D !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    color: #92400E !important;
    margin: 0 16px 12px !important;
}

/* ── WC notices ── */
.woocommerce-checkout .woocommerce-error { list-style: none !important; }
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-message {
    border-radius: 8px !important;
    margin-bottom: 16px !important;
}

/* ── Responsive ── */
@media (max-width: 860px) {
    .woocommerce-checkout .col2-set { width: 100% !important; float: none !important; padding-right: 0 !important; }
    .woocommerce-checkout #order_review { width: 100% !important; float: none !important; position: static !important; margin-bottom: 20px !important; }
    /* Show summary first on mobile */
    .woocommerce-checkout form.checkout { display: flex !important; flex-direction: column !important; }
    .woocommerce-checkout #order_review { order: -1 !important; }
    .woocommerce-checkout .col2-set { order: 1 !important; }
    .woocommerce-checkout #payment { order: 2 !important; }
}
@media (max-width: 500px) {
    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last { width: 100% !important; float: none !important; }
}

/* ============================================================
   CART PAGE (/cart/) — full native WC cart styling
   Mirrors the checkout page's design language (same tokens,
   same card/border/radius language) so both feel consistent.
   ============================================================ */

.woocommerce-cart .woocommerce {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 60px;
    box-sizing: border-box;
}
.woocommerce-cart .woocommerce::after {
    content: '';
    display: table;
    clear: both;
}

/* Two columns via float, same technique as checkout (proven to work
   once the outer container isn't artificially narrow) */
.woocommerce-cart form.woocommerce-cart-form {
    width: 62% !important;
    float: left !important;
    box-sizing: border-box;
}
.woocommerce-cart .cart-collaterals {
    width: 34% !important;
    float: right !important;
    margin: 0 !important;
    position: sticky;
    top: 90px;
}

/* Cart table */
.woocommerce-cart table.shop_table.cart {
    width: 100%;
    border-collapse: collapse;
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}
.woocommerce-cart table.shop_table.cart thead {
    background: var(--bg);
    border-bottom: 1px solid var(--border);
}
.woocommerce-cart table.shop_table.cart thead th {
    padding: 14px 16px;
    font-size: 11px;
    font-weight: 700;
    color: var(--dark);
    text-transform: uppercase;
    letter-spacing: .4px;
    text-align: left;
    border: none;
}
.woocommerce-cart table.shop_table.cart tbody tr { border-bottom: 1px solid var(--border); }
.woocommerce-cart table.shop_table.cart tbody tr:last-child { border-bottom: none; }
.woocommerce-cart table.shop_table.cart td {
    padding: 14px 16px;
    vertical-align: middle;
    border: none;
    font-size: 13px;
    color: var(--dark);
}
.woocommerce-cart td.product-thumbnail img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--bg);
    padding: 4px;
}
.woocommerce-cart td.product-name {
    font-weight: 600;
    line-height: 1.4;
    word-break: break-word;
}
.woocommerce-cart td.product-name a { color: var(--dark); text-decoration: none; }
.woocommerce-cart td.product-name a:hover { color: var(--green); }
.woocommerce-cart .variation { font-size: 11px; color: var(--gray-light); margin-top: 4px; }
.woocommerce-cart .variation p { margin: 0; }
.woocommerce-cart td.product-price,
.woocommerce-cart td.product-subtotal { font-weight: 700; color: var(--dark); white-space: nowrap; }

.woocommerce-cart td.product-quantity .quantity {
    display: inline-flex;
    border: 1.5px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
}
.woocommerce-cart .quantity input.qty {
    width: 52px;
    padding: 8px 6px;
    border: none;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--dark);
    font-family: 'Inter', sans-serif;
}
.woocommerce-cart .quantity input.qty:focus { outline: none; }

.woocommerce-cart td.product-remove a.remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: var(--gray-light) !important;
    font-size: 18px;
    text-decoration: none;
    transition: all .15s;
}
.woocommerce-cart td.product-remove a.remove:hover { background: #FEF2F2; color: var(--red) !important; }

.woocommerce-cart .actions {
    padding: 16px !important;
    background: var(--bg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.woocommerce-cart .coupon { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.woocommerce-cart .coupon input#coupon_code {
    padding: 10px 14px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius);
    font-size: 13px;
    font-family: inherit;
    color: var(--dark);
    outline: none;
    min-width: 180px;
}
.woocommerce-cart .coupon input#coupon_code:focus { border-color: var(--green); }
.woocommerce-cart .coupon button.button,
.woocommerce-cart button[name="update_cart"] {
    background: var(--dark) !important;
    color: #fff !important;
    border: none !important;
    padding: 10px 18px !important;
    border-radius: var(--radius) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}
.woocommerce-cart .coupon button.button:hover,
.woocommerce-cart button[name="update_cart"]:hover { background: var(--dark2) !important; }

.woocommerce-cart .cart_totals {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}
.woocommerce-cart .cart_totals h2 {
    font-size: 15px;
    font-weight: 800;
    color: var(--dark);
    padding: 16px 20px;
    margin: 0;
    background: var(--bg);
    border-bottom: 1px solid var(--border);
}
.woocommerce-cart .cart_totals table.shop_table { width: 100%; border-collapse: collapse; }
.woocommerce-cart .cart_totals table.shop_table tr { border-bottom: 1px solid var(--border); }
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
    padding: 12px 20px;
    font-size: 13px;
    color: var(--gray);
    font-weight: 600;
    border: none;
    text-align: left;
}
.woocommerce-cart .cart_totals table.shop_table th { color: var(--dark); font-weight: 700; }
.woocommerce-cart .cart_totals table.shop_table tr.order-total th,
.woocommerce-cart .cart_totals table.shop_table tr.order-total td {
    font-size: 18px;
    font-weight: 900;
    color: var(--green);
    padding-top: 14px;
    border-top: 2px solid var(--border);
}
.woocommerce-cart .cart_totals .woocommerce-shipping-totals select {
    padding: 8px 10px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius);
    font-size: 12px;
    font-family: inherit;
    color: var(--dark);
}

.woocommerce-cart .wc-proceed-to-checkout { padding: 16px 20px; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100% !important;
    background: var(--green) !important;
    color: #fff !important;
    border: none !important;
    padding: 15px !important;
    border-radius: var(--radius) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(16,185,129,.3);
    transition: all .2s;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--green-dark) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(16,185,129,.4);
}

.woocommerce-cart .cross-sells { margin-top: 32px; width: 100%; clear: both; }
.woocommerce-cart .cross-sells h2 { font-size: 18px; font-weight: 800; color: var(--dark); margin-bottom: 16px; }

.woocommerce-cart .cart-empty {
    background: var(--bg);
    border-radius: var(--radius-lg);
    padding: 40px 20px;
    text-align: center;
    font-size: 14px;
    color: var(--gray);
}
.woocommerce-cart .return-to-shop a.button {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    background: var(--green) !important;
    color: #fff !important;
    padding: 10px 20px !important;
    border-radius: var(--radius) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    margin-top: 14px;
}

.woocommerce-cart .woocommerce-message {
    background: var(--green-xlight) !important;
    border-left: 4px solid var(--green) !important;
    border-radius: var(--radius) !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    color: var(--dark) !important;
    margin-bottom: 20px !important;
}

@media (max-width: 900px) {
    .woocommerce-cart form.woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals {
        width: 100% !important;
        float: none !important;
        position: static;
    }
    .woocommerce-cart .cart-collaterals { margin-top: 20px !important; }
}
@media (max-width: 700px) {
    .woocommerce-cart .woocommerce { padding: 16px 14px 40px; }
    .woocommerce-cart table.shop_table.cart thead { display: none; }
    .woocommerce-cart table.shop_table.cart tbody tr {
        display: grid;
        grid-template-columns: 64px 1fr;
        gap: 4px 12px;
        padding: 12px;
        position: relative;
    }
    .woocommerce-cart table.shop_table.cart td { padding: 2px 0; border: none; }
    .woocommerce-cart td.product-thumbnail { grid-row: 1 / span 3; }
    .woocommerce-cart td.product-remove { position: absolute; top: 10px; right: 10px; grid-row: unset; grid-column: unset; }
    .woocommerce-cart td.product-price { display: none; }
}