/* ==========================================================================
   THE VELVET BOX — PURPLE PREMIUM THEME OVERRIDE
   Loaded LAST (after app.css / wocommerce.css / responsive.css) so these
   rules win. Uses the same palette already defined on front-page.php so the
   whole site now matches the homepage.
   ========================================================================== */

:root{
  --vb-purple: #7C3AED;
  --vb-purple-dark: #5B21B6;
  --vb-purple-light: #C4B5FD;
  --vb-purple-pale: #F3EEFF;
  --vb-gold: #C9A84C;
  --vb-cream: #FBF9F6;
  --vb-ink: #2A2630;
  --vb-white: #FFFFFF;
  --vb-radius: 14px;
  --vb-shadow: 0 8px 24px rgba(124,58,237,.10);
  --vb-shadow-hover: 0 16px 34px rgba(124,58,237,.18);
  --vb-display: 'Cormorant Garamond', serif;
  --vb-body: 'Jost', 'Lato', sans-serif;
}

body{
  font-family: var(--vb-body) !important;
  color: var(--vb-ink);
}
h1,h2,h3,h4,h5,h6,
.page-title, .entry-title, .woocommerce-products-header__title{
  font-family: var(--vb-display) !important;
  font-weight: 600 !important;
  color: var(--vb-ink) !important;
}
a{ transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease; }

/* ==========================================================================
   1. GLOBAL BUTTONS
   ========================================================================== */
.button,
button,
input[type="submit"],
input[type="button"],
.wp-block-button__link,
.single_add_to_cart_button,
a.button,
#place_order,
.checkout-button,
.wc-proceed-to-checkout a,
.wpcf7-submit{
  background: var(--vb-purple) !important;
  border: 1px solid var(--vb-purple) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: var(--vb-body) !important;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 13px 32px !important;
  box-shadow: var(--vb-shadow);
}
.button:hover,
button:hover,
input[type="submit"]:hover,
.single_add_to_cart_button:hover,
a.button:hover,
#place_order:hover,
.wpcf7-submit:hover{
  background: #fff !important;
  color: var(--vb-purple) !important;
  box-shadow: var(--vb-shadow-hover);
  transform: translateY(-1px);
}

/* Secondary / "Buy Now" style buttons -> light purple */
.buy-now-button,
.buynow_button,
a.buy-now,
.single_buy_now_button{
  background: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
}
.buy-now-button:hover,
.single_buy_now_button:hover{
  background: #fff !important;
  color: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
}

/* ==========================================================================
   2. HEADER
   ========================================================================== */
.site-header,
.site-header.header-v2,
.site-header.bg-black{
  background: var(--vb-white) !important;
  border-bottom: 1px solid var(--vb-purple-pale);
}
.site-header .logo img{ max-height: 46px; }
.site-header .menu_btn,
.site-header .search_btn,
.site-header i{
  color: var(--vb-ink) !important;
}
.site-header .right_right_menu ul li a{
  color: var(--vb-ink) !important;
  position: relative;
}
.site-header .right_right_menu ul li a:hover,
.site-header .menu_btn:hover i,
.site-header .search_btn:hover i{
  color: var(--vb-purple) !important;
}
.site-header .right_right_menu .cart-count,
.site-header .right_right_menu .addon{
  background: var(--vb-purple) !important;
  color: #fff !important;
  border-radius: 50%;
  font-size: 10px;
}
.site-header .input_box input,
.header_form input[type="text"],
.header_form input[type="search"]{
  border: 1px solid var(--vb-purple-light) !important;
  border-radius: 999px !important;
  font-family: var(--vb-body);
}
.site-header .input_box input:focus{
  border-color: var(--vb-purple) !important;
  box-shadow: 0 0 0 3px var(--vb-purple-pale);
}
.site-header.fixed{
  box-shadow: var(--vb-shadow);
}

/* Primary nav */
.bottom_area{
  background: var(--vb-cream) !important;
  border-top: 1px solid var(--vb-purple-pale);
}
.nav-primary .menu_listing > li > a{
  color: var(--vb-ink) !important;
  font-family: var(--vb-body);
  font-weight: 500;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: .5px;
}
.nav-primary .menu_listing > li > a:hover,
.nav-primary .menu_listing > li.current-menu-item > a{
  color: var(--vb-purple) !important;
}
.nav-primary .menu_listing .sub-menu{
  background: #fff !important;
  border-top: 3px solid var(--vb-purple) !important;
  box-shadow: var(--vb-shadow-hover);
}
.nav-primary .menu_listing .sub-menu a:hover{
  color: var(--vb-purple) !important;
  background: var(--vb-purple-pale) !important;
}

/* ==========================================================================
   3. FOOTER
   ========================================================================== */
footer{
  background: var(--vb-ink) !important;
  color: #d9d3e0 !important;
}
footer h4{
  color: #fff !important;
  font-family: var(--vb-display) !important;
  position: relative;
  padding-bottom: 10px;
}
footer h4::after{
  content:"";
  display:block;
  width: 34px; height: 2px;
  background: var(--vb-purple-light);
  margin-top: 8px;
}
footer .f_menu li a,
footer .f_menu_cat li a{
  color: #cfc6db !important;
}
footer .f_menu li a:hover,
footer .f_menu_cat li a:hover{
  color: var(--vb-purple-light) !important;
  padding-left: 4px;
}
footer .social_media li a{
  border-color: var(--vb-purple-light) !important;
  color: #fff !important;
}
footer .social_media li a:hover{
  background: var(--vb-purple) !important;
  border-color: var(--vb-purple) !important;
}
footer .newslater input[type="email"],
footer .newslater input[type="text"]{
  border-radius: 999px 0 0 999px !important;
  border: 1px solid var(--vb-purple-light) !important;
  background: transparent;
  color: #fff;
}
footer .newslater input[type="submit"],
footer .newslater button{
  border-radius: 0 999px 999px 0 !important;
  background: var(--vb-purple) !important;
  border-color: var(--vb-purple) !important;
}
.whatsappp a{
  background: var(--vb-purple) !important;
}

/* ==========================================================================
   4. BREADCRUMB + PAGE TITLE (shop / category header band)
   ========================================================================== */
.woocommerce-breadcrumb{
  background: var(--vb-purple-pale) !important;
  color: var(--vb-ink) !important;
  padding: 14px 0;
}
.woocommerce-breadcrumb a{
  color: var(--vb-purple-dark) !important;
}
.woocommerce-breadcrumb a:hover{ color: var(--vb-purple) !important; }
.woocommerce-products-header__title.page-title{
  font-size: 34px !important;
  color: var(--vb-ink) !important;
}

/* Sorting / result count */
.woocommerce-ordering select{
  border: 1px solid var(--vb-purple-light) !important;
  border-radius: 999px !important;
  color: var(--vb-ink) !important;
  font-family: var(--vb-body);
  padding: 8px 18px !important;
}
.woocommerce-result-count{
  color: #8a8390;
}

/* ==========================================================================
   5. SHOP / CATEGORY PRODUCT GRID
   ========================================================================== */
ul.products li.product{
  background: #fff !important;
  border: 1px solid #F0ECF8 !important;
  border-radius: var(--vb-radius) !important;
  box-shadow: var(--vb-shadow);
  overflow: hidden;
  padding: 0 !important;
  transition: box-shadow .25s ease, transform .25s ease;
}
ul.products li.product:hover{
  box-shadow: var(--vb-shadow-hover) !important;
  transform: translateY(-4px);
  border-color: var(--vb-purple-light) !important;
}
ul.products li.product .woocommerce-loop-product__link{
  display:block;
  background: var(--vb-cream);
}
ul.products li.product .woocommerce-loop-product__link img{
  aspect-ratio: 1/1;
  object-fit: cover;
  width: 100%;
}
ul.products li.product .woocommerce-loop-product__title{
  font-family: var(--vb-display) !important;
  font-size: 17px !important;
  color: var(--vb-ink) !important;
  padding: 14px 14px 0 !important;
}
ul.products li.product .price{
  color: var(--vb-purple) !important;
  font-weight: 600 !important;
  padding: 4px 14px 14px !important;
}
ul.products li.product .price del{
  color: #b3aebb !important;
  opacity: 1 !important;
}
ul.products li.product .price ins{
  color: var(--vb-purple) !important;
  text-decoration: none;
}
ul.products li.product a.button,
ul.products li.product .button,
ul.products li.product .add_to_cart_button{
  display:block;
  width: calc(100% - 28px);
  margin: 0 14px 16px !important;
  text-align: center;
  background: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
  border-radius: 999px !important;
  padding: 11px 10px !important;
  font-size: 12px !important;
}
ul.products li.product a.button:hover,
ul.products li.product .button:hover{
  background: var(--vb-purple) !important;
  border-color: var(--vb-purple) !important;
  color: #fff !important;
}
.onsale{
  background: var(--vb-purple) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: var(--vb-body);
  font-size: 11px !important;
  font-weight: 600;
  padding: 4px 12px !important;
  text-transform: uppercase;
  top: 12px !important; left: 12px !important;
}
.tinvwl_add_to_wishlist_button,
ul.products li.product .tinvwl_add_to_wishlist_button{
  color: var(--vb-purple) !important;
}

/* variation swatch badges shown on cards (size/colour dots under title) */
.product_catagories li.product-category .count,
.product_wrapper .add_to_cart_button, .product_wrapper .added_to_cart{
  background: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
}

/* ==========================================================================
   6. SINGLE PRODUCT PAGE
   ========================================================================== */
.single-product .summary h1.entry-title,
.summary h1.entry-title{
  font-family: var(--vb-display) !important;
  font-size: 32px !important;
  color: var(--vb-ink) !important;
}
.summary .price,
.price{
  color: var(--vb-purple) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
}
.price del{ color: #b3aebb !important; font-size: 15px; }
.price ins{ text-decoration: none; color: var(--vb-purple) !important; }
.summary .woocommerce-product-rating .star-rating{ color: var(--vb-gold) !important; }
.woocommerce-product-rating a{ color: #8a8390 !important; }

/* image gallery */
.woocommerce-product-gallery{
  border-radius: var(--vb-radius);
  overflow: hidden;
}
.woocommerce-product-gallery .flex-control-nav li img,
.woocommerce-product-gallery__wrapper img{
  border-radius: 10px;
}
.woocommerce-product-gallery .flex-control-nav li img.flex-active,
.woocommerce-product-gallery .flex-control-nav li img:hover{
  border: 2px solid var(--vb-purple) !important;
}
.woocommerce-product-gallery__trigger{
  background: var(--vb-purple) !important;
  color: #fff !important;
  border-radius: 50%;
}

/* variation swatches (size boxes / colour dots / pack-of) */
.variations .thwvsf-rad-li .th-container .checkmark,
.variations .thwvsf-wrapper-ul .thwvsf-wrapper-item-li.attr_swatch_design_default{
  border-radius: 8px !important;
  border: 1px solid #ddd6e8 !important;
}
.variations .thwvsf-rad-li .th-container input:checked ~ .checkmark{
  border-color: var(--vb-purple) !important;
  background: var(--vb-purple-pale) !important;
  color: var(--vb-purple-dark) !important;
  box-shadow: 0 0 0 1px var(--vb-purple) inset;
}
.variations .thwvsf-rad-li .th-container:hover .checkmark{
  border-color: var(--vb-purple-light) !important;
}
.variations table,
.variations td.label{
  font-family: var(--vb-body);
  color: var(--vb-ink);
}
.variations select{
  border: 1px solid var(--vb-purple-light) !important;
  border-radius: 8px !important;
}

/* quantity stepper */
.quantity input[type="number"]{
  border: 1px solid var(--vb-purple-light) !important;
  border-radius: 999px !important;
  text-align: center;
  height: 44px;
  color: var(--vb-ink);
}
.quantity input[type="number"]:focus{
  border-color: var(--vb-purple) !important;
}

/* Add to cart / Buy now row */
.single_add_to_cart_button{
  background: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
}
.single_add_to_cart_button:hover{
  background: var(--vb-purple) !important;
  border-color: var(--vb-purple) !important;
  color: #fff !important;
}
.summary .tinv-wraper.tinv-wishlist .tinvwl_add_to_wishlist_button,
.summary .tinv-wishlist.tinvwl-before-add-to-cart .tinvwl_add_to_wishlist_button{
  border: 1px solid var(--vb-purple-light) !important;
  color: var(--vb-purple) !important;
  border-radius: 50% !important;
  background: #fff !important;
}
.summary .tinv-wraper.tinv-wishlist .tinvwl_add_to_wishlist_button:hover{
  background: var(--vb-purple) !important;
  color: #fff !important;
}

/* SKU / categories / tags / share row */
.product_meta,
.product_meta a{
  color: #7d7686 !important;
  font-size: 13px;
}
.product_meta a:hover{ color: var(--vb-purple) !important; }

/* Tabs: Description / Additional info / Reviews / Q&A */
.tabs.wc-tabs{
  border-bottom: 1px solid var(--vb-purple-pale) !important;
}
.tabs.wc-tabs li a{
  color: #8a8390 !important;
  font-family: var(--vb-body);
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  border: none !important;
  background: transparent !important;
}
.tabs.wc-tabs li.active a,
.tabs.wc-tabs li a:hover{
  color: var(--vb-purple) !important;
  border-bottom: 2px solid var(--vb-purple) !important;
  background: transparent !important;
}
.woocommerce-Tabs-panel.entry-content h2,
.woocommerce-Tabs-panel.entry-content h3{
  font-family: var(--vb-display) !important;
  color: var(--vb-ink) !important;
}
.woocommerce-tabs #reviews p.stars a::before{
  color: var(--vb-gold) !important;
}
.woocommerce-tabs #tab-reviews #submit{
  background: var(--vb-purple) !important;
  border-color: var(--vb-purple) !important;
}

/* Related products — reuse the same card style as the shop grid */
.related.products h2,
.up-sells h2{
  font-family: var(--vb-display) !important;
  font-size: 26px !important;
  color: var(--vb-ink) !important;
  text-align: left;
  border-bottom: 1px solid var(--vb-purple-pale);
  padding-bottom: 14px;
  margin-bottom: 24px !important;
}

/* Delivery / pincode / cash-on-delivery block */
.delivery-check-block,
.pincode-check{
  border: 1px dashed var(--vb-purple-light);
  border-radius: 10px;
  background: var(--vb-purple-pale);
}

/* ==========================================================================
   7. CART / CHECKOUT / MY ACCOUNT (kept functional, just re-skinned)
   ========================================================================== */
.shop_table th{
  background: var(--vb-purple-pale) !important;
  color: var(--vb-ink) !important;
  font-family: var(--vb-body);
  text-transform: uppercase;
  font-size: 12px;
}
.woocommerce-message,
.woocommerce-info{
  border-top-color: var(--vb-purple) !important;
}
.woocommerce-message::before,
.woocommerce-info::before{
  color: var(--vb-purple) !important;
}
.woocommerce-form-coupon input[type="submit"],
.coupon button{
  background: var(--vb-ink) !important;
  border-color: var(--vb-ink) !important;
}
.my_account_orders .button,
.woocommerce-MyAccount-navigation ul li.is-active a{
  color: var(--vb-purple) !important;
}
.woocommerce-MyAccount-navigation ul li a{
  color: var(--vb-ink);
}
.woocommerce-MyAccount-navigation ul li.is-active a{
  border-color: var(--vb-purple) !important;
}

/* ==========================================================================
   8. RESPONSIVE TWEAKS
   ========================================================================== */
@media (max-width: 767px){
  .woocommerce-products-header__title.page-title{ font-size: 24px !important; }
  .summary h1.entry-title{ font-size: 24px !important; }
  ul.products li.product .woocommerce-loop-product__title{ font-size: 14px !important; }
}