/*
Theme Name: Pixelio
Theme URI: https://totaliweb.it/themes/pixelio
Author: Totaliweb
Author URI: https://totaliweb.it
Description: Pixelio — Tema WordPress Digital Products E-Commerce by Totaliweb. WooCommerce-first, accessibilità estrema, font grande, contrasto alto, tap target 48px+, badge formato file, licenze, download istantaneo. I tuoi prodotti digitali, consegnati in un click.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pixelio
Tags: e-commerce, accessibility-ready, one-column, custom-colors, custom-logo, custom-menu, featured-images, theme-options, translation-ready
*/

/* ============================================
   PIXELIO by Totaliweb
   Digital Products — Accessibility Gold Standard
   ============================================ */

:root {
  /* High Contrast Palette */
  --px-bg: #ffffff;
  --px-bg-2: #f7f7f8;
  --px-bg-3: #eeeff1;
  --px-surface: #ffffff;
  --px-text: #111111;
  --px-text-2: #333333;
  --px-text-muted: #5f6368;
  --px-border: #d1d5db;
  --px-border-focus: #111111;

  /* Brand */
  --px-primary: #4f46e5;
  --px-primary-hover: #4338ca;
  --px-primary-light: #eef2ff;
  --px-green: #059669;
  --px-green-light: #ecfdf5;
  --px-red: #dc2626;
  --px-red-light: #fef2f2;
  --px-orange: #d97706;
  --px-orange-light: #fffbeb;
  --px-blue: #2563eb;
  --px-purple: #7c3aed;

  /* Shadows */
  --px-shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --px-shadow-md: 0 4px 12px rgba(0,0,0,.08);
  --px-shadow-lg: 0 8px 24px rgba(0,0,0,.1);

  /* Typography — LARGE for accessibility */
  --px-font: 'Inter', -apple-system, system-ui, sans-serif;
  --px-base: 18px;
  --px-lh: 1.8;

  /* Spacing — generous */
  --px-xs: .375rem;
  --px-sm: .75rem;
  --px-md: 1.25rem;
  --px-lg: 2rem;
  --px-xl: 3rem;
  --px-2xl: 4.5rem;
  --px-3xl: 7rem;

  /* Radius — soft but not round */
  --px-r: 8px;
  --px-r-md: 12px;
  --px-r-lg: 16px;

  /* Touch targets — min 48px per WCAG */
  --px-touch: 48px;

  --px-max-width: 1200px;
  --px-header-h: 72px;
  --px-transition: .2s ease;
}

/* Dark Mode */
[data-theme="dark"] {
  --px-bg: #111111;
  --px-bg-2: #1a1a1a;
  --px-bg-3: #222222;
  --px-surface: #1e1e1e;
  --px-text: #f5f5f5;
  --px-text-2: #d4d4d4;
  --px-text-muted: #9ca3af;
  --px-border: #333333;
  --px-border-focus: #f5f5f5;
  --px-primary-light: rgba(79,70,229,.15);
  --px-green-light: rgba(5,150,105,.12);
  --px-red-light: rgba(220,38,38,.12);
  --px-orange-light: rgba(217,119,6,.12);
  --px-shadow: 0 1px 3px rgba(0,0,0,.3);
  --px-shadow-md: 0 4px 12px rgba(0,0,0,.3);
  --px-shadow-lg: 0 8px 24px rgba(0,0,0,.4);
}

/* === RESET === */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: var(--px-base); }

body {
  font-family: var(--px-font);
  color: var(--px-text-2);
  background: var(--px-bg);
  line-height: var(--px-lh);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  transition: background var(--px-transition), color var(--px-transition);
}

/* === ACCESSIBILITY FOCUS === */
:focus-visible {
  outline: 3px solid var(--px-primary) !important;
  outline-offset: 3px !important;
  border-radius: var(--px-r) !important;
}

/* Skip to content */
.px-skip-link {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--px-primary);
  color: #fff;
  padding: var(--px-md) var(--px-lg);
  font-size: 1rem;
  font-weight: 700;
  z-index: 9999;
  border-radius: 0 0 var(--px-r-md) var(--px-r-md);
  transition: top .2s;
}

.px-skip-link:focus {
  top: 0;
  color: #fff;
}

a { color: var(--px-primary); text-decoration: underline; transition: color var(--px-transition); }
a:hover { color: var(--px-primary-hover); }
img { max-width: 100%; height: auto; display: block; }

/* Typography — Large & Clear */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--px-font);
  font-weight: 800;
  color: var(--px-text);
  line-height: 1.25;
  letter-spacing: -.02em;
}

h1 { font-size: clamp(1.75rem, 4vw, 2.75rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.125rem, 2vw, 1.5rem); }
h4 { font-size: 1.125rem; }

p { margin-bottom: var(--px-md); font-size: 1rem; }

/* Container */
.px-container { width: 100%; max-width: var(--px-max-width); margin: 0 auto; padding: 0 var(--px-lg); }
.px-section { padding: var(--px-3xl) 0; }

/* === BUTTONS — Min 48px touch target === */
.px-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: var(--px-touch);
  padding: .75em 1.75em;
  font-family: var(--px-font); font-size: 1rem; font-weight: 700;
  border: 2px solid transparent; border-radius: var(--px-r-md);
  cursor: pointer; transition: all var(--px-transition);
  text-decoration: none; line-height: 1.4;
}

.px-btn-primary {
  background: var(--px-primary); color: #fff; border-color: var(--px-primary);
}
.px-btn-primary:hover { background: var(--px-primary-hover); border-color: var(--px-primary-hover); color: #fff; }

.px-btn-outline {
  background: transparent; color: var(--px-text); border-color: var(--px-border);
}
.px-btn-outline:hover { border-color: var(--px-text); background: var(--px-bg-2); color: var(--px-text); }

.px-btn-green { background: var(--px-green); color: #fff; border-color: var(--px-green); }
.px-btn-green:hover { opacity: .9; color: #fff; }

.px-btn-sm { min-height: 40px; padding: .5em 1.25em; font-size: .875rem; }
.px-btn-lg { min-height: 56px; padding: 1em 2.25em; font-size: 1.125rem; }
.px-btn-full { width: 100%; }
.px-btn-icon { min-width: var(--px-touch); padding: .5em; }

/* === BADGES — File Format, License, Status === */
.px-badge {
  display: inline-flex; align-items: center; gap: .3em;
  padding: .25em .65em;
  font-size: .75rem; font-weight: 700; line-height: 1.4;
  border-radius: var(--px-r);
  text-transform: uppercase; letter-spacing: .04em;
}

/* File format badges */
.px-badge-pdf { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.px-badge-psd { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.px-badge-ai  { background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa; }
.px-badge-zip { background: #f0fdf4; color: #059669; border: 1px solid #bbf7d0; }
.px-badge-fig { background: #faf5ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.px-badge-xls { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
.px-badge-mp4 { background: #fdf4ff; color: #a21caf; border: 1px solid #f0abfc; }
.px-badge-font { background: #f8fafc; color: #334155; border: 1px solid #cbd5e1; }

/* License badges */
.px-badge-personal { background: var(--px-green-light); color: var(--px-green); border: 1px solid rgba(5,150,105,.2); }
.px-badge-commercial { background: var(--px-primary-light); color: var(--px-primary); border: 1px solid rgba(79,70,229,.2); }
.px-badge-extended { background: var(--px-orange-light); color: var(--px-orange); border: 1px solid rgba(217,119,6,.2); }

/* Status badges */
.px-badge-new { background: var(--px-primary); color: #fff; }
.px-badge-sale { background: var(--px-red); color: #fff; }
.px-badge-hot { background: var(--px-orange); color: #fff; }
.px-badge-free { background: var(--px-green); color: #fff; }

/* Instant download badge */
.px-badge-instant {
  background: var(--px-green-light); color: var(--px-green);
  border: 1px solid rgba(5,150,105,.2);
  display: inline-flex; align-items: center; gap: .4em;
  padding: .35em .75em; font-size: .8125rem; font-weight: 600;
}

/* === CARDS === */
.px-card {
  background: var(--px-surface);
  border: 1px solid var(--px-border);
  border-radius: var(--px-r-lg);
  overflow: hidden;
  transition: all var(--px-transition);
}

.px-card:hover {
  box-shadow: var(--px-shadow-md);
  border-color: var(--px-primary);
}

/* === PROMO BAR === */
.px-promo-bar {
  background: var(--px-primary);
  color: #fff;
  text-align: center;
  padding: .6em var(--px-lg);
  font-size: .9375rem;
  font-weight: 600;
}
.px-promo-bar a { color: #fff; text-decoration: underline; }

/* === HEADER === */
.px-header {
  position: sticky; top: 0; z-index: 1000;
  background: var(--px-bg);
  border-bottom: 1px solid var(--px-border);
  height: var(--px-header-h);
  transition: background var(--px-transition);
}

.px-header-inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 100%; max-width: var(--px-max-width); margin: 0 auto; padding: 0 var(--px-lg);
}

.px-logo {
  font-size: 1.5rem; font-weight: 800; color: var(--px-text);
  text-decoration: none; display: flex; align-items: center; gap: .5rem;
  letter-spacing: -.02em;
}
.px-logo img { height: 40px; width: auto; }
.px-logo:hover { color: var(--px-text); text-decoration: none; }
.px-logo-accent { color: var(--px-primary); }

/* Nav — large touch targets */
.px-nav { display: flex; align-items: center; gap: var(--px-sm); }
.px-nav-menu { display: flex; list-style: none; gap: 2px; }
.px-nav-menu a {
  display: flex; align-items: center;
  min-height: var(--px-touch);
  padding: 0 var(--px-md);
  font-size: .9375rem; font-weight: 600; color: var(--px-text-muted);
  border-radius: var(--px-r); text-decoration: none;
  transition: all var(--px-transition);
}
.px-nav-menu a:hover, .px-nav-menu .current-menu-item a {
  color: var(--px-text); background: var(--px-bg-2);
}

/* Header actions */
.px-header-actions { display: flex; align-items: center; gap: var(--px-sm); }

.px-header-icon {
  position: relative; display: flex; align-items: center; justify-content: center;
  min-width: var(--px-touch); min-height: var(--px-touch);
  border-radius: var(--px-r); border: 1px solid var(--px-border);
  background: transparent; color: var(--px-text-muted);
  font-size: 1.25rem; cursor: pointer; text-decoration: none;
  transition: all var(--px-transition);
}
.px-header-icon:hover { border-color: var(--px-text); color: var(--px-text); }

.px-cart-count {
  position: absolute; top: -4px; right: -4px;
  min-width: 20px; height: 20px; border-radius: 10px;
  background: var(--px-primary); color: #fff;
  font-size: .6875rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}

.px-theme-toggle {
  display: flex; align-items: center; justify-content: center;
  min-width: var(--px-touch); min-height: var(--px-touch);
  border-radius: var(--px-r); border: 1px solid var(--px-border);
  background: transparent; color: var(--px-text-muted);
  font-size: 1.125rem; cursor: pointer;
  transition: all var(--px-transition);
}
.px-theme-toggle:hover { border-color: var(--px-text); color: var(--px-text); }

/* Hamburger — large touch target */
.px-hamburger {
  display: none; align-items: center; justify-content: center;
  min-width: var(--px-touch); min-height: var(--px-touch);
  background: none; border: 1px solid var(--px-border); border-radius: var(--px-r);
  cursor: pointer; flex-direction: column; gap: 5px; padding: 12px;
}
.px-hamburger span { display: block; width: 20px; height: 2px; background: var(--px-text); transition: all var(--px-transition); }
.px-hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.px-hamburger.active span:nth-child(2) { opacity: 0; }
.px-hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* Mobile menu */
.px-mobile-menu {
  position: fixed; inset: 0; top: var(--px-header-h);
  background: var(--px-bg); z-index: 999; padding: var(--px-xl) var(--px-lg);
  opacity: 0; pointer-events: none; transition: opacity .2s; overflow-y: auto;
}
.px-mobile-menu.active { opacity: 1; pointer-events: all; }
.px-mobile-menu a {
  display: flex; align-items: center; min-height: var(--px-touch);
  padding: var(--px-sm) 0; font-size: 1.125rem; font-weight: 600;
  color: var(--px-text); border-bottom: 1px solid var(--px-border);
  text-decoration: none;
}

/* === HERO === */
.px-hero {
  padding: var(--px-3xl) 0; text-align: center;
  background: var(--px-bg-2);
  border-bottom: 1px solid var(--px-border);
}
.px-hero-inner { max-width: 750px; margin: 0 auto; }
.px-hero h1 { margin-bottom: var(--px-md); }
.px-hero-desc { font-size: 1.1875rem; color: var(--px-text-muted); margin-bottom: var(--px-xl); max-width: 600px; margin-left: auto; margin-right: auto; }
.px-hero-actions { display: flex; justify-content: center; gap: var(--px-sm); flex-wrap: wrap; }

/* Stats under hero */
.px-hero-stats {
  display: flex; justify-content: center; gap: var(--px-2xl); margin-top: var(--px-2xl);
  padding-top: var(--px-xl); border-top: 1px solid var(--px-border);
}
.px-hero-stat { text-align: center; }
.px-hero-stat-number { font-size: 2rem; font-weight: 900; color: var(--px-text); line-height: 1; }
.px-hero-stat-label { font-size: .8125rem; color: var(--px-text-muted); margin-top: .25em; }

/* === PRODUCT GRID === */
.px-product-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--px-lg);
}

.px-product-card {
  display: flex; flex-direction: column;
}

.px-product-thumb {
  position: relative; aspect-ratio: 16/10; overflow: hidden;
  background: var(--px-bg-2); display: flex; align-items: center; justify-content: center;
  border-bottom: 1px solid var(--px-border);
}

.px-product-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.px-product-card:hover .px-product-thumb img { transform: scale(1.03); }

.px-product-thumb-badges {
  position: absolute; top: var(--px-sm); left: var(--px-sm);
  display: flex; flex-direction: column; gap: var(--px-xs); z-index: 2;
}

.px-product-thumb-formats {
  position: absolute; bottom: var(--px-sm); left: var(--px-sm);
  display: flex; gap: var(--px-xs); z-index: 2;
}

.px-product-body { padding: var(--px-lg); display: flex; flex-direction: column; flex: 1; }

.px-product-cat {
  font-size: .75rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--px-primary); margin-bottom: var(--px-xs);
  text-decoration: none;
}

.px-product-card h3 { font-size: 1.0625rem; font-weight: 700; margin-bottom: var(--px-sm); }
.px-product-card h3 a { color: var(--px-text); text-decoration: none; }
.px-product-card h3 a:hover { color: var(--px-primary); }

.px-product-desc { font-size: .875rem; color: var(--px-text-muted); margin-bottom: var(--px-md); flex: 1; }

.px-product-footer { display: flex; justify-content: space-between; align-items: center; margin-top: auto; }

.px-product-price { font-size: 1.25rem; font-weight: 800; color: var(--px-text); }
.px-product-price .px-price-old { font-size: .875rem; color: var(--px-text-muted); text-decoration: line-through; margin-right: .3em; font-weight: 400; }
.px-product-price-free { color: var(--px-green); font-weight: 800; }

.px-product-rating { display: flex; align-items: center; gap: .3em; font-size: .875rem; color: #f59e0b; }
.px-product-rating span { color: var(--px-text-muted); font-size: .75rem; }

/* Downloads count */
.px-product-downloads { font-size: .75rem; color: var(--px-text-muted); display: flex; align-items: center; gap: .3em; margin-top: var(--px-sm); }

/* === CATEGORY CARDS === */
.px-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--px-md); }
.px-cat-card {
  display: flex; flex-direction: column; align-items: center;
  padding: var(--px-xl) var(--px-lg); text-align: center;
  text-decoration: none;
}
.px-cat-icon { font-size: 2.5rem; margin-bottom: var(--px-sm); }
.px-cat-card h3 { font-size: 1rem; color: var(--px-text); margin-bottom: .15em; }
.px-cat-card p { font-size: .8125rem; color: var(--px-text-muted); margin: 0; }

/* === SINGLE PRODUCT — Digital Focused === */
.px-single-product { padding: var(--px-2xl) 0; }
.px-single-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--px-2xl); align-items: start; }

.px-single-preview {
  background: var(--px-bg-2); border: 1px solid var(--px-border);
  border-radius: var(--px-r-lg); overflow: hidden;
  aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center;
  position: relative;
}
.px-single-preview img { width: 100%; height: 100%; object-fit: cover; }

.px-single-info { position: sticky; top: calc(var(--px-header-h) + var(--px-lg)); }
.px-single-info h1 { margin-bottom: var(--px-sm); }

.px-single-price { font-size: 2rem; font-weight: 900; color: var(--px-text); margin-bottom: var(--px-md); }
.px-single-price .px-price-old { font-size: 1.25rem; color: var(--px-text-muted); text-decoration: line-through; font-weight: 400; }

.px-single-desc { font-size: 1rem; color: var(--px-text-2); line-height: var(--px-lh); margin-bottom: var(--px-xl); }

/* What's included */
.px-whats-included {
  background: var(--px-bg-2); border: 1px solid var(--px-border);
  border-radius: var(--px-r-md); padding: var(--px-lg); margin-bottom: var(--px-lg);
}
.px-whats-included h4 { font-size: .875rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--px-md); }
.px-whats-included ul { list-style: none; }
.px-whats-included li {
  display: flex; align-items: center; gap: var(--px-sm);
  padding: var(--px-sm) 0; border-bottom: 1px solid var(--px-border);
  font-size: .9375rem;
}
.px-whats-included li:last-child { border-bottom: none; }
.px-check { color: var(--px-green); font-weight: 700; }

/* Trust / Guarantee */
.px-trust-row {
  display: flex; gap: var(--px-lg); padding: var(--px-lg) 0;
  border-top: 1px solid var(--px-border);
  margin-top: var(--px-lg);
}
.px-trust-item { display: flex; align-items: center; gap: var(--px-sm); font-size: .8125rem; color: var(--px-text-muted); }

/* License selector */
.px-license-options { display: flex; flex-direction: column; gap: var(--px-sm); margin-bottom: var(--px-lg); }
.px-license-option {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--px-md) var(--px-lg);
  border: 2px solid var(--px-border); border-radius: var(--px-r-md);
  cursor: pointer; transition: all var(--px-transition);
  min-height: var(--px-touch);
}
.px-license-option:hover, .px-license-option.selected { border-color: var(--px-primary); background: var(--px-primary-light); }
.px-license-name { font-weight: 700; }
.px-license-desc { font-size: .8125rem; color: var(--px-text-muted); }
.px-license-price { font-weight: 800; font-size: 1.125rem; }

/* Tabs */
.px-tabs-nav { display: flex; gap: 0; border-bottom: 2px solid var(--px-border); margin-bottom: var(--px-xl); }
.px-tab-btn {
  padding: var(--px-md) var(--px-lg); min-height: var(--px-touch);
  font-family: var(--px-font); font-size: .9375rem; font-weight: 700;
  background: none; border: none; border-bottom: 2px solid transparent;
  color: var(--px-text-muted); cursor: pointer; margin-bottom: -2px;
  transition: all var(--px-transition);
}
.px-tab-btn.active, .px-tab-btn:hover { color: var(--px-text); border-bottom-color: var(--px-primary); }
.px-tab-panel { display: none; }
.px-tab-panel.active { display: block; }
.px-tab-panel p { font-size: 1rem; line-height: var(--px-lh); }

/* === SHOP PAGE === */
.px-shop-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: var(--px-md) 0; border-bottom: 1px solid var(--px-border);
  margin-bottom: var(--px-xl); flex-wrap: wrap; gap: var(--px-md);
}
.px-shop-count { font-size: .9375rem; color: var(--px-text-muted); }
.px-shop-sort select {
  min-height: var(--px-touch); padding: .5em 1em;
  border: 1px solid var(--px-border); border-radius: var(--px-r);
  background: var(--px-surface); color: var(--px-text);
  font-family: var(--px-font); font-size: .9375rem;
}
.px-filter-pills { display: flex; gap: var(--px-xs); flex-wrap: wrap; margin-bottom: var(--px-lg); }
.px-filter-pill {
  min-height: 40px; padding: .4em 1em;
  border: 1px solid var(--px-border); border-radius: var(--px-r);
  font-size: .875rem; font-weight: 600; cursor: pointer;
  transition: all var(--px-transition); background: var(--px-surface);
  color: var(--px-text-2); text-decoration: none;
  display: flex; align-items: center;
}
.px-filter-pill:hover, .px-filter-pill.active { background: var(--px-primary); color: #fff; border-color: var(--px-primary); }

/* === CUSTOM CART === */
.px-cart-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: var(--px-2xl); align-items: start; }
.px-cart-item {
  display: flex; gap: var(--px-lg); align-items: center;
  padding: var(--px-lg) 0; border-bottom: 1px solid var(--px-border);
}
.px-cart-item-thumb { width: 100px; aspect-ratio: 16/10; overflow: hidden; border-radius: var(--px-r); background: var(--px-bg-2); flex-shrink: 0; }
.px-cart-item-thumb img { width: 100%; height: 100%; object-fit: cover; }
.px-cart-item-info { flex: 1; }
.px-cart-item-info h3 { font-size: 1rem; font-weight: 700; margin-bottom: .25em; }
.px-cart-item-info h3 a { color: var(--px-text); text-decoration: none; }
.px-cart-item-meta { font-size: .8125rem; color: var(--px-text-muted); }
.px-cart-item-remove { font-size: .8125rem; color: var(--px-red); text-decoration: underline; cursor: pointer; margin-top: var(--px-xs); display: inline-block; }
.px-cart-item-price { font-weight: 800; font-size: 1.125rem; text-align: right; white-space: nowrap; }

.px-cart-summary {
  background: var(--px-bg-2); border: 1px solid var(--px-border);
  border-radius: var(--px-r-lg); padding: var(--px-xl);
  position: sticky; top: calc(var(--px-header-h) + var(--px-lg));
}
.px-cart-summary h3 { font-size: 1.125rem; margin-bottom: var(--px-lg); }
.px-summary-row { display: flex; justify-content: space-between; padding: var(--px-sm) 0; font-size: 1rem; }
.px-summary-row.total { font-size: 1.25rem; font-weight: 800; color: var(--px-text); border-top: 2px solid var(--px-text); padding-top: var(--px-md); margin-top: var(--px-md); }

.px-coupon-row { display: flex; gap: var(--px-sm); margin-top: var(--px-lg); }
.px-coupon-row input { flex: 1; min-height: var(--px-touch); padding: .5em 1em; border: 1px solid var(--px-border); border-radius: var(--px-r); font-family: var(--px-font); font-size: .9375rem; background: var(--px-surface); color: var(--px-text); }

/* === CHECKOUT === */
.px-checkout-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--px-2xl); align-items: start; }
.px-checkout-section { margin-bottom: var(--px-xl); }
.px-checkout-section h3 { font-size: 1rem; font-weight: 700; margin-bottom: var(--px-lg); padding-bottom: var(--px-sm); border-bottom: 1px solid var(--px-border); }
.px-form-row { margin-bottom: var(--px-md); }
.px-form-row label { display: block; font-size: .875rem; font-weight: 700; margin-bottom: var(--px-xs); color: var(--px-text); }
.px-form-row input, .px-form-row select, .px-form-row textarea {
  width: 100%; min-height: var(--px-touch); padding: .65em 1em;
  border: 1px solid var(--px-border); border-radius: var(--px-r);
  background: var(--px-surface); color: var(--px-text);
  font-family: var(--px-font); font-size: 1rem;
  transition: border-color var(--px-transition);
}
.px-form-row input:focus, .px-form-row select:focus { border-color: var(--px-primary); }

/* === MY ACCOUNT === */
.px-account-grid { display: grid; grid-template-columns: 260px 1fr; gap: var(--px-2xl); align-items: start; }
.px-account-nav { display: flex; flex-direction: column; gap: 2px; }
.px-account-nav a {
  display: flex; align-items: center; gap: var(--px-sm);
  min-height: var(--px-touch); padding: var(--px-sm) var(--px-lg);
  font-size: .9375rem; font-weight: 600; color: var(--px-text-2);
  border-radius: var(--px-r); text-decoration: none;
  transition: all var(--px-transition);
}
.px-account-nav a:hover, .px-account-nav a.active { background: var(--px-primary-light); color: var(--px-primary); }

.px-dashboard-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--px-md); margin-bottom: var(--px-2xl); }
.px-dashboard-card {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: var(--px-xl) var(--px-lg); text-decoration: none;
}
.px-dashboard-card:hover { border-color: var(--px-primary); }
.px-dashboard-icon { font-size: 2rem; margin-bottom: var(--px-sm); }
.px-dashboard-card h4 { font-size: .9375rem; color: var(--px-text); margin-bottom: .15em; }
.px-dashboard-card p { font-size: .8125rem; color: var(--px-text-muted); margin: 0; }

/* === FEATURES STRIP === */
.px-features-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border: 1px solid var(--px-border); border-radius: var(--px-r-lg);
  background: var(--px-surface); overflow: hidden;
}
.px-feature-cell {
  padding: var(--px-lg); text-align: center;
  border-right: 1px solid var(--px-border);
}
.px-feature-cell:last-child { border-right: none; }
.px-feature-icon { font-size: 1.5rem; margin-bottom: var(--px-sm); display: block; }
.px-feature-cell h4 { font-size: .875rem; margin-bottom: .15em; }
.px-feature-cell p { font-size: .75rem; color: var(--px-text-muted); margin: 0; }

/* === NEWSLETTER === */
.px-newsletter {
  background: var(--px-bg-2); border: 1px solid var(--px-border);
  border-radius: var(--px-r-lg); padding: var(--px-2xl);
  text-align: center; margin: 0 var(--px-lg);
}
.px-newsletter h2 { margin-bottom: var(--px-sm); }
.px-newsletter p { color: var(--px-text-muted); max-width: 500px; margin: 0 auto var(--px-xl); }
.px-newsletter-form { display: flex; gap: var(--px-sm); max-width: 450px; margin: 0 auto; }
.px-newsletter-form input { flex: 1; min-height: var(--px-touch); padding: .65em 1em; border: 1px solid var(--px-border); border-radius: var(--px-r); font-family: var(--px-font); font-size: 1rem; background: var(--px-surface); color: var(--px-text); }

/* === SEARCH RESULTS === */
.px-search-header { text-align: center; padding: var(--px-2xl) 0; border-bottom: 1px solid var(--px-border); }
.px-search-form-big { display: flex; gap: var(--px-sm); max-width: 600px; margin: var(--px-lg) auto 0; }
.px-search-form-big input { flex: 1; min-height: 56px; padding: .75em 1.25em; border: 2px solid var(--px-border); border-radius: var(--px-r-md); font-family: var(--px-font); font-size: 1.125rem; background: var(--px-surface); color: var(--px-text); }
.px-search-form-big input:focus { border-color: var(--px-primary); }

/* === FOOTER === */
.px-footer {
  background: var(--px-bg-2); border-top: 1px solid var(--px-border);
  padding: var(--px-2xl) 0 var(--px-lg);
}
.px-footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--px-2xl); margin-bottom: var(--px-2xl); }
.px-footer-brand p { font-size: .9375rem; color: var(--px-text-muted); max-width: 320px; margin-top: var(--px-sm); }
.px-footer h4 { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--px-text-muted); margin-bottom: var(--px-md); }
.px-footer-links { list-style: none; }
.px-footer-links li { margin-bottom: var(--px-xs); }
.px-footer-links a { font-size: .9375rem; color: var(--px-text-2); }
.px-footer-links a:hover { color: var(--px-primary); }
.px-footer-social { display: flex; gap: var(--px-sm); margin-top: var(--px-md); }
.px-footer-social a {
  min-width: 40px; min-height: 40px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--px-border); border-radius: var(--px-r);
  font-size: .75rem; font-weight: 700; color: var(--px-text-muted);
  transition: all var(--px-transition); text-decoration: none;
}
.px-footer-social a:hover { border-color: var(--px-primary); color: var(--px-primary); }

.px-footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: var(--px-lg); border-top: 1px solid var(--px-border);
  font-size: .8125rem; color: var(--px-text-muted);
}
.px-footer-bottom a { color: var(--px-primary); }

.px-pay-icons { display: flex; gap: var(--px-sm); }
.px-pay-icon { padding: .2em .5em; border: 1px solid var(--px-border); border-radius: var(--px-r); font-size: .625rem; font-weight: 700; color: var(--px-text-muted); }

/* === WHATSAPP === */
.px-whatsapp-float {
  position: fixed; bottom: 24px; right: 24px; z-index: 998;
  display: flex; align-items: center; gap: .5em;
  min-height: var(--px-touch);
  background: var(--px-green); color: #fff;
  border-radius: var(--px-r-md); padding: 0 var(--px-lg);
  font-size: .9375rem; font-weight: 700;
  box-shadow: var(--px-shadow-lg); text-decoration: none;
  transition: all var(--px-transition);
}
.px-whatsapp-float:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(5,150,105,.3); color: #fff; }
.px-whatsapp-float svg { width: 20px; height: 20px; fill: currentColor; }

/* === SCROLL REVEAL === */
.px-reveal { opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease; }
.px-reveal.visible { opacity: 1; transform: translateY(0); }

/* === PAGE DEFAULTS === */
.px-page { padding: var(--px-2xl) 0 var(--px-3xl); min-height: 60vh; }
.px-single { max-width: 760px; margin: 0 auto; padding: var(--px-2xl) var(--px-lg) var(--px-3xl); }
.px-single h1 { margin-bottom: var(--px-md); }
.px-single .entry-content { font-size: 1.0625rem; line-height: var(--px-lh); }
.px-single .entry-content p { margin-bottom: var(--px-lg); }
.px-single .entry-content img { border-radius: var(--px-r-md); margin: var(--px-xl) 0; }
.px-single .entry-content blockquote { border-left: 4px solid var(--px-primary); padding: var(--px-md) var(--px-lg); background: var(--px-bg-2); border-radius: 0 var(--px-r-md) var(--px-r-md) 0; margin: var(--px-xl) 0; }

/* 404 */
.px-404 { min-height: 70vh; display: flex; align-items: center; justify-content: center; text-align: center; }
.px-404-number { font-size: clamp(5rem, 12vw, 8rem); font-weight: 900; color: var(--px-border); line-height: 1; margin-bottom: var(--px-sm); }

/* ═══ WOOCOMMERCE OVERRIDES ═══ */
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: var(--px-lg) !important; margin: 0 !important; padding: 0 !important; }
.woocommerce ul.products li.product { background: var(--px-surface) !important; border: 1px solid var(--px-border) !important; border-radius: var(--px-r-lg) !important; padding: 0 !important; margin: 0 !important; overflow: hidden; float: none !important; width: auto !important; transition: all var(--px-transition) !important; }
.woocommerce ul.products li.product:hover { border-color: var(--px-primary) !important; box-shadow: var(--px-shadow-md) !important; }
.woocommerce ul.products li.product a img { margin: 0 !important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: var(--px-font) !important; font-size: 1rem !important; font-weight: 700 !important; padding: var(--px-sm) var(--px-lg) 0 !important; color: var(--px-text) !important; }
.woocommerce ul.products li.product .price { padding: var(--px-xs) var(--px-lg) !important; font-weight: 800 !important; font-size: 1.125rem !important; color: var(--px-text) !important; }
.woocommerce ul.products li.product .price del { color: var(--px-text-muted) !important; font-weight: 400 !important; font-size: .875rem !important; }
.woocommerce ul.products li.product .price ins { text-decoration: none !important; }
.woocommerce ul.products li.product .button { display: block !important; width: calc(100% - 2*var(--px-lg)) !important; margin: var(--px-sm) var(--px-lg) var(--px-lg) !important; padding: .7em !important; background: var(--px-primary) !important; color: #fff !important; border: none !important; border-radius: var(--px-r-md) !important; font-family: var(--px-font) !important; font-size: .875rem !important; font-weight: 700 !important; text-align: center !important; cursor: pointer !important; min-height: var(--px-touch) !important; transition: background var(--px-transition) !important; }
.woocommerce ul.products li.product .button:hover { background: var(--px-primary-hover) !important; }

.woocommerce span.onsale { background: var(--px-red) !important; color: #fff !important; border-radius: var(--px-r) !important; font-size: .75rem !important; font-weight: 700 !important; padding: .3em .7em !important; min-height: auto !important; min-width: auto !important; line-height: 1.4 !important; }
.woocommerce .star-rating { color: #f59e0b !important; }

.woocommerce #respond input#submit, .woocommerce button.button, .woocommerce input.button, .woocommerce a.button { background: var(--px-primary) !important; color: #fff !important; border: none !important; border-radius: var(--px-r-md) !important; font-family: var(--px-font) !important; font-weight: 700 !important; padding: .75em 1.75em !important; min-height: var(--px-touch) !important; font-size: 1rem !important; transition: background var(--px-transition) !important; }
.woocommerce #respond input#submit:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce a.button:hover { background: var(--px-primary-hover) !important; }

.woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce form .form-row textarea { background: var(--px-surface) !important; border: 1px solid var(--px-border) !important; border-radius: var(--px-r) !important; color: var(--px-text) !important; padding: .65em 1em !important; font-family: var(--px-font) !important; min-height: var(--px-touch) !important; font-size: 1rem !important; }

.woocommerce-message { border-top-color: var(--px-green) !important; background: var(--px-green-light) !important; color: var(--px-text) !important; border-radius: var(--px-r) !important; font-size: 1rem !important; padding: var(--px-md) !important; }
.woocommerce-info { border-top-color: var(--px-primary) !important; background: var(--px-primary-light) !important; color: var(--px-text) !important; border-radius: var(--px-r) !important; }
.woocommerce-error { border-top-color: var(--px-red) !important; background: var(--px-red-light) !important; color: var(--px-text) !important; border-radius: var(--px-r) !important; }

.woocommerce .woocommerce-breadcrumb { font-size: .875rem !important; color: var(--px-text-muted) !important; padding: var(--px-md) 0 !important; }
.woocommerce .woocommerce-breadcrumb a { color: var(--px-primary) !important; }

.woocommerce nav.woocommerce-pagination ul { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { background: var(--px-surface) !important; color: var(--px-text) !important; border: 1px solid var(--px-border) !important; border-radius: var(--px-r) !important; min-width: var(--px-touch) !important; min-height: var(--px-touch) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 1rem !important; }
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--px-primary) !important; color: #fff !important; border-color: var(--px-primary) !important; }

/* === RESPONSIVE === */
@media (max-width: 1024px) {
  .px-product-grid, .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
  .px-cat-grid { grid-template-columns: repeat(2, 1fr); }
  .px-single-grid, .px-cart-grid, .px-checkout-grid { grid-template-columns: 1fr; }
  .px-account-grid { grid-template-columns: 1fr; }
  .px-features-strip { grid-template-columns: repeat(2, 1fr); }
  .px-feature-cell { border-bottom: 1px solid var(--px-border); }
  .px-footer-grid { grid-template-columns: 1fr 1fr; }
  .px-hero-stats { gap: var(--px-xl); }
  .px-dashboard-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .px-nav-menu { display: none; }
  .px-hamburger { display: flex; }
  .px-product-grid, .woocommerce ul.products { grid-template-columns: 1fr !important; max-width: 500px; margin: 0 auto !important; }
  .px-cat-grid { grid-template-columns: 1fr 1fr; }
  .px-features-strip { grid-template-columns: 1fr; }
  .px-footer-grid { grid-template-columns: 1fr; }
  .px-footer-bottom { flex-direction: column; gap: var(--px-sm); text-align: center; }
  .px-hero-stats { flex-direction: column; gap: var(--px-lg); }
  .px-cart-item { flex-direction: column; text-align: center; }
  .px-cart-item-thumb { width: 120px; }
  .px-account-nav { flex-direction: row; flex-wrap: wrap; gap: var(--px-xs); }
  .px-account-nav a { padding: var(--px-sm) var(--px-md); }
  .px-newsletter { margin: 0; border-radius: 0; }
  .px-whatsapp-float span { display: none; }
  .px-whatsapp-float { padding: 0; width: var(--px-touch); border-radius: 50%; justify-content: center; }
  .px-dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  :root { --px-2xl: 3rem; --px-3xl: 5rem; }
  .px-hero { padding: var(--px-2xl) 0; }
  .px-search-form-big { flex-direction: column; }
  .px-newsletter-form { flex-direction: column; }
  .px-coupon-row { flex-direction: column; }
}

/* WP defaults */
.alignleft { float: left; margin: 0 var(--px-lg) var(--px-lg) 0; }
.alignright { float: right; margin: 0 0 var(--px-lg) var(--px-lg); }
.aligncenter { display: block; margin: 0 auto var(--px-lg); }
.screen-reader-text { clip: rect(1px,1px,1px,1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .px-reveal { opacity: 1 !important; transform: none !important; }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  :root { --px-border: #000000; --px-text-muted: #333333; }
  .px-btn { border-width: 3px; }
}

/* Large text preference */
@media (prefers-contrast: more) {
  :root { --px-base: 20px; }
}