/* =========================================================================
   WOOCOMMERCE — košík, pokladňa, účet
   =========================================================================

   WooCommerce si nesie vlastné štýly písané pre svetlý web: biele dosky,
   sivé rámiky, zaoblené rohy. Na tomto podklade z toho boli svietiace
   obdĺžniky. Tento súbor ich vracia do tej istej reči ako zvyšok webu —
   ostré hrany, oceľové dosky, jedna modrá na to, čo treba urobiť ďalej.

   Načítava sa len na stránkach obchodu (pozri functions.php).
   ========================================================================= */

/* Šablóna obchodu nie je z Elementora, takže si odsadenie pod pevnú
   hlavičku musí urobiť sama. */
.woocommerce-page .site-main,
.woocommerce-page main,
.woocommerce-page .page-content {
	max-width: 1120px;
	margin-inline: auto;
	padding: clamp(96px, 12vh, 150px) clamp(20px, 4vw, 48px) clamp(72px, 10vh, 120px);
}

.woocommerce-page .woocommerce-breadcrumb {
	font-size: .8125rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--rf-label);
	margin-bottom: var(--rf-4);
}

.woocommerce-page .woocommerce-breadcrumb a { color: var(--rf-ice-quiet); }
.woocommerce-page .woocommerce-breadcrumb a:hover { color: var(--rf-blue-hot); }

.woocommerce-page h1,
.woocommerce-page h2,
.woocommerce-page h3,
.woocommerce-page .woocommerce-column__title,
.woocommerce-page #order_review_heading {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .01em;
	color: var(--rf-ice);
}

.woocommerce-page h1 { font-size: clamp(2.2rem, 5vw, 3.4rem); margin-bottom: var(--rf-4); }
.woocommerce-page h2,
.woocommerce-page #order_review_heading { font-size: 1.7rem; margin: var(--rf-5) 0 var(--rf-3); }
.woocommerce-page h3 { font-size: 1.3rem; }

/* --- oznamy ---
   Predvolené sú svetlosivé s farebným prúžkom. Tu je z nich oceľová doska
   s modrou hranou — tá istá reč ako karty vĺn. */
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error,
.woocommerce-page .wc-block-components-notice-banner {
	background: var(--rf-steel-900);
	border: 1px solid var(--rf-steel-700);
	border-top: 2px solid var(--rf-blue);
	border-radius: 0;
	color: var(--rf-ice-dim);
	padding: var(--rf-3) var(--rf-4);
}

.woocommerce-page .woocommerce-error { border-top-color: #E5555F; }

/* Ikona oznamu je absolútne na 1.5em zľava — bez tohto odsadenia sedela
   na prvom písmene („✓odukt …“). */
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error { padding-left: 3.5em; }

.woocommerce-page .woocommerce-message::before,
.woocommerce-page .woocommerce-info::before,
.woocommerce-page .woocommerce-error::before { color: var(--rf-blue-hot); }

/* --- tlačidlá ---
   Jedno hlavné na obrazovku: „Prejsť k pokladni“ a „Objednať“ sú modré,
   všetko ostatné je len obrys. */
.woocommerce-page .button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce-page a.button,
.woocommerce-page .wc-block-components-button {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	border-radius: 0;
	padding: 15px var(--rf-4);
	background: transparent;
	color: var(--rf-ice);
	border: 1px solid var(--rf-steel-500);
	transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.woocommerce-page .button:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover {
	border-color: var(--rf-blue-hot);
	color: #fff;
}

/* `.woocommerce a.button.alt` z WooCommerce má vyššiu špecificitu (0,3,1)
   — bez `.woocommerce` v selektore bolo tlačidlo v košíku fialové. */
.woocommerce-page .checkout-button,
.woocommerce-page .woocommerce a.button.alt,
.woocommerce-page .woocommerce button.button.alt,
.woocommerce-page #place_order,
.woocommerce-page .button.alt,
.woocommerce-page .wc-block-components-checkout-place-order-button {
	background: var(--rf-blue-fill);
	border-color: rgba(160, 205, 255, .5);
	color: #fff;
}

.woocommerce-page .checkout-button:hover,
.woocommerce-page .woocommerce a.button.alt:hover,
.woocommerce-page .woocommerce button.button.alt:hover,
.woocommerce-page #place_order:hover,
.woocommerce-page .button.alt:hover {
	background: var(--rf-blue-hot);
	color: var(--rf-night);
}

/* --- polia formulárov --- */
.woocommerce-page input[type="text"],
.woocommerce-page input[type="email"],
.woocommerce-page input[type="tel"],
.woocommerce-page input[type="password"],
.woocommerce-page input[type="number"],
.woocommerce-page textarea,
.woocommerce-page select,
.woocommerce-page .select2-container .select2-selection {
	background: var(--rf-night);
	border: 1px solid var(--rf-steel-700);
	border-radius: 0;
	color: var(--rf-ice);
	padding: 12px var(--rf-3);
	font-family: Inter, system-ui, sans-serif;
	min-height: 46px;
}

.woocommerce-page input:focus,
.woocommerce-page textarea:focus,
.woocommerce-page select:focus {
	outline: 2px solid var(--rf-blue-hot);
	outline-offset: 1px;
}

.woocommerce-page label,
.woocommerce-page .woocommerce-input-wrapper { color: var(--rf-ice-dim); }

.woocommerce-page .required { color: var(--rf-blue-hot); }

/* --- tabuľky košíka a rekapitulácie --- */
.woocommerce-page table.shop_table {
	background: var(--rf-deep);
	border: 1px solid var(--rf-steel-700);
	border-radius: 0;
	border-collapse: collapse;
	color: var(--rf-ice-dim);
}

.woocommerce-page table.shop_table th {
	font-family: Inter, system-ui, sans-serif;
	font-size: .75rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--rf-label);
	border-bottom: 1px solid var(--rf-steel-700);
	padding: var(--rf-3);
}

.woocommerce-page table.shop_table td {
	border-top: 1px solid var(--rf-steel-700);
	padding: var(--rf-3);
}

.woocommerce-page table.shop_table .order-total .amount,
.woocommerce-page .cart-subtotal .amount { color: var(--rf-ice); font-weight: 700; }

.woocommerce-page .cart_totals,
.woocommerce-page .woocommerce-checkout-review-order,
.woocommerce-page .woocommerce-order-details,
.woocommerce-page .woocommerce-customer-details { margin-top: var(--rf-4); }

/* --- účet --- */
.woocommerce-page .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 var(--rf-4);
	padding: 0;
	border-top: 1px solid var(--rf-steel-700);
}

.woocommerce-page .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--rf-steel-700);
}

.woocommerce-page .woocommerce-MyAccount-navigation a {
	display: block;
	padding: 12px 0;
	color: var(--rf-ice-dim);
	text-decoration: none;
	letter-spacing: .04em;
	text-transform: uppercase;
	font-size: .875rem;
}

.woocommerce-page .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-page .woocommerce-MyAccount-navigation a:hover { color: var(--rf-blue-hot); }

/* Prázdny košík je najčastejší pohľad pred spustením predaja — nemá
   pôsobiť ako chyba. */
.woocommerce-page .cart-empty {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-size: 1.6rem;
	text-transform: uppercase;
	color: var(--rf-ice);
	text-align: center;
}

.woocommerce-page .return-to-shop { text-align: center; }