/*
Theme Name: OXY Theme
Theme URI: https://oxy.sk
Author: Antigravity
Author URI: https://oxy.sk
Description: Prémiová téma pre nábytkové a kuchynské štúdio. Minimalizmus a geometria.
Version: 1.0
Tested up to: 7.0
Text Domain: oxy-theme
*/

:root {
  --font: 'Inter', sans-serif;
  --primary: #C57B57;
  --bg-header-rgb: 249, 246, 240;
  --bg-header-alpha: 0.45;
  --bg-header: rgba(var(--bg-header-rgb), var(--bg-header-alpha));
}

/* Theme variables applied to body for Light/Dark modes */
body[data-theme="light"] {
  --bg-header-rgb: 249, 246, 240;
  --bg-header-alpha: 0.45;
  --bg-header: rgba(var(--bg-header-rgb), var(--bg-header-alpha));
  --bg: #F9F6F0; --surface: #E8DCCB; --muted: #6B5B53; --ink: #2C2621; --grid: rgba(44,38,33,0.1);
}
body[data-theme="dark"] {
  --bg-header-rgb: 30, 26, 22;
  --bg-header-alpha: 0.45;
  --bg-header: rgba(var(--bg-header-rgb), var(--bg-header-alpha));
  --bg: #1E1A16; --surface: #2C2621; --muted: #9A8A7C; --ink: #F0EAE0; --grid: rgba(240,234,224,0.08);
}
body[data-theme="dark"] label[for="gdpr_consent"] a {
  color: var(--primary);
  text-decoration-color: var(--primary);
}
body[data-theme="dark"] label[for="gdpr_consent"] a:hover {
  color: var(--ink);
  text-decoration-color: var(--ink);
}

/* Mix mode variables applied locally to sections */
body[data-theme="mix"] {
  --bg: #F9F6F0; --surface: #E8DCCB; --muted: #6B5B53; --ink: #2C2621; --grid: rgba(44,38,33,0.1);
}
body[data-theme="mix"] .section-light {
  --bg: #F9F6F0; --surface: #E8DCCB; --muted: #6B5B53; --ink: #2C2621; --grid: rgba(44,38,33,0.1);
}
body[data-theme="mix"] .section-dark {
  --bg: #1E1A16; --surface: #2C2621; --muted: #9A8A7C; --ink: #F0EAE0; --grid: rgba(240,234,224,0.08);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: var(--font); background: var(--bg); color: var(--ink);
  -webkit-font-smoothing: antialiased; line-height: 1.6; transition: background 0.6s, color 0.6s;
  display: flex; flex-direction: column; min-height: 100vh;
}
body.admin-bar { min-height: calc(100vh - 32px); }
@media screen and (max-width: 782px) {
  body.admin-bar { min-height: calc(100vh - 46px); }
}

/* Structural Classes */
.section { background: var(--bg); color: var(--ink); padding: 96px 5vw; transition: background 0.6s, color 0.6s; }
.section-sm { padding: 48px 5vw; }
.container { max-width: 1300px; margin: 0 auto; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }

@media (max-width: 900px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
}

/* Typography */
h1 { font-size: 4rem; font-weight: 300; line-height: 1.05; letter-spacing: -0.02em; margin-bottom: 24px; }
h1 b { font-weight: 600; }
h2 { font-size: 2.5rem; font-weight: 300; line-height: 1.1; margin-bottom: 24px; letter-spacing: -0.01em; }
h3 { font-size: 1.5rem; font-weight: 500; margin-bottom: 16px; }
p { font-size: 1rem; color: var(--muted); margin-bottom: 24px; }
.eyebrow { font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--primary); font-weight: 600; margin-bottom: 16px; display: block; }

/* Components */
.btn {
  display: inline-flex; padding: 16px 32px; background: var(--primary); color: #1E1A16; 
  font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none;
  font-weight: 600; transition: transform 0.2s, opacity 0.2s; border-radius: 2px;
}
.btn:hover { transform: translateY(-2px); opacity: 0.9; }

.card {
  background: var(--surface); padding: 48px; border-radius: 2px; transition: background 0.6s;
  border: 1px solid var(--grid);
}
.card-img {
  aspect-ratio: 4/3; background: var(--surface); border-radius: 2px; overflow: hidden; margin-bottom: 24px;
}
.card-img img { width: 100%; height: 100%; object-fit: cover; }

.hero-img { width: 100%; height: 500px; background: var(--surface); margin-bottom: 64px; border-radius: 2px; overflow: hidden; }
.hero-img img { width: 100%; height: 100%; object-fit: cover; }

/* Product Cards */
.prod-card { transition: transform 0.3s; cursor: pointer; }
.prod-card:hover { transform: translateY(-5px); }
.prod-img { aspect-ratio: 1/1; background: var(--surface); border-radius: 2px; overflow: hidden; margin-bottom: 16px; padding: 24px; display: flex; align-items: center; justify-content: center; }
.prod-img img { width: 100%; height: 100%; object-fit: cover; }
.prod-title { font-size: 1.1rem; font-weight: 600; margin-bottom: 4px; }
.prod-desc { font-size: 0.8rem; color: var(--muted); }

/* Filters */
.filter-nav { display: flex; gap: 24px; margin-bottom: 48px; border-bottom: 1px solid var(--grid); padding-bottom: 16px; }
.filter-nav span { font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); cursor: pointer; font-weight: 500; }
.filter-nav span.active { color: var(--ink); font-weight: 700; }

/* Contact Form */
.contact-block { margin-bottom: 40px; }
.contact-block h3 { font-size: 1rem; font-weight: 600; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.1em; }
.contact-block p { margin-bottom: 4px; color: var(--ink); }
.contact-block span { color: var(--muted); font-size: 0.85rem; }

.form-box { background: var(--surface); padding: 48px; border-radius: 2px; border: 1px solid var(--grid); }
.form-group { margin-bottom: 24px; }
.form-group label { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 8px; font-weight: 600; }
.form-group input, .form-group textarea, select { width: 100%; padding: 16px; background: var(--bg); border: 1px solid var(--grid); color: var(--ink); font-family: var(--font); border-radius: 2px; outline: none; transition: border-color 0.2s; }
.form-group input:focus, .form-group textarea:focus, select:focus { border-color: var(--primary); }
select option { background: var(--surface); color: var(--ink); padding: 12px; }
select option:checked, select option:hover, select option:focus { background-color: var(--primary) !important; color: #1E1A16 !important; }
select { accent-color: var(--primary); }

/* Navigation */
header { position: sticky; top: 0; z-index: 100; width: 100%; }
.logo-line { stroke: var(--ink); transition: stroke 0.3s ease; }
body[data-theme="mix"] .over-dark-section .logo .logo-line { stroke: #F2EFE9; }
.header-bg { position: absolute; top: 0; left: 0; right: 0; height: 100%; background: rgba(var(--bg-header-rgb), var(--bg-header-alpha)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--grid); z-index: -1; transition: background 0.6s, border-color 0.6s; transform-origin: top; }
.header-content { display: flex; justify-content: space-between; align-items: center; padding: 24px 5vw; }

/* Overscroll Reveal */
.header-reveal { position: fixed; top: 50vh; left: 0; right: 0; transform: translateY(-50%); display: flex; opacity: 0; pointer-events: none; z-index: 10; font-size: 1.4rem; font-weight: 500; letter-spacing: -0.02em; color: var(--ink); }
.header-reveal.active { pointer-events: auto; }
.reveal-phone { position: absolute; left: 33.333%; transform: translateX(-50%); white-space: nowrap; }
.reveal-email { position: absolute; left: 66.666%; transform: translateX(-50%); white-space: nowrap; display: flex; align-items: center; gap: 16px; }
.header-right { display: flex; align-items: center; gap: 32px; }

/* Language Switcher */
.lang-switcher ul { list-style: none; display: flex; gap: 12px; margin: 0; padding: 0; }
.lang-switcher a { color: var(--muted); text-decoration: none; font-size: 0.75rem; font-family: var(--font); letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; transition: color 0.2s; }
.lang-switcher a:hover { color: var(--ink); }
.lang-switcher li.current-lang a { color: var(--primary); }

/* Theme Switcher */
.reveal-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0; display: flex; align-items: center; justify-content: center; }
.reveal-logo svg { width: 300px; height: auto; pointer-events: none; }
.email-wrapper { position: relative; display: inline-block; }
.reveal-line { position: absolute; bottom: -7px; left: 0; width: 100%; height: 1px; background: var(--ink); transform-origin: center; opacity: 0; }
.copy-btn { width: 48px; height: 48px; border-radius: 50%; background: var(--surface); border: 1px solid var(--grid); color: var(--primary); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s; outline: none; }
.copy-btn:hover { background: var(--primary); color: #1E1A16; transform: scale(1.05); }
.copy-btn:active { transform: scale(0.95); }
.copy-btn svg { width: 24px; height: 24px; pointer-events: none; }
.header-left { flex: 1; flex-basis: 0; display: flex; justify-content: flex-start; align-items: center; }
.header-right { flex: 1; flex-basis: 0; display: flex; justify-content: flex-end; align-items: center; gap: 16px; }
nav { display: flex; justify-content: center; align-items: center; }
.nav-links { display: flex; gap: 32px; list-style: none; margin: 0; padding: 0; align-items: center;}
.nav-links li { margin: 0; padding: 0; }
.nav-links a {
  color: var(--muted); text-decoration: none; font-size: 0.75rem; letter-spacing: 0.1em;
  text-transform: uppercase; font-weight: 500; transition: color 0.2s;
}
.nav-links a:hover, .nav-links a.active, .nav-links .current-menu-item > a { color: var(--ink); }

/* Hamburger Menu */
.menu-toggle { display: none; background: none; border: none; cursor: pointer; color: var(--ink); }
.menu-toggle svg { width: 32px; height: 32px; }

@media (max-width: 900px) {
  .nav-links { 
    display: none; position: absolute; top: 100%; left: 0; right: 0; 
    background: var(--bg); flex-direction: column; padding: 24px 5vw; 
    border-bottom: 1px solid var(--grid); z-index: 50; gap: 24px;
  }
  .nav-links.open { display: flex; }
  .menu-toggle { display: block; }
  header { position: relative; }
  .header-bg { position: absolute; height: 100% !important; }
  .theme-switcher button { padding: 6px 10px; font-size: 0.6rem; }
  .header-left { flex: 0 0 auto; }
}
.logo svg { width: 90px; height: auto; }

/* Theme Switcher Widget */
.theme-switcher { background: var(--surface); padding: 6px; border-radius: 40px; display: flex; gap: 4px; border: 1px solid var(--grid); }
.theme-switcher button { background: transparent; border: none; color: var(--muted); padding: 8px 16px; font-size: 0.7rem; font-family: var(--font); letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; border-radius: 30px; transition: all 0.2s; font-weight: 600; }
.theme-switcher button.active {
  background: var(--primary); color: #1E1A16;
}

/* Scroll Top */
html { scroll-behavior: smooth; }
.scroll-top {
  position: fixed; bottom: 32px; right: 5vw; width: 48px; height: 48px;
  background: var(--bg-header); border: 1px solid var(--primary); border-radius: 50%;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary); text-decoration: none; transition: transform 0.2s, background 0.2s;
  z-index: 90;
}
.scroll-top:hover { transform: translateY(-4px); background: var(--surface); }
.scroll-top svg { width: 24px; height: 24px; }

/* WP Admin Bar fix */
.admin-bar header { top: 32px; }

/* WooCommerce Single Product Layout */
.woocommerce div.product { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: start; }
.woocommerce div.product div.images, .woocommerce div.product div.summary { width: 100% !important; float: none !important; margin: 0 !important; }
@media (max-width: 900px) { .woocommerce div.product { grid-template-columns: 1fr; gap: 32px; } }

/* WooCommerce Variations */
table.variations { border-collapse: collapse; width: 100%; margin-bottom: 24px; table-layout: fixed; }
table.variations th, table.variations td { padding: 8px 0 2px 0; vertical-align: baseline; border-bottom: 1px solid var(--grid); }
table.variations .label { width: 30%; text-align: left; padding-right: 16px; }
table.variations .label label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); font-weight: 600; margin: 0; line-height: 1; display: block; }
table.variations .value { width: 70%; position: relative; }
table.variations select { width: 100%; margin: 0; padding: 0 16px 0 0; height: auto; min-height: 0; background: transparent !important; border: none !important; box-shadow: none !important; outline: none !important; color: var(--ink); font-family: var(--font); border-radius: 0; appearance: none; -webkit-appearance: none; cursor: pointer; line-height: 1; font-size: 1rem; vertical-align: baseline; }
table.variations select:focus { border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; }
table.variations .value::after { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid var(--ink); pointer-events: none; }
.woocommerce-variation-add-to-cart { display: flex; flex-direction: row; align-items: stretch; gap: 16px; margin-top: 24px; }
.quantity { display: inline-flex; align-items: center; background: var(--surface); border: 1px solid var(--grid); border-radius: 0; overflow: hidden; }
.quantity input.qty { width: 64px; height: 100%; min-height: 48px; padding: 0; text-align: center; background: transparent !important; border: none !important; outline: none !important; color: var(--ink); font-family: var(--font); font-size: 1rem; box-shadow: none !important; -moz-appearance: textfield; }
.quantity input.qty:focus { outline: none !important; box-shadow: none !important; background: transparent !important; }
.quantity input.qty::-webkit-outer-spin-button, .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.reset_variations { display: none !important; }

/* SelectWoo Overrides for Variations */
.select2-container--default .select2-selection--single { background: transparent !important; border: none !important; border-radius: 0 !important; height: auto !important; }
.select2-container .select2-selection--single .select2-selection__rendered { color: var(--ink) !important; padding: 0 16px 0 0 !important; line-height: 1 !important; font-size: 1rem !important; font-family: var(--font) !important; vertical-align: baseline !important; text-align: right !important; }
td.value > .select2-container[style*="absolute"] { top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; }
td.value > .select2-container--open .select2-selection__rendered { opacity: 0 !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow { display: none !important; }
.oxy-variation-dropdown { position: absolute !important; background: var(--surface) !important; border: 1px solid var(--grid) !important; border-radius: 0 !important; width: auto !important; min-width: 0 !important; right: -16px !important; left: auto !important; top: -2px !important; margin: 0 !important; pointer-events: auto !important; }

.select2-container--above .oxy-variation-dropdown { top: auto !important; bottom: -8px !important; margin: 0 !important; }
.oxy-variation-dropdown .select2-results, .oxy-variation-dropdown .select2-results__options { max-height: none !important; overflow: visible !important; overflow-y: visible !important; -ms-overflow-style: none !important; scrollbar-width: none !important; }
.oxy-variation-dropdown .select2-results__options { padding-top: 36px !important; }
.oxy-variation-dropdown .select2-results::-webkit-scrollbar, .oxy-variation-dropdown .select2-results__options::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
.oxy-variation-dropdown .select2-results__option { padding: 10px 16px !important; text-align: right !important; background: transparent !important; color: var(--ink) !important; font-family: var(--font) !important; }
.oxy-variation-dropdown .select2-results__option--highlighted { font-weight: 700 !important; }
.oxy-variation-dropdown .select2-results__option[aria-selected="true"] { background: var(--primary) !important; color: #1E1A16 !important; }

/* GDPR Banner & Modal */
#gdpr-banner {
  box-shadow: 0 -4px 20px rgba(0,0,0,0.1);
}
.gdpr-modal-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 10000; display: none; align-items: center; justify-content: center; backdrop-filter: blur(4px);
}
.gdpr-modal {
  background: var(--surface); padding: 32px; border-radius: 12px; width: 90%; max-width: 500px; border: 1px solid var(--grid);
}
.gdpr-modal-header { font-size: 1.25rem; margin-bottom: 16px; color: var(--ink); font-weight: 600; }
.gdpr-modal-body { margin-bottom: 24px; max-height: 50vh; overflow-y: auto; }
.gdpr-option { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--grid); }
.gdpr-option:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
.gdpr-opt-desc { font-size: 0.85rem; color: var(--muted); margin-top: 4px; }
.gdpr-opt-title { font-weight: 500; color: var(--ink); }
/* Toggle switch */
.gdpr-switch { position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0; margin-left: 16px; }
.gdpr-switch input { opacity: 0; width: 0; height: 0; }
.gdpr-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--muted); transition: .4s; border-radius: 24px; }
.gdpr-slider:before { position: absolute; content: ""; height: 16px; width: 16px; left: 4px; bottom: 4px; background-color: #fff; transition: .4s; border-radius: 50%; }
.gdpr-switch input:checked + .gdpr-slider { background-color: var(--primary); }
.gdpr-switch input:checked + .gdpr-slider:before { transform: translateX(20px); }
.gdpr-switch input:disabled + .gdpr-slider { opacity: 0.5; cursor: not-allowed; }
.gdpr-modal-footer { display: flex; justify-content: flex-end; gap: 12px; }
.gdpr-settings-link { font-size: 0.75rem; text-decoration: underline; color: var(--muted); cursor: pointer; display: inline-block; margin-top: 8px; }
@media screen and (max-width: 782px) {
  body.admin-bar header, body.admin-bar .header-bg { top: 46px; }
}
.prod-img svg { width: 64px; height: 64px; stroke: currentColor; }
