/*
Theme Name: TSI Torebki
Theme URI: https://torebkisklep24h.pl/
Author: TSI
Description: Lekki motyw WooCommerce dla TorebkiSklep24h. Bez zależności od Hello Elementor i Elementora. Współpracuje z TSI SCF Torebki.
Version: 1.0.1
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: tsi-torebki
*/

:root {
    --tsi-theme-max: 1200px;
    --tsi-theme-text: #151515;
    --tsi-theme-muted: #666;
    --tsi-theme-border: #e8e8e8;
    --tsi-theme-accent: #ef6fa8;
    --tsi-theme-bg: #fff;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--tsi-theme-bg);
    color: var(--tsi-theme-text);
    font-family: Poppins, Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}
img, picture, video, iframe, svg { max-width: 100%; }
img { height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
    background: #f1f1f1;
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

.tsi-theme-main,
.tsi-theme-container {
    width: min(calc(100% - 32px), var(--tsi-theme-max));
    margin-inline: auto;
}
.tsi-theme-main { padding: 36px 0 64px; }
.tsi-theme-main--wide { width: min(calc(100% - 32px), var(--tsi-theme-max)); max-width: var(--tsi-theme-max); margin-inline: auto; padding-top: 0; }
.tsi-theme-entry { max-width: 1000px; margin-inline: auto; }
.tsi-theme-entry-header { margin-bottom: 26px; }
.tsi-theme-entry-title { margin: 0; font-size: clamp(28px, 4vw, 46px); line-height: 1.15; }
.tsi-theme-entry-content > :first-child { margin-top: 0; }
.tsi-theme-entry-content > :last-child { margin-bottom: 0; }

/* Fallback header/footer are visible only when the SCF chrome module is disabled. */
.tsi-theme-fallback-header { border-bottom: 1px solid var(--tsi-theme-border); background: #fff; }
.tsi-theme-fallback-header__inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}
.tsi-theme-fallback-brand { display: inline-flex; align-items: center; text-decoration: none; font-weight: 800; font-size: 22px; }
.tsi-theme-fallback-brand img { max-height: 54px; width: auto; }
.tsi-theme-fallback-nav ul { list-style: none; display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin: 0; padding: 0; }
.tsi-theme-fallback-nav a { text-decoration: none; font-weight: 600; }
.tsi-theme-fallback-nav a:hover { color: var(--tsi-theme-accent); }

.tsi-theme-fallback-footer { margin-top: 50px; border-top: 1px solid var(--tsi-theme-border); background: #111; color: #fff; }
.tsi-theme-fallback-footer__inner { padding: 30px 0; display: flex; align-items: center; justify-content: space-between; gap: 25px; flex-wrap: wrap; }
.tsi-theme-fallback-footer a { color: inherit; }
.tsi-theme-fallback-footer ul { list-style: none; display: flex; gap: 18px; flex-wrap: wrap; margin: 0; padding: 0; }

/* Neutral WooCommerce fallback. Main product/cart/checkout visuals are provided by TSI SCF Torebki when enabled. */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    border-radius: 4px;
}
.woocommerce .button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background: var(--tsi-theme-accent);
}
.woocommerce .button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
    background: #d95f95;
}

.tsi-theme-empty { padding: 60px 0; text-align: center; }

@media (max-width: 800px) {
    .tsi-theme-main, .tsi-theme-container { width: min(calc(100% - 24px), var(--tsi-theme-max)); }
    .tsi-theme-main { padding: 24px 0 44px; }
    .tsi-theme-fallback-header__inner { min-height: 66px; flex-direction: column; align-items: flex-start; padding: 12px 0; }
    .tsi-theme-fallback-nav ul { gap: 12px 18px; }
}


/* === 1.0.1: stały kontener 1200 px po wyłączeniu Elementora ===
   Elementor wcześniej nadawał szerokość Boxed. Po jego wyłączeniu SCF i część
   shortcode'ów dostawała width:100% / max-width:none. Ten guard przejmuje tę rolę. */
:root{
    --tsi-theme-max:1200px;
    --tsi-woo-max:1200px;
    --tsi-chrome-max:1200px;
}

@media (min-width:821px){
    .tsi-theme-main,
    .tsi-theme-main--wide,
    .tsi-theme-container,
    body.tsi-home-scf-active .tsi-scf-home-main,
    .tsi-scf-home-main,
    .tsi-scf-home-root,
    .tsi-woo-shell{
        width:min(calc(100% - 32px),1200px)!important;
        max-width:1200px!important;
        margin-left:auto!important;
        margin-right:auto!important;
        box-sizing:border-box!important;
    }

    /* Moduły strony głównej wypełniają kontener, a nie całe okno przeglądarki. */
    .tsi-scf-home-root .tsi-home-module{
        width:100%!important;
        max-width:100%!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }

    /* Header i footer mają pełne tło, ale ich treść zostaje w 1200 px. */
    .tsi-scf-chrome-inner,
    .tsi-theme-fallback-header__inner,
    .tsi-theme-fallback-footer__inner{
        width:min(calc(100% - 32px),1200px)!important;
        max-width:1200px!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }

    /* Szablony sprzedażowe pozostają lekko węższe, jak wcześniej w Elementorze. */
    .tsi-woo-product .tsi-bag-sale,
    .tsi-woo-product .tsi-bag-legacy,
    .tsi-bag-sale,
    .tsi-bag-legacy{
        width:100%!important;
        max-width:1180px!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }

    /* Grid i bannery mają wypełnić wyłącznie kontener strony. */
    .tsi-scf-home-root .sbse-wrap,
    .tsi-scf-home-root .tsi-home-module--banner,
    .tsi-woo-shell .sbse-wrap{
        width:100%!important;
        max-width:100%!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }
}

@media (max-width:820px){
    .tsi-scf-home-main,
    .tsi-scf-home-root,
    .tsi-woo-shell,
    .tsi-theme-main,
    .tsi-theme-main--wide{
        width:100%!important;
        max-width:100%!important;
    }
}
