/*
Theme Name: Storefront Child - Wstepna Konfiguracja
Theme URI: https://woocommerce.com/storefront/
Description: Potomny motyw (child theme) dla WooCommerce Storefront z wstepnie skonfigurowanymi kolorami, uklad strony glownej i stylami dla sklepu. Wymaga zainstalowanego i aktywnego motywu nadrzednego "Storefront".
Author:
Template: storefront
Version: 1.0.0
Text Domain: storefront-child
*/

/* ==========================================================================
   Wstepna paleta kolorow sklepu - zmien ponizsze wartosci na wlasne
   ========================================================================== */
:root {
	--sf-child-primary: #7f54b3;      /* kolor glowny (przyciski, linki) */
	--sf-child-primary-dark: #684090; /* hover/aktywny */
	--sf-child-dark: #1a1a1a;         /* kolor naglowka/stopki */
	--sf-child-accent: #e2b007;       /* wyroznienia, np. ceny promocyjne */
}

/* Naglowek strony */
.site-header,
.storefront-handheld-footer-bar {
	background-color: var(--sf-child-dark);
}

.site-header .site-branding .site-title a,
.site-header .site-branding .site-description {
	color: #ffffff;
}

/* Przyciski i elementy WooCommerce */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
a.button.alt,
button.button.alt,
input.button.alt {
	background-color: var(--sf-child-primary);
	color: #ffffff;
	border-radius: 4px;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
a.button.alt:hover {
	background-color: var(--sf-child-primary-dark);
}

/* Ceny i promocje */
.woocommerce ins {
	background: transparent;
	color: var(--sf-child-accent);
	font-weight: 700;
}

.price {
	color: var(--sf-child-primary-dark);
	font-weight: 600;
}

/* Stopka */
#colophon {
	background-color: var(--sf-child-dark);
	color: #f1f1f1;
}

#colophon a {
	color: #ffffff;
}

/* Sekcje na stronie glownej (homepage hooks Storefront) */
.storefront-product-section {
	margin-bottom: 3em;
}

.storefront-product-section .section-title {
	text-align: center;
	margin-bottom: 1.5em;
}