/*
 Theme Name:   Astra Child - Melodika Music
 Theme URI:    http://test.local
 Description:  A vibrant, musical child theme for Melodika Music Store
 Author:       Melodika
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

/* ============================================
   🎵 MELODIKA MUSIC STORE - CUSTOM STYLES 🎵
   A vibrant, musical e-commerce theme
   ============================================ */

/* ---------- CSS Variables / Design Tokens ---------- */
:root {
  /* Primary palette */
  --mk-purple-deep: #1a0a2e;
  --mk-purple: #6B21A8;
  --mk-purple-light: #9333EA;
  --mk-violet: #A855F7;
  --mk-blue: #3B82F6;
  --mk-blue-light: #60A5FA;
  --mk-cyan: #22D3EE;
  
  /* Accent / warm */
  --mk-gold: #F59E0B;
  --mk-amber: #FBBF24;
  --mk-orange: #F97316;
  --mk-rose: #F43F5E;
  
  /* Neutrals */
  --mk-dark: #0F0A1A;
  --mk-dark-card: #1E1432;
  --mk-dark-surface: #241A38;
  --mk-dark-border: #3D2E5C;
  --mk-text-primary: #F1E8FF;
  --mk-text-secondary: #B8A5D4;
  --mk-text-muted: #7C6A9A;
  --mk-white: #FFFFFF;
  
  /* Gradients */
  --mk-gradient-hero: linear-gradient(135deg, #1a0a2e 0%, #2d1052 30%, #1a0a2e 60%, #0f1a3d 100%);
  --mk-gradient-accent: linear-gradient(135deg, #6B21A8, #3B82F6);
  --mk-gradient-warm: linear-gradient(135deg, #F59E0B, #F97316, #F43F5E);
  --mk-gradient-card: linear-gradient(145deg, rgba(107, 33, 168, 0.15), rgba(59, 130, 246, 0.08));
  --mk-gradient-glow: radial-gradient(ellipse at 50% 0%, rgba(147, 51, 234, 0.3) 0%, transparent 60%);
  
  /* Shadows */
  --mk-shadow-sm: 0 2px 8px rgba(107, 33, 168, 0.15);
  --mk-shadow-md: 0 4px 20px rgba(107, 33, 168, 0.2);
  --mk-shadow-lg: 0 8px 40px rgba(107, 33, 168, 0.3);
  --mk-shadow-glow: 0 0 30px rgba(147, 51, 234, 0.4);
  
  /* Transitions */
  --mk-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --mk-transition-bounce: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  
  /* Border radius */
  --mk-radius-sm: 8px;
  --mk-radius-md: 12px;
  --mk-radius-lg: 16px;
  --mk-radius-xl: 24px;
  --mk-radius-full: 9999px;
}

/* ---------- Global Styles / Body ---------- */
body {
  background: var(--mk-dark) !important;
  color: var(--mk-text-primary) !important;
  font-family: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  overflow-x: hidden;
}

/* Subtle animated background grain */
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--mk-gradient-glow);
  pointer-events: none;
  z-index: 0;
}

/* Musical note floating particles – pure CSS */
body::after {
  content: '♪ ♫ ♬ ♩ ♭ ♮';
  position: fixed;
  top: 0;
  left: 0;
  width: 200%;
  height: 100%;
  font-size: 24px;
  color: rgba(147, 51, 234, 0.04);
  letter-spacing: 80px;
  line-height: 120px;
  word-spacing: 60px;
  pointer-events: none;
  z-index: 0;
  animation: floatNotes 60s linear infinite;
  white-space: nowrap;
}

@keyframes floatNotes {
  0% { transform: translate(0, 0); }
  100% { transform: translate(-50%, 0); }
}

/* ---------- Links ---------- */
a {
  color: var(--mk-violet) !important;
  transition: var(--mk-transition);
}

a:hover {
  color: var(--mk-cyan) !important;
}

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: var(--mk-dark);
}
::-webkit-scrollbar-thumb {
  background: var(--mk-purple);
  border-radius: var(--mk-radius-full);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--mk-purple-light);
}

/* ============================================
   HEADER / NAVIGATION
   ============================================ */
.ast-primary-header,
.ast-main-header-wrap,
header.site-header,
.ast-primary-header-bar {
  background: rgba(15, 10, 26, 0.7) !important;
  backdrop-filter: blur(12px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(180%) !important;
  border-bottom: 1px solid rgba(147, 51, 234, 0.15) !important;
  transition: var(--mk-transition);
  padding: 10px 0 !important;
}

/* Site title */
.ast-site-title a,
.site-title a,
.ast-site-identity a {
  color: var(--mk-white) !important;
  font-weight: 800 !important;
  font-size: 1.4rem !important;
  letter-spacing: -0.5px !important;
  background: linear-gradient(135deg, #fff 0%, var(--mk-violet) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 20px rgba(147, 51, 234, 0.3);
}

/* Nav links */
.ast-header-break-point .main-navigation a,
.main-header-menu > .menu-item > a,
.ast-header-sections-navigation .menu-item > a,
.ast-builder-menu .menu-item > .menu-link,
header .menu-item > a,
.ast-nav-menu > li > a {
  color: var(--mk-text-secondary) !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 6px 14px !important;
  margin: 0 4px !important;
  border-radius: var(--mk-radius-sm) !important;
  transition: var(--mk-transition) !important;
  position: relative;
}

.main-header-menu > .menu-item > a:hover,
.ast-builder-menu .menu-item > .menu-link:hover,
header .menu-item > a:hover,
.ast-nav-menu > li > a:hover {
  color: var(--mk-white) !important;
  background: rgba(147, 51, 234, 0.1) !important;
  transform: translateY(-1px);
}

/* Header transition on scroll or hover */
header.site-header:hover {
  background: rgba(15, 10, 26, 0.85) !important;
}

.main-header-menu > .menu-item.current-menu-item > a,
.ast-builder-menu .menu-item.current-menu-item > .menu-link,
.ast-nav-menu > li.current-menu-item > a {
  color: var(--mk-white) !important;
  background: rgba(147, 51, 234, 0.1) !important;
  border: 1px solid rgba(147, 51, 234, 0.3) !important;
  box-shadow: 0 0 15px rgba(147, 51, 234, 0.1) !important;
}

.main-header-menu > .menu-item.current-menu-item > a::after,
.ast-nav-menu > li.current-menu-item > a::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 2px;
  background: var(--mk-gradient-accent);
  border-radius: 2px;
  box-shadow: 0 0 10px var(--mk-purple-light);
  animation: pulseGlow 2s infinite;
}

@keyframes pulseGlow {
  0% { opacity: 0.6; width: 12px; }
  50% { opacity: 1; width: 18px; }
  100% { opacity: 0.6; width: 12px; }
}

/* ============================================
   MAIN CONTENT AREA
   ============================================ */
#content,
.site-content,
.ast-container,
.entry-content {
  position: relative;
  z-index: 1;
}

.site-content {
  background: transparent !important;
}

/* Page titles */
.entry-title,
.page-title,
.woocommerce-products-header__title,
h1.wp-block-heading,
.wp-block-post-title {
  color: var(--mk-white) !important;
  font-weight: 800 !important;
  font-size: 2.8rem !important;
  letter-spacing: -1px !important;
  background: linear-gradient(135deg, var(--mk-white) 0%, var(--mk-violet) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 0.5em !important;
}

h2, h3, h4 {
  color: var(--mk-text-primary) !important;
  font-weight: 700 !important;
}

p {
  color: var(--mk-text-secondary) !important;
}

/* ============================================
   BREADCRUMBS
   ============================================ */
.woocommerce-breadcrumb,
.ast-breadcrumbs {
  color: var(--mk-text-muted) !important;
  padding: 16px 0 !important;
  font-size: 0.85rem !important;
}

.woocommerce-breadcrumb a {
  color: var(--mk-violet) !important;
}

/* ============================================
   🛍️ SHOP / PRODUCT GRID
   ============================================ */

/* Product cards */
.woocommerce ul.products li.product,
.wc-block-grid__product,
ul.products li.product {
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-lg) !important;
  padding: 0 !important;
  overflow: hidden;
  transition: var(--mk-transition) !important;
  position: relative;
}

.woocommerce ul.products li.product,
ul.products li.product {
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-lg) !important;
  transition: var(--mk-transition-bounce) !important;
  overflow: hidden !important;
  position: relative;
  display: flex !important;
  flex-direction: column !important;
}

.woocommerce ul.products li.product:hover,
ul.products li.product:hover {
  transform: translateY(-8px) !important;
  border-color: var(--mk-purple) !important;
  box-shadow: var(--mk-shadow-lg), 0 0 60px rgba(147, 51, 234, 0.15) !important;
}

/* Product image container */
.woocommerce ul.products li.product a img,
ul.products li.product .attachment-woocommerce_thumbnail {
  border-radius: 0 !important;
  transition: var(--mk-transition) !important;
  width: 100% !important;
}

.woocommerce ul.products li.product:hover a img {
  transform: scale(1.06);
  filter: brightness(1.1);
}

/* Product image wrapper */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap,
ul.products li.product .astra-shop-thumbnail-wrap {
  overflow: hidden !important;
  position: relative;
  background: linear-gradient(180deg, var(--mk-dark-surface), var(--mk-dark-card)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  aspect-ratio: 1/1 !important;
  max-height: 240px !important;
}

/* Hide on-card floating button */
.ast-on-card-button,
.ast-on-card-button-wrap {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Summary wrap adjustments */
.astra-shop-summary-wrap {
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

/* Force visual order: Category > Title > Price > Rating > Button */
.astra-shop-summary-wrap .ast-woo-product-category { order: 1 !important; }
.astra-shop-summary-wrap .ast-loop-product__link { order: 2 !important; }
.astra-shop-summary-wrap .price { order: 3 !important; padding-bottom: 4px !important; }
.astra-shop-summary-wrap .review-rating,
.astra-shop-summary-wrap .star-rating { 
  order: 4 !important; 
  margin: 0 16px 12px !important;
}
.astra-shop-summary-wrap .button { order: 5 !important; }

/* Product title, category and price inside summary */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--mk-white) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  line-height: 1.3 !important;
  padding: 8px 16px 2px !important;
  margin: 0 !important;
}

.woocommerce ul.products li.product .ast-woo-product-category {
  color: var(--mk-violet) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  padding: 12px 16px 0 !important;
}

.woocommerce ul.products li.product .price {
  color: var(--mk-gold) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  padding: 4px 16px 8px !important;
}

.woocommerce ul.products li.product .price .amount,
.woocommerce ul.products li.product .price ins {
  color: var(--mk-gold) !important;
}

.woocommerce ul.products li.product .price del {
  color: var(--mk-text-muted) !important;
  opacity: 0.6;
}

/* Star rating styling */
.woocommerce ul.products li.product .star-rating {
  font-size: 0.85rem !important;
  width: 75px !important;
}

.woocommerce ul.products li.product .star-rating::before {
  color: rgba(255, 255, 255, 0.2) !important;
}

/* Add to Cart button (Flush at bottom) */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.add_to_cart_button,
ul.products li.product .button {
  background: var(--mk-gradient-accent) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: 0 !important; /* Flush corner */
  padding: 12px 20px !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  width: 100% !important;
  text-align: center !important;
  transition: var(--mk-transition) !important;
  margin: auto 0 0 0 !important; /* Push to bottom */
  display: block !important;
}

.woocommerce ul.products li.product .button:hover,
ul.products li.product .button:hover {
  background: linear-gradient(135deg, var(--mk-purple-light), var(--mk-cyan)) !important;
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.2) !important;
  transform: none !important;
}

/* Sale badge */
.woocommerce span.onsale,
.onsale {
  background: var(--mk-gradient-warm) !important;
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 6px 14px !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 2px 12px rgba(249, 115, 22, 0.4) !important;
  z-index: 10 !important;
}

/* Shop Toolbar (Sorting & Result Count) */
.woocommerce-shop-header,
.ast-woocommerce-container .woocommerce-ordering,
.woocommerce-ordering {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 15px !important;
  margin-bottom: 30px !important;
}

.woocommerce-result-count {
  margin: 0 !important;
  color: var(--mk-text-muted) !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
}

.woocommerce-ordering select,
.orderby {
  background: var(--mk-dark-surface) !important;
  color: var(--mk-white) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 10px 24px !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: var(--mk-transition-bounce) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: 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='%238b5cf6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'%3E%3C/path%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  padding-right: 45px !important;
  min-width: 220px !important;
}

.woocommerce-ordering select:hover {
  border-color: var(--mk-purple) !important;
  box-shadow: var(--mk-shadow-glow) !important;
  transform: translateY(-2px);
}

.woocommerce-ordering select:focus {
  outline: none !important;
  border-color: var(--mk-cyan) !important;
  background-color: var(--mk-dark-card) !important;
}

/* Custom expand feel */
.woocommerce-ordering {
  position: relative;
  z-index: 100;
  display: flex !important;
  gap: 12px !important;
}

/* Filter Toggle Button */
.mk-filter-toggle {
  background: var(--mk-dark-surface) !important;
  color: var(--mk-white) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 10px 24px !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  transition: var(--mk-transition-bounce) !important;
}

.mk-filter-toggle svg {
  stroke: var(--mk-purple) !important;
  transition: var(--mk-transition) !important;
}

.mk-filter-toggle:hover,
.mk-filter-toggle.active {
  background: var(--mk-dark-card) !important;
  border-color: var(--mk-purple) !important;
  box-shadow: var(--mk-shadow-glow) !important;
}

.mk-filter-toggle.active svg {
  stroke: var(--mk-cyan) !important;
  transform: rotate(90deg);
}

/* Expandable Sidebar logic */
.mk-expandable-sidebar {
  max-height: 0;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
  opacity: 0;
  transform: translateY(-20px);
  width: 100% !important;
  flex: 0 0 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  padding: 0 !important;
}

.mk-expandable-sidebar.is-open {
  display: block !important;
  max-height: 2000px !important; /* Larger for many filters */
  opacity: 1 !important;
  transform: translateY(0) !important;
  padding: 30px !important;
  margin-bottom: 40px !important;
  background: rgba(15, 10, 26, 0.4) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-lg) !important;
  backdrop-filter: blur(10px);
  visibility: visible !important;
}

/* Layout adjustments when sidebar is expandable */
@media (min-width: 922px) {
  .ast-left-sidebar #content .ast-container,
  .ast-right-sidebar #content .ast-container {
      display: flex;
      flex-direction: column;
  }
  
  #primary {
      width: 100% !important;
  }
  
  #secondary {
      order: -1; /* Place it above products but below header/title if needed */
  }
}

/* ============================================
   🛒 CART PAGE
   ============================================ */
.wc-block-cart,
.woocommerce-cart .woocommerce {
  color: var(--mk-text-primary) !important;
}

/* Cart table / block */
.wc-block-cart__main,
.woocommerce-cart-form {
  background: var(--mk-dark-card) !important;
  border-radius: var(--mk-radius-lg) !important;
  border: 1px solid var(--mk-dark-border) !important;
  padding: 24px !important;
  overflow: hidden;
}

.wc-block-cart .wc-block-cart-items,
.woocommerce table.shop_table {
  background: transparent !important;
  border: none !important;
  color: var(--mk-text-primary) !important;
}

.wc-block-cart .wc-block-cart-items .wc-block-cart-items__row,
.woocommerce table.shop_table tr {
  border-bottom: 1px solid var(--mk-dark-border) !important;
  transition: var(--mk-transition);
}

.wc-block-cart .wc-block-cart-items .wc-block-cart-items__row:hover {
  background: rgba(147, 51, 234, 0.05) !important;
}

/* Cart item product name */
.wc-block-cart .wc-block-components-product-name,
.woocommerce-cart .product-name a {
  color: var(--mk-white) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
}

/* Cart item prices */
.wc-block-cart .wc-block-components-product-price,
.wc-block-cart .wc-block-cart-item__total .wc-block-components-formatted-money-amount,
.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal {
  color: var(--mk-gold) !important;
  font-weight: 700 !important;
}

/* Cart item image */
.wc-block-cart .wc-block-cart-item__image img {
  border-radius: var(--mk-radius-md) !important;
  border: 1px solid var(--mk-dark-border) !important;
}

/* Quantity controls */
.wc-block-cart .wc-block-components-quantity-selector,
.wc-block-components-quantity-selector__input,
.woocommerce .quantity input {
  background: var(--mk-dark-surface) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-sm) !important;
  color: var(--mk-text-primary) !important;
}

.wc-block-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
  color: var(--mk-violet) !important;
}

/* Cart sidebar / totals */
.wc-block-cart__sidebar,
.wc-block-cart .wc-block-cart__totals-title,
.cart-collaterals,
.cart_totals {
  background: var(--mk-dark-card) !important;
  border-radius: var(--mk-radius-lg) !important;
  border: 1px solid var(--mk-dark-border) !important;
  padding: 24px !important;
  color: var(--mk-text-primary) !important;
}

.wc-block-cart .wc-block-cart__totals-title {
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  font-size: 1.3rem !important;
  border-bottom: 2px solid var(--mk-purple) !important;
  padding-bottom: 12px !important;
}

/* Cart totals text */
.wc-block-cart .wc-block-components-totals-item__label,
.cart_totals th {
  color: var(--mk-text-secondary) !important;
}

.wc-block-cart .wc-block-components-totals-item__value,
.cart_totals td {
  color: var(--mk-gold) !important;
  font-weight: 700 !important;
}

/* Proceed to Checkout button */
.wc-block-cart .wc-block-cart__submit-button .wc-block-components-button,
.wc-block-cart__submit-container .wc-block-components-button,
.wc-block-components-checkout-place-order-button,
.checkout-button,
.woocommerce a.checkout-button,
.wp-block-woocommerce-proceed-to-checkout-block a,
.wc-block-cart__submit-button a {
  background: var(--mk-gradient-accent) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 16px 32px !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: var(--mk-transition) !important;
  box-shadow: var(--mk-shadow-md) !important;
  width: 100% !important;
  text-align: center !important;
  display: block !important;
}

.wc-block-cart .wc-block-cart__submit-button .wc-block-components-button:hover,
.wc-block-cart__submit-container .wc-block-components-button:hover,
.checkout-button:hover {
  background: linear-gradient(135deg, var(--mk-purple-light), var(--mk-cyan)) !important;
  box-shadow: var(--mk-shadow-glow) !important;
  transform: translateY(-2px) !important;
}

/* ============================================
   💳 CHECKOUT PAGE
   ============================================ */
.wc-block-checkout,
.woocommerce-checkout {
  color: var(--mk-text-primary) !important;
}

/* Checkout main form */
.wc-block-checkout__main,
.woocommerce-checkout .woocommerce-checkout {
  color: var(--mk-text-primary) !important;
}

/* Checkout form sections */
.wc-block-checkout .wc-block-components-checkout-step,
.woocommerce-checkout #customer_details > div {
  background: var(--mk-dark-card) !important;
  border-radius: var(--mk-radius-lg) !important;
  border: 1px solid var(--mk-dark-border) !important;
  padding: 24px !important;
  margin-bottom: 20px !important;
  transition: var(--mk-transition);
}

.wc-block-checkout .wc-block-components-checkout-step:hover {
  border-color: rgba(147, 51, 234, 0.3) !important;
}

/* Checkout step titles */
.wc-block-checkout .wc-block-components-checkout-step__title,
.wc-block-checkout h2,
.woocommerce-checkout h3 {
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
}

/* Form inputs */
.wc-block-checkout input[type="text"],
.wc-block-checkout input[type="email"],
.wc-block-checkout input[type="tel"],
.wc-block-checkout input[type="number"],
.wc-block-checkout select,
.wc-block-checkout textarea,
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout select {
  background: var(--mk-dark-surface) !important;
  color: var(--mk-text-primary) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-sm) !important;
  padding: 12px 16px !important;
  transition: var(--mk-transition) !important;
  font-family: 'Outfit', sans-serif !important;
}

.wc-block-checkout input:focus,
.wc-block-checkout select:focus,
.wc-block-components-text-input input:focus,
.woocommerce-checkout input:focus {
  border-color: var(--mk-purple) !important;
  box-shadow: 0 0 0 3px rgba(107, 33, 168, 0.2) !important;
  outline: none !important;
}

/* Form labels */
.wc-block-components-text-input label,
.wc-block-checkout label,
.woocommerce-checkout label {
  color: var(--mk-text-secondary) !important;
}

/* Order summary sidebar */
.wc-block-checkout__sidebar,
.woocommerce-checkout-review-order {
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-lg) !important;
  padding: 24px !important;
}

.wc-block-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item__description {
  color: var(--mk-text-secondary) !important;
}

.wc-block-checkout .wc-block-components-product-name {
  color: var(--mk-white) !important;
  font-weight: 600 !important;
}

.wc-block-checkout .wc-block-formatted-money-amount,
.wc-block-checkout .wc-block-components-formatted-money-amount {
  color: var(--mk-gold) !important;
  font-weight: 700 !important;
}

/* Payment options */
.wc-block-checkout__payment-method {
  margin-top: 20px !important;
}

.wc-block-checkout .wc-block-components-radio-control {
  gap: 12px !important;
  display: flex !important;
  flex-direction: column !important;
}

.wc-block-checkout .wc-block-components-radio-control__option {
  background: var(--mk-dark-surface) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-md) !important;
  padding: 20px !important;
  margin: 0 !important;
  transition: var(--mk-transition) !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  line-height: 1.2 !important;
}

.wc-block-checkout .wc-block-components-radio-control__option:hover {
  border-color: var(--mk-purple) !important;
  background: rgba(107, 33, 168, 0.1) !important;
}

.wc-block-checkout .wc-block-components-radio-control__option-checked {
  border-color: var(--mk-purple) !important;
  background: rgba(107, 33, 168, 0.15) !important;
  box-shadow: 0 0 15px rgba(107, 33, 168, 0.1) !important;
}

.wc-block-checkout .wc-block-components-radio-control__input {
  margin: 0 5px 0 0 !important;
  width: 22px !important;
  height: 22px !important;
  background: var(--mk-dark-card) !important;
  border: 2px solid var(--mk-dark-border) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  border-radius: 50% !important;
  position: relative !important;
  top: 0 !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}

.wc-block-checkout .wc-block-components-radio-control__input:checked {
  border-color: var(--mk-cyan) !important;
}

.wc-block-checkout .wc-block-components-radio-control__input:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  background: var(--mk-cyan);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--mk-cyan);
}

.wc-block-checkout .wc-block-components-radio-control__label {
  color: var(--mk-white) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.wc-block-components-radio-control__option-layout {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

/* Payment method description content */
.wc-block-components-radio-control-accordion-content {
  background: rgba(15, 10, 26, 0.2) !important;
  padding: 15px 20px 20px 55px !important;
  color: var(--mk-text-secondary) !important;
  font-size: 0.9rem !important;
  line-height: 1.6 !important;
  border-radius: 0 0 var(--mk-radius-md) var(--mk-radius-md) !important;
  margin-top: -10px !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-top: none !important;
}

.wc-block-components-radio-control-accordion-option--checked-option-highlighted .wc-block-components-radio-control__option {
  border-radius: var(--mk-radius-md) var(--mk-radius-md) 0 0 !important;
}

/* Place Order button */
.wc-block-checkout .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-button,
.woocommerce-checkout #place_order {
  background: var(--mk-gradient-warm) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 18px 40px !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: var(--mk-transition) !important;
  box-shadow: 0 4px 20px rgba(249, 115, 22, 0.3) !important;
  cursor: pointer;
}

.wc-block-checkout .wc-block-components-checkout-place-order-button:hover,
.woocommerce-checkout #place_order:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 30px rgba(249, 115, 22, 0.5) !important;
  filter: brightness(1.1);
}

/* ============================================
   🏠 HOMEPAGE / HERO
   ============================================ */
.page-id-2 .entry-content,
.home .entry-content,
.home .site-content,
.page-template-default .entry-content {
  padding: 0 !important;
}

/* Style the hero section */
.home .entry-content > *:first-child,
.page-id-2 .entry-content h1,
.home .entry-content h1 {
  font-size: 3.5rem !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  letter-spacing: -2px !important;
}

/* CTA buttons */
.wp-block-button .wp-block-button__link,
.wp-element-button,
.woocommerce .button,
a.button,
button.button {
  background: var(--mk-gradient-accent) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 14px 32px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: var(--mk-transition) !important;
  box-shadow: var(--mk-shadow-md) !important;
  cursor: pointer;
  text-decoration: none !important;
}

.wp-block-button .wp-block-button__link:hover,
.wp-element-button:hover,
.woocommerce .button:hover,
a.button:hover {
  background: linear-gradient(135deg, var(--mk-purple-light), var(--mk-cyan)) !important;
  box-shadow: var(--mk-shadow-glow) !important;
  transform: translateY(-2px) !important;
}

/* ============================================
   FOOTER
   ============================================ */
.ast-footer-overlay,
.site-footer,
footer.site-footer,
.ast-small-footer,
.site-below-footer-wrap,
.site-primary-footer-wrap,
.site-above-footer-wrap,
.ast-builder-footer-grid-columns,
.ast-footer-row-container,
.ast-builder-grid-row-container,
.ast-builder-grid-row-container-inner {
  background-color: var(--mk-purple-deep) !important;
  background-image: none !important;
  border-top: 1px solid rgba(147, 51, 234, 0.2) !important;
  color: var(--mk-text-muted) !important;
  position: relative;
  z-index: 1;
}

.site-below-footer-wrap::before,
.site-below-footer-wrap::after,
.ast-builder-grid-row-container::before,
.ast-builder-grid-row-container::after {
  display: none !important;
}

.site-footer a,
footer a,
.ast-small-footer a,
.site-below-footer-wrap a {
  color: var(--mk-violet) !important;
  text-decoration: none !important;
}

.site-footer a:hover,
footer a:hover {
  color: var(--mk-cyan) !important;
}

.site-footer p,
footer p,
.ast-footer-copyright,
.ast-footer-copyright p,
.site-below-footer-wrap .ast-footer-copyright {
  color: var(--mk-text-muted) !important;
}

/* ============================================
   WOO NOTICES / MESSAGES
   ============================================ */
.woocommerce-message,
.woocommerce-info,
.wc-block-components-notice-banner {
  background: var(--mk-dark-card) !important;
  border-left: 4px solid var(--mk-purple) !important;
  color: var(--mk-text-primary) !important;
  border-radius: var(--mk-radius-md) !important;
  padding: 16px 20px !important;
}

.woocommerce-error {
  background: var(--mk-dark-card) !important;
  border-left: 4px solid var(--mk-rose) !important;
  color: var(--mk-text-primary) !important;
  border-radius: var(--mk-radius-md) !important;
}

/* ============================================
   MY ACCOUNT PAGE
   ============================================ */
.woocommerce-MyAccount-navigation {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-bottom: 30px !important;
}

.woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

.woocommerce-MyAccount-navigation ul li {
  border: none !important;
  padding: 0 !important;
  margin: 0 0 8px 0 !important;
}

.woocommerce-MyAccount-navigation ul li a {
  color: var(--mk-text-secondary) !important;
  display: flex !important;
  align-items: center;
  padding: 14px 24px !important;
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-md) !important;
  font-weight: 500 !important;
  transition: var(--mk-transition-bounce) !important;
  text-decoration: none !important;
}

.woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--mk-dark-surface) !important;
  color: var(--mk-white) !important;
  border-color: var(--mk-purple) !important;
  transform: translateX(5px);
}

.woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--mk-gradient-accent) !important;
  color: var(--mk-white) !important;
  border: none !important;
  box-shadow: var(--mk-shadow-glow) !important;
}

.woocommerce-MyAccount-content {
  background: var(--mk-dark-card) !important;
  border-radius: var(--mk-radius-lg) !important;
  border: 1px solid var(--mk-dark-border) !important;
  padding: 32px !important;
  color: var(--mk-text-primary) !important;
  box-shadow: var(--mk-shadow-md) !important;
}

/* Orders Table Styling */
.woocommerce-MyAccount-content table.shop_table.account-orders-table {
  border: none !important;
  background: transparent !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  margin-bottom: 40px !important;
}

/* Account Details Form Styling */
.woocommerce-EditAccountForm,
.woocommerce-form-edit-account {
  margin-top: 20px !important;
}

.woocommerce-EditAccountForm label,
.woocommerce-form-edit-account label {
  color: var(--mk-text-secondary) !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
  display: block !important;
}

.woocommerce-EditAccountForm input.input-text,
.woocommerce-form-edit-account input.input-text,
.woocommerce-EditAccountForm input[type="text"],
.woocommerce-EditAccountForm input[type="email"],
.woocommerce-EditAccountForm input[type="password"],
.woocommerce-form-edit-account input[type="text"],
.woocommerce-form-edit-account input[type="email"],
.woocommerce-form-edit-account input[type="password"] {
  background: var(--mk-dark-surface) !important;
  border: 1px solid var(--mk-dark-border) !important;
  color: var(--mk-white) !important;
  border-radius: var(--mk-radius-sm) !important;
  padding: 12px 16px !important;
  transition: var(--mk-transition) !important;
}

.woocommerce-EditAccountForm input.input-text:focus,
.woocommerce-form-edit-account input.input-text:focus {
  border-color: var(--mk-purple) !important;
  box-shadow: 0 0 0 3px rgba(107, 33, 168, 0.2) !important;
  outline: none !important;
}

.woocommerce-EditAccountForm em,
.woocommerce-form-edit-account em,
#account_display_name_description {
  color: var(--mk-text-muted) !important;
  font-size: 0.85rem !important;
  display: block;
  margin-top: 5px;
}

.woocommerce-EditAccountForm fieldset,
.woocommerce-form-edit-account fieldset {
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-md) !important;
  padding: 20px !important;
  margin: 30px 0 !important;
  background: rgba(15, 10, 26, 0.2) !important;
}

.woocommerce-EditAccountForm fieldset legend,
.woocommerce-form-edit-account fieldset legend {
  color: var(--mk-white) !important;
  background: var(--mk-purple-deep) !important;
  padding: 0 15px !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

.show-password-input {
  background-color: transparent !important;
  color: var(--mk-text-muted) !important;
}

.woocommerce-MyAccount-content table.shop_table.account-orders-table thead {
  background: var(--mk-dark-surface) !important;
}

.woocommerce-MyAccount-content table.shop_table.account-orders-table thead th {
  border: none !important;
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-size: 0.8rem !important;
  letter-spacing: 1px !important;
  padding: 16px !important;
  background: var(--mk-dark-surface) !important;
}

.woocommerce-MyAccount-content table.shop_table.account-orders-table td,
.woocommerce-MyAccount-content table.shop_table.account-orders-table th {
  border: none !important;
  border-bottom: 1px solid var(--mk-dark-border) !important;
  padding: 16px !important;
  background: transparent !important;
  color: var(--mk-text-secondary) !important;
}

.woocommerce-MyAccount-content table.shop_table.account-orders-table tr:hover td {
  background: rgba(147, 51, 234, 0.05) !important;
}

.woocommerce-MyAccount-content table.shop_table.account-orders-table .button.view {
  padding: 10px 20px !important;
  font-size: 0.8rem !important;
}

/* Addresses Section Styling */
.woocommerce-Addresses {
  margin-top: 20px !important;
}

.woocommerce-Address {
  background: var(--mk-dark-surface) !important;
  border: none !important;
  border-radius: var(--mk-radius-md) !important;
  padding: 24px !important;
  margin-bottom: 30px !important;
  transition: var(--mk-transition) !important;
}

.woocommerce-Address-title {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border: none !important;
  margin-bottom: 15px !important;
  padding-bottom: 15px !important;
  background: transparent !important;
}

.woocommerce-Address-title h2,
.woocommerce-Address-title .title h2 {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--mk-white) !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
}

.woocommerce-Address-title::before,
.woocommerce-Address-title::after,
.woocommerce-Address-title h2::before,
.woocommerce-Address-title h2::after {
  display: none !important;
  background: transparent !important;
  border: none !important;
}

.woocommerce-Address-title .edit {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: var(--mk-violet) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  text-decoration: none !important;
}

.woocommerce-Address-title .edit:hover {
  color: var(--mk-cyan) !important;
}

.woocommerce-Address address {
  color: var(--mk-text-secondary) !important;
  font-style: normal !important;
  line-height: 1.8 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
}

/* ============================================
   SINGLE PRODUCT PAGE
   ============================================ */
.single-product .summary {
  color: var(--mk-text-primary) !important;
}

.single-product .product_title {
  color: var(--mk-white) !important;
  font-size: 2.2rem !important;
  font-weight: 800 !important;
}

.single-product .price {
  color: var(--mk-gold) !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
}

.single-product .woocommerce-product-details__short-description,
.single-product .description p {
  color: var(--mk-text-secondary) !important;
  line-height: 1.7 !important;
}

.single-product .single_add_to_cart_button {
  background: var(--mk-gradient-warm) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 18px 40px !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: var(--mk-transition) !important;
  box-shadow: 0 4px 20px rgba(249, 115, 22, 0.3) !important;
}

.single-product .single_add_to_cart_button:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 6px 30px rgba(249, 115, 22, 0.5) !important;
}

/* Product tabs */
.woocommerce-tabs ul.tabs {
  border-bottom: 2px solid var(--mk-dark-border) !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}

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

.woocommerce-tabs .tabs li a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--mk-text-muted) !important;
  background: transparent !important;
  border: none !important;
  padding: 12px 24px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-size: 0.85rem !important;
  transition: var(--mk-transition) !important;
}

.woocommerce-tabs .tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--mk-white) !important;
  background: var(--mk-dark-card) !important;
  border-radius: var(--mk-radius-md) var(--mk-radius-md) 0 0 !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-bottom-color: var(--mk-dark-card) !important;
  margin-bottom: -2px;
}

.woocommerce-tabs .panel,
.woocommerce div.product .woocommerce-tabs .panel {
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-top: none !important;
  border-radius: 0 0 var(--mk-radius-lg) var(--mk-radius-lg) !important;
  padding: 40px !important;
  color: var(--mk-text-secondary) !important;
}

/* Review Form Styling */
#reviews,
#review_form_wrapper,
#review_form,
#review_form_wrapper #respond {
  border: 1px solid var(--mk-dark-border) !important;
  background: rgba(15, 10, 26, 0.3) !important;
  border-radius: var(--mk-radius-lg) !important;
  padding: 30px !important;
}

/* Remove internal borders if they exist */
#review_form_wrapper #respond {
  border: none !important;
  padding: 0 !important;
  background: transparent !important;
}

#review_form_wrapper .comment-reply-title {
  color: var(--mk-white) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
  display: block;
}

#review_form_wrapper label {
  color: var(--mk-text-secondary) !important;
}

#review_form_wrapper textarea,
#review_form_wrapper input[type="text"],
#review_form_wrapper input[type="email"] {
  background: var(--mk-dark-surface) !important;
  border: 1px solid var(--mk-dark-border) !important;
  color: var(--mk-white) !important;
  border-radius: var(--mk-radius-md) !important;
  padding: 15px !important;
  width: 100% !important;
}

#review_form_wrapper textarea:focus {
  border-color: var(--mk-purple) !important;
  outline: none !important;
}

#review_form_wrapper .submit {
  background: var(--mk-gradient-accent) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-full) !important;
  padding: 14px 40px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  cursor: pointer;
  transition: var(--mk-transition-bounce) !important;
}

#review_form_wrapper .submit:hover {
  transform: translateY(-2px);
  box-shadow: var(--mk-shadow-glow) !important;
}

.woocommerce-noreviews {
  color: var(--mk-text-muted) !important;
  font-style: italic !important;
  margin-bottom: 20px !important;
}

/* ============================================
   STAR RATINGS
   ============================================ */
.star-rating span::before,
.star-rating::before {
  color: var(--mk-gold) !important;
}

/* ============================================
   WIDGETS / SIDEBAR
   ============================================ */
.widget {
  background: var(--mk-dark-card) !important;
  border: 1px solid var(--mk-dark-border) !important;
  border-radius: var(--mk-radius-lg) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
}

.widget-title,
.widget h2 {
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid var(--mk-purple) !important;
  padding-bottom: 10px !important;
  margin-bottom: 16px !important;
}

/* ============================================
   PULSE ANIMATION FOR CTA
   ============================================ */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 20px rgba(147, 51, 234, 0.3); }
  50% { box-shadow: 0 0 40px rgba(147, 51, 234, 0.6); }
}

.home .wp-block-button .wp-block-button__link {
  animation: pulse-glow 3s ease-in-out infinite;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 768px) {
  .entry-title,
  .woocommerce-products-header__title,
  h1.wp-block-heading {
    font-size: 2rem !important;
  }
  
  .home .entry-content h1 {
    font-size: 2.4rem !important;
    letter-spacing: -1px !important;
  }
  
  .woocommerce ul.products li.product {
    margin-bottom: 16px !important;
  }
  
  .wc-block-cart__main,
  .wc-block-checkout .wc-block-components-checkout-step {
    padding: 16px !important;
  }
}

/* ============================================
   WOOCOMMERCE BLOCK OVERRIDES (Colors)
   ============================================ */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
  color: var(--mk-gold) !important;
  font-size: 1.4rem !important;
  font-weight: 800 !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  color: var(--mk-white) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

/* Remove default Astra blue focus */
.ast-search-menu-icon .search-field:focus,
input:focus,
textarea:focus,
select:focus {
  border-color: var(--mk-purple) !important;
  box-shadow: 0 0 0 2px rgba(107, 33, 168, 0.2) !important;
}

/* ============================================
   COUPON SECTION
   ============================================ */
.wc-block-components-totals-coupon__content input,
.woocommerce-cart .coupon input {
  background: var(--mk-dark-surface) !important;
  border: 1px solid var(--mk-dark-border) !important;
  color: var(--mk-text-primary) !important;
  border-radius: var(--mk-radius-sm) !important;
}

.wc-block-components-totals-coupon__content button {
  background: var(--mk-purple) !important;
  color: var(--mk-white) !important;
  border: none !important;
  border-radius: var(--mk-radius-sm) !important;
}

/* ============================================
   REMOVE LINK / SECONDARY ACTIONS
   ============================================ */
.wc-block-cart .wc-block-cart-item__remove-link,
.woocommerce-cart .product-remove a {
  color: var(--mk-rose) !important;
  font-size: 0.85rem !important;
}

/* ============================================
   LOADING / SKELETON
   ============================================ */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.wc-block-components-loading-mask::after {
  background: linear-gradient(90deg, transparent, rgba(147, 51, 234, 0.1), transparent);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

/* Admin bar compat */
#wpadminbar {
  opacity: 0.8;
}
#wpadminbar:hover {
  opacity: 1;
}