/* ============================================================
   theme.css — kolory, cienie, obramowania
   Zmień ten plik żeby zmienić wygląd całego sklepu
   ============================================================ */

/* ===== GŁÓWNY KOLOR MARKI ===== */
:root {
    --color-brand:        rgb(80, 60, 2);
    --color-brand-light:  #f6f2eb;
    --color-brand-border: #e5e7eb;
    --color-accent:       #00ff00;   /* aktywny rozmiar / aktywny kolor */
    --color-link:         #3b82f6;   /* linki, aktywne filtry */
    --color-price:        #3b82f6;   /* cena produktu */
    --color-text:         rgb(80, 60, 2);
    --color-text-muted:   #888;
    --color-bg:           #ffffff;
    --color-bg-light:     #f6f2eb;
    --color-border:       #e5e7eb;
    --color-border-light: #f6f2eb;
    --shadow-sm:          0 1px 1px rgba(0, 0, 0, 0.08);
    --shadow-md:          0 4px 12px rgba(0, 0, 0, 0.1);
    --shadow-hover:       0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --radius-sm:          8px;
    --radius-md:          12px;
    --radius-full:        999px;
}

/* ===== KOLORY TEKSTU ===== */
.menu-scroll a,
.cat-item-text p,
.carousel-arrow,
.topbar,
.mobile-menu a,
.footer,
.price,
.slider,
.text-arrow,
.search-input,
.sub-item a,
.categories-grid a,
.pdright,
.button_size,
.icon-btn {
    color: var(--color-brand);
    text-decoration: none;
}

/* ===== CIENIE I OBRAMOWANIA ===== */
.search-wrap,
.button_size {
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
}

.cat-img {
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
}

.cat-img:hover {
    border: 1px solid var(--color-border-light);
    box-shadow: 0 1px 1px rgba(209, 146, 107, 0.74);
}

.sub-item img {
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
}

.sub-item img:hover {
    border: 1px solid var(--color-accent);
    box-shadow: var(--shadow-sm);
}

/* ===== AKTYWNE STANY ===== */
.button_size.active {
    border: 1px solid var(--color-accent);
    box-shadow: var(--shadow-sm);
}

.thumbclick.active {
    border: 1px solid var(--color-accent);
    box-shadow: var(--shadow-sm);
}

/* ===== INPUT FOCUS ===== */
input:focus {
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
    outline: none;
}