/*
Theme Name: Yuzuma
Theme URI: https://yuzuma.com
Author: Yuzuma
Description: Temă custom Yuzuma — beauty tech, dark iridescent glassmorphism, pentru WooCommerce.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: yuzuma
*/

/* ============================== TOKENS ================================= */
:root {
  --void: #0B0812;
  --void-2: #140F1F;
  --void-3: #1A1426;
  --glass: rgba(255,255,255,0.06);
  --glass-strong: rgba(255,255,255,0.09);
  --glass-line: rgba(255,255,255,0.14);
  --ink: #F4F0FA;
  --ink-dim: #B4A9C9;
  --magenta: #FF3FA4;
  --violet: #7B5CFF;
  --cyan: #45E8D8;
}

/* ============================== RESET =================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--void);
  color: var(--ink);
  font-family: 'Sora', system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, .display {
  font-family: 'Unbounded', system-ui, sans-serif;
  line-height: 1.15;
  margin: 0 0 0.5em;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font-family: inherit; }
ul { list-style: none; margin: 0; padding: 0; }
.container { max-width: 1320px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 64px); }

/* ============================== HELPERS ================================= */
.gradient-text {
  background: linear-gradient(92deg, var(--magenta) 0%, var(--violet) 52%, var(--cyan) 100%);
  -webkit-background-clip: text; background-clip: text; color: var(--magenta);
  -webkit-text-fill-color: transparent;
}
.glass-card {
  background: var(--glass);
  border: 1px solid var(--glass-line);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 4px;
}
.btn, .button, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.single_add_to_cart_button {
  background: linear-gradient(92deg, var(--magenta), var(--violet)) !important;
  color: #0B0812 !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 15px 30px !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  display: inline-flex; align-items: center; gap: 10px;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 16px 40px -12px rgba(255,63,164,0.45);
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.btn:hover, .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .single_add_to_cart_button:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.12), 0 20px 48px -12px rgba(255,63,164,0.6);
}
.btn-ghost {
  background: var(--glass) !important; color: var(--ink) !important;
  border: 1px solid var(--glass-line) !important; border-radius: 999px !important;
  padding: 15px 30px !important; font-size: 14.5px !important; font-weight: 600 !important;
  backdrop-filter: blur(12px);
}
.eyebrow {
  font-size: 12.5px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  color: var(--cyan); display: flex; align-items: center; gap: 10px;
}
.eyebrow::before { content:''; width: 22px; height: 1px; background: var(--cyan); display: inline-block; }
.orb-field { position: relative; overflow: hidden; }
.orb-field::before, .orb-field::after {
  content: ''; position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.45; pointer-events:none; z-index: 0;
}
.orb-field::before { width: 420px; height: 420px; background: var(--magenta); top: -120px; right: -80px; }
.orb-field::after { width: 380px; height: 380px; background: var(--cyan); bottom: -140px; left: -60px; opacity:0.35; }
.orb-field > * { position: relative; z-index: 1; }

/* ============================== ANNOUNCEMENT BAR ========================= */
.announce-bar {
  background: var(--void-2); color: var(--ink-dim); text-align: center;
  padding: 10px 24px; font-size: 12.5px; letter-spacing: 0.04em;
  border-bottom: 1px solid var(--glass-line);
}

/* ============================== HEADER =================================== */
.site-header {
  display:flex; align-items:center; justify-content:space-between;
  padding: 20px clamp(20px, 4vw, 64px);
  position:sticky; top:0; z-index:50;
  background:rgba(11,8,18,0.72); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--glass-line);
  gap: 20px; flex-wrap: wrap;
}
.site-logo { font-family:'Unbounded',sans-serif; font-size: 22px; font-weight: 700; letter-spacing: 0.02em; }
.main-nav { display:flex; gap:30px; font-size:14px; font-weight:600; color:var(--ink-dim); flex-wrap: wrap; }
.main-nav a:hover { color: var(--ink); }
.main-nav .current-menu-item > a, .main-nav .current_page_item > a { color: var(--ink); }
.header-icons { display:flex; align-items:center; gap:20px; color:var(--ink); }
.header-icons a { display:flex; }
.cart-count {
  position:relative; top:-8px; right:6px; background: var(--magenta); color:#0B0812;
  font-size: 10px; font-weight:800; border-radius:999px; padding:1px 5px; margin-left:-10px;
}
.mobile-nav-toggle { display:none; background:none; border:none; color:var(--ink); }

@media (max-width: 900px) {
  .main-nav { display: none; }
  .mobile-nav-toggle { display:flex; }
}

/* ============================== HERO ====================================== */
.hero {
  padding: clamp(60px,10vw,120px) clamp(20px,4vw,64px) clamp(60px,8vw,100px);
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:28px;
  border-bottom: 1px solid var(--glass-line);
}
.hero h1 { font-size: clamp(38px, 6vw, 76px); font-weight:700; max-width: 920px; }
.hero p { margin:0; max-width:480px; font-size:17px; line-height:1.6; color: var(--ink-dim); }
.hero-actions { display:flex; gap:16px; margin-top:8px; flex-wrap: wrap; justify-content:center; }
.hero-visual {
  margin-top:56px; width:100%; max-width:1040px; border-radius:4px; padding:6px;
}
.hero-visual-inner {
  aspect-ratio: 21/8; border-radius:2px;
  background: linear-gradient(120deg, rgba(255,63,164,0.35), rgba(123,92,255,0.35) 45%, rgba(69,232,216,0.35));
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}

/* ============================== SECTIONS ================================= */
.section { padding: clamp(48px,8vw,88px) clamp(20px,4vw,64px); border-bottom: 1px solid var(--glass-line); }
.section-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:40px; gap: 16px; flex-wrap: wrap; }
.section-head h2 { font-size: 30px; font-weight:500; }
.section-link { font-size:14px; font-weight:600; color:var(--cyan); white-space: nowrap; }

/* Category grid */
.cat-grid { display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap:18px; }
@media (max-width: 1100px) { .cat-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 600px) { .cat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.cat-card {
  padding:28px 20px; display:flex; flex-direction:column; gap:20px; aspect-ratio:0.85;
}
.cat-card svg { flex-shrink: 0; }
.cat-card .cat-name { font-size:14.5px; font-weight:700; margin-top:auto; }

/* Product grid (homepage bestsellers + WooCommerce archive override) */
.product-grid, .woocommerce ul.products {
  display:grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap:22px !important;
  margin: 0 !important; padding: 0 !important;
}
@media (max-width: 900px) { .product-grid, .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }

.product-card, .woocommerce ul.products li.product {
  border-radius:4px !important; padding:18px !important; display:flex !important; flex-direction:column !important; gap:14px !important;
  background: var(--glass) !important; border: 1px solid var(--glass-line) !important;
  backdrop-filter: blur(14px); list-style: none !important;
}
.product-card .product-thumb, .woocommerce ul.products li.product a img {
  aspect-ratio:0.9 !important; border-radius:2px !important; object-fit: cover !important;
  background: linear-gradient(150deg, rgba(255,63,164,0.2), rgba(69,232,216,0.18));
  width: 100% !important; height: auto !important;
}
.product-card .product-brand {
  font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--cyan); font-weight:700;
}
.product-card .product-name, .woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size:14px !important; line-height:1.35 !important; color:var(--ink) !important; margin: 0 !important; font-weight: 500 !important;
}
.product-card .product-price, .woocommerce ul.products li.product .price,
.woocommerce span.price { font-size:15px !important; font-weight:700 !important; color: var(--ink) !important; }
.woocommerce ul.products li.product .price del { color: var(--ink-dim) !important; opacity: 0.7; }
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--magenta) !important; }
.woocommerce ul.products li.product a { color: var(--ink) !important; }

.note-line { margin-top:22px; font-size:12px; color:var(--ink-dim); }

/* Why us / feature grid */
.feature-grid {
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1px;
  background: var(--glass-line); border: 1px solid var(--glass-line); border-radius:4px; overflow:hidden;
}
@media (max-width: 800px) { .feature-grid { grid-template-columns: 1fr; } }
.feature-item { background:var(--void); padding:44px 36px; display:flex; flex-direction:column; gap:18px; }
.feature-item h3 { font-size:19px; font-weight:500; }
.feature-item p { margin:0; font-size:14px; line-height:1.6; color:var(--ink-dim); }

/* Newsletter */
.newsletter-box { border-radius:4px; padding:56px 64px; display:flex; align-items:center; justify-content:space-between; gap:48px; flex-wrap:wrap; }
@media (max-width: 700px) { .newsletter-box { padding: 40px 28px; } }
.newsletter-box h2 { font-size:26px; font-weight:500; margin: 0 0 12px; }
.newsletter-box p { margin:0; font-size:14px; color:var(--ink-dim); line-height:1.6; max-width: 420px; }
.newsletter-form { display:flex; gap:12px; flex-grow:1; max-width:440px; min-width:260px; }
.newsletter-form input[type=email] {
  flex-grow:1; padding:15px 18px; border-radius:999px; border:1px solid var(--glass-line);
  background:rgba(255,255,255,0.05); color:var(--ink); font-size:14.5px; font-family:inherit;
}

/* Footer */
.site-footer-main {
  padding: 56px clamp(20px,4vw,64px) 40px; display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:32px;
}
@media (max-width: 800px) { .site-footer-main { grid-template-columns: 1fr 1fr; } }
.site-footer-main .col-title { font-weight:700; margin-bottom:4px; color:var(--ink); }
.site-footer-main a, .site-footer-main p { color:var(--ink-dim); font-size:13.5px; }
.footer-col { display:flex; flex-direction:column; gap:10px; }
.site-footer-bottom { padding: 20px clamp(20px,4vw,64px); border-top: 1px solid var(--glass-line); font-size:12px; color:var(--ink-dim); }

/* ============================== WOOCOMMERCE GLOBAL OVERRIDES ============= */
.woocommerce, .woocommerce-page { background: var(--void); color: var(--ink); }
.woocommerce-breadcrumb { color: var(--ink-dim) !important; font-size: 13px; padding: 24px clamp(20px,4vw,64px) 0; }
.woocommerce-breadcrumb a { color: var(--cyan) !important; }

.woocommerce-notices-wrapper, .woocommerce-message, .woocommerce-info, .woocommerce-error {
  background: var(--glass) !important; border: 1px solid var(--glass-line) !important; color: var(--ink) !important;
  border-radius: 4px !important; margin: 16px clamp(20px,4vw,64px) !important; padding: 16px 20px !important;
}
.woocommerce-error::before, .woocommerce-message::before, .woocommerce-info::before { color: var(--cyan) !important; }

/* Shop / category archive wrapper */
.woocommerce-products-header, .page-title-wrap {
  padding: 40px clamp(20px,4vw,64px) 0;
}
.woocommerce-products-header__title { font-family:'Unbounded',sans-serif; font-size: 32px; font-weight: 500; }
.woocommerce main.site-main, .woocommerce-page main.site-main { padding: 0 clamp(20px,4vw,64px) 60px; max-width: 1320px; margin: 0 auto; }
.woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering { color: var(--ink-dim); }
.woocommerce .woocommerce-ordering select {
  background: var(--glass); color: var(--ink); border: 1px solid var(--glass-line); border-radius: 4px; padding: 8px 12px;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li { border: none !important; background: transparent !important; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
  background: var(--glass) !important; color: var(--ink) !important; border: 1px solid var(--glass-line) !important;
  border-radius: 4px !important; margin: 0 4px !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--violet) !important; color: #0B0812 !important; }

/* Single product page */
.woocommerce div.product {
  padding: 40px clamp(20px,4vw,64px) 60px; max-width: 1320px; margin: 0 auto; display: block;
}
.woocommerce div.product .woocommerce-product-gallery { border-radius: 4px; overflow: hidden; }
.woocommerce div.product .summary { padding-top: 12px; }
.woocommerce div.product .product_title { font-family:'Unbounded',sans-serif; font-size: 32px; font-weight: 500; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--ink) !important; font-size: 24px !important; font-weight: 700 !important; }
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--ink-dim); }
.woocommerce div.product form.cart .quantity input {
  background: var(--glass); border: 1px solid var(--glass-line); color: var(--ink); border-radius: 4px; padding: 12px; width: 70px;
}
.woocommerce-tabs { margin-top: 40px; }
.woocommerce-tabs ul.tabs { border-bottom: 1px solid var(--glass-line) !important; }
.woocommerce-tabs ul.tabs li { background: transparent !important; border: none !important; }
.woocommerce-tabs ul.tabs li a { color: var(--ink-dim) !important; }
.woocommerce-tabs ul.tabs li.active a { color: var(--ink) !important; }
.woocommerce-tabs .panel { color: var(--ink-dim); padding-top: 20px; }

/* Related products already covered by .woocommerce ul.products */

/* Cart & Checkout */
.woocommerce-cart .woocommerce, .woocommerce-checkout .woocommerce {
  padding: 40px clamp(20px,4vw,64px) 60px; max-width: 1320px; margin: 0 auto; display:block;
}
.woocommerce table.shop_table {
  border: 1px solid var(--glass-line) !important; border-radius: 4px; background: var(--glass); color: var(--ink);
}
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-top: 1px solid var(--glass-line) !important; }
.woocommerce-cart-form .product-remove a { color: var(--magenta) !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce-additional-fields textarea {
  background: var(--glass) !important; border: 1px solid var(--glass-line) !important; color: var(--ink) !important; border-radius: 4px !important;
  padding: 12px !important;
}
.woocommerce-checkout #payment { background: var(--glass) !important; border-radius: 4px; border: 1px solid var(--glass-line) !important; }
.woocommerce-checkout #payment div.payment_box { background: var(--void-2) !important; color: var(--ink-dim) !important; }
.cart-collaterals .cart_totals { background: var(--glass); border: 1px solid var(--glass-line); border-radius: 4px; padding: 20px; }

/* My account */
.woocommerce-account .woocommerce-MyAccount-navigation ul { border: 1px solid var(--glass-line); border-radius: 4px; overflow: hidden; }
.woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--glass-line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display:block; padding: 12px 16px; color: var(--ink-dim); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { color: var(--ink); background: var(--glass); }