/* ══════════════════════════════════════════════════════════════
   MEGASTORE v5 — KaBuM Style | SVG Icons | Full Responsive
   ══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --primary:     #ff6b00;
  --primary-dk:  #e05d00;
  --primary-lt:  #ff8c33;
  --blue-dk:     #0a1628;
  --blue-md:     #0f2040;
  --blue-card:   #111d35;
  --blue-border: #1a2d4d;
  --blue-hover:  #162238;
  --text-w:      #ffffff;
  --text-lt:     #c8d4e8;
  --text-muted:  #7a90b0;
  --success:     #22c55e;
  --danger:      #ef4444;
  --star:        #fbbf24;
  --r:           8px;
  --rlg:         12px;
  --shadow:      0 4px 24px rgba(0,0,0,0.4);
  --tr:          0.18s ease;
  --nav-h:       60px;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }

body.vs-page {
  background: var(--blue-dk) !important;
  color: var(--text-lt) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
body.vs-page a { color:inherit; text-decoration:none; }
body.vs-page img { display:block; max-width:100%; }
body.vs-page button { font-family:'Inter',sans-serif; cursor:pointer; }
body.vs-page ul { list-style:none; }
body.vs-page input, body.vs-page select, body.vs-page textarea { font-family:'Inter',sans-serif; }

/* ── Theme Chrome Hide ───────────────────────────────────────── */
body.vs-page header.site-header, body.vs-page .site-header,
body.vs-page #masthead, body.vs-page .wp-site-blocks>header,
body.vs-page footer.site-footer, body.vs-page .site-footer,
body.vs-page #colophon, body.vs-page .header-area,
body.vs-page .footer-area, body.vs-page .nav-primary,
body.vs-page #header, body.vs-page #footer,
body.vs-page .elementor-location-header,
body.vs-page .header-widget-area { display:none !important; }
body.vs-page .site-content, body.vs-page #content,
body.vs-page .content-area, body.vs-page main.site-main,
body.vs-page #main, body.vs-page .wp-site-blocks>main,
body.vs-page .entry-content, body.vs-page article.page,
body.vs-page .page-content { margin-top:0 !important; padding-top:0 !important; }

/* ── Welcome Bar ─────────────────────────────────────────────── */
.vs-welcome-bar {
  position:fixed; top:var(--nav-h); left:0; right:0; z-index:99998;
  background:var(--primary); color:#fff;
  font-size:12px; font-weight:600; display:none;
}
.vs-welcome-inner {
  max-width:1400px; margin:0 auto; padding:5px 20px;
  display:flex; align-items:center; justify-content:space-between;
}
.vs-welcome-logout {
  background:rgba(0,0,0,.2); border:none; color:#fff;
  padding:2px 10px; border-radius:4px; font-size:11px;
  font-family:'Inter',sans-serif; cursor:pointer;
}

/* ── Navbar ──────────────────────────────────────────────────── */
.vs-navbar {
  position:fixed; top:0; left:0; right:0; z-index:99999;
  background:var(--blue-dk); border-bottom:2px solid var(--primary);
  height:var(--nav-h);
}
body.admin-bar .vs-navbar { top:32px; }
@media (max-width:782px) { body.admin-bar .vs-navbar { top:46px; } }

.vs-navbar-inner {
  max-width:1400px; margin:0 auto; padding:0 16px;
  height:100%; display:flex; align-items:center; gap:12px;
}
.vs-navbar-brand {
  display:flex; align-items:center; gap:6px;
  font-size:20px; font-weight:900; color:#fff;
  flex-shrink:0; text-decoration:none;
}
.vs-navbar-brand span { color:var(--primary); }
.vs-navbar-brand img { height:36px; width:auto; }

.vs-navbar-search {
  flex:1; max-width:520px;
  display:flex; align-items:center;
  background:var(--blue-md); border:1px solid var(--blue-border);
  border-radius:6px; overflow:hidden;
}
.vs-navbar-search input {
  flex:1; background:none; border:none; outline:none;
  color:#fff; padding:0 12px; height:38px;
  font-size:13px;
}
.vs-navbar-search input::placeholder { color:var(--text-muted); }
.vs-navbar-search button {
  background:var(--primary); border:none; color:#fff;
  width:42px; height:38px; display:flex; align-items:center; justify-content:center;
  transition:background var(--tr); flex-shrink:0;
}
.vs-navbar-search button:hover { background:var(--primary-dk); }
.vs-navbar-search button svg { width:16px; height:16px; }

.vs-navbar-nav {
  display:flex; align-items:center; gap:2px; margin-left:auto;
}
.vs-navbar-nav li { position:relative; }
.vs-navbar-nav a, .vs-navbar-nav>li>button {
  color:var(--text-lt); font-size:12px; font-weight:500;
  padding:6px 10px; border-radius:4px;
  transition:all var(--tr); white-space:nowrap;
  background:none; border:none; display:flex; align-items:center; gap:4px;
}
.vs-navbar-nav a:hover, .vs-navbar-nav>li>button:hover { color:#fff; background:var(--blue-md); }

.vs-cart-btn {
  display:flex !important; align-items:center; gap:6px;
  background:var(--primary) !important; color:#fff !important;
  border:none !important; border-radius:6px !important;
  padding:7px 14px !important; font-size:12px !important; font-weight:700 !important;
  transition:background var(--tr) !important; white-space:nowrap;
  position:relative !important;
}
.vs-cart-btn:hover { background:var(--primary-dk) !important; }
.vs-cart-btn:hover svg { stroke:#fff; }
.vs-cart-count {
  background:var(--blue-dk); color:var(--primary);
  font-size:10px; font-weight:900; border-radius:50%;
  width:18px; height:18px; display:none;
  align-items:center; justify-content:center;
  font-family:'Inter',sans-serif;
}
.vs-cart-count.show { display:inline-flex; }

/* Dropdown */
.vs-nav-has-dropdown { position:relative; }
.vs-nav-has-dropdown::after { content:''; position:absolute; top:100%; left:0; right:0; height:12px; }
.vs-caret { font-size:10px; transition:transform .2s; }
.vs-nav-has-dropdown:hover .vs-caret { transform:rotate(180deg); }
.vs-dropdown-menu {
  position:absolute; top:calc(100% + 12px); left:0;
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg); padding:6px; min-width:220px;
  box-shadow:var(--shadow);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:all .18s; z-index:99998;
}
.vs-nav-has-dropdown:hover .vs-dropdown-menu { opacity:1; visibility:visible; transform:translateY(0); }
.vs-dropdown-item {
  display:flex; align-items:center; gap:10px;
  padding:8px 12px; border-radius:6px;
  color:var(--text-lt); font-size:12px; font-weight:500;
  transition:all var(--tr); text-decoration:none; white-space:nowrap;
}
.vs-dropdown-item:hover { background:var(--blue-hover); color:var(--primary); }
.vs-drop-icon { font-size:14px; width:18px; text-align:center; }
.vs-dropdown-divider { height:1px; background:var(--blue-border); margin:4px 4px; }
.vs-dropdown-all { color:var(--primary) !important; font-weight:700; font-size:11px; }

/* Carrinho mobile (só aparece em mobile, antes do hamburguer) */
.vs-cart-mobile-btn {
  display:none; position:relative; background:none; border:none;
  padding:6px 8px; cursor:pointer; color:var(--text-lt);
  align-items:center; justify-content:center;
  margin-left:auto; /* empurra para a direita em mobile */
}
.vs-cart-mobile-btn svg { width:22px; height:22px; stroke:var(--text-lt); }
.vs-cart-count-mobile {
  position:absolute; top:2px; right:2px;
  background:var(--primary); color:#fff; font-size:9px; font-weight:800;
  border-radius:50%; width:16px; height:16px;
  display:flex; align-items:center; justify-content:center;
}
@media (max-width:900px) {
  .vs-cart-mobile-btn { display:flex; }
  /* Em mobile, a search some via display:none (já no breakpoint 480px),
     então o auto-margin no carrinho empurra tudo para a direita */
  .vs-navbar-search { flex:1; }
}

/* Hamburger */
.vs-menu-toggle {
  display:none!important; flex-direction:column; gap:5px;
  background:none; border:none; padding:6px; cursor:pointer;
}
.vs-menu-toggle span { display:block; width:20px; height:2px; background:var(--text-lt); border-radius:2px; transition:all .3s; }
.vs-menu-toggle.vs-open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.vs-menu-toggle.vs-open span:nth-child(2) { opacity:0; }
.vs-menu-toggle.vs-open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile menu */
.vs-mobile-menu {
  display:none; position:fixed; top:var(--nav-h); left:0; right:0; bottom:0;
  background:var(--blue-dk); z-index:100000; overflow-y:auto; padding:0;
  flex-direction:column;
}
.vs-mobile-menu.vs-open { display:flex; }
.vs-mobile-search { display:flex; gap:8px; padding:12px 16px; border-bottom:1px solid var(--blue-border); }
.vs-mobile-search input {
  flex:1; background:var(--blue-md); border:1px solid var(--blue-border);
  border-radius:6px; color:#fff; padding:9px 12px; font-size:13px; outline:none;
}
.vs-mobile-search button {
  background:var(--primary); border:none; border-radius:6px;
  color:#fff; padding:9px 14px; font-size:12px; font-weight:700;
}
.vs-mobile-menu a, .vs-mobile-menu>button {
  display:flex; align-items:center; gap:10px;
  padding:13px 16px; border-bottom:1px solid var(--blue-border);
  color:var(--text-lt); font-size:14px; text-decoration:none;
  background:none; border-left:none; border-right:none; border-top:none;
  text-align:left; width:100%; transition:background var(--tr);
}
.vs-mobile-menu a:hover, .vs-mobile-menu>button:hover { background:var(--blue-md); color:#fff; }
.vs-mobile-cat-label {
  display:block; padding:10px 16px 4px;
  font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--primary);
}
.vs-mobile-cat-link { padding-left:32px !important; font-size:13px !important; color:var(--text-muted) !important; }

/* Page padding */
.vs-page-wrap { padding-top:var(--nav-h); overflow-x:hidden; }
body.vs-has-welcome .vs-page-wrap { padding-top:calc(var(--nav-h) + 29px); }
/* ── Banner ──────────────────────────────────────────────────── */
/* Banner proporção 1920x600 — ocupa 100vw sem cortar */
.vs-banner-slider {
  position: relative;
  overflow: hidden;
  background: var(--blue-md);

  width: 100%;
  max-width: 1920px;
  margin: 0 auto;

  aspect-ratio: 1920 / 600;

  max-height: 600px;
  min-height: 120px;
}

.vs-banner-track {
  display: flex;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
  height: 100%;
}

.vs-banner-slide {
  flex: 0 0 100%;
  position: relative;
  display: block;
  height: 100%;
}

.vs-banner-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
/* Mobile: mantém proporção mas com altura mínima decente */
@media (max-width:480px) {
  .vs-banner-slider { max-height:200px; min-height:100px; }
}
.vs-banner-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,22,40,.6) 0%,transparent 60%); pointer-events:none; }
.vs-banner-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.2);
  color:#fff; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:all .2s; z-index:10; backdrop-filter:blur(4px);
}
.vs-banner-btn:hover { background:var(--primary); border-color:var(--primary); }
.vs-banner-btn svg { width:18px; height:18px; stroke:#fff; fill:none; }
.vs-banner-prev { left:12px; }
.vs-banner-next { right:12px; }
.vs-banner-dots { position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:10; }
.vs-banner-dot { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.4); border:none; cursor:pointer; transition:all .25s; padding:0; }
.vs-banner-dot.vs-dot-active { background:var(--primary); width:22px; border-radius:4px; }

/* ── Section ─────────────────────────────────────────────────── */
.vs-section { max-width:1400px; margin:0 auto; padding:28px 16px 0; }
.vs-section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.vs-section-title { font-size:18px; font-weight:800; color:#fff; display:flex; align-items:center; gap:8px; }
.vs-section-title a { color:#fff; transition:color var(--tr); }
.vs-section-title a:hover { color:var(--primary); }
.vs-section-accent { color:var(--primary); }
.vs-see-all {
  font-size:12px; font-weight:600; color:var(--primary);
  background:rgba(255,107,0,.1); border:1px solid rgba(255,107,0,.3);
  border-radius:20px; padding:5px 14px; transition:all var(--tr);
  text-decoration:none; white-space:nowrap;
}
.vs-see-all:hover { background:var(--primary); color:#fff; }

/* ── Products grid ───────────────────────────────────────────── */
.vs-products-row {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px; margin-bottom:32px;
}
@media (max-width:1200px) { .vs-products-row { grid-template-columns:repeat(4,1fr); } }
@media (max-width:900px)  { .vs-products-row { grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px)  { .vs-products-row { grid-template-columns:repeat(2,1fr); gap:8px; } }

/* ── Product card ────────────────────────────────────────────── */
.vs-product-card {
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg); overflow:hidden; cursor:pointer;
  transition:all var(--tr); position:relative;
  display:flex; flex-direction:column;
}
.vs-product-card:hover { border-color:var(--primary); transform:translateY(-3px); box-shadow:0 8px 32px rgba(255,107,0,.15); }
.vs-product-img {
  height:180px; background:#0d1930;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; position:relative;
}
@media (max-width:600px) { .vs-product-img { height:140px; } }
.vs-product-img img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.vs-product-card:hover .vs-product-img img { transform:scale(1.07); }
.vs-product-img-ph { font-size:44px; opacity:.25; }

.vs-product-badge {
  position:absolute; top:8px; left:8px;
  background:var(--primary); color:#fff;
  font-size:9px; font-weight:800; letter-spacing:.5px;
  padding:3px 7px; border-radius:4px; text-transform:uppercase;
}
.vs-product-badge.badge-top    { background:#7c3aed; }
.vs-product-badge.badge-novo   { background:var(--success); }
.vs-product-badge.badge-goty   { background:#f59e0b; color:#000; }
.vs-product-badge.badge-gamer  { background:var(--danger); }
.vs-product-badge.badge-combo  { background:#0ea5e9; }

.vs-product-fav {
  position:absolute; top:8px; right:8px;
  background:rgba(0,0,0,.6); border:1.5px solid rgba(255,255,255,.3);
  border-radius:50%; width:32px; height:32px;
  display:flex; align-items:center; justify-content:center;
  transition:all var(--tr); cursor:pointer;
}
.vs-product-fav .vs-heart-svg { width:16px; height:16px; stroke:#fff; fill:none; transition:stroke .2s,fill .2s; flex-shrink:0; display:block; }
.vs-product-fav:hover .vs-heart-svg { stroke:#ff6b6b; fill:none; }
.vs-product-fav.active .vs-heart-svg { stroke:#ef4444; fill:#ef4444; }
.vs-product-fav.active { border-color:#ef4444; }

.vs-product-info { padding:10px; display:flex; flex-direction:column; gap:5px; flex:1; }
.vs-product-brand { font-size:10px; font-weight:700; color:var(--primary); text-transform:uppercase; letter-spacing:1px; }
.vs-product-name { font-size:12px; font-weight:600; color:#fff; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.vs-product-stars { display:flex; align-items:center; gap:4px; }
.vs-stars-fill { color:var(--star); font-size:11px; letter-spacing:-1px; }
.vs-reviews-count { font-size:10px; color:var(--text-muted); }
.vs-product-price-wrap { margin-top:auto; padding-top:4px; }
.vs-product-old { font-size:11px; color:var(--text-muted); text-decoration:line-through; }
.vs-product-price { font-size:17px; font-weight:800; color:#fff; line-height:1.1; }
.vs-product-price-sub { font-size:10px; color:var(--text-muted); }
.vs-product-disc { font-size:10px; font-weight:700; color:var(--success); }

.vs-btn-add {
  width:100%; background:var(--primary); color:#fff; border:none;
  border-radius:6px; padding:8px; font-size:11px; font-weight:700;
  letter-spacing:.5px; transition:background var(--tr);
  margin-top:7px; display:flex; align-items:center; justify-content:center; gap:5px;
}
.vs-btn-add:hover { background:var(--primary-dk); }
.vs-btn-add svg { width:13px; height:13px; stroke:#fff; fill:none; flex-shrink:0; }

/* ── Produto individual ──────────────────────────────────────── */
.vs-produto-page { max-width:1200px; margin:0 auto; padding:24px 16px 60px; }
.vs-breadcrumb { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--text-muted); margin-bottom:20px; flex-wrap:wrap; }
.vs-breadcrumb a { color:var(--primary); }
.vs-breadcrumb span { opacity:.4; }
.vs-produto-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-bottom:40px; }
@media (max-width:768px) { .vs-produto-grid { grid-template-columns:1fr; gap:16px; } }

.vs-produto-gallery { display:flex; flex-direction:column; gap:10px; }
.vs-produto-main-img {
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg);
  display:flex; align-items:center; justify-content:center; min-height:340px;
  overflow:hidden;
}
.vs-produto-main-img img { width:100%; height:340px; object-fit:cover; transition:transform .3s; display:block; }
.vs-produto-main-img img:hover { transform:scale(1.03); }
.vs-produto-thumbs { display:flex; gap:8px; flex-wrap:wrap; }
.vs-produto-thumb {
  width:64px; height:64px; border-radius:8px; overflow:hidden; cursor:pointer;
  border:2px solid var(--blue-border); background:var(--blue-card);
  display:flex; align-items:center; justify-content:center;
  transition:border-color var(--tr);
}
.vs-produto-thumb:hover, .vs-produto-thumb.active { border-color:var(--primary); }
.vs-produto-thumb img { width:100%; height:100%; object-fit:contain; padding:4px; }

.vs-produto-info-col { display:flex; flex-direction:column; gap:12px; }
.vs-produto-brand-tag { font-size:11px; font-weight:700; color:var(--primary); text-transform:uppercase; letter-spacing:1.5px; }
.vs-produto-name-big { font-size:22px; font-weight:800; color:#fff; line-height:1.3; }
@media (max-width:600px) { .vs-produto-name-big { font-size:18px; } }
.vs-produto-stars-row { display:flex; align-items:center; gap:8px; }
.vs-produto-rating-count { font-size:12px; color:var(--primary); }

.vs-produto-price-box {
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg); padding:16px; display:flex; flex-direction:column; gap:5px;
}
.vs-produto-old { font-size:13px; color:var(--text-muted); text-decoration:line-through; }
.vs-produto-price-big { font-size:30px; font-weight:900; color:#fff; line-height:1; }
.vs-produto-disc-tag {
  display:inline-block; background:rgba(34,197,94,.15); color:var(--success);
  font-size:11px; font-weight:700; padding:3px 10px; border-radius:4px;
}
.vs-produto-parcel { font-size:12px; color:var(--text-muted); }
.vs-produto-parcel strong { color:var(--success); }
.vs-produto-desc { font-size:13px; color:var(--text-lt); line-height:1.7; border-top:1px solid var(--blue-border); padding-top:12px; }

.vs-produto-actions { display:flex; flex-direction:column; gap:8px; }
.vs-btn-comprar {
  background:var(--primary); color:#fff; border:none; border-radius:var(--r);
  padding:13px; font-size:14px; font-weight:800;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:background var(--tr);
}
.vs-btn-comprar:hover { background:var(--primary-dk); }
.vs-btn-comprar svg { width:16px; height:16px; stroke:#fff; fill:none; }
.vs-btn-carrinho-sec {
  background:transparent; color:var(--primary); border:2px solid var(--primary);
  border-radius:var(--r); padding:11px; font-size:13px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:all var(--tr);
}
.vs-btn-carrinho-sec:hover { background:rgba(255,107,0,.1); }
.vs-btn-carrinho-sec svg { width:15px; height:15px; stroke:currentColor; fill:none; }
.vs-btn-fav-big {
  background:transparent; color:var(--text-muted); border:1px solid var(--blue-border);
  border-radius:var(--r); padding:10px; font-size:13px; font-weight:500;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:all var(--tr);
}
.vs-btn-fav-big:hover, .vs-btn-fav-big.active { color:var(--danger); border-color:var(--danger); }
.vs-btn-fav-big svg { width:15px; height:15px; stroke:currentColor; fill:none; transition:all var(--tr); }
.vs-btn-fav-big.active svg { fill:var(--danger); }

/* Relacionados */
.vs-relacionados { border-top:1px solid var(--blue-border); padding-top:32px; }

/* ── Cart ────────────────────────────────────────────────────── */
.vs-cart-page { max-width:1100px; margin:0 auto; padding:24px 16px 60px; }
.vs-page-title { font-size:20px; font-weight:800; color:#fff; margin-bottom:20px; display:flex; align-items:center; gap:10px; }
.vs-page-title svg { width:22px; height:22px; stroke:var(--primary); fill:none; }

.vs-cart-layout { display:grid; grid-template-columns:1fr 320px; gap:20px; align-items:start; }
@media (max-width:768px) { .vs-cart-layout { grid-template-columns:1fr; } }

.vs-cart-item {
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg); padding:14px;
  display:flex; gap:14px; align-items:center; margin-bottom:10px;
}
.vs-cart-item-img { width:72px; height:72px; object-fit:contain; flex-shrink:0; background:var(--blue-md); border-radius:8px; padding:4px; }
.vs-cart-item-ph { width:72px; height:72px; flex-shrink:0; background:var(--blue-md); border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:28px; opacity:.4; }
.vs-cart-item-name { font-size:13px; font-weight:600; color:#fff; margin-bottom:4px; }
.vs-cart-item-price { font-size:16px; font-weight:800; color:var(--primary); }
.vs-qty-ctrl { display:flex; align-items:center; gap:8px; margin-top:6px; }
.vs-qty-btn {
  background:var(--blue-md); border:1px solid var(--blue-border); color:#fff;
  width:26px; height:26px; border-radius:4px; font-size:14px;
  display:flex; align-items:center; justify-content:center;
  transition:background var(--tr);
}
.vs-qty-btn:hover { background:var(--primary); }
.vs-qty-val { font-weight:700; color:#fff; min-width:20px; text-align:center; }
.vs-cart-remove {
  margin-left:auto; background:none; border:none;
  display:flex; align-items:center; justify-content:center;
  padding:6px; border-radius:6px; transition:background var(--tr);
}
.vs-cart-remove svg { width:16px; height:16px; stroke:var(--text-muted); fill:none; transition:stroke var(--tr); }
.vs-cart-remove:hover { background:rgba(239,68,68,.1); }
.vs-cart-remove:hover svg { stroke:var(--danger); }

.vs-cart-summary {
  background:var(--blue-card); border:1px solid var(--blue-border);
  border-radius:var(--rlg); padding:18px; position:sticky; top:80px;
}
.vs-summary-title { font-size:14px; font-weight:700; color:#fff; margin-bottom:14px; }
.vs-summary-row { display:flex; justify-content:space-between; font-size:13px; color:var(--text-muted); margin-bottom:8px; }
.vs-summary-frete { color:var(--success); font-weight:600; }
.vs-summary-total { font-size:17px; font-weight:800; color:#fff; border-top:1px solid var(--blue-border); padding-top:10px; margin-top:4px; display:flex; justify-content:space-between; }
.vs-summary-total span { color:var(--primary); }
.vs-btn-checkout {
  width:100%; background:var(--primary); color:#fff; border:none;
  border-radius:var(--r); padding:12px; font-size:13px; font-weight:800;
  margin-top:12px; transition:background var(--tr);
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.vs-btn-checkout:hover { background:var(--primary-dk); }
.vs-btn-checkout svg { width:15px; height:15px; stroke:#fff; fill:none; }

/* Cupom */
.vs-cupom-row { display:flex; gap:8px; margin:12px 0 6px; }
.vs-cupom-row .vs-input { flex:1; }
.vs-cupom-btn {
  background:var(--blue-md); color:var(--primary); border:1px solid var(--primary);
  border-radius:var(--r); padding:0 12px; font-weight:700; white-space:nowrap;
}

/* ── Checkout ────────────────────────────────────────────────── */
.vs-checkout-page { max-width:1100px; margin:0 auto; padding:24px 16px 60px; }
.vs-checkout-layout { display:grid; grid-template-columns:1fr 340px; gap:20px; align-items:start; }
@media (max-width:768px) { .vs-checkout-layout { grid-template-columns:1fr; } }
@media (max-width:768px) { .vs-checkout-summary-col { order:-1; } }

.vs-checkout-section { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:var(--rlg); padding:20px; margin-bottom:14px; }
.vs-checkout-section h3 { font-size:14px; font-weight:700; color:#fff; margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.vs-checkout-section h3 svg { width:16px; height:16px; stroke:var(--primary); fill:none; }

.vs-form-group { margin-bottom:12px; }
.vs-form-group label { display:block; font-size:11px; font-weight:600; color:var(--text-muted); letter-spacing:.5px; margin-bottom:5px; }
.vs-form-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:480px) { .vs-form-row { grid-template-columns:1fr; } }
.vs-input {
  width:100%; box-sizing:border-box;
  background:var(--blue-md); border:1px solid var(--blue-border);
  border-radius:var(--r); color:#fff; padding:10px 12px;
  font-size:13px; outline:none; transition:border-color .2s;
}
.vs-input:focus { border-color:var(--primary); }
.vs-input::placeholder { color:var(--text-muted); }
.vs-input.error { border-color:var(--danger); }
.vs-input.ok    { border-color:var(--success); }
select.vs-input option { background:var(--blue-md); }

.vs-frete-row { display:flex; gap:8px; }
.vs-frete-row .vs-input { flex:1; }
.vs-frete-btn {
  background:var(--primary); color:#fff; border:none;
  border-radius:var(--r); padding:0 14px; font-weight:700; white-space:nowrap;
  transition:background var(--tr);
}
.vs-frete-btn:hover { background:var(--primary-dk); }
.vs-field-msg { font-size:11px; margin-top:4px; min-height:14px; font-weight:500; }
.vs-field-msg.ok  { color:var(--success); }
.vs-field-msg.err { color:var(--danger); }

/* Payment tabs */
.vs-payment-tabs { display:flex; gap:8px; margin-bottom:14px; }
.vs-payment-tab {
  flex:1; padding:9px 6px; background:var(--blue-md); border:1px solid var(--blue-border);
  border-radius:var(--r); color:var(--text-muted); font-size:12px; font-weight:600;
  cursor:pointer; text-align:center; transition:all var(--tr);
  display:flex; align-items:center; justify-content:center; gap:5px;
}
.vs-payment-tab svg { width:14px; height:14px; stroke:currentColor; fill:none; }
.vs-payment-tab.active { background:rgba(255,107,0,.1); border-color:var(--primary); color:var(--primary); }
.vs-payment-panel { display:none; }
.vs-payment-panel.active { display:block; }

/* Card preview */
.vs-card-preview {
  background:linear-gradient(135deg,#1a2a4a,#0a1628);
  border-radius:10px; padding:18px; margin-bottom:14px;
  border:1px solid var(--blue-border); position:relative; min-height:110px;
}
.vs-card-number { font-size:18px; font-weight:700; color:#fff; letter-spacing:3px; margin-bottom:12px; font-family:monospace; }
.vs-card-holder { font-size:11px; color:var(--text-muted); text-transform:uppercase; letter-spacing:1px; }
.vs-card-expiry { position:absolute; right:18px; bottom:18px; font-size:11px; color:var(--text-muted); }
.vs-card-brand-logo { position:absolute; top:14px; right:14px; height:24px; width:auto; }
.vs-card-brand-text { position:absolute; top:14px; right:14px; font-size:11px; font-weight:800; color:var(--primary); }

/* PIX / Boleto panels */
.vs-pix-box, .vs-boleto-box {
  background:var(--blue-md); border:1px solid var(--blue-border);
  border-radius:var(--r); padding:20px; text-align:center;
}
.vs-pix-box svg, .vs-boleto-box svg { width:48px; height:48px; margin:0 auto 10px; display:block; stroke:var(--primary); fill:none; }
.vs-pix-box p, .vs-boleto-box p { font-size:12px; color:var(--text-muted); margin-top:4px; }

/* ── Auth pages ──────────────────────────────────────────────── */
.vs-auth-page { min-height:calc(100vh - var(--nav-h)); display:flex; align-items:center; justify-content:center; padding:40px 16px; }
.vs-auth-box { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:16px; padding:32px; width:100%; max-width:400px; }
.vs-auth-icon { width:48px; height:48px; margin:0 auto 12px; display:block; stroke:var(--primary); fill:none; }
.vs-auth-box h2 { font-size:20px; font-weight:800; color:#fff; text-align:center; margin-bottom:4px; }
.vs-auth-box p.vs-auth-sub { font-size:13px; color:var(--text-muted); text-align:center; margin-bottom:20px; }
.vs-auth-actions { margin-top:16px; display:flex; flex-direction:column; gap:10px; }
.vs-btn-primary {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--primary); color:#fff; border:none;
  border-radius:var(--r); padding:12px 24px;
  font-size:13px; font-weight:700; transition:background var(--tr); cursor:pointer; text-decoration:none;
}
.vs-btn-primary:hover { background:var(--primary-dk); color:#fff; }
.vs-auth-link { font-size:12px; color:var(--text-muted); text-align:center; margin-top:12px; }
.vs-auth-link a { color:var(--primary); font-weight:600; }
.vs-msg { font-size:12px; padding:8px 12px; border-radius:6px; font-weight:500; min-height:16px; margin-top:6px; }
.vs-msg-success { color:var(--success); background:rgba(34,197,94,.1); }
.vs-msg-error   { color:var(--danger);  background:rgba(239,68,68,.1); }

/* ── Minha Conta ─────────────────────────────────────────────── */
.vs-minha-conta-page { max-width:960px; margin:0 auto; padding:24px 16px 60px; }
.vs-conta-layout { display:grid; grid-template-columns:200px 1fr; gap:20px; align-items:start; }
@media (max-width:768px) { .vs-conta-layout { grid-template-columns:1fr; } }
.vs-conta-sidebar { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:var(--rlg); padding:18px; position:sticky; top:80px; }
.vs-conta-avatar { width:60px; height:60px; border-radius:50%; background:linear-gradient(135deg,var(--primary),var(--primary-lt)); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:900; color:#fff; margin:0 auto 10px; }
.vs-conta-sidebar-name { font-size:13px; font-weight:700; color:#fff; text-align:center; margin-bottom:14px; }
.vs-conta-nav { display:flex; flex-direction:column; gap:2px; }
.vs-conta-nav-item { display:flex; align-items:center; gap:8px; padding:9px 10px; border-radius:6px; color:var(--text-muted); font-size:12px; font-weight:500; text-decoration:none; transition:all var(--tr); background:none; border:none; cursor:pointer; font-family:'Inter',sans-serif; text-align:left; width:100%; }
.vs-conta-nav-item svg { width:14px; height:14px; stroke:currentColor; fill:none; flex-shrink:0; }
.vs-conta-nav-item:hover { background:var(--blue-hover); color:#fff; }
.vs-conta-nav-active { background:rgba(255,107,0,.1) !important; color:var(--primary) !important; }
.vs-conta-nav-logout:hover { background:rgba(239,68,68,.1) !important; color:var(--danger) !important; }
.vs-conta-section { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:var(--rlg); padding:20px; }
.vs-conta-section h2 { font-size:17px; font-weight:800; color:#fff; margin-bottom:4px; }
.vs-conta-section-sub { font-size:12px; color:var(--text-muted); margin-bottom:18px; }
.vs-conta-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:480px) { .vs-conta-info-grid { grid-template-columns:1fr; } }
.vs-conta-info-item { background:var(--blue-md); border:1px solid var(--blue-border); border-radius:var(--r); padding:12px; }
.vs-conta-info-label { font-size:10px; font-weight:700; color:var(--text-muted); letter-spacing:1px; text-transform:uppercase; margin-bottom:3px; }
.vs-conta-info-value { font-size:13px; font-weight:600; color:#fff; }
.vs-conta-section .vs-form-group { max-width:380px; }
.vs-senha-strength { display:flex; align-items:center; gap:10px; margin-top:6px; }
.vs-strength-bar { flex:1; height:3px; background:var(--blue-border); border-radius:2px; overflow:hidden; }
#vs-strength-fill { height:100%; width:0; border-radius:2px; transition:all .3s; }
#vs-strength-label { font-size:11px; font-weight:600; min-width:80px; }

/* ── Favoritos ───────────────────────────────────────────────── */
.vs-favs-page { max-width:1200px; margin:0 auto; padding:24px 16px 60px; }
.vs-favs-gate { display:flex; justify-content:center; align-items:center; min-height:300px; }
.vs-favs-gate-box { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:var(--rlg); padding:40px; text-align:center; max-width:340px; }
.vs-favs-gate-box svg { width:48px; height:48px; stroke:var(--text-muted); fill:none; margin:0 auto 12px; display:block; }
.vs-favs-gate-box h3 { font-size:17px; font-weight:700; color:#fff; margin-bottom:8px; }
.vs-favs-gate-box p { font-size:13px; color:var(--text-muted); margin-bottom:18px; }
.vs-favs-empty { text-align:center; padding:60px 20px; color:var(--text-muted); }
.vs-favs-empty svg { width:56px; height:56px; stroke:var(--text-muted); fill:none; margin:0 auto 12px; display:block; opacity:.4; }
#vs-favs-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
@media (max-width:900px) { #vs-favs-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px) { #vs-favs-grid { grid-template-columns:repeat(2,1fr); } }

/* ── Cupons ──────────────────────────────────────────────────── */
.vs-cupons-page { max-width:900px; margin:0 auto; padding:24px 16px 60px; }
.vs-cupons-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (max-width:600px) { .vs-cupons-grid { grid-template-columns:1fr; } }
.vs-cupom-card { background:var(--blue-card); border:2px dashed var(--blue-border); border-radius:var(--rlg); padding:18px; display:flex; align-items:center; gap:14px; transition:border-color var(--tr); }
.vs-cupom-card:hover { border-color:var(--primary); }
.vs-cupom-icon { width:40px; height:40px; stroke:var(--primary); fill:none; flex-shrink:0; }
.vs-cupom-code { font-size:15px; font-weight:900; color:var(--primary); letter-spacing:1px; font-family:monospace; }
.vs-cupom-desc { font-size:12px; color:var(--text-muted); margin-top:2px; }
.vs-cupom-copy { margin-left:auto; background:var(--blue-md); border:1px solid var(--blue-border); color:var(--text-muted); border-radius:6px; padding:5px 10px; font-size:11px; font-weight:600; transition:all var(--tr); white-space:nowrap; display:flex; align-items:center; gap:4px; }
.vs-cupom-copy svg { width:12px; height:12px; stroke:currentColor; fill:none; }
.vs-cupom-copy:hover { border-color:var(--primary); color:var(--primary); }
.vs-cupom-copy.copied { background:rgba(34,197,94,.1); border-color:var(--success); color:var(--success); }

/* ── Categorias ──────────────────────────────────────────────── */
.vs-cats-page { max-width:1100px; margin:0 auto; padding:24px 16px 60px; }
.vs-cats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:768px) { .vs-cats-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .vs-cats-grid { grid-template-columns:1fr; } }
.vs-cat-card-big {
  position:relative; border-radius:var(--rlg); overflow:hidden;
  min-height:200px; text-decoration:none; display:flex;
  flex-direction:column; justify-content:flex-end;
  background-size:cover; background-position:center; background-color:var(--blue-card);
  border:1px solid var(--blue-border);
  transition:all var(--tr);
}
.vs-cat-card-big:hover { transform:translateY(-3px); box-shadow:0 10px 32px rgba(0,0,0,.5); border-color:var(--primary); }
.vs-cat-card-big:hover .vs-cat-card-overlay { background:linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.15) 100%); }
.vs-cat-card-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.05) 100%);
  transition:background .3s;
}
.vs-cat-card-content { position:relative; z-index:1; padding:18px 16px; display:flex; flex-direction:column; gap:4px; }
.vs-cat-icon-big { font-size:28px; margin-bottom:4px; }
.vs-cat-card-big h3 { font-size:17px; font-weight:800; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.6); }
.vs-cat-card-big p { font-size:11px; color:rgba(255,255,255,.75); line-height:1.4; }
.vs-cat-card-big .vs-cat-count { font-size:11px; font-weight:700; color:var(--primary); margin-top:4px; }

/* ── Resultados ──────────────────────────────────────────────── */
.vs-resultados-page { max-width:1200px; margin:0 auto; padding:24px 16px 60px; }

/* ── Page hero ───────────────────────────────────────────────── */
.vs-page-hero { background:linear-gradient(135deg,var(--blue-md),var(--blue-dk)); border-bottom:1px solid var(--blue-border); padding:24px 16px 18px; }
.vs-page-hero-inner { max-width:1400px; margin:0 auto; }
.vs-page-hero h1 { font-size:22px; font-weight:900; color:#fff; }
.vs-page-hero p  { font-size:13px; color:var(--text-muted); margin-top:3px; }

/* ── Institucional ───────────────────────────────────────────── */
.vs-institucional { max-width:860px; margin:0 auto; padding:32px 16px 60px; }
.vs-institucional h1 { font-size:26px; font-weight:800; color:#fff; margin-bottom:18px; }
.vs-institucional h2 { font-size:16px; font-weight:700; color:var(--primary); margin:22px 0 8px; }
.vs-institucional p  { font-size:13px; color:var(--text-lt); line-height:1.8; margin-bottom:10px; }

/* ── Demo overlay ────────────────────────────────────────────── */
.vs-demo-overlay { position:fixed; inset:0; background:rgba(0,0,0,.88); z-index:999999; display:flex; align-items:center; justify-content:center; padding:20px; }
.vs-demo-box { background:var(--blue-card); border:2px solid var(--primary); border-radius:20px; padding:40px 32px; max-width:480px; width:100%; text-align:center; }
.vs-demo-box svg { width:56px; height:56px; color:red; stroke:var(--success); fill:none; margin:0 auto 12px; display:block; }
.vs-demo-box h2 { font-size:24px; font-weight:900; color:var(--primary); margin-bottom:8px; }
.vs-demo-box p  { font-size:13px; color:var(--text-lt); line-height:1.7; }
.vs-demo-box code { display:block; background:var(--blue-md); padding:12px 14px; border-radius:8px; font-size:12px; color:var(--primary); margin-top:14px; text-align:left; word-break:break-all; }

/* ── Empty states ────────────────────────────────────────────── */
.vs-empty { text-align:center; padding:60px 20px; color:var(--text-muted); }
.vs-empty svg { width:56px; height:56px; stroke:var(--text-muted); fill:none; margin:0 auto 12px; display:block; opacity:.35; }
.vs-empty a { color:var(--primary); font-weight:700; }

/* ── Toast ───────────────────────────────────────────────────── */
.vs-toast {
  position:fixed; bottom:24px; right:24px; z-index:999999;
  background:var(--success); color:#fff;
  padding:12px 18px; border-radius:8px; font-weight:700; font-size:13px;
  box-shadow:0 4px 20px rgba(0,0,0,.3);
  display:flex; align-items:center; gap:8px;
  animation:vs-toast-in .3s ease;
}
.vs-toast svg { width:16px; height:16px; stroke:#fff; fill:none; }
.vs-toast.vs-toast-err { background:var(--danger); }
@keyframes vs-toast-in { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }

/* ── Footer ──────────────────────────────────────────────────── */
.vs-footer { background:var(--blue-md); border-top:2px solid var(--primary); padding:36px 16px 18px; margin-top:40px; }
.vs-footer-grid { max-width:1200px; margin:0 auto 20px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:28px; }
@media (max-width:768px) { .vs-footer-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:480px) { .vs-footer-grid { grid-template-columns:1fr; } }
.vs-footer-brand h3 { font-size:18px; font-weight:900; color:#fff; margin-bottom:8px; }
.vs-footer-brand h3 span { color:var(--primary); }
.vs-footer-brand p { font-size:12px; color:var(--text-muted); line-height:1.7; }
.vs-footer-col h4 { font-size:11px; font-weight:700; color:#fff; letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; }
.vs-footer-col ul li { margin-bottom:7px; }
.vs-footer-col ul li a { font-size:12px; color:var(--text-muted); transition:color var(--tr); }
.vs-footer-col ul li a:hover { color:var(--primary); }
.vs-footer-bottom { max-width:1200px; margin:0 auto; border-top:1px solid var(--blue-border); padding-top:14px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.vs-footer-bottom p { font-size:11px; color:var(--text-muted); }
.vs-footer-aviso { font-size:10px; color:var(--primary); font-weight:700; background:rgba(255,107,0,.1); padding:3px 10px; border-radius:4px; }

/* ── Responsive tweaks ───────────────────────────────────────── */
@media (max-width:900px) { .vs-menu-toggle { display:flex!important; } .vs-navbar-nav { display:none; } .vs-navbar-search { max-width:none; flex:1; } }
@media (max-width:900px) { .vs-navbar-search { flex:1; max-width:none; } }
@media (max-width:480px) { .vs-navbar-search { display:none; } }
/* Quando search some, o carrinho mobile herda o margin-left:auto e fica na direita */
@media (max-width:480px) { .vs-cart-mobile-btn { margin-left:auto; } }

/* ── Auth pages (Login / Cadastro) ──────────────────────────── */
.vs-auth-page { display:flex; justify-content:center; align-items:flex-start; padding:40px 16px 60px; min-height:60vh; }
.vs-auth-box { background:var(--blue-md); border:1px solid var(--blue-border); border-radius:14px; padding:36px 32px; width:100%; max-width:420px; text-align:center; }
.vs-auth-box h2 { font-size:20px; font-weight:800; color:#fff; margin:10px 0 4px; }
.vs-auth-sub { font-size:13px; color:var(--text-muted); margin-bottom:24px; }
.vs-auth-divider { font-size:11px; color:var(--text-muted); margin:18px 0; position:relative; }
.vs-auth-divider::before,.vs-auth-divider::after { content:''; position:absolute; top:50%; width:42%; height:1px; background:var(--blue-border); }
.vs-auth-divider::before { left:0; } .vs-auth-divider::after { right:0; }
@media (max-width:480px) { .vs-auth-box { padding:24px 18px; } }

/* ── Força o footer em todas as páginas VS ───────────────────── */
.vs-page .vs-footer { display:block!important; }

/* ── Abas produto (Descrição / Specs / Avaliações) ──────────── */
.vs-produto-tabs-wrap { border-top:1px solid var(--blue-border); margin-top:32px; padding-top:24px; }
.vs-produto-tabs { display:flex; gap:4px; margin-bottom:24px; border-bottom:1px solid var(--blue-border); }
.vs-ptab {
  background:none; border:none; padding:10px 20px; font-size:13px; font-weight:600;
  color:var(--text-muted); cursor:pointer; border-bottom:2px solid transparent;
  transition:all var(--tr); margin-bottom:-1px; border-radius:6px 6px 0 0;
}
.vs-ptab:hover { color:#fff; }
.vs-ptab.active { color:var(--primary); border-bottom-color:var(--primary); background:rgba(255,107,0,.06); }
.vs-ptab-panel { animation:vs-fadein .2s; }

.vs-produto-desc-full { font-size:14px; color:var(--text-lt); line-height:1.8; white-space:pre-wrap; }

.vs-specs-table { width:100%; border-collapse:collapse; font-size:13px; }
.vs-specs-table tr { border-bottom:1px solid var(--blue-border); }
.vs-specs-table tr:last-child { border-bottom:none; }
.vs-specs-table th { width:35%; padding:10px 12px; color:var(--text-muted); font-weight:600; text-align:left; background:rgba(255,255,255,.03); }
.vs-specs-table td { padding:10px 12px; color:#fff; }

/* Resumo de avaliações */
.vs-reviews-summary { display:flex; gap:32px; align-items:flex-start; margin-bottom:28px; padding:20px; background:var(--blue-card); border-radius:12px; border:1px solid var(--blue-border); }
@media(max-width:600px){ .vs-reviews-summary { flex-direction:column; gap:16px; } }
.vs-reviews-score { text-align:center; min-width:100px; }
.vs-reviews-big-num { font-size:52px; font-weight:900; color:#fff; line-height:1; }
.vs-reviews-total-count { font-size:11px; color:var(--text-muted); margin-top:4px; }
.vs-reviews-bars { flex:1; display:flex; flex-direction:column; gap:7px; justify-content:center; }
.vs-reviews-bar-row { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text-muted); }
.vs-reviews-bar-bg { flex:1; height:8px; background:var(--blue-border); border-radius:4px; overflow:hidden; }
.vs-reviews-bar-fill { height:100%; background:var(--primary); border-radius:4px; transition:width .4s; }
.vs-reviews-bar-pct { min-width:30px; text-align:right; }

/* Lista de avaliações */
.vs-reviews-list { display:flex; flex-direction:column; gap:16px; }
.vs-review-item { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:10px; padding:16px; }
.vs-review-header { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.vs-review-avatar { width:36px; height:36px; border-radius:50%; background:var(--primary); color:#fff; font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.vs-review-name { font-size:13px; font-weight:700; color:#fff; }
.vs-review-stars { display:flex; align-items:center; gap:6px; margin-top:2px; }
.vs-review-date { font-size:11px; color:var(--text-muted); }
.vs-review-verified { margin-left:auto; font-size:10px; color:var(--success); background:rgba(34,197,94,.1); padding:3px 8px; border-radius:4px; white-space:nowrap; }
.vs-review-text { font-size:13px; color:var(--text-lt); line-height:1.6; }

/* ── Bandeiras de cartão ─────────────────────────────────────── */
.vs-card-flags { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-bottom:14px; padding:10px 12px; background:rgba(255,255,255,.04); border-radius:8px; border:1px solid var(--blue-border); }
.vs-flag { display:inline-flex; align-items:center; justify-content:center; height:22px; padding:0 8px; border-radius:4px; font-size:10px; font-weight:800; letter-spacing:.5px; }
.vs-flag-visa  { background:#1434CB; color:#fff; font-style:italic; font-size:12px; }
.vs-flag-mc    { background:transparent; padding:0; }
.vs-flag-elo   { background:#FFCA00; color:#000; font-weight:900; font-size:12px; font-style:italic; }
.vs-flag-amex  { background:#2E77BC; color:#fff; }
.vs-flag-hiper { background:#8B0000; color:#fff; }
.vs-flag-pix   { background:#32BCAD; color:#fff; }

/* ── Botão confirmar pedido ──────────────────────────────────── */
.vs-btn-confirmar {
  width:100%; margin-top:10px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dk));
  color:#fff; border:none; border-radius:8px;
  padding:0 16px; font-size:13px; font-weight:700; letter-spacing:.5px;
  cursor:pointer; height:40px; line-height:40px;
  display:block; text-align:center;
  transition:all var(--tr); box-sizing:border-box;
}
.vs-btn-confirmar:hover { background:linear-gradient(135deg,var(--primary-lt),var(--primary)); }

/* ── Certificados de segurança ───────────────────────────────── */
.vs-security-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; justify-content:center; }
.vs-sec-badge { font-size:10px; color:var(--text-muted); background:rgba(255,255,255,.04); border:1px solid var(--blue-border); border-radius:4px; padding:4px 8px; }

/* ── Página Suporte ──────────────────────────────────────────── */
.vs-suporte-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:20px; }
@media(max-width:600px){ .vs-suporte-grid { grid-template-columns:1fr; } }
.vs-suporte-card { background:var(--blue-card); border:1px solid var(--blue-border); border-radius:12px; padding:20px; display:flex; flex-direction:column; gap:8px; }
.vs-suporte-card span { font-size:28px; }
.vs-suporte-card h3 { font-size:15px; font-weight:700; color:#fff; }
.vs-suporte-card p { font-size:13px; color:var(--text-muted); line-height:1.6; }

/* ── Seletor de tamanho nos cards ────────────────────────────── */
.vs-size-select-wrap { margin:6px 0 4px; }
.vs-size-select {
  width:100%; padding:6px 8px; font-size:12px; font-weight:600;
  background:var(--blue-md); color:#fff; border:1px solid var(--blue-border);
  border-radius:6px; outline:none; cursor:pointer; transition:border-color var(--tr);
}
.vs-size-select:focus { border-color:var(--primary); }
.vs-size-select-err { border-color:var(--danger)!important; animation:vs-shake .4s; }
.vs-btn-add-disabled {
  opacity:.5; cursor:not-allowed!important;
  background:var(--blue-border)!important; color:var(--text-muted)!important;
}

/* ── Seletor de tamanho na página individual ─────────────────── */
.vs-produto-size-wrap { margin:12px 0 16px; }
.vs-size-label { font-size:12px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.5px; display:block; margin-bottom:8px; }
.vs-size-btns { display:flex; flex-wrap:wrap; gap:8px; }
.vs-size-btn {
  min-width:44px; padding:7px 12px; font-size:13px; font-weight:700;
  background:var(--blue-card); color:var(--text-lt);
  border:1.5px solid var(--blue-border); border-radius:6px; cursor:pointer;
  transition:all var(--tr);
}
.vs-size-btn:hover { border-color:var(--primary); color:#fff; }
.vs-size-btn.vs-size-active { background:var(--primary); border-color:var(--primary); color:#fff; }
.vs-size-msg { font-size:12px; margin-top:8px; min-height:16px; }
.vs-size-msg-err { color:var(--danger); font-weight:600; }
.vs-btn-need-size { opacity:.55; }
@keyframes vs-shake {
  0%,100%{ transform:translateX(0); }
  20%    { transform:translateX(-6px); }
  40%    { transform:translateX(6px); }
  60%    { transform:translateX(-4px); }
  80%    { transform:translateX(4px); }
}
.vs-size-shake { animation:vs-shake .5s; }