/*------------------------------------------------------------------
  Shèffe Jewels — Premium Luxury Theme Layer
  Mobile-First · Animated · Conversion-Optimized
  v2.0.0
-------------------------------------------------------------------*/

/* ============================================================
   0. GOOGLE FONTS IMPORT
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&family=Jost:wght@300;400;500;600;700&display=swap');

/* ============================================================
   1. GLOBAL RESET & BASE
   ============================================================ */

*, *::before, *::after {
  -webkit-tap-highlight-color: transparent;
}

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: 'Jost', sans-serif !important;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.7;
  color: var(--sf-text);
  background-color: var(--sf-white);
  overflow-x: hidden;
  letter-spacing: 0.01em;
}

::selection {
  background-color: var(--sf-gold);
  color: var(--sf-white);
}

::-moz-selection {
  background-color: var(--sf-gold);
  color: var(--sf-white);
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: var(--sf-off-white);
}
::-webkit-scrollbar-thumb {
  background: var(--sf-gold);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--sf-gold-dark);
}

/* ============================================================
   2. TYPOGRAPHY
   ============================================================ */

h1, h2, h3, h4, h5, h6,
.widget-title,
.tbay-element-base .heading-tbay-title,
.product_title,
.woocommerce div.product .product_title,
.page-title,
.entry-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--sf-black);
  line-height: 1.2;
}

h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.6rem, 4vw, 2.8rem); }
h3 { font-size: clamp(1.3rem, 3vw, 2rem); }
h4 { font-size: clamp(1.1rem, 2.5vw, 1.5rem); }

p, span, li, td, th, label, input, textarea, select {
  font-family: 'Jost', sans-serif;
}

a {
  color: var(--sf-black);
  text-decoration: none;
  transition: color var(--sf-duration-fast) var(--sf-transition);
}

a:hover {
  color: var(--sf-gold);
}

/* ============================================================
   3. ANIMATION SYSTEM — Scroll Reveal
   ============================================================ */

/* Fade In Up */
.sf-reveal,
.tbay-element,
.tbay-element-base,
.products .product,
.widget,
.woocommerce-tabs .panel,
.related.products,
.up-sells,
.cross-sells {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s var(--sf-transition),
              transform 0.7s var(--sf-transition);
}

.sf-reveal.sf-visible,
.tbay-element.sf-visible,
.tbay-element-base.sf-visible,
.products .product.sf-visible,
.widget.sf-visible,
.woocommerce-tabs .panel.sf-visible,
.related.products.sf-visible,
.up-sells.sf-visible,
.cross-sells.sf-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered children animation */
.products .product:nth-child(1) { transition-delay: 0s; }
.products .product:nth-child(2) { transition-delay: 0.08s; }
.products .product:nth-child(3) { transition-delay: 0.16s; }
.products .product:nth-child(4) { transition-delay: 0.24s; }
.products .product:nth-child(5) { transition-delay: 0.32s; }
.products .product:nth-child(6) { transition-delay: 0.4s; }
.products .product:nth-child(7) { transition-delay: 0.48s; }
.products .product:nth-child(8) { transition-delay: 0.56s; }

/* Shimmer text effect for headings */
@keyframes sfShimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.sf-shimmer-text {
  background: linear-gradient(90deg, var(--sf-black) 40%, var(--sf-gold) 50%, var(--sf-black) 60%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: sfShimmer 4s ease-in-out infinite;
}

/* Pulse glow for CTAs */
@keyframes sfPulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,169,110,0.4); }
  50% { box-shadow: 0 0 20px 4px rgba(201,169,110,0.15); }
}

/* Float animation for badges */
@keyframes sfFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

/* Scale entrance */
@keyframes sfScaleIn {
  from { opacity: 0; transform: scale(0.92); }
  to { opacity: 1; transform: scale(1); }
}

/* Slide from left */
@keyframes sfSlideLeft {
  from { opacity: 0; transform: translateX(-30px); }
  to { opacity: 1; transform: translateX(0); }
}

/* Slide from right */
@keyframes sfSlideRight {
  from { opacity: 0; transform: translateX(30px); }
  to { opacity: 1; transform: translateX(0); }
}

/* Gentle rotate in */
@keyframes sfRotateIn {
  from { opacity: 0; transform: rotate(-2deg) scale(0.95); }
  to { opacity: 1; transform: rotate(0) scale(1); }
}

/* ============================================================
   4. HEADER — Luxury Sticky Header
   ============================================================ */

.site-header,
#tbay-header,
.header-main {
  background-color: var(--sf-white) !important;
  border-bottom: 1px solid var(--sf-border-subtle);
  transition: all var(--sf-duration) var(--sf-transition);
}

/* Sticky header with glass morphism */
.header-sticky.is-sticky .site-header,
.header-sticky.is-sticky #tbay-header,
.header-sticky.is-sticky .header-main,
#tbay-header.sticky-header {
  background-color: rgba(255,255,255,0.95) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  box-shadow: 0 1px 30px rgba(0,0,0,0.06);
  border-bottom-color: transparent;
}

/* Logo animation */
.site-header .logo img,
.logo img,
#tbay-header .logo img {
  transition: transform var(--sf-duration) var(--sf-transition),
              opacity var(--sf-duration) var(--sf-transition);
  will-change: transform;
}

.site-header .logo img:hover {
  transform: scale(1.02);
}

/* Navigation links */
#tbay-header .tbay-mainmenu .navbar-nav > li > a,
.main-menu .navbar-nav > li > a,
.tbay-mainmenu .nav > li > a {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500;
  font-size: 13px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--sf-black) !important;
  padding: 12px 16px !important;
  position: relative;
  transition: color var(--sf-duration-fast) var(--sf-transition);
}

#tbay-header .tbay-mainmenu .navbar-nav > li > a::after,
.main-menu .navbar-nav > li > a::after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 16px;
  right: 16px;
  height: 1.5px;
  background: var(--sf-gold);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--sf-duration) var(--sf-transition);
}

#tbay-header .tbay-mainmenu .navbar-nav > li:hover > a,
.main-menu .navbar-nav > li:hover > a {
  color: var(--sf-gold) !important;
}

#tbay-header .tbay-mainmenu .navbar-nav > li:hover > a::after,
.main-menu .navbar-nav > li:hover > a::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Dropdown menus */
.tbay-mainmenu .navbar-nav .dropdown-menu,
.sub-menu {
  border: none !important;
  border-radius: var(--sf-radius-lg) !important;
  box-shadow: var(--sf-shadow-lg) !important;
  padding: 16px 0 !important;
  animation: sfScaleIn 0.3s var(--sf-transition) forwards;
  transform-origin: top center;
  border-top: 2px solid var(--sf-gold) !important;
}

.tbay-mainmenu .navbar-nav .dropdown-menu a,
.sub-menu a {
  font-size: 13px !important;
  padding: 8px 24px !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.tbay-mainmenu .navbar-nav .dropdown-menu a:hover,
.sub-menu a:hover {
  color: var(--sf-gold) !important;
  padding-left: 30px !important;
  background: var(--sf-cream) !important;
}

/* Header icons — cart, search, user */
.tbay-custom-language .select-button,
.header-right .tbay-icon,
.top-wishlist,
.tbay-search-form,
.cart-dropdown .cart-icon,
.header-right a,
.topbar-mobile-right a {
  color: var(--sf-black) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.header-right .tbay-icon:hover,
.cart-dropdown .cart-icon:hover,
.header-right a:hover,
.topbar-mobile-right a:hover {
  color: var(--sf-gold) !important;
  transform: translateY(-1px);
}

/* Cart count badge */
.cart-dropdown .count-icon,
.tbay-icon .count,
.count-icon,
.mini-cart .count {
  background-color: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600;
  font-size: 10px !important;
  min-width: 18px;
  height: 18px;
  line-height: 18px;
  border-radius: 9px;
  animation: sfFloat 3s ease-in-out infinite;
}

/* ============================================================
   5. HERO / BANNER SECTION
   ============================================================ */

.tbay-element-banner,
.tbay-element-banner-box,
.tbay-banner,
.elementor-widget-image {
  overflow: hidden;
  border-radius: var(--sf-radius-lg);
}

.tbay-element-banner img,
.tbay-banner img,
.banner-image img {
  transition: transform 1.2s var(--sf-transition),
              filter 0.8s var(--sf-transition);
  will-change: transform;
}

.tbay-element-banner:hover img,
.tbay-banner:hover img,
.banner-image:hover img {
  transform: scale(1.05);
}

/* Banner overlay text */
.tbay-element-banner .banner-tbay-title,
.tbay-banner .content {
  font-family: 'Cormorant Garamond', serif !important;
  letter-spacing: 0.06em;
}

/* ============================================================
   6. PRODUCT CARDS — Premium Hover Effects
   ============================================================ */

.products .product,
.product-block,
li.product {
  border: none !important;
  border-radius: var(--sf-radius-lg);
  overflow: hidden;
  background: var(--sf-white);
  transition: all var(--sf-duration) var(--sf-transition);
  position: relative;
}

.products .product:hover,
.product-block:hover {
  box-shadow: var(--sf-shadow-md);
  transform: translateY(-4px);
}

/* Product image container */
.product-block .image,
.products .product .product-image,
.product-block .product-image,
.product .product-content-image,
li.product .product-image-wrapper {
  overflow: hidden;
  position: relative;
  border-radius: var(--sf-radius-lg) var(--sf-radius-lg) 0 0;
}

.product-block .image img,
.products .product .product-image img,
.product .product-content-image img,
li.product .wp-post-image {
  transition: transform 0.8s var(--sf-transition);
  will-change: transform;
}

.product-block:hover .image img,
.products .product:hover .product-image img,
.product:hover .product-content-image img,
li.product:hover .wp-post-image {
  transform: scale(1.06);
}

/* Product action buttons — quick view, wishlist, compare */
.product-block .group-buttons,
.product .group-action,
.product-block .add-wishlist,
.yith-wcwl-add-button,
.woocommerce .products .product .group-action {
  opacity: 0;
  transform: translateY(10px);
  transition: all var(--sf-duration) var(--sf-transition);
}

.product-block:hover .group-buttons,
.product:hover .group-action,
.product-block:hover .add-wishlist,
li.product:hover .group-action {
  opacity: 1;
  transform: translateY(0);
}

.product-block .group-buttons a,
.product .group-action a,
.group-action .button {
  background: var(--sf-white) !important;
  color: var(--sf-black) !important;
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  line-height: 40px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0 3px !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
  box-shadow: var(--sf-shadow-sm);
}

.product-block .group-buttons a:hover,
.product .group-action a:hover,
.group-action .button:hover {
  background: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  border-color: var(--sf-gold) !important;
  transform: scale(1.1);
  box-shadow: var(--sf-shadow-gold);
}

/* Product title */
.product-block .name a,
.products .product .woocommerce-loop-product__title,
.woocommerce-loop-product__title,
.product_title,
li.product .woocommerce-loop-product__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 0.03em;
  color: var(--sf-black) !important;
  transition: color var(--sf-duration-fast) var(--sf-transition);
  margin-top: 12px !important;
}

.product-block .name a:hover,
li.product .woocommerce-loop-product__title:hover {
  color: var(--sf-gold) !important;
}

/* Product price */
.product-block .price,
.products .product .price,
.woocommerce .products .product .price,
li.product .price {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  color: var(--sf-gold-dark) !important;
  letter-spacing: 0.02em;
}

.product-block .price del,
.products .product .price del {
  color: var(--sf-warm-gray) !important;
  font-weight: 400 !important;
}

.product-block .price ins,
.products .product .price ins {
  color: var(--sf-gold-dark) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

/* Sale badge */
.onsale,
.product-block .onsale,
.woocommerce span.onsale,
.products .product .onsale,
.product .onsale {
  background: var(--sf-black) !important;
  color: var(--sf-white) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 600 !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  border-radius: var(--sf-radius) !important;
  padding: 4px 10px !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1.4 !important;
  animation: sfFloat 3s ease-in-out infinite;
}

/* ============================================================
   7. ADD TO CART BUTTON — Luxury CTA
   ============================================================ */

.product-block .add-cart a,
.products .product .button,
.product .add_to_cart_button,
.woocommerce .products .product .add_to_cart_button,
.single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
li.product .add_to_cart_button,
.button.product_type_simple {
  background: var(--sf-black) !important;
  color: var(--sf-white) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border: 2px solid var(--sf-black) !important;
  border-radius: var(--sf-radius) !important;
  padding: 12px 28px !important;
  position: relative;
  overflow: hidden;
  transition: all var(--sf-duration) var(--sf-transition);
  cursor: pointer;
}

.product-block .add-cart a::before,
.single_add_to_cart_button::before,
.woocommerce a.button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(201,169,110,0.2), transparent);
  transition: left 0.6s var(--sf-transition);
}

.product-block .add-cart a:hover,
.products .product .button:hover,
.single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
li.product .add_to_cart_button:hover {
  background: var(--sf-gold) !important;
  border-color: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  transform: translateY(-2px);
  box-shadow: var(--sf-shadow-gold);
}

.product-block .add-cart a:hover::before,
.single_add_to_cart_button:hover::before {
  left: 100%;
}

/* Alternate button style (outlined) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.checkout-button,
.wc-proceed-to-checkout .checkout-button {
  background: var(--sf-gold) !important;
  border-color: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: var(--sf-radius) !important;
  padding: 14px 32px !important;
  transition: all var(--sf-duration) var(--sf-transition);
  animation: sfPulseGlow 3s ease-in-out infinite;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.checkout-button:hover {
  background: var(--sf-gold-dark) !important;
  border-color: var(--sf-gold-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 30px rgba(201,169,110,0.3);
}

/* ============================================================
   8. SINGLE PRODUCT PAGE
   ============================================================ */

.woocommerce div.product {
  animation: sfScaleIn 0.6s var(--sf-transition) forwards;
}

.woocommerce div.product .product_title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(1.6rem, 4vw, 2.4rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  margin-bottom: 12px !important;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: 'Jost', sans-serif !important;
  font-size: 22px !important;
  font-weight: 500 !important;
  color: var(--sf-gold-dark) !important;
}

/* Product gallery */
.woocommerce div.product div.images {
  overflow: hidden;
  border-radius: var(--sf-radius-lg);
}

.woocommerce div.product div.images img {
  border-radius: var(--sf-radius-lg);
  transition: transform 0.8s var(--sf-transition);
}

.woocommerce div.product div.images:hover img {
  transform: scale(1.03);
}

/* Product gallery thumbnails */
.woocommerce div.product div.images .flex-control-thumbs li img,
.product-gallery-thumbnails img {
  border-radius: var(--sf-radius) !important;
  border: 2px solid transparent !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
  cursor: pointer;
}

.woocommerce div.product div.images .flex-control-thumbs li img:hover,
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
  border-color: var(--sf-gold) !important;
  opacity: 1 !important;
}

/* Quantity selector */
.woocommerce .quantity .qty,
.quantity input[type="number"] {
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: var(--sf-radius) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 500;
  padding: 8px 12px !important;
  transition: border-color var(--sf-duration-fast) var(--sf-transition);
}

.woocommerce .quantity .qty:focus,
.quantity input[type="number"]:focus {
  border-color: var(--sf-gold) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(201,169,110,0.1);
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--sf-border-subtle) !important;
  padding: 0 !important;
  margin-bottom: 30px !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--sf-text-light) !important;
  padding: 14px 24px !important;
  position: relative;
  transition: color var(--sf-duration-fast) var(--sf-transition);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 24px;
  right: 24px;
  height: 2px;
  background: var(--sf-gold);
  transform: scaleX(0);
  transition: transform var(--sf-duration) var(--sf-transition);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li:hover a {
  color: var(--sf-black) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a::after {
  transform: scaleX(1);
}

/* ============================================================
   9. SHOPPING CART & CHECKOUT
   ============================================================ */

/* Mini cart dropdown */
.cart-dropdown .dropdown-menu,
.tbay-offcanvas-cart,
.widget_shopping_cart {
  border: none !important;
  box-shadow: var(--sf-shadow-lg) !important;
  border-radius: var(--sf-radius-lg) !important;
  animation: sfSlideRight 0.4s var(--sf-transition) forwards;
}

/* Cart items */
.woocommerce-cart-form .product-name a,
.mini_cart_item a {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 500 !important;
  color: var(--sf-black) !important;
}

/* Cart totals */
.cart_totals,
.woocommerce-checkout-review-order {
  background: var(--sf-cream) !important;
  border-radius: var(--sf-radius-lg) !important;
  padding: 30px !important;
  border: none !important;
}

/* Checkout form fields */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-input-wrapper input,
.woocommerce-input-wrapper textarea {
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: var(--sf-radius) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  padding: 14px 16px !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
  background: var(--sf-white) !important;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: var(--sf-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,169,110,0.08) !important;
  outline: none;
}

.woocommerce form .form-row label {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  letter-spacing: 0.04em;
  color: var(--sf-text) !important;
  text-transform: uppercase;
}

/* ============================================================
   10. FOOTER — Elegant Dark Footer
   ============================================================ */

footer,
.tbay-footer,
#tbay-footer,
.site-footer,
.footer {
  background: var(--sf-black) !important;
  color: rgba(255,255,255,0.7) !important;
  position: relative;
}

.tbay-footer::before,
#tbay-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--sf-gold), transparent);
}

footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
.tbay-footer h1, .tbay-footer h2, .tbay-footer h3, .tbay-footer h4,
#tbay-footer .widget-title,
.footer .widget-title {
  color: var(--sf-white) !important;
  font-family: 'Cormorant Garamond', serif !important;
  letter-spacing: 0.06em;
}

footer a,
.tbay-footer a,
#tbay-footer a {
  color: rgba(255,255,255,0.6) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

footer a:hover,
.tbay-footer a:hover,
#tbay-footer a:hover {
  color: var(--sf-gold) !important;
  padding-left: 4px;
}

/* Footer newsletter */
footer .mc4wp-form input[type="email"],
.tbay-footer .mc4wp-form input[type="email"],
.newsletter-form input[type="email"] {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: var(--sf-white) !important;
  border-radius: var(--sf-radius) !important;
  padding: 14px 18px !important;
  font-family: 'Jost', sans-serif !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

footer .mc4wp-form input[type="email"]:focus,
.newsletter-form input[type="email"]:focus {
  border-color: var(--sf-gold) !important;
  background: rgba(255,255,255,0.12) !important;
}

footer .mc4wp-form input[type="submit"],
.newsletter-form button,
.newsletter-form input[type="submit"] {
  background: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  border: none !important;
  border-radius: var(--sf-radius) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 14px 28px !important;
  transition: all var(--sf-duration) var(--sf-transition);
}

footer .mc4wp-form input[type="submit"]:hover,
.newsletter-form button:hover {
  background: var(--sf-gold-dark) !important;
  transform: translateY(-2px);
  box-shadow: var(--sf-shadow-gold);
}

/* ============================================================
   11. CATEGORY / SHOP PAGE
   ============================================================ */

/* Page header / breadcrumb */
.woocommerce-products-header,
.tbay-breadcrumb,
.page-heading {
  background: var(--sf-cream) !important;
  border-bottom: 1px solid var(--sf-border-subtle);
  padding: 40px 0 !important;
}

.tbay-breadcrumb .breadcrumb a,
.woocommerce-breadcrumb a {
  color: var(--sf-text-light) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.tbay-breadcrumb .breadcrumb .active,
.woocommerce-breadcrumb > span:last-child {
  color: var(--sf-gold) !important;
}

/* Product filters / sidebar */
.widget.woocommerce ul li a,
.widget_product_categories ul li a {
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  color: var(--sf-text) !important;
  padding: 8px 0 !important;
  display: block;
  border-bottom: 1px solid var(--sf-border-subtle);
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.widget.woocommerce ul li a:hover,
.widget_product_categories ul li a:hover {
  color: var(--sf-gold) !important;
  padding-left: 8px !important;
}

/* Sorting select */
.woocommerce-ordering select,
.orderby {
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: var(--sf-radius) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  padding: 10px 14px !important;
}

/* ============================================================
   12. MOBILE-FIRST RESPONSIVE STYLES
   ============================================================ */

/* Mobile bottom navigation enhancement */
.tbay-footer-mobile,
.footer-device,
.mobile-footer-bar {
  background: var(--sf-white) !important;
  box-shadow: 0 -2px 20px rgba(0,0,0,0.06) !important;
  border-top: 1px solid var(--sf-border-subtle) !important;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  z-index: 9999;
}

.tbay-footer-mobile a,
.footer-device a,
.mobile-footer-bar a {
  color: var(--sf-text-light) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 10px !important;
  letter-spacing: 0.04em;
  transition: color var(--sf-duration-fast) var(--sf-transition);
}

.tbay-footer-mobile a.active,
.tbay-footer-mobile a:hover,
.footer-device a.active {
  color: var(--sf-gold) !important;
}

/* Mobile header */
@media (max-width: 1199px) {
  .topbar-mobile,
  .header-mobile,
  .tbay-header-mobile {
    background: var(--sf-white) !important;
    box-shadow: var(--sf-shadow-sm);
    padding: 8px 0 !important;
  }

  .topbar-mobile .mobile-logo img,
  .tbay-header-mobile .logo img {
    max-height: 40px;
  }
}

/* Mobile menu panel */
.mm-menu,
.tbay-offcanvas,
.offcanvas-menu {
  background: var(--sf-white) !important;
}

.mm-menu .mm-listview > li > a,
.tbay-offcanvas .menu-item a,
.offcanvas-menu a {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0.06em;
  color: var(--sf-black) !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid var(--sf-border-subtle) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.mm-menu .mm-listview > li > a:hover {
  color: var(--sf-gold) !important;
  padding-left: 28px !important;
}

/* Mobile product grid - 2 columns */
@media (max-width: 767px) {
  .products .product,
  .products li.product {
    margin-bottom: 16px !important;
  }

  .products .product .product-image img {
    border-radius: var(--sf-radius-lg) var(--sf-radius-lg) 0 0;
  }

  .woocommerce-loop-product__title,
  .product-block .name a {
    font-size: 14px !important;
    line-height: 1.3;
  }

  .products .product .price {
    font-size: 14px !important;
  }

  /* Single product mobile */
  .woocommerce div.product .product_title {
    font-size: 1.5rem !important;
  }

  .single_add_to_cart_button {
    width: 100% !important;
    padding: 16px !important;
    font-size: 13px !important;
    position: sticky;
    bottom: 70px;
    z-index: 100;
  }

  /* Mobile-friendly touch targets */
  .product-block .group-buttons a,
  .group-action a {
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
  }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1023px) {
  .products .product {
    margin-bottom: 20px !important;
  }

  h1 { font-size: 2rem; }
  h2 { font-size: 1.8rem; }
}

/* Desktop enhancements */
@media (min-width: 1024px) {
  .products .product:hover .product-image img,
  .product-block:hover .image img {
    transform: scale(1.08);
  }
}

/* ============================================================
   13. LOADING & PAGE TRANSITIONS
   ============================================================ */

/* Smooth page load */
#wrapper-container {
  animation: sfScaleIn 0.5s var(--sf-transition) forwards;
}

/* Skeleton loading placeholder */
.sf-skeleton {
  background: linear-gradient(90deg, var(--sf-off-white) 25%, var(--sf-cream) 37%, var(--sf-off-white) 63%);
  background-size: 400% 100%;
  animation: sfSkeleton 1.4s ease infinite;
  border-radius: var(--sf-radius);
}

@keyframes sfSkeleton {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

/* AJAX loading spinner */
.woocommerce .blockUI.blockOverlay::before,
.loading::before {
  border-color: var(--sf-cream) !important;
  border-top-color: var(--sf-gold) !important;
}

/* ============================================================
   14. WISHLIST & COMPARE
   ============================================================ */

.yith-wcwl-add-to-wishlist a,
.add-to-wishlist a {
  color: var(--sf-text-light) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.yith-wcwl-add-to-wishlist a:hover,
.add-to-wishlist a:hover,
.yith-wcwl-add-to-wishlist .yith-wcwl-wishlistaddedbrowse a,
.yith-wcwl-add-to-wishlist .yith-wcwl-wishlistexistsbrowse a {
  color: #E74C3C !important;
}

/* ============================================================
   15. FORMS & INPUTS (Global)
   ============================================================ */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="url"],
input[type="search"],
textarea,
select {
  font-family: 'Jost', sans-serif !important;
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: var(--sf-radius) !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  color: var(--sf-text) !important;
  background: var(--sf-white) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
  -webkit-appearance: none;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--sf-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,169,110,0.08) !important;
  outline: none !important;
}

/* Search form */
.tbay-search-form input[type="text"],
.search-form input[type="search"],
.dgwt-wcas-search-input {
  border-radius: 30px !important;
  padding: 12px 24px !important;
  background: var(--sf-off-white) !important;
  border: 1px solid var(--sf-border-subtle) !important;
}

.tbay-search-form input[type="text"]:focus,
.search-form input[type="search"]:focus {
  background: var(--sf-white) !important;
  border-color: var(--sf-gold) !important;
  box-shadow: var(--sf-shadow-md) !important;
}

/* ============================================================
   16. NOTIFICATIONS & POPUPS
   ============================================================ */

.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--sf-gold) !important;
  background: var(--sf-cream) !important;
  color: var(--sf-text) !important;
  font-family: 'Jost', sans-serif !important;
  border-radius: var(--sf-radius-lg) !important;
  animation: sfSlideLeft 0.4s var(--sf-transition) forwards;
}

.woocommerce-error {
  border-top-color: #E74C3C !important;
  border-radius: var(--sf-radius-lg) !important;
  animation: sfSlideLeft 0.4s var(--sf-transition) forwards;
}

.woocommerce-message a.button {
  background: var(--sf-gold) !important;
  color: var(--sf-white) !important;
  border: none !important;
  border-radius: var(--sf-radius) !important;
}

/* Newsletter popup */
.mfp-bg {
  background: rgba(10,10,10,0.7) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.mfp-content {
  animation: sfScaleIn 0.4s var(--sf-transition-spring) forwards;
}

.popup-newsletter,
.tbay-popup-newsletter {
  border-radius: var(--sf-radius-lg) !important;
  overflow: hidden;
  box-shadow: var(--sf-shadow-lg) !important;
}

/* ============================================================
   17. STAR RATINGS
   ============================================================ */

.star-rating,
.woocommerce .star-rating {
  color: var(--sf-gold) !important;
}

.star-rating::before {
  color: var(--sf-cream) !important;
}

/* ============================================================
   18. SOCIAL PROOF & TRUST BADGES
   ============================================================ */

/* Add visual trust indicators */
.woocommerce div.product .product_meta {
  border-top: 1px solid var(--sf-border-subtle);
  padding-top: 20px;
  margin-top: 20px;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  color: var(--sf-text-light);
}

/* ============================================================
   19. BLOG / POSTS
   ============================================================ */

.entry-title a {
  font-family: 'Cormorant Garamond', serif !important;
  color: var(--sf-black) !important;
  transition: color var(--sf-duration-fast) var(--sf-transition);
}

.entry-title a:hover {
  color: var(--sf-gold) !important;
}

.entry-content,
.entry-summary {
  font-family: 'Jost', sans-serif;
  line-height: 1.8;
  color: var(--sf-text);
}

/* ============================================================
   20. PAGINATION
   ============================================================ */

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
.page-numbers li a,
.page-numbers li span {
  font-family: 'Jost', sans-serif !important;
  border: 1px solid var(--sf-border-subtle) !important;
  border-radius: var(--sf-radius) !important;
  color: var(--sf-text) !important;
  transition: all var(--sf-duration-fast) var(--sf-transition);
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.page-numbers li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current,
.page-numbers li span.current {
  background: var(--sf-gold) !important;
  border-color: var(--sf-gold) !important;
  color: var(--sf-white) !important;
}

/* ============================================================
   21. UTILITY CLASSES
   ============================================================ */

.sf-gold-text { color: var(--sf-gold) !important; }
.sf-gold-bg { background-color: var(--sf-gold) !important; }
.sf-black-bg { background-color: var(--sf-black) !important; }
.sf-cream-bg { background-color: var(--sf-cream) !important; }
.sf-serif { font-family: 'Cormorant Garamond', serif !important; }
.sf-sans { font-family: 'Jost', sans-serif !important; }

/* Gold gradient text */
.sf-gradient-text {
  background: linear-gradient(135deg, var(--sf-gold-dark), var(--sf-gold), var(--sf-gold-light));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Gold line divider */
.sf-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--sf-gold), transparent);
  border: none;
  margin: 30px 0;
}

/* ============================================================
   22. PERFORMANCE — GPU Acceleration & Will-Change
   ============================================================ */

.products .product,
.product-block .image img,
.tbay-element-banner img,
.site-header,
.single_add_to_cart_button {
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .sf-reveal,
  .tbay-element,
  .products .product {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ============================================================
   23. PRINT STYLES
   ============================================================ */

@media print {
  .site-header,
  .tbay-footer,
  .tbay-footer-mobile,
  .footer-device,
  .group-action,
  .group-buttons {
    display: none !important;
  }

  body {
    font-size: 12pt;
    color: #000;
  }
}
