/* ============================================================
   RACEPARTS.PL — DESIGN SYSTEM (PRODUKCJA)
   Premium Tech / Engineering · Dark Mode
   = nowe tokeny + warstwa aliasów (kompat. wstecz) + reset/baza
     + globalne nadpisania Storefront/WooCommerce
   Źródło tokenów: design/tokens.css (utrzymywać w sync)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,400..900;1,400..900&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ── Design Tokens ────────────────────────────────────────── */
:root {
  /* akcent — czerwień z logo (stonowana) */
  --rp-red-400:#e8453a; --rp-red-500:#d12e27; --rp-red-600:#ab1d16;
  --rp-red-glow:rgba(209,46,39,.42); --rp-red-dim:rgba(209,46,39,.10);

  /* tła — hierarchia ciemności */
  --rp-bg:#0a0b0c; --rp-surface-1:#121315; --rp-surface-2:#191b1e;
  --rp-surface-3:#22262b; --rp-inset:#060708;

  /* linie */
  --rp-border:#282c31; --rp-border-strong:#3a3f46; --rp-border-accent:var(--rp-red-500);

  /* tekst */
  --rp-text:#f4f6f8; --rp-text-secondary:#aeb6c0; --rp-text-muted:#6e7681; --rp-text-on-accent:#fff;

  /* semantyka */
  --rp-success:#34d399; --rp-warning:#f5a524; --rp-danger:#ff4d4f; --rp-info:#38bdf8;

  /* typografia */
  --rp-font-sans:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --rp-font-mono:'JetBrains Mono',ui-monospace,'SF Mono','Cascadia Code',monospace;
  --rp-text-xs:.75rem; --rp-text-sm:.875rem; --rp-text-base:1rem; --rp-text-lg:1.125rem;
  --rp-text-xl:1.375rem; --rp-text-2xl:1.75rem; --rp-text-3xl:2.5rem; --rp-text-4xl:3.5rem;
  --rp-text-display:clamp(2.75rem,6vw,4.5rem);
  --rp-w-regular:400; --rp-w-medium:500; --rp-w-semibold:600; --rp-w-bold:700; --rp-w-extra:800; --rp-w-black:900;
  --rp-track-tight:-.02em; --rp-track-normal:0; --rp-track-wide:.06em; --rp-track-wider:.14em; --rp-track-widest:.22em;
  --rp-leading-tight:1.05; --rp-leading-snug:1.25; --rp-leading-normal:1.6; --rp-leading-relaxed:1.75;

  /* spacing — siatka 4px */
  --rp-space-1:.25rem; --rp-space-2:.5rem; --rp-space-3:.75rem; --rp-space-4:1rem; --rp-space-5:1.25rem;
  --rp-space-6:1.5rem; --rp-space-8:2rem; --rp-space-10:2.5rem; --rp-space-12:3rem; --rp-space-16:4rem;
  --rp-space-20:5rem; --rp-space-24:6rem;

  /* radius — ostry */
  --rp-radius-none:0; --rp-radius-xs:2px; --rp-radius-sm:3px; --rp-radius-md:4px; --rp-radius-lg:6px; --rp-radius-pill:999px;

  /* cienie + glow */
  --rp-shadow-sm:0 1px 2px rgba(0,0,0,.45); --rp-shadow-md:0 4px 16px -2px rgba(0,0,0,.55);
  --rp-shadow-lg:0 12px 40px -8px rgba(0,0,0,.65);
  --rp-glow-accent:0 0 0 1px rgba(209,46,39,.5),0 0 28px -6px rgba(209,46,39,.55);

  /* motion */
  --rp-ease:cubic-bezier(.2,.7,.3,1); --rp-ease-out:cubic-bezier(.16,1,.3,1);
  --rp-dur-fast:120ms; --rp-dur:200ms;

  /* layout */
  --rp-container:1280px; --rp-gutter:clamp(1rem,4vw,2.5rem);

  /* blueprint */
  --rp-grid-line:rgba(255,255,255,.025); --rp-grid-cell:24px;
}

/* ── Warstwa aliasów — kompatybilność ze starym CSS/szablonami ──
   Stare pliki (pdp/shop/checkout/legal.css) i single-product.php
   używają starych nazw. Aliasy mapują je na nowe tokeny → zero awarii
   w trakcie stopniowej migracji widoków. Docelowo usunąć. */
:root {
  --rp-bg-surface:     var(--rp-surface-1);
  --rp-bg-elevated:    var(--rp-surface-3);
  --rp-border-subtle:  var(--rp-border);
  --rp-text-primary:   var(--rp-text);
  --rp-red:            var(--rp-red-500);
  --rp-red-hover:      var(--rp-red-600);
  --rp-orange:         var(--rp-red-500);   /* pomarańcz usunięty → czerwień */
  --rp-orange-dim:     var(--rp-red-dim);
  --rp-white:          #ffffff;
  --rp-font-body:      var(--rp-font-sans);
  --rp-font-display:   var(--rp-font-sans);
  --rp-text-5xl:       var(--rp-text-4xl);
  --rp-radius:         var(--rp-radius-md);
  --rp-transition:     var(--rp-dur) var(--rp-ease);
  --rp-transition-slow:320ms var(--rp-ease);
  --rp-shadow-red:     var(--rp-glow-accent);
  --rp-max-width:      var(--rp-container);
}

/* ── Reset ────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background-color:var(--rp-bg);color:var(--rp-text);
  font-family:var(--rp-font-sans);font-size:var(--rp-text-base);line-height:var(--rp-leading-normal);
  font-weight:var(--rp-w-regular);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img,video{display:block;max-width:100%;height:auto}
a{color:var(--rp-red-500);text-decoration:none;transition:color var(--rp-dur) var(--rp-ease)}
a:hover{color:var(--rp-red-400)}
button{cursor:pointer;font-family:inherit}
ul,ol{list-style:none}

/* ── Typografia ───────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6{
  font-family:var(--rp-font-sans);font-weight:var(--rp-w-extra);line-height:var(--rp-leading-tight);
  letter-spacing:var(--rp-track-tight);color:var(--rp-text);text-transform:uppercase;
}
h1{font-size:clamp(var(--rp-text-3xl),5vw,var(--rp-text-4xl))}
h2{font-size:clamp(var(--rp-text-2xl),3vw,var(--rp-text-3xl))}
h3{font-size:clamp(var(--rp-text-xl),2.5vw,var(--rp-text-2xl))}
h4{font-size:var(--rp-text-xl)}
p{margin-bottom:var(--rp-space-4)}
p:last-child{margin-bottom:0}

/* ── Layout ───────────────────────────────────────────────── */
.rp-container{width:100%;max-width:var(--rp-container);margin-inline:auto;padding-inline:var(--rp-gutter)}

/* ============================================================
   STOREFRONT / WOOCOMMERCE — globalne nadpisania (motyw lekki)
   Default markup WC dopasowany do Design Systemu nowymi tokenami.
   ============================================================ */
.site{background:var(--rp-bg)}

/* Storefront's breadcrumb wrapper — hidden; we render our own in templates */
.storefront-breadcrumb{display:none!important}

/* header */
.site-header{
  background:rgba(10,11,12,.85)!important;border-bottom:1px solid var(--rp-border)!important;
  backdrop-filter:blur(12px);position:sticky;top:0;z-index:100;padding:var(--rp-space-4) 0!important;
}
/* header */
.site-header .site-branding .site-title a,
.site-header .site-branding .site-title{
  color:var(--rp-text)!important;font-family:var(--rp-font-sans)!important;
  font-weight:var(--rp-w-black)!important;font-style:italic;font-size:var(--rp-text-2xl)!important;
  letter-spacing:var(--rp-track-tight);text-transform:uppercase;
}
.main-navigation ul.menu li a,.main-navigation ul.nav-menu li a{
  color:var(--rp-text-secondary)!important;font-weight:var(--rp-w-semibold);text-transform:uppercase;
  letter-spacing:var(--rp-track-wide);font-size:var(--rp-text-sm);transition:color var(--rp-dur) var(--rp-ease);
}
.main-navigation ul.menu li a:hover{color:var(--rp-text)!important}

/* przyciski */
.button,button,input[type=submit],
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt{
  font-family:var(--rp-font-sans)!important;font-weight:var(--rp-w-bold)!important;
  text-transform:uppercase;letter-spacing:var(--rp-track-wide);font-size:var(--rp-text-sm);
  background:var(--rp-red-500)!important;color:var(--rp-text-on-accent)!important;
  border:1px solid transparent!important;border-radius:var(--rp-radius-md)!important;
  padding:var(--rp-space-3) var(--rp-space-6)!important;
  transition:background var(--rp-dur) var(--rp-ease),transform var(--rp-dur) var(--rp-ease)!important;
}
.button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover{
  background:var(--rp-red-400)!important;transform:translateY(-1px);color:var(--rp-text-on-accent)!important;
}
/* przycisk drugorzędny (np. „Wróć do sklepu") */
.woocommerce a.button.wc-backward,.woocommerce .cart .button[name=update_cart]{
  background:transparent!important;color:var(--rp-text)!important;border:1px solid var(--rp-border-strong)!important;
}

/* formularze */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],
select,textarea{
  background:var(--rp-surface-2)!important;color:var(--rp-text)!important;
  border:1px solid var(--rp-border)!important;border-radius:var(--rp-radius-md)!important;
  padding:var(--rp-space-3) var(--rp-space-4)!important;font-family:var(--rp-font-sans);
  transition:border-color var(--rp-dur) var(--rp-ease),box-shadow var(--rp-dur) var(--rp-ease)!important;
}
input:focus,select:focus,textarea:focus,
.woocommerce form .form-row input.input-text:focus{
  outline:none!important;border-color:var(--rp-red-500)!important;box-shadow:0 0 0 3px var(--rp-red-dim)!important;
}
::placeholder{color:var(--rp-text-muted)}
label{color:var(--rp-text-secondary)}

/* ceny */
.price,.woocommerce ul.products li.product .price,.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-family:var(--rp-font-mono)!important;color:var(--rp-text)!important;font-weight:var(--rp-w-bold);
}
.woocommerce div.product p.price del,.price del{color:var(--rp-text-muted)!important;font-weight:var(--rp-w-regular)}
.woocommerce div.product p.price ins,.price ins{text-decoration:none}

/* product loop — karty */
.woocommerce ul.products li.product,.woocommerce-page ul.products li.product{
  background:var(--rp-surface-1);border:1px solid var(--rp-border);border-radius:var(--rp-radius-md);
  padding:var(--rp-space-4)!important;transition:border-color var(--rp-dur) var(--rp-ease),transform var(--rp-dur) var(--rp-ease),box-shadow var(--rp-dur) var(--rp-ease);
}
.woocommerce ul.products li.product:hover{border-color:var(--rp-border-strong);transform:translateY(-2px);box-shadow:var(--rp-shadow-md)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--rp-font-sans);font-weight:var(--rp-w-semibold);font-size:var(--rp-text-base);
  color:var(--rp-text);text-transform:none;letter-spacing:0;line-height:var(--rp-leading-snug);padding:var(--rp-space-2) 0;
}
.woocommerce ul.products li.product a img{border-radius:var(--rp-radius-sm);background:var(--rp-inset)}

/* sale badge */
.woocommerce span.onsale{
  background:var(--rp-red-500)!important;color:var(--rp-text-on-accent)!important;
  font-family:var(--rp-font-mono);font-size:var(--rp-text-xs);font-weight:var(--rp-w-bold);
  text-transform:uppercase;letter-spacing:var(--rp-track-wide);border-radius:var(--rp-radius-sm);
  min-height:auto;min-width:auto;padding:var(--rp-space-1) var(--rp-space-3);line-height:1.4;
}

/* gwiazdki */
.star-rating span::before,.woocommerce .star-rating span::before{color:var(--rp-red-500)}
.star-rating::before{color:var(--rp-text-muted)}

/* breadcrumb */
.woocommerce-breadcrumb{
  font-family:var(--rp-font-mono)!important;font-size:var(--rp-text-xs)!important;
  color:var(--rp-text-muted)!important;letter-spacing:var(--rp-track-wide);text-transform:uppercase;
}
.woocommerce-breadcrumb a{color:var(--rp-text-secondary)}

/* paginacja */
.woocommerce nav.woocommerce-pagination ul{border:0}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{
  background:var(--rp-surface-1);border:1px solid var(--rp-border)!important;border-radius:var(--rp-radius-md);
  color:var(--rp-text-secondary);font-family:var(--rp-font-mono);font-size:var(--rp-text-sm);
}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--rp-red-500);border-color:var(--rp-red-500)!important;color:#fff}

/* notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  background:var(--rp-surface-1)!important;border:1px solid var(--rp-border)!important;border-left-width:3px!important;
  border-radius:var(--rp-radius-md)!important;color:var(--rp-text-secondary)!important;
}
.woocommerce-message{border-left-color:var(--rp-success)!important}
.woocommerce-info{border-left-color:var(--rp-info)!important}
.woocommerce-error{border-left-color:var(--rp-danger)!important}
.woocommerce-message::before{color:var(--rp-success)}
.woocommerce-info::before{color:var(--rp-info)}

/* taby PDP (domyślne WC) */
.woocommerce div.product .woocommerce-tabs ul.tabs{border-bottom:1px solid var(--rp-border)}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:transparent;border:0;border-radius:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  font-family:var(--rp-font-sans);font-weight:var(--rp-w-semibold);text-transform:uppercase;
  letter-spacing:var(--rp-track-wide);font-size:var(--rp-text-sm);color:var(--rp-text-muted);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--rp-text)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{border-bottom:2px solid var(--rp-red-500)}

/* tabele (koszyk, dane) */
.woocommerce table.shop_table{border:1px solid var(--rp-border);border-radius:var(--rp-radius-md);background:var(--rp-surface-1)}
.woocommerce table.shop_table th{font-family:var(--rp-font-mono);font-size:var(--rp-text-xs);text-transform:uppercase;letter-spacing:var(--rp-track-wide);color:var(--rp-text-muted)}
.woocommerce table.shop_table td{border-top:1px solid var(--rp-border);color:var(--rp-text-secondary)}

/* footer */
.site-footer,.storefront-handheld-footer-bar{
  background:var(--rp-inset)!important;border-top:1px solid var(--rp-border);color:var(--rp-text-muted);
}
.site-footer a{color:var(--rp-text-secondary)}
.site-footer a:hover{color:var(--rp-red-500)}

/* FIX: copyright + polityka w jednej linii, usuń <br> i separator */
.site-footer .site-info{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:0 var(--rp-space-4);
  font-size:var(--rp-text-xs);
}
.site-footer .site-info br{display:none!important}
.site-footer .site-info [role="separator"]{display:none!important}
/* fallback: ukryj WC link CSS-side jeśli PHP filter nie zadziała */
.site-footer .site-info a[href*="woocommerce.com"]{display:none!important}

/* selection */
::selection{background:var(--rp-red-500);color:#fff}

/* ── FIX: search icon (position:absolute;left:0) overlaps placeholder ── */
.woocommerce-product-search{position:relative}
.woocommerce-product-search input[type="search"]{padding-left:2.5rem!important}
.woocommerce-product-search button[type="submit"]{
  position:absolute;left:0;top:0;bottom:0;width:2.5rem;
  background:transparent!important;border:none!important;padding:0!important;
  display:flex;align-items:center;justify-content:center;
  color:var(--rp-text-muted);cursor:pointer;z-index:1;
}
.woocommerce-product-search button[type="submit"]:hover{color:var(--rp-red-500)}

/* ── FIX: WC Blocks wp-element-button → rp-red ─────────────────────── */
a.wp-element-button,button.wp-element-button,
.wc-block-components-button.wp-element-button{
  background:var(--rp-red-500)!important;color:var(--rp-text-on-accent)!important;
  border:1px solid transparent!important;border-radius:var(--rp-radius-md)!important;
  font-family:var(--rp-font-sans)!important;font-weight:var(--rp-w-bold)!important;
  text-transform:uppercase;letter-spacing:var(--rp-track-wide);
}
a.wp-element-button:hover,button.wp-element-button:hover{
  background:var(--rp-red-400)!important;color:var(--rp-text-on-accent)!important;
  transform:translateY(-1px);
}

/* ── FIX: Cart widget — better header layout ────────────────────────── */
.site-header-cart .cart-contents{
  display:flex;align-items:center;gap:var(--rp-space-2);white-space:nowrap;
  font-family:var(--rp-font-mono);font-size:var(--rp-text-sm);color:var(--rp-text-secondary);
}
.site-header-cart .cart-contents .amount{color:var(--rp-text);font-weight:var(--rp-w-bold)}

/* ── FIX: Header cart dropdown — dark theme (Storefront domyślnie biały) */
.site-header-cart .widget_shopping_cart,
.site-header-cart .widget_shopping_cart_content{
  background:var(--rp-surface-2)!important;
  border:1px solid var(--rp-border)!important;
  border-radius:var(--rp-radius-md)!important;
  box-shadow:0 8px 32px rgba(0,0,0,.6)!important;
}
.site-header-cart .widget_shopping_cart ul.cart_list{
  background:transparent!important;
}
.site-header-cart .widget_shopping_cart ul.cart_list li{
  background:transparent!important;
  border-bottom:1px solid var(--rp-border)!important;
  color:var(--rp-text)!important;
}
.site-header-cart .widget_shopping_cart ul.cart_list li a{
  color:var(--rp-text)!important;
  font-weight:var(--rp-w-semibold);
}
.site-header-cart .widget_shopping_cart ul.cart_list li a:hover{color:var(--rp-red-500)!important}
.site-header-cart .widget_shopping_cart ul.cart_list li .amount{
  font-family:var(--rp-font-mono)!important;color:var(--rp-text-secondary)!important;
}
.site-header-cart .widget_shopping_cart .total{
  background:transparent!important;
  border-top:1px solid var(--rp-border)!important;
  color:var(--rp-text)!important;
  font-family:var(--rp-font-mono)!important;
  padding:var(--rp-space-3) var(--rp-space-4)!important;
}
.site-header-cart .widget_shopping_cart .total .amount{
  color:var(--rp-text)!important;font-weight:var(--rp-w-bold)!important;
}
/* Wrappery sekcji przycisków + total — Storefront daje im białe tło */
.site-header-cart .widget_shopping_cart .buttons,
.site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons,
.site-header-cart .widget_shopping_cart .woocommerce-mini-cart__total,
.site-header-cart .widget_shopping_cart p.total,
.site-header-cart .widget_shopping_cart p{
  background:transparent!important;
  margin:0!important;
}
.site-header-cart .widget_shopping_cart .buttons,
.site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons{
  display:flex;flex-direction:column;gap:var(--rp-space-2);
  padding:var(--rp-space-4)!important;
}
/* Buttons inside dropdown */
.site-header-cart .widget_shopping_cart .buttons a{
  background:var(--rp-red-500)!important;color:var(--rp-text-on-accent)!important;
  border:none!important;border-radius:var(--rp-radius-md)!important;
  font-family:var(--rp-font-sans)!important;font-weight:var(--rp-w-bold)!important;
  text-transform:uppercase!important;letter-spacing:var(--rp-track-wide)!important;
  padding:var(--rp-space-3) var(--rp-space-5)!important;
  transition:background var(--rp-dur) var(--rp-ease)!important;
}
.site-header-cart .widget_shopping_cart .buttons a:hover{background:var(--rp-red-400)!important}
/* Remove/× button in cart list */
.site-header-cart .widget_shopping_cart ul.cart_list li a.remove{
  color:var(--rp-text-muted)!important;background:transparent!important;
  border:none!important;font-size:1.2em!important;
}
.site-header-cart .widget_shopping_cart ul.cart_list li a.remove:hover{
  color:var(--rp-red-500)!important;background:transparent!important;
}
