/* ========================================
   BRIVOX TECHMART - Professional Theme v3
   Mobile-First | Clean | Modern
   ======================================== */

:root {
  --c-bg: #fff;
  --c-text: #111;
  --c-muted: #666;
  --c-light: #f5f5f5;
  --c-border: #e5e5e5;
  --c-accent: #111;
  --c-sale: #dc2626;
  --c-success: #16a34a;
  --radius: 12px;
  --radius-sm: 8px;
  --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-tap-highlight-color: transparent; }
body { font-family: var(--font); background: var(--c-bg); color: var(--c-text); line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

/* Toast */
#vxToast {
  position: fixed; bottom: 80px; left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: var(--c-text); color: #fff;
  padding: 12px 24px; border-radius: 50px;
  font-size: 13px; font-weight: 600;
  opacity: 0; transition: all .3s;
  z-index: 9999; pointer-events: none;
}
#vxToast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ========== SEARCH ========== */
.vx-search-section { padding: 12px 16px; }
.vx-search {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; background: var(--c-light);
  border: 1px solid var(--c-border); border-radius: var(--radius);
}
.vx-search__icon { width: 20px; height: 20px; stroke: var(--c-muted); stroke-width: 2; fill: none; flex-shrink: 0; }
.vx-search__input { flex: 1; border: none; background: none; font-size: 14px; outline: none; }
.vx-search__btn {
  padding: 10px 20px; background: var(--c-text); color: #fff;
  border-radius: var(--radius-sm); font-size: 13px; font-weight: 600;
}

/* ========== HERO SLIDER (FIXED) ========== */
.vx-slider {
  position: relative; width: 100%; height: 60vh;
  min-height: 350px; max-height: 550px;
  overflow: hidden; background: #000;
}
.vx-slider__track {
  display: flex; height: 100%;
  transition: transform .6s cubic-bezier(.4,0,.2,1);
}
.vx-slide {
  flex: 0 0 100%; width: 100%; height: 100%;
  background-size: cover; background-position: center;
  position: relative;
}
.vx-slide__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.7) 0%, rgba(0,0,0,.2) 50%, rgba(0,0,0,.3) 100%);
}
.vx-slide__content {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 30px 20px; color: #fff; z-index: 2;
}
.vx-slide__tag {
  display: inline-block; background: #fff; color: #000;
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
  padding: 6px 12px; border-radius: 4px; margin-bottom: 12px;
}
.vx-slide__title { font-size: 26px; font-weight: 700; line-height: 1.1; margin-bottom: 8px; }
.vx-slide__desc { font-size: 14px; opacity: .85; margin-bottom: 16px; }
.vx-slide__btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; color: #000; font-size: 14px; font-weight: 600;
  padding: 12px 24px; border-radius: var(--radius-sm);
}

.vx-slider__dots {
  position: absolute; bottom: 20px; right: 20px;
  display: flex; gap: 8px; z-index: 10;
}
.vx-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,.4); transition: all .3s; border: none;
}
.vx-dot.active { width: 28px; border-radius: 5px; background: #fff; }

.vx-slider__arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.9); color: #000;
  display: flex; align-items: center; justify-content: center;
  z-index: 10; opacity: 0; transition: opacity .3s;
}
.vx-slider__arrow svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; fill: none; }
.vx-slider__arrow--prev { left: 16px; }
.vx-slider__arrow--next { right: 16px; }
.vx-slider:hover .vx-slider__arrow { opacity: 1; }

@media (min-width: 768px) {
  .vx-slider { height: 70vh; max-height: 650px; }
  .vx-slide__content { padding: 50px 60px; max-width: 550px; }
  .vx-slide__title { font-size: 42px; }
}

/* ========== BENEFITS BAR ========== */
.vx-benefits { background: var(--c-text); padding: 14px 0; overflow: hidden; }
.vx-benefits__track {
  display: flex; gap: 40px; white-space: nowrap;
  animation: vxScroll 25s linear infinite;
}
.vx-benefit {
  display: inline-flex; align-items: center; gap: 8px;
  color: #fff; font-size: 13px; font-weight: 500; flex-shrink: 0;
}
.vx-benefit svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 2; fill: none; }
@keyframes vxScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .vx-benefits__track { animation: none; } }

/* ========== BANNERS ========== */
.vx-banners { display: grid; grid-template-columns: 1fr; gap: 12px; padding: 16px; }
.vx-banner { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 16/9; }
.vx-banner img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.vx-banner:hover img { transform: scale(1.05); }
.vx-banner__content {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.6), transparent);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 16px; color: #fff;
}
.vx-banner__label { font-size: 18px; font-weight: 700; }
.vx-banner__cta { font-size: 13px; opacity: .9; margin-top: 4px; }
@media (min-width: 768px) {
  .vx-banners { grid-template-columns: repeat(3, 1fr); padding: 20px; gap: 16px; }
  .vx-banner { aspect-ratio: 4/3; }
}

/* ========== SECTIONS ========== */
.vx-section { padding: 24px 16px; }
.vx-section__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.vx-section__title { font-size: 20px; font-weight: 700; }
.vx-section__link { font-size: 13px; font-weight: 600; color: var(--c-muted); }
@media (min-width: 768px) {
  .vx-section { padding: 32px 20px; max-width: 1200px; margin: 0 auto; }
}

/* ========== PRODUCT CARDS ========== */
.vx-products-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.vx-card {
  position: relative; background: var(--c-bg); border-radius: var(--radius);
  border: 1px solid var(--c-border); overflow: hidden;
}
.vx-card__link { display: block; }
.vx-card__img { position: relative; aspect-ratio: 1; background: var(--c-light); overflow: hidden; }
.vx-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.vx-card:hover .vx-card__img img { transform: scale(1.05); }
.vx-card__badge {
  position: absolute; top: 8px; left: 8px;
  background: var(--c-sale); color: #fff;
  font-size: 10px; font-weight: 700; padding: 4px 8px;
  border-radius: 4px; text-transform: uppercase;
}
.vx-card__body { padding: 12px; }
.vx-card__title {
  font-size: 13px; font-weight: 600; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; margin-bottom: 6px;
}
.vx-card__rating { display: flex; align-items: center; gap: 4px; margin-bottom: 6px; }
.vx-card__rating svg { width: 14px; height: 14px; color: #f59e0b; }
.vx-card__rating span { font-size: 12px; color: var(--c-muted); }
.vx-card__price { font-size: 15px; font-weight: 700; }
.vx-card__price del { font-size: 12px; color: var(--c-muted); margin-right: 6px; }
.vx-card__price ins { text-decoration: none; color: var(--c-sale); }

/* Add to Cart Button - Fixed Style */
.vx-card__cart {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  width: calc(100% - 24px); margin: 0 12px 12px;
  height: 36px; background: var(--c-text); color: #fff;
  border-radius: var(--radius-sm); font-size: 12px; font-weight: 600;
  transition: all .2s;
}
.vx-card__cart svg { width: 14px; height: 14px; stroke: currentColor; stroke-width: 2; fill: none; }
.vx-card__cart:hover { background: #333; }
.vx-card__cart.loading { opacity: .7; pointer-events: none; }
.vx-card__cart.added { background: var(--c-success); }

@media (min-width: 640px) { .vx-products-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; } }
@media (min-width: 1024px) { .vx-products-grid { grid-template-columns: repeat(4, 1fr); } }

/* ========== PROMO BANNER ========== */
.vx-promo {
  margin: 0 16px; padding: 30px 20px;
  background: var(--c-text); border-radius: var(--radius);
  text-align: center; color: #fff;
}
.vx-promo__tag {
  display: inline-block; background: rgba(255,255,255,.15);
  font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 6px 14px; border-radius: 50px; margin-bottom: 12px;
}
.vx-promo__title { font-size: 22px; font-weight: 700; margin-bottom: 8px; }
.vx-promo__desc { font-size: 14px; opacity: .8; margin-bottom: 16px; }
.vx-promo__code {
  display: inline-flex; align-items: center; gap: 12px;
  background: rgba(255,255,255,.1); padding: 6px 6px 6px 16px; border-radius: 50px;
}
.vx-promo__code span { font-size: 16px; font-weight: 700; letter-spacing: .1em; }
.vx-promo__copy {
  background: #fff; color: #000; font-size: 13px; font-weight: 600;
  padding: 10px 18px; border-radius: 50px;
}
.vx-promo__copy.copied { background: var(--c-success); color: #fff; }
@media (min-width: 768px) { .vx-promo { margin: 0 20px; padding: 50px; max-width: 1160px; margin: 0 auto; } .vx-promo__title { font-size: 28px; } }

/* ========== CATEGORIES ========== */
.vx-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.vx-cat { position: relative; aspect-ratio: 1; border-radius: var(--radius); overflow: hidden; }
.vx-cat img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.vx-cat:hover img { transform: scale(1.08); }
.vx-cat__name {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.4); color: #fff; font-size: 13px; font-weight: 700; text-align: center; padding: 10px;
}
@media (min-width: 640px) { .vx-cats { grid-template-columns: repeat(6, 1fr); } }

/* ========== FEATURES ========== */
.vx-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 24px 16px; }
.vx-feature { background: var(--c-light); border-radius: var(--radius); padding: 20px; text-align: center; }
.vx-feature__icon {
  width: 48px; height: 48px; background: var(--c-bg); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;
}
.vx-feature__icon svg { width: 24px; height: 24px; stroke: var(--c-text); stroke-width: 1.5; fill: none; }
.vx-feature h3 { font-size: 14px; font-weight: 700; margin-bottom: 4px; }
.vx-feature p { font-size: 12px; color: var(--c-muted); }
@media (min-width: 768px) { .vx-features { grid-template-columns: repeat(4, 1fr); padding: 40px 20px; max-width: 1200px; margin: 0 auto; } }

/* ========== NEWSLETTER ========== */
.vx-newsletter { background: var(--c-light); padding: 40px 20px; text-align: center; }
.vx-newsletter h2 { font-size: 22px; font-weight: 700; margin-bottom: 8px; }
.vx-newsletter p { font-size: 14px; color: var(--c-muted); margin-bottom: 20px; }
.vx-newsletter__form { display: flex; gap: 10px; max-width: 400px; margin: 0 auto; }
.vx-newsletter__form input {
  flex: 1; height: 48px; padding: 0 16px; border: 1px solid var(--c-border);
  border-radius: var(--radius-sm); font-size: 14px; background: var(--c-bg);
}
.vx-newsletter__form button {
  height: 48px; padding: 0 24px; background: var(--c-text); color: #fff;
  border-radius: var(--radius-sm); font-size: 14px; font-weight: 600;
}

/* ========== FOOTER CREDIT ========== */
.vx-footer-credit { padding: 24px 16px; text-align: center; border-top: 1px solid var(--c-border); background: var(--c-light); }
.vx-footer-credit p { font-size: 13px; color: var(--c-muted); margin: 0 0 6px; }
.vx-footer-credit p:last-child { margin: 0; }
.vx-footer-credit a { color: var(--c-text); font-weight: 600; }

/* ========== BREADCRUMB ========== */
.vx-breadcrumb { font-size: 13px; color: var(--c-muted); }
.vx-breadcrumb a { color: var(--c-text); }
.vx-breadcrumb a:hover { text-decoration: underline; }
.vx-breadcrumb__sep { margin: 0 8px; color: var(--c-border); }
.vx-single-breadcrumb { padding: 16px 16px 0; }
@media (min-width: 768px) { .vx-single-breadcrumb { padding: 20px 20px 0; max-width: 1200px; margin: 0 auto; } }

/* ========== SHOP TOOLBAR ========== */
.vx-toolbar { padding: 16px; border-bottom: 1px solid var(--c-border); }
.vx-toolbar__breadcrumb { margin-bottom: 12px; }
.vx-toolbar__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.vx-toolbar__count { font-size: 13px; color: var(--c-muted); }
.vx-toolbar__count .woocommerce-result-count { margin: 0; }
.vx-sort { display: flex; align-items: center; gap: 8px; }
.vx-sort label { font-size: 13px; color: var(--c-muted); }
.vx-sort select {
  height: 40px; padding: 0 32px 0 12px; border: 1px solid var(--c-border);
  border-radius: var(--radius-sm); font-size: 13px; font-weight: 500;
  background: var(--c-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
  appearance: none; cursor: pointer;
}
@media (min-width: 768px) { .vx-toolbar { padding: 20px; max-width: 1200px; margin: 0 auto; } }

/* ========== SHOP / ARCHIVE ========== */
.woocommerce-page .woocommerce { padding: 16px; }
.woocommerce ul.products {
  display: grid !important; grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important; margin: 0 !important; padding: 0 !important; list-style: none !important;
}
.woocommerce ul.products li.product {
  margin: 0 !important; padding: 0 !important; width: auto !important; float: none !important;
  background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius); overflow: hidden;
  position: relative;
}
.woocommerce ul.products li.product a { display: block; }
.woocommerce ul.products li.product a img { aspect-ratio: 1; object-fit: cover; border-radius: 0; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 13px !important; font-weight: 600 !important;
  padding: 10px 12px 0 !important; margin: 0 !important;
}
.woocommerce ul.products li.product .price {
  padding: 6px 12px !important; font-size: 14px !important; font-weight: 700 !important;
}
.woocommerce ul.products li.product .price del { font-size: 11px; opacity: .5; }
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--c-sale); }
.woocommerce ul.products li.product .onsale {
  position: absolute; top: 8px; left: 8px; background: var(--c-sale) !important; color: #fff;
  font-size: 10px !important; font-weight: 700; padding: 4px 8px !important;
  border-radius: 4px; min-height: auto !important; line-height: 1.4 !important;
}
/* Shop Add to Cart Button */
.woocommerce ul.products li.product .button {
  display: flex !important; align-items: center; justify-content: center; gap: 6px;
  width: calc(100% - 24px) !important; margin: 0 12px 12px !important;
  height: 36px !important; padding: 0 !important;
  background: var(--c-text) !important; color: #fff !important;
  border-radius: var(--radius-sm) !important; font-size: 11px !important; font-weight: 600 !important;
}
.woocommerce ul.products li.product .button:hover { background: #333 !important; }
.woocommerce ul.products li.product .added_to_cart { display: none !important; }
@media (min-width: 640px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
@media (min-width: 1024px) {
  .woocommerce ul.products { grid-template-columns: repeat(4, 1fr) !important; }
  .woocommerce-page .woocommerce { max-width: 1200px; margin: 0 auto; padding: 20px; }
}

/* Hide default result/ordering */
.woocommerce .woocommerce-result-count:not(.vx-toolbar__count .woocommerce-result-count),
.woocommerce .woocommerce-ordering { display: none !important; }

/* ========== SINGLE PRODUCT ========== */
.single-product .woocommerce { padding: 0; }
.vx-single { display: flex; flex-direction: column; padding: 0 16px 16px; }
.vx-single__gallery { position: relative; width: 100%; aspect-ratio: 1; background: var(--c-light); border-radius: var(--radius); overflow: hidden; }
.vx-single__gallery img { width: 100%; height: 100%; object-fit: cover; }
.vx-single__title-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 50px 16px 16px;
  background: linear-gradient(to top, rgba(0,0,0,.7), transparent);
  color: #fff;
}
.vx-single__title-overlay h1 { font-size: 20px; font-weight: 700; line-height: 1.2; margin-bottom: 8px; }
.vx-single__title-overlay .price { font-size: 18px; font-weight: 700; }
.vx-single__title-overlay .price del { opacity: .6; font-size: 14px; margin-right: 8px; }
.vx-single__title-overlay .price ins { text-decoration: none; }

.vx-single__thumbs { display: flex; gap: 8px; padding: 12px 0; overflow-x: auto; }
.vx-single__thumb {
  flex: 0 0 60px; width: 60px; height: 60px; border-radius: var(--radius-sm);
  overflow: hidden; border: 2px solid transparent; cursor: pointer;
}
.vx-single__thumb.active { border-color: var(--c-text); }
.vx-single__thumb img { width: 100%; height: 100%; object-fit: cover; }

.vx-single__info { padding: 16px 0; }
.vx-single__rating { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.vx-single__rating svg { width: 16px; height: 16px; fill: #f59e0b; }
.vx-single__rating span { font-size: 13px; color: var(--c-muted); }
.vx-single__excerpt { padding: 14px; background: var(--c-light); border-radius: var(--radius-sm); font-size: 14px; color: var(--c-muted); line-height: 1.6; margin-bottom: 16px; }
.vx-single__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.vx-single__badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; background: var(--c-light); border-radius: 50px;
  font-size: 12px; font-weight: 600;
}
.vx-single__badge svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 2; fill: none; }

@media (min-width: 900px) {
  .vx-single { flex-direction: row; gap: 30px; padding: 20px; max-width: 1200px; margin: 0 auto; }
  .vx-single__left { width: 55%; }
  .vx-single__right { width: 45%; }
  .vx-single__gallery { aspect-ratio: auto; min-height: 450px; }
  .vx-single__title-overlay h1 { font-size: 26px; }
}

/* Tabs */
.woocommerce-tabs { margin-top: 20px; }
.woocommerce-tabs ul.tabs {
  display: flex !important; gap: 8px !important; margin: 0 0 16px !important; padding: 0 !important;
  background: none !important; border: none !important; list-style: none !important; overflow-x: auto !important;
}
.woocommerce-tabs ul.tabs::before, .woocommerce-tabs ul.tabs::after { display: none !important; }
.woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; }
.woocommerce-tabs ul.tabs li a {
  display: inline-flex !important; padding: 10px 18px !important;
  background: var(--c-light) !important; border: 1px solid var(--c-border) !important;
  border-radius: 50px !important; font-size: 13px !important; font-weight: 600 !important;
  color: var(--c-muted) !important; white-space: nowrap !important;
}
.woocommerce-tabs ul.tabs li.active a { background: var(--c-text) !important; color: #fff !important; border-color: var(--c-text) !important; }
.woocommerce-tabs .panel { padding: 20px !important; background: var(--c-light) !important; border-radius: var(--radius) !important; margin: 0 !important; border: none !important; }
.woocommerce-tabs .panel h2 { font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.woocommerce-tabs .panel p { font-size: 14px; line-height: 1.7; color: var(--c-muted); }

/* Reviews */
#reviews .commentlist { margin: 0 !important; padding: 0 !important; list-style: none !important; display: grid; gap: 12px; }
#reviews .comment_container { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 16px; background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius); }
#reviews .comment_container img.avatar { width: 40px !important; height: 40px !important; border-radius: 50% !important; }
#reviews .comment-text { margin: 0 !important; padding: 0 !important; border: none !important; }
#reviews .star-rating { font-size: 12px; margin-bottom: 4px; }
#reviews .woocommerce-review__author { font-size: 14px; font-weight: 600; }
#reviews .woocommerce-review__published-date { font-size: 12px; color: var(--c-muted); }
#reviews .description p { font-size: 13px; color: var(--c-muted); margin-top: 8px; }
#review_form_wrapper { padding: 20px; background: var(--c-bg); border: 1px solid var(--c-border); border-radius: var(--radius); margin-top: 16px; }
#review_form label { font-size: 13px; font-weight: 600; display: block; margin-bottom: 6px; }
#review_form input, #review_form textarea { width: 100%; padding: 12px; border: 1px solid var(--c-border); border-radius: var(--radius-sm); font-size: 14px; margin-bottom: 12px; }
#review_form .form-submit input { width: auto; padding: 12px 24px; background: var(--c-text); color: #fff; border: none; font-weight: 600; cursor: pointer; margin: 0; }

/* Sticky Bar */
.vx-sticky-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 999;
  padding: 12px 16px; padding-bottom: calc(12px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.97); backdrop-filter: blur(10px); border-top: 1px solid var(--c-border);
}
.vx-sticky-bar__inner { display: flex; gap: 10px; max-width: 500px; margin: 0 auto; }
.vx-qty { display: flex; align-items: center; background: var(--c-light); border-radius: var(--radius-sm); overflow: hidden; }
.vx-qty__btn { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 500; }
.vx-qty__input { width: 44px; height: 44px; border: none; background: none; text-align: center; font-size: 15px; font-weight: 600; }
.vx-sticky-bar__add {
  flex: 1; height: 44px; background: var(--c-text); color: #fff;
  border-radius: var(--radius-sm); font-size: 14px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.vx-sticky-bar__add svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 2; fill: none; }
.single-product main { padding-bottom: 80px; }

/* ========== CART & CHECKOUT BUTTONS ONLY ========== */
.wc-block-cart .wc-block-components-button,
.wc-block-checkout .wc-block-components-button,
.wc-block-cart .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-checkout-place-order-button {
  background: #111 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 14px 24px !important;
}
.wc-block-cart .wc-block-components-button:hover,
.wc-block-checkout .wc-block-components-button:hover {
  background: #333 !important;
}
.wc-block-cart .wc-block-components-button--outlined {
  background: #f5f5f5 !important;
  color: #111 !important;
  border: 1px solid #e5e5e5 !important;
}
/* ========== MINI CART ========== */
.widget_shopping_cart_content {
  padding: 16px;
}

.woocommerce-mini-cart {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  max-height: 300px;
  overflow-y: auto;
}

.woocommerce-mini-cart-item {
  display: grid !important;
  grid-template-columns: 50px 1fr 24px;
  gap: 10px;
  align-items: center;
  padding: 12px !important;
  margin-bottom: 8px !important;
  background: #f5f5f5;
  border-radius: 10px;
  position: relative;
}

.woocommerce-mini-cart-item .vx-mini-thumb {
  width: 50px;
  height: 50px;
  border-radius: 6px;
  overflow: hidden;
  display: block;
}

.woocommerce-mini-cart-item .vx-mini-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.woocommerce-mini-cart-item .vx-mini-info {
  min-width: 0;
}

.woocommerce-mini-cart-item .vx-mini-name {
  display: block;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.woocommerce-mini-cart-item .vx-mini-qty {
  font-size: 12px;
  color: #666;
}

.woocommerce-mini-cart-item .remove {
  width: 24px;
  height: 24px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 50%;
  color: #999 !important;
  font-size: 18px;
  line-height: 1;
  text-decoration: none;
}

.woocommerce-mini-cart-item .remove:hover {
  background: #fee;
  color: #dc2626 !important;
}

.woocommerce-mini-cart__total {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  margin-top: 8px;
  border-top: 1px solid #e5e5e5;
  font-size: 15px;
}

.woocommerce-mini-cart__buttons {
  display: flex;
  gap: 8px;
  padding-top: 12px;
}

.woocommerce-mini-cart__buttons .button {
  flex: 1;
  text-align: center;
  padding: 12px 16px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.woocommerce-mini-cart__buttons .button:first-child {
  background: #f5f5f5 !important;
  color: #111 !important;
}

.woocommerce-mini-cart__buttons .button.checkout {
  background: #111 !important;
  color: #fff !important;
}

.woocommerce-mini-cart__empty-message {
  text-align: center;
  padding: 40px 20px;
  color: #666;
}

/* ========== CART PAGE (WooCommerce Default) ========== */
.woocommerce-cart .woocommerce {
  max-width: 900px;
  margin: 0 auto;
  padding: 20px 16px;
}

.woocommerce table.shop_table {
  border: none !important;
}

.woocommerce table.shop_table td,
.woocommerce table.shop_table th {
  border: none !important;
  padding: 12px !important;
  vertical-align: middle !important;
}

.woocommerce table.shop_table tbody tr {
  border-bottom: 1px solid #e5e5e5;
}

.woocommerce table.shop_table td.product-thumbnail img {
  width: 60px !important;
  height: 60px !important;
  object-fit: cover;
  border-radius: 8px;
}

.woocommerce table.shop_table td.product-name a {
  font-weight: 600;
  color: #111;
}

.woocommerce table.shop_table td.product-quantity .qty {
  width: 60px;
  height: 40px;
  text-align: center;
  border: 1px solid #ddd;
  border-radius: 6px;
}

.woocommerce table.shop_table td.product-remove a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: #f5f5f5;
  border-radius: 50%;
  color: #666 !important;
  font-size: 18px;
}

.woocommerce table.shop_table td.product-remove a:hover {
  background: #fee;
  color: #dc2626 !important;
}

/* Cart Totals */
.woocommerce .cart_totals {
  width: 100% !important;
  max-width: 400px;
  margin-left: auto !important;
}

.woocommerce .cart_totals h2 {
  font-size: 18px;
  font-weight: 700;
}

.woocommerce .cart_totals table {
  background: #f5f5f5;
  border-radius: 12px;
}

.woocommerce .cart_totals th,
.woocommerce .cart_totals td {
  padding: 14px 16px !important;
}

/* Buttons */
.woocommerce .button {
  background: #111 !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  font-weight: 600 !important;
}

.woocommerce .button:hover {
  background: #333 !important;
}

.woocommerce button[name="update_cart"] {
  background: #f5f5f5 !important;
  color: #111 !important;
}

.woocommerce .wc-proceed-to-checkout a {
  display: block;
  width: 100%;
  text-align: center;
}

/* ========== CHECKOUT (WooCommerce Default) ========== */
.woocommerce-checkout .woocommerce {
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px 16px;
}

.woocommerce-checkout h3 {
  font-size: 18px !important;
  font-weight: 700 !important;
}

.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  border: 1px solid #ddd !important;
  border-radius: 8px !important;
  padding: 12px !important;
}

.woocommerce-checkout #payment {
  background: #f5f5f5 !important;
  border-radius: 12px !important;
}

.woocommerce-checkout #place_order {
  width: 100%;
  height: 50px;
  font-size: 16px !important;
}
/* WOO MESSAGES */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  padding: 14px 16px !important; margin: 0 0 16px !important;
  background: var(--c-light) !important; border: 1px solid var(--c-border) !important;
  border-radius: var(--radius-sm) !important; font-size: 14px !important;
}
.woocommerce-error { background: #fef2f2 !important; border-color: #fecaca !important; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none !important; }

/* STAR RATING */
.star-rating { color: #f59e0b; }

/* HIDE VOLTCO SEARCH */
.voltco-searchbar { display: none !important; }

/* Mini Cart Footer */
.vx-mini-footer { padding-top: 16px; border-top: 1px solid var(--c-border); margin-top: 16px; }
.vx-mini-total { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; font-size: 15px; }
.vx-mini-total strong { font-weight: 600; }
.vx-mini-total span { font-weight: 700; }
.vx-mini-buttons { display: flex; gap: 10px; }
.vx-mini-btn {
  flex: 1; padding: 12px; text-align: center; border-radius: var(--radius-sm);
  font-size: 13px; font-weight: 600; transition: all .2s;
}
.vx-mini-btn--cart { background: var(--c-light); color: var(--c-text); border: 1px solid var(--c-border); }
.vx-mini-btn--checkout { background: var(--c-text); color: #fff; }

/* Single Product Form */
.vx-single__form { margin-top: 16px; }
.vx-single__form .variations { margin-bottom: 16px; }
.vx-single__form .variations td { padding: 8px 0; display: block; }
.vx-single__form .variations .label { font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.vx-single__form .variations select {
  width: 100%; height: 44px; padding: 0 14px;
  border: 1px solid var(--c-border); border-radius: var(--radius-sm);
  font-size: 14px; background: var(--c-bg);
}
.vx-single__form .single_add_to_cart_button {
  width: 100%; height: 48px; background: var(--c-text); color: #fff;
  border: none; border-radius: var(--radius-sm); font-size: 14px; font-weight: 700;
  cursor: pointer;
}
.vx-single__form .quantity { display: none; }

/* Loading state */
.vx-card__cart.loading svg { animation: vxSpin 1s linear infinite; }
@keyframes vxSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* ========================================
   BRIVOX CART & CHECKOUT PAGES
   ======================================== */

/* Container */
.vx-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px 16px;
}

.vx-page-title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 24px;
}

/* Buttons */
.vx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 24px;
  background: #111;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all .2s;
  text-decoration: none;
}
.vx-btn:hover { background: #333; color: #fff; }
.vx-btn--outline {
  background: #f5f5f5;
  color: #111;
  border: 1px solid #e5e5e5;
}
.vx-btn--outline:hover { background: #eee; color: #111; }
.vx-btn--checkout { width: 100%; margin-top: 16px; }
.vx-btn--place-order { width: 100%; height: 56px; font-size: 16px; }

/* Input */
.vx-input {
  height: 48px;
  padding: 0 16px;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  font-size: 14px;
  width: 100%;
}

/* ========== EMPTY CART ========== */
.vx-empty-cart {
  text-align: center;
  padding: 60px 20px;
}
.vx-empty-cart svg {
  stroke: #ccc;
  stroke-width: 1.5;
  fill: none;
  margin-bottom: 20px;
}
.vx-empty-cart h2 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 8px;
}
.vx-empty-cart p {
  color: #666;
  margin-bottom: 24px;
}

/* ========== CART ITEMS ========== */
.vx-cart-items {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 20px;
}

.vx-cart-item {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 12px;
  padding: 16px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  position: relative;
}

.vx-cart-item__img {
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f5;
}
.vx-cart-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vx-cart-item__info { min-width: 0; }
.vx-cart-item__name {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 6px;
  line-height: 1.3;
}
.vx-cart-item__name a { color: inherit; }
.vx-cart-item__price {
  font-size: 14px;
  color: #666;
}

.vx-cart-item__qty {
  grid-column: 2;
}

.vx-qty-control {
  display: inline-flex;
  align-items: center;
  background: #f5f5f5;
  border-radius: 8px;
  overflow: hidden;
}
.vx-qty-btn {
  width: 40px;
  height: 40px;
  border: none;
  background: none;
  font-size: 18px;
  cursor: pointer;
}
.vx-qty-btn:hover { background: #eee; }
.vx-qty-input {
  width: 50px;
  height: 40px;
  border: none;
  background: none;
  text-align: center;
  font-size: 15px;
  font-weight: 600;
}

.vx-cart-item__subtotal {
  position: absolute;
  top: 16px;
  right: 50px;
  font-size: 16px;
  font-weight: 700;
}

.vx-cart-item__remove {
  position: absolute;
  top: 16px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: none;
  background: #f5f5f5;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vx-cart-item__remove svg {
  width: 16px;
  height: 16px;
  stroke: #666;
  stroke-width: 2;
}
.vx-cart-item__remove:hover {
  background: #fef2f2;
}
.vx-cart-item__remove:hover svg { stroke: #dc2626; }

/* Cart Actions */
.vx-cart-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 0;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 24px;
}
.vx-coupon {
  display: flex;
  gap: 8px;
  flex: 1;
  min-width: 250px;
}
.vx-coupon .vx-input { flex: 1; }

/* Cart Totals */
.vx-cart-totals {
  max-width: 400px;
  margin-left: auto;
  padding: 24px;
  background: #f5f5f5;
  border-radius: 12px;
}
.vx-cart-totals h2 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}
.vx-totals-row {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid #e5e5e5;
  font-size: 14px;
}
.vx-totals-row:last-of-type { border-bottom: none; }
.vx-totals-row--total {
  font-size: 18px;
  font-weight: 700;
  padding-top: 16px;
  margin-top: 8px;
  border-top: 2px solid #111;
  border-bottom: none;
}

/* ========== CHECKOUT PAGE ========== */
.vx-checkout-form {
  display: grid;
  gap: 24px;
}

@media (min-width: 900px) {
  .vx-checkout-form {
    grid-template-columns: 1.3fr 0.7fr;
    align-items: start;
  }
}

.vx-checkout-section {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}
.vx-checkout-section h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 20px;
}

.vx-form-grid {
  display: grid;
  gap: 16px;
}
@media (min-width: 600px) {
  .vx-form-grid { grid-template-columns: 1fr 1fr; }
  .vx-form-grid .form-row-wide { grid-column: 1 / -1; }
}

.vx-checkout-page .form-row { margin: 0; }
.vx-checkout-page .form-row label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
}
.vx-checkout-page .form-row .required { color: #dc2626; }
.vx-checkout-page .form-row input,
.vx-checkout-page .form-row select,
.vx-checkout-page .form-row textarea {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  font-size: 14px;
}
.vx-checkout-page .form-row textarea {
  height: auto;
  min-height: 100px;
  padding: 14px 16px;
}
.vx-checkout-page .select2-container .select2-selection--single {
  height: 48px !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 8px !important;
}
.vx-checkout-page .select2-container .select2-selection__rendered {
  line-height: 48px !important;
  padding-left: 16px !important;
}

/* Order Review Sidebar */
.vx-checkout-sidebar { position: sticky; top: 20px; }

.vx-order-review {
  background: #f5f5f5;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}
.vx-order-review h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 16px;
}

.vx-order-items { margin-bottom: 16px; }
.vx-order-item {
  display: grid;
  grid-template-columns: 50px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #e5e5e5;
}
.vx-order-item:last-child { border-bottom: none; }
.vx-order-item__img {
  width: 50px;
  height: 50px;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}
.vx-order-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vx-order-item__name {
  font-size: 13px;
  font-weight: 600;
  display: block;
}
.vx-order-item__qty {
  font-size: 12px;
  color: #666;
}
.vx-order-item__price {
  font-size: 14px;
  font-weight: 600;
}

.vx-order-totals { border-top: 1px solid #e5e5e5; padding-top: 12px; }
.vx-order-row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  font-size: 14px;
}
.vx-order-row--total {
  font-size: 18px;
  font-weight: 700;
  border-top: 2px solid #111;
  margin-top: 8px;
  padding-top: 16px;
}

/* Payment Methods */
.vx-payment-section {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}
.vx-payment-section h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 16px;
}
.vx-payment-method {
  padding: 14px;
  background: #f5f5f5;
  border-radius: 8px;
  margin-bottom: 10px;
}
.vx-payment-method:last-child { margin-bottom: 0; }
.vx-payment-method label {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.vx-payment-method__title {
  font-size: 14px;
  font-weight: 600;
}
.vx-payment-method__desc {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e5e5e5;
  font-size: 13px;
  color: #666;
}
.vx-payment-method__desc p { margin: 0; }

.vx-place-order { padding: 0; }
.vx-place-order .woocommerce-terms-and-conditions-wrapper {
  margin-bottom: 16px;
  font-size: 13px;
}

/* ========== MINI CART FIX ========== */
.widget_shopping_cart_content .vx-mini-list,
.voltco-minicart .vx-mini-list {
  max-height: 300px;
  overflow-y: auto;
}

/* ========== MOBILE VIEW ON DESKTOP ========== */
html, body {
  max-width: 480px !important;
  margin: 0 auto !important;
  overflow-x: hidden;
}

/* Add border/shadow to show mobile frame feel */
@media (min-width: 481px) {
  body {
    box-shadow: 0 0 30px rgba(0,0,0,0.1);
    min-height: 100vh;
  }
}

/* Force mobile grid everywhere */
.vx-products-grid,
.woocommerce ul.products {
  grid-template-columns: repeat(2, 1fr) !important;
}

.vx-banners {
  grid-template-columns: 1fr !important;
}

.vx-cats {
  grid-template-columns: repeat(3, 1fr) !important;
}

.vx-features {
  grid-template-columns: repeat(2, 1fr) !important;
}

.vx-checkout-form {
  grid-template-columns: 1fr !important;
}

.vx-single {
  flex-direction: column !important;
}

.vx-single__left,
.vx-single__right {
  width: 100% !important;
}

/* Header stays mobile */
.site-header,
.voltco-header {
  max-width: 480px;
  margin: 0 auto;
}

/* ========== CART PAGE FIXED ========== */
.vx-cart-page { padding-bottom: 40px; }
.vx-container { max-width: 900px; margin: 0 auto; padding: 16px; }
.vx-page-title { font-size: 22px; font-weight: 700; margin-bottom: 20px; }

.vx-empty-cart { text-align: center; padding: 60px 20px; }
.vx-empty-cart svg { stroke: #ccc; stroke-width: 1.5; fill: none; margin-bottom: 16px; }
.vx-empty-cart h2 { font-size: 20px; margin-bottom: 8px; }
.vx-empty-cart p { color: #666; margin-bottom: 20px; }

/* Cart Items */
.vx-cart-items { margin-bottom: 20px; }

.vx-cart-item {
  display: grid;
  grid-template-columns: 70px 1fr;
  grid-template-rows: auto auto auto;
  gap: 8px 12px;
  padding: 16px;
  margin-bottom: 12px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  position: relative;
}

.vx-cart-item__image {
  grid-row: 1 / 4;
  width: 70px;
  height: 70px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f5;
}
.vx-cart-item__image img { width: 100%; height: 100%; object-fit: cover; }

.vx-cart-item__details { grid-column: 2; }
.vx-cart-item__name { font-size: 14px; font-weight: 600; margin: 0 30px 4px 0; line-height: 1.3; }
.vx-cart-item__name a { color: inherit; }
.vx-cart-item__price { font-size: 13px; color: #666; }

.vx-cart-item__quantity {
  grid-column: 2;
  display: inline-flex;
  align-items: center;
  background: #f5f5f5;
  border-radius: 8px;
  overflow: hidden;
  width: fit-content;
}
.vx-qty-btn {
  width: 36px;
  height: 36px;
  border: none;
  background: none;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vx-qty-btn:hover { background: #eee; }
.vx-qty-input {
  width: 40px;
  height: 36px;
  border: none;
  background: none;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  -moz-appearance: textfield;
}
.vx-qty-input::-webkit-outer-spin-button,
.vx-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }

.vx-cart-item__total {
  grid-column: 2;
  font-size: 16px;
  font-weight: 700;
}

.vx-cart-item__remove {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 30px;
  height: 30px;
  border: none;
  background: #f5f5f5;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
}
.vx-cart-item__remove:hover { background: #fee; color: #dc2626; }

/* Cart Bottom */
.vx-cart-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 16px 0;
  border-top: 1px solid #e5e5e5;
  margin-bottom: 24px;
}
.vx-cart-coupon { display: flex; gap: 8px; flex: 1; min-width: 200px; }
.vx-cart-coupon .vx-input { flex: 1; }

/* Summary */
.vx-cart-summary {
  padding: 20px;
  background: #f5f5f5;
  border-radius: 12px;
}
.vx-cart-summary h2 { font-size: 18px; font-weight: 700; margin-bottom: 16px; }
.vx-summary-row {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid #e5e5e5;
  font-size: 14px;
}
.vx-summary-row:last-of-type { border-bottom: none; }
.vx-summary-row--total {
  font-size: 18px;
  font-weight: 700;
  border-top: 2px solid #111;
  border-bottom: none;
  margin-top: 8px;
  padding-top: 16px;
}

/* Buttons */
.vx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 24px;
  background: #111;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
}
.vx-btn:hover { background: #333; color: #fff; }
.vx-btn--outline { background: #fff; color: #111; border: 1px solid #ddd; }
.vx-btn--outline:hover { background: #f5f5f5; color: #111; }
.vx-btn--checkout { width: 100%; margin-top: 16px; }

.vx-input {
  height: 48px;
  padding: 0 16px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 14px;
}

/* Item removing animation */
.vx-cart-item.removing {
  opacity: 0.4;
  pointer-events: none;
}

/* ========== CART PAGE LAYOUT ========== */
.vx-cart-layout {
  display: grid;
  gap: 24px;
}

@media (min-width: 768px) {
  .vx-cart-layout {
    grid-template-columns: 1fr 350px;
    align-items: start;
  }
}

.vx-cart-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.vx-cart-coupon form {
  display: flex;
  gap: 8px;
}

.vx-cart-coupon .vx-input {
  flex: 1;
}

/* Cart Item - Fixed Layout */
.vx-cart-item {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  grid-template-rows: auto auto;
  gap: 8px 12px;
  padding: 16px;
  margin-bottom: 12px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  position: relative;
}

.vx-cart-item__image {
  grid-row: span 2;
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f5;
}

.vx-cart-item__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vx-cart-item__details {
  grid-column: 2;
  padding-right: 30px;
}

.vx-cart-item__name {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 4px;
  line-height: 1.3;
}

.vx-cart-item__name a {
  color: inherit;
}

.vx-cart-item__price {
  font-size: 13px;
  color: #666;
}

.vx-cart-item__quantity {
  grid-column: 2;
  display: flex;
  align-items: center;
  width: fit-content;
  background: #f5f5f5;
  border-radius: 8px;
  overflow: hidden;
}

.vx-cart-item__total {
  grid-column: 3;
  grid-row: span 2;
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  padding-right: 30px;
}

.vx-cart-item__remove {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 30px;
  height: 30px;
  border: none;
  background: #f5f5f5;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  transition: all .2s;
}

.vx-cart-item__remove:hover {
  background: #fee;
  color: #dc2626;
}

/* ========== CHECKOUT PAGE ========== */
.vx-checkout-page .woocommerce-checkout {
  display: grid;
  gap: 24px;
}

@media (min-width: 900px) {
  .vx-checkout-page .woocommerce-checkout {
    grid-template-columns: 1.3fr 0.7fr;
  }
  
  .vx-checkout-page #order_review {
    order: 2;
  }
  
  .vx-checkout-page #customer_details {
    order: 1;
  }
}

.vx-checkout-page .woocommerce-billing-fields,
.vx-checkout-page .woocommerce-shipping-fields,
.vx-checkout-page .woocommerce-additional-fields {
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
}

.vx-checkout-page #order_review {
  background: #f9f9f9;
  border-radius: 12px;
  padding: 24px;
  position: sticky;
  top: 20px;
}

.vx-checkout-page #payment {
  background: transparent !important;
}

.vx-checkout-page .woocommerce-checkout-payment {
  padding: 0 !important;
}

.vx-checkout-page #place_order {
  width: 100%;
  height: 54px;
  font-size: 16px !important;
  margin-top: 16px;
}