/* ============================================================================
   Harmonogram 1:1 z OFF — WŁASNE dodatki do zawężonych arkuszy OFF (harmonogram-off.css):
   osadzenie w motywie (pełna szerokość okna jak iframe na offcamera.pl), fokus z klawiatury,
   elementy interaktywne bez zmiany wyglądu, okno przeniesione do <body>, minione terminy.
   Wyglądu oryginału NIE zmieniać tutaj — różnice mierzy var/harmonogram/probe.mjs + diff.py.
   ============================================================================ */
.hm-off-wrap { margin-inline: calc(50% - 50vw); width: 100vw; }
.hm-off { position: relative; }
.hm-off .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/* fokus tylko z klawiatury (WCAG 2.4.7); na czarnym pasku biały */
.hm-off [role="button"]:focus-visible, .hm-off button:focus-visible, .hm-off a:focus-visible,
.hm-off input:focus-visible, .hm-off [tabindex="0"]:focus-visible { outline: 3px solid #1a73e8; outline-offset: 2px; }
.hm-off .filters :focus-visible, .hm-off .mobile-navbar :focus-visible { outline-color: #fff; }
.hm-off .repertoire:focus-visible { outline-offset: -3px; }
.hm-off .table-container:focus-visible { outline-offset: -3px; }

/* przyciski w miejscu <span>/<i> oryginału (serce ulubionych): bez chromu przeglądarki */
.hm-off .hm-btn-reset { appearance: none; -webkit-appearance: none; background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; cursor: pointer; }
/* ikona Font Awesome jako przycisk (stepper liczby biletów w oknie: OFF ma <i onclick>): bez resetu
   fontu, bo .fas ustawia rodzinę i wagę glifu; marginesy zostawiamy regułom .plusminus z OFF */
.hm-off .hm-icon-btn { appearance: none; -webkit-appearance: none; background: none; border: 0; padding: 0; color: inherit; cursor: pointer; }
/* Bootstrap 3 (zawężony) daje `button { font: inherit }` o wyższej specyficzności niż `.fas` — glif wraca
   przez jawne wskazanie rodziny Font Awesome 5 (ładowanej w base motywu) */
.hm-off button.hm-icon-btn.fas { font-family: "Font Awesome 5 Free"; font-weight: 900; line-height: 1; text-align: start; vertical-align: top; }   /* jak <i class="fas"> w OFF: line-height 1 (FA), bez wyśrodkowania; vertical-align: top — <button> ma inny punkt bazowy niż <i> (+1 px na wiersz steppera, pomiar probe.mjs) */
/* okno „Bilet został dodany do koszyka": KUP TERAZ jest u nas linkiem (OFF: div onclick=goToCart) — ten sam blokowy układ */
.hm-off .modal-buttons a.modal-rep.button { display: block; }
.hm-off .button-buy[aria-busy="true"], .hm-off .button-book[aria-busy="true"] { cursor: progress; }
/* podpowiedź „Pula rezerwacji została wyczerpana" (OFF: tylko :hover) — także z klawiatury */
.hm-off .gotooltip:focus-within .tooltiptext { visibility: visible; }
.hm-off [data-fav-termin][aria-pressed="true"] .heart-icon { fill: #000; stroke: #000; stroke-width: 1px; }

/* koszyk: ikona OFF (tło CSS) + link na całej powierzchni */
.hm-off .cartIcon { position: relative; }
.hm-off .hm-cart-link { position: absolute; inset: 0; display: block; }

/* minione terminy: oryginał daje opacity .5 na całym bloku, co obniża kontrast tekstu
   poniżej 4,5:1 (WCAG 1.4.3). Rozjaśniamy TYLKO tło (warstwa pod treścią), tekst zostaje czarny. */
.hm-off .hm-past .repertoire { position: relative; }
.hm-off .hm-past .repertoire::before { content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, 0.5); pointer-events: none; z-index: 0; }
.hm-off .hm-past .repertoire > * { position: relative; z-index: 1; }
.hm-off .hm-past .repertoire { border-left-color: rgba(0, 0, 0, 0.25) !important; }

/* lista dni na telefonie i panel filtrów: stany sterowane skryptem (jak jQuery slideDown/menushow) */
.hm-off .filtrowanie.hm-open { display: flex !important; }
.hm-off .hm-day-hidden { display: none !important; }

/* podpowiedzi wyszukiwarki renderujemy w kolumnie pola (oryginał: <ul> na końcu <body>) */
.hm-off .ui-autocomplete { position: absolute; z-index: 12001; }
.hm-off .ui-autocomplete[hidden] { display: none; }

/* okno i tło: skrypt przenosi je do <body> w kontenerze .hm-off.hm-off-modal (arkusz OFF
   zawężony do .hm-off musi je dalej widzieć); kontener nie może niczego przesuwać */
.hm-off.hm-off-modal { position: static; height: auto; overflow: visible; }
body.hm-dialog-open { overflow: hidden; }

/* ── przecieki motywu do kontenera OFF (zmierzone sondą 2026-11-02) ───────────────────
   Baza WSF ładuje siatkę Bootstrapa 5 (bootstrap-grid): `.row{display:flex}` i `.row>*{width:100%;
   max-width:100%;flex-shrink:0}` nie mają odpowiednika w zawężonym Bootstrapie 3, więc przeciekały
   (pasek dni stawał się flexem, kolumna `.buttons` dostawała margin auto). :where() = ta sama
   specyficzność co reguły BS5 (0,1,0), a arkusz jest późniejszy — wygrywa, nie bijąc kolumn BS3. */
.hm-off :where(.row) { display: block; flex-wrap: nowrap; margin-top: 0; }
.hm-off :where(.row > *) { width: auto; max-width: none; flex-shrink: 1; padding-right: 15px; padding-left: 15px; }
.hm-off img { max-width: none; }
.hm-off :where(.row) { gap: normal; }
.hm-off .row { gap: normal; }                 /* motyw: .site-main .row { gap: 0 } */
.hm-off .sidebar { margin-bottom: 0; }        /* motyw: .sidebar { margin-bottom: 1.5rem } */
/* OFF celuje w <li onclick="dropdownMenu(this)">; u nas <li> bez atrybutu onclick (obsługa w skrypcie) */
.hm-off .toggle li[data-mobile-dropdown] { align-items: center; display: flex; cursor: pointer; width: 100%; background: #000; }
/* okno nad przyklejonym nagłówkiem motywu (WSF: .site-header z-index 9999, szuflada 10001) */
.hm-off #modal-background { z-index: 10050; }
.hm-off #modal-box { z-index: 10051; }

/* SB-4762 — pasek dni: kontener .buttons ma (jak OFF) inline overflow-x: auto, a pasek .slider stałe
   1240 px, więc przewija się zawsze; motyw wsf maluje paski przewijania 15 px z czarnym suwakiem
   (1:1 ze starą stroną) i ten pasek zasłaniał dolną połowę dat. Pasek ukryty — dni przewijają
   strzałki, kółko/gładzik i fokus z klawiatury (przewinięcie do elementu działa dalej). */
.hm-off .calendar .buttons { scrollbar-width: none; -ms-overflow-style: none; }
.hm-off .calendar .buttons::-webkit-scrollbar { display: none; width: 0; height: 0; }
/* przeciąganie osi myszą (skrypt harmonogramu): w trakcie ruchu kursor „łapki" */
.hm-off .table-container.active, .hm-off .table-container.active * { cursor: grabbing; }

/* SB-4762 — partner sekcji na dole okna terminu (Repertuar (dane dodatkowe) → Sekcje): tekst, pod nim
   logotypy w jednej linii (czarne, bez tła — wyrównanie wysokością, szerokie ograniczone szerokością) */
.hm-off .modal-add-info.hm-partner { flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 15px; overflow: visible; }
.hm-off .hm-partner .hm-partner-text { margin: 0; padding: 0; height: auto; min-height: 0; overflow: visible; }
.hm-off .hm-partner-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.hm-off .hm-partner-logos img { display: block; height: 40px; width: auto; max-width: 160px; object-fit: contain; }

/* SB-4762 — okno terminu od 990 px (próg układu dwukolumnowego OFF; węższe: kolumny jedna pod drugą
   i przewijanie okna jak w OFF) bez paska w środku i z kolorem kolumny do samego dołu:
   warstwa `.hm-layer` (skrypt, tylko przy otwartym oknie) przewija się jak strona, okno ma naturalną
   wysokość (OFF: max-height 70% + lewa kolumna 79vh), a kolumny stoją w flexie o wspólnej wysokości
   (OFF: kolumna z kolorem pływała i kończyła się na swojej treści). Tablet i telefon bez zmian. */
@media (min-width: 990px) {
    /* kontener ma klasę .hm-off, a arkusz OFF przenosi na nią styl body (background-color #fff) — na całym
       ekranie zasłaniał stronę i podkład dawał jednolitą szarość; warstwa musi być przezroczysta */
    .hm-off-modal.hm-layer { position: fixed; inset: 0; overflow-y: auto; overscroll-behavior: contain; z-index: 10050; background: transparent; height: auto; }
    .hm-off-modal.hm-layer #modal-box { position: relative; top: auto; left: auto; right: auto; max-height: none; overflow: visible; margin-bottom: 16px; }
    .hm-off #modal-box .modal-box-content { display: flex; flex-direction: row-reverse; align-items: stretch; max-height: none; overflow: visible; }
    .hm-off #modal-box .modal-right { float: none; flex: 0 0 35%; width: 35%; height: auto; }
    .hm-off #modal-box .modal-left { flex: 1 1 65%; width: 65%; margin-right: 0; height: auto; min-height: 0; }
}

/* SB-4762 (2026-11-12, uwaga 4-26533): link w komunikatach okna („…tylko dla zalogowanych użytkowników zaloguj się",
   adnotacje sali) ma wyglądać na link — OFF zdejmował podkreślenie (`.modal-buttons.info a { text-decoration: none }`) */
.hm-off .modal-buttons.info a { text-decoration: underline; text-underline-offset: 3px; }
.hm-off .modal-buttons.info a:hover, .hm-off .modal-buttons.info a:focus-visible { text-decoration-thickness: 2px; }
