/* ============================================================
   SPIRO PILATES — grafik.css
   Strona grafiku zajęć z widżetem Fitssey
   Umieść w: your-theme/assets/css/pages/grafik.css
   ============================================================ */

.spiro-grafik {
    padding: 72px 0 100px;
    font-family: var(--font-body);
    background: var(--bg);
}

/* ── Nagłówek ──────────────────────────────────────────────── */
.sg-header {
    margin-bottom: 48px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--line);
}

.sg-header__label {
    font-size: 10px;
    letter-spacing: 0.38em;
    text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 12px;
}

.sg-header__title {
    font-family: var(--font-title);
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 400;
    color: var(--text);
    margin: 0 0 16px;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.sg-header__title em {
    font-style: italic;
    color: var(--muted);
}

.sg-header__sub {
    font-size: 15px;
    line-height: 1.8;
    color: var(--muted);
    margin: 0;
}

/* ── Widget wrapper ────────────────────────────────────────── */
.sg-widget {
    width: 100%;
    min-height: 600px;
}

/* Fitssey widget — ogólne ostylowanie kontenera */
lb-schedule-widget {
    display: block;
    width: 100%;
    font-family: var(--font-body) !important;
}

/* ── Nadpisanie kolorów Fitssey przez CSS vars ─────────────── */
/* Fitssey używa własnych CSS custom properties */
:root {
    --lb-primary-color:        #10221b;   /* --cta */
    --lb-secondary-color:      #dff57b;   /* --accent */
    --lb-background-color:     #f7f3ea;   /* --bg */
    --lb-text-color:           #10221b;   /* --text */
    --lb-border-color:         rgba(16,34,27,0.25); /* --line */
    --lb-font-family:          system-ui, -apple-system, sans-serif;
}

/* Nadpisanie przez selektory na elementy Fitssey */
lb-schedule-widget,
lb-schedule-widget * {
    font-family: var(--font-body) !important;
}

/* Tło głównego kontenera widżetu */
lb-schedule-widget > div,
.lb-widget,
.lb-schedule {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Nagłówek z zakładkami (GRAFIK / CENNIK / PROFIL) */
.lb-widget__header,
.lb-tabs,
.lb-nav {
    background: var(--bg) !important;
    border-bottom: 1px solid rgba(16,34,27,0.25) !important;
    border-radius: 0 !important;
}

/* Aktywna zakładka */
.lb-tab--active,
.lb-nav__item--active {
    color: #10221b !important;
    border-bottom: 2px solid #10221b !important;
    background: transparent !important;
}

/* Filtry (Data, Klasa, Nauczyciel, Lokalizacja) */
.lb-filters,
.lb-filter {
    background: var(--bg) !important;
    border: 1px solid rgba(16,34,27,0.25) !important;
    border-radius: 0 !important;
    font-family: var(--font-body) !important;
    color: #10221b !important;
}

/* Wiersze dni */
.lb-day,
.lb-schedule__day {
    background: #ffffff !important;
    border: 1px solid rgba(16,34,27,0.15) !important;
    border-radius: 0 !important;
    margin-bottom: 8px !important;
}

/* Przycisk "Zapisz się" */
.lb-btn,
.lb-button,
button[class*="lb-"] {
    background: #dff57b !important;
    color: #10221b !important;
    border: 1px solid #dff57b !important;
    border-radius: 40px !important;
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    transition: background 0.25s !important;
}

.lb-btn:hover,
.lb-button:hover,
button[class*="lb-"]:hover {
    background: #10221b !important;
    color: #ffffff !important;
    border-color: #10221b !important;
}