/*
Theme Name: VIJG Shopping
Theme URI: https://vijg.com.br
Author: VIJG Shopping Place LTDA
Author URI: https://vijg.com.br
Description: Tema personalizado VIJG Shopping — dark tech aesthetic com accent verde. WooCommerce ready.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: Proprietary
License URI: https://vijg.com.br
Text Domain: vijg-theme
Tags: e-commerce, dark, woocommerce, technology

/* ═══════════════════════════════
   VIJG THEME — GLOBAL VARIABLES
═══════════════════════════════ */
:root {
  --black:      #0a0a0a;
  --black2:     #0d0d0d;
  --black3:     #141414;
  --gray1:      #1a1a1a;
  --gray2:      #222;
  --gray3:      #2a2a2a;
  --gray4:      #444;
  --muted:      #666;
  --muted2:     #888;
  --white:      #f5f3ee;
  --white2:     #ccc;
  --accent:     #00e5a0;
  --accent-dim: rgba(0,229,160,0.12);
  --accent-bdr: rgba(0,229,160,0.3);
  --wpp:        #25D366;
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-pill:100px;
  --font-display:'Bebas Neue', sans-serif;
  --font-body:   'DM Sans', sans-serif;
  --nav-h:       64px;
}

/* ═══════════════════
   RESET & BASE
═══════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  background: var(--black) !important;
  color: var(--white) !important;
  font-family: var(--font-body) !important;
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ═══════════════════
   TYPOGRAPHY
═══════════════════ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display) !important;
  letter-spacing: 1px;
  color: var(--white) !important;
  line-height: 1;
}
p { color: var(--muted2); font-weight: 300; }

/* ═══════════════════
   NAVIGATION
═══════════════════ */
.site-header,
header.site-header,
#masthead {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  background: rgba(10,10,10,0.95) !important;
  backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid var(--gray2) !important;
  box-shadow: none !important;
}

/* Logo */
.site-title a,
.custom-logo-link,
.site-branding a {
  font-family: var(--font-display) !important;
  font-size: 26px !important;
  letter-spacing: 3px !important;
  color: var(--white) !important;
  text-decoration: none !important;
}

/* Nav links */
.main-navigation a,
.primary-menu a,
nav ul li a {
  color: var(--muted2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition: color 0.2s !important;
  text-decoration: none !important;
}
.main-navigation a:hover,
nav ul li a:hover { color: var(--white) !important; }

/* Cart icon */
.cart-contents, .woocommerce-cart-link {
  background: var(--accent-dim) !important;
  border: 1px solid var(--accent-bdr) !important;
  color: var(--accent) !important;
  padding: 6px 14px !important;
  border-radius: var(--radius-pill) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

/* ═══════════════════
   HERO / HOMEPAGE
═══════════════════ */
.home .hero-section,
.site-main .wp-block-cover,
.entry-content .wp-block-cover {
  background: var(--black) !important;
  position: relative;
  overflow: hidden;
}

/* Announcement bar */
.woocommerce-store-notice,
p.demo_store {
  background: var(--accent) !important;
  color: var(--black) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-align: center !important;
  padding: 10px !important;
  position: static !important;
}

/* ═══════════════════
   SHOP / PRODUCTS
═══════════════════ */
.woocommerce-page,
.woocommerce {
  background: var(--black) !important;
}

/* Shop title */
.woocommerce-products-header__title,
.woocommerce-page h1.page-title {
  font-family: var(--font-display) !important;
  font-size: 56px !important;
  color: var(--white) !important;
}

/* Product grid */
ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 20px !important;
}

/* Product card */
ul.products li.product {
  background: var(--black3) !important;
  border: 1px solid var(--gray2) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  transition: transform 0.3s, border-color 0.3s !important;
  padding: 0 !important;
  margin: 0 !important;
}
ul.products li.product:hover {
  transform: translateY(-4px) !important;
  border-color: var(--gray3) !important;
}

/* Product image */
ul.products li.product .woocommerce-loop-product__link img,
ul.products li.product a img {
  width: 100% !important;
  height: 200px !important;
  object-fit: contain !important;
  padding: 20px !important;
  background: var(--gray1) !important;
  transition: transform 0.4s !important;
}
ul.products li.product:hover img {
  transform: scale(1.04) !important;
}

/* Product info area */
ul.products li.product .woocommerce-loop-product__link,
ul.products li.product h2,
ul.products li.product .price {
  padding: 0 16px !important;
}

/* Product title */
ul.products li.product h2,
ul.products li.product .woocommerce-loop-product__title {
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: var(--font-body) !important;
  color: var(--white) !important;
  padding: 16px 16px 6px !important;
  line-height: 1.3 !important;
}

/* Price */
ul.products li.product .price {
  font-size: 22px !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  padding: 0 16px 8px !important;
}
ul.products li.product .price del {
  color: var(--muted) !important;
  font-size: 14px !important;
}
ul.products li.product .price ins {
  text-decoration: none !important;
  color: var(--accent) !important;
}

/* Add to cart button */
ul.products li.product .add_to_cart_button,
ul.products li.product .button {
  background: var(--wpp) !important;
  color: white !important;
  border: none !important;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important;
  width: 100% !important;
  padding: 14px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-family: var(--font-body) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  transition: opacity 0.2s !important;
  display: block !important;
  text-align: center !important;
  margin: 8px 0 0 !important;
}
ul.products li.product .add_to_cart_button:hover,
ul.products li.product .button:hover {
  opacity: 0.88 !important;
  background: var(--wpp) !important;
  color: white !important;
}

/* On sale badge */
ul.products li.product .onsale,
span.onsale {
  background: var(--accent) !important;
  color: var(--black) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: var(--radius-pill) !important;
  padding: 4px 12px !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  min-width: auto !important;
  min-height: auto !important;
  line-height: 1 !important;
}

/* ═══════════════════
   SINGLE PRODUCT
═══════════════════ */
.woocommerce div.product {
  background: var(--black) !important;
}
.woocommerce div.product .product_title {
  font-family: var(--font-display) !important;
  font-size: 42px !important;
  color: var(--white) !important;
  line-height: 1 !important;
}
.woocommerce div.product .price {
  font-size: 36px !important;
  color: var(--accent) !important;
}
.woocommerce div.product .price del {
  color: var(--muted) !important;
  font-size: 20px !important;
}
.woocommerce div.product div.summary {
  color: var(--muted2) !important;
}
.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--muted2) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

/* Single product add to cart */
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button {
  background: var(--wpp) !important;
  color: white !important;
  border: none !important;
  border-radius: var(--radius-pill) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: var(--font-body) !important;
  padding: 14px 32px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  transition: opacity 0.2s !important;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
  background: var(--wpp) !important;
  opacity: 0.88 !important;
  color: white !important;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  background: transparent !important;
  border-bottom: 1px solid var(--gray2) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--muted) !important;
  font-weight: 500 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--accent) !important;
}
.woocommerce div.product .woocommerce-tabs .panel {
  background: var(--black2) !important;
  border: 1px solid var(--gray2) !important;
  border-radius: var(--radius-md) !important;
  padding: 24px !important;
  color: var(--muted2) !important;
}

/* ═══════════════════
   CART & CHECKOUT
═══════════════════ */
.woocommerce-cart-form,
.woocommerce-checkout,
table.cart {
  background: var(--black) !important;
  color: var(--white) !important;
}
table.cart td, table.cart th {
  border-color: var(--gray2) !important;
  color: var(--white) !important;
}
.cart_totals,
.woocommerce-checkout-review-order {
  background: var(--black3) !important;
  border: 1px solid var(--gray2) !important;
  border-radius: var(--radius-md) !important;
  padding: 24px !important;
}

/* Checkout fields */
.woocommerce form .form-row input,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  background: var(--gray1) !important;
  border: 1px solid var(--gray3) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 12px !important;
}
.woocommerce form .form-row label {
  color: var(--muted2) !important;
  font-size: 13px !important;
}

/* Checkout button */
#place_order {
  background: var(--accent) !important;
  color: var(--black) !important;
  border: none !important;
  border-radius: var(--radius-pill) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  font-family: var(--font-body) !important;
  padding: 16px 40px !important;
  width: 100% !important;
  cursor: pointer !important;
}

/* ═══════════════════
   BREADCRUMB
═══════════════════ */
.woocommerce-breadcrumb {
  color: var(--muted) !important;
  font-size: 12px !important;
  padding: 12px 0 !important;
}
.woocommerce-breadcrumb a { color: var(--muted2) !important; }
.woocommerce-breadcrumb a:hover { color: var(--white) !important; }

/* ═══════════════════
   FOOTER
═══════════════════ */
.site-footer,
footer.site-footer,
#colophon {
  background: #080808 !important;
  border-top: 1px solid var(--gray2) !important;
  color: var(--muted) !important;
  padding: 48px 5vw 32px !important;
}
.site-footer a { color: var(--muted2) !important; transition: color 0.2s !important; }
.site-footer a:hover { color: var(--white) !important; }
.site-info, .copyright { color: var(--gray4) !important; font-size: 12px !important; }

/* ═══════════════════
   WHATSAPP FLOAT
═══════════════════ */
.vijg-whatsapp-float {
  position: fixed !important;
  bottom: 28px !important;
  right: 28px !important;
  z-index: 9999 !important;
  background: var(--wpp) !important;
  color: white !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 20px rgba(37,211,102,0.4) !important;
  text-decoration: none !important;
  transition: transform 0.2s !important;
}
.vijg-whatsapp-float:hover { transform: scale(1.1) !important; }

/* ═══════════════════
   UTILITIES
═══════════════════ */
.screen-reader-text { display: none !important; }
.woocommerce-result-count { color: var(--muted) !important; font-size: 13px !important; }
.woocommerce-ordering select {
  background: var(--gray1) !important;
  border: 1px solid var(--gray3) !important;
  color: var(--white) !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 12px !important;
}

/* ═══════════════════
   RESPONSIVE
═══════════════════ */
@media (max-width: 768px) {
  ul.products {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
    gap: 12px !important;
  }
  .woocommerce div.product .product_title { font-size: 28px !important; }
}
