/* ═══════════════════════════════════════════════════
   ARIO GLOBAL STYLES — cała witryna
   Plik: /wp-content/themes/astra-child/assets/css/ario-global.css
   Wersja: 1.0 — Transformative Teal 2026
   Ładowany: globalnie na każdej podstronie
═══════════════════════════════════════════════════ */

@font-face {
  font-family: 'Syne';
  src: url('/fonts/Syne-VariableFont_wght.woff2') format('woff2');
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: 'DM Sans';
  src: url('/fonts/DMSans-VariableFont.woff2') format('woff2');
  font-weight: 300 500;
  font-display: swap;
}

/* ── TOKENY BRANDOWE ── */
:root {
  --c-bg:       #f2f7f7;
  --c-ink:      #0a1a1a;
  --c-mid:      #4a6060;
  --c-accent:   #0D6E6E;
  --c-accent2:  #19B8A0;
  --c-gold:     #C8963E;
  --c-white:    #ffffff;
  --c-border:   #d8eaea;
  --c-tag:      #e8f5f5;
  --ff-display: 'Syne', sans-serif;
  --ff-body:    'DM Sans', sans-serif;
  --r:          14px;
  --r-lg:       24px;
  --shadow-sm:  0 2px 12px rgba(13,110,110,.08);
  --shadow-md:  0 8px 40px rgba(13,110,110,.14);
  --shadow-lg:  0 20px 60px rgba(13,110,110,.18);
}

/* ── TYPOGRAFIA BAZOWA ── */
body {
  font-family: var(--ff-body) !important;
  color: var(--c-ink) !important;
  background-color: var(--c-bg) !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.woocommerce-loop-product__title,
.product_title {
  font-family: var(--ff-display) !important;
  color: var(--c-ink);
  line-height: 1.15 !important;
}

p, li, td, th, label, input, textarea, select {
  font-family: var(--ff-body) !important;
}

a {
  color: var(--c-accent);
  transition: color .15s;
}
a:hover {
  color: #0a5858;
}

/* ── PRZYCISKI GLOBALNE ── */
.ast-button,
.button,
button[type="submit"],
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  font-family: var(--ff-display) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  background: var(--c-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  padding: 12px 24px !important;
  transition: background .15s, transform .15s !important;
  cursor: pointer !important;
}
.ast-button:hover,
.button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: #0a5858 !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

/* Przycisk alt / secondary */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt {
  background: var(--c-gold) !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: #a8782e !important;
}

/* ── INPUTY I FORMULARZE ── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
input[type="password"],
input[type="url"],
textarea,
select,
.woocommerce .input-text {
  font-family: var(--ff-body) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--r) !important;
  padding: 12px 16px !important;
  color: var(--c-ink) !important;
  background: var(--c-white) !important;
  transition: border-color .15s, box-shadow .15s !important;
  outline: none !important;
}
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus,
.woocommerce .input-text:focus {
  border-color: var(--c-accent) !important;
  box-shadow: 0 0 0 3px rgba(13,110,110,.12) !important;
}

/* ── BREADCRUMBS ── */
.ast-breadcrumbs,
.woocommerce-breadcrumb {
  font-family: var(--ff-body) !important;
  font-size: 13px !important;
  color: var(--c-mid) !important;
}
.ast-breadcrumbs a,
.woocommerce-breadcrumb a {
  color: var(--c-accent) !important;
}

/* ── SIDEBAR ── */
.widget-title,
.widgettitle {
  font-family: var(--ff-display) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  border-bottom: 2px solid var(--c-accent) !important;
  padding-bottom: 8px !important;
  margin-bottom: 16px !important;
}

/* ── WOOCOMMERCE — KARTY PRODUKTÓW ── */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: var(--c-white) !important;
  border-radius: var(--r-lg) !important;
  border: 1px solid var(--c-border) !important;
  box-shadow: var(--shadow-sm) !important;
  overflow: hidden !important;
  transition: transform .25s, box-shadow .25s !important;
  padding: 0 !important;
}
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-md) !important;
}

/* Nazwa produktu */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--ff-display) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--c-ink) !important;
  padding: 16px 16px 4px !important;
}

/* Cena */
.woocommerce ul.products li.product .price,
.woocommerce .price {
  color: var(--c-accent) !important;
  font-family: var(--ff-display) !important;
  font-weight: 700 !important;
}
.woocommerce ul.products li.product .price del {
  color: var(--c-mid) !important;
  opacity: .7 !important;
}

/* Przycisk "Do koszyka" */
.woocommerce ul.products li.product .button {
  margin: 0 16px 16px !important;
  width: calc(100% - 32px) !important;
  display: block !important;
  text-align: center !important;
}

/* Odznaka "Sale" */
.woocommerce span.onsale {
  background: var(--c-accent) !important;
  color: #fff !important;
  font-family: var(--ff-display) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 100px !important;
  min-height: auto !important;
  min-width: auto !important;
  padding: 4px 10px !important;
  line-height: 1.4 !important;
}

/* ── WOOCOMMERCE — STRONA PRODUKTU ── */
.woocommerce div.product .product_title {
  font-size: clamp(28px, 4vw, 44px) !important;
}
.woocommerce div.product p.price {
  font-size: 28px !important;
  color: var(--c-accent) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--c-accent) !important;
  border-top: 2px solid var(--c-accent) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--ff-display) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
}

/* ── WOOCOMMERCE — KOSZYK I CHECKOUT ── */
.woocommerce table.shop_table {
  border: 1px solid var(--c-border) !important;
  border-radius: var(--r-lg) !important;
  overflow: hidden !important;
}
.woocommerce table.shop_table th {
  font-family: var(--ff-display) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--c-mid) !important;
  background: var(--c-tag) !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--c-gold) !important;
  border-radius: 100px !important;
  font-family: var(--ff-display) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
}

/* ── WOOCOMMERCE — KOMUNIKATY / NOTICES ── */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--c-accent) !important;
  background: var(--c-tag) !important;
  color: var(--c-ink) !important;
}
.woocommerce-error {
  border-top-color: #dc2626 !important;
}

/* ── PAGINACJA ── */
.page-numbers a,
.page-numbers span,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  font-family: var(--ff-display) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  border: 1px solid var(--c-border) !important;
  color: var(--c-mid) !important;
  transition: all .15s !important;
}
.page-numbers .current,
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--c-accent) !important;
  color: #fff !important;
  border-color: var(--c-accent) !important;
}
.page-numbers a:hover,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--c-tag) !important;
  color: var(--c-accent) !important;
  border-color: var(--c-accent) !important;
}

/* ── STOPKA ── */
.site-footer,
.ast-small-footer {
  background: var(--c-ink) !important;
  color: rgba(255,255,255,.6) !important;
  font-family: var(--ff-body) !important;
}
.site-footer a,
.ast-small-footer a {
  color: rgba(255,255,255,.6) !important;
  transition: color .15s !important;
}
.site-footer a:hover,
.ast-small-footer a:hover {
  color: var(--c-accent2) !important;
}

/* ── SCROLLBAR (opcjonalnie, Chromium) ── */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--c-bg); }
::-webkit-scrollbar-thumb { background: var(--c-accent); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #0a5858; }

/* ── SELECTION ── */
::selection {
  background: rgba(13,110,110,.2);
  color: var(--c-ink);
}

/* ── FOCUS VISIBLE — dostępność ── */
:focus-visible {
  outline: 2px solid var(--c-accent) !important;
  outline-offset: 3px !important;
}
