/* ============================================================
   SZABLON STRONY — arkusz wdrożeniowy (per klient)
   ------------------------------------------------------------
   ⛔ KOLORY SĄ KLIENTA, NIE DIRELO. Strona buduje markę
     gospodarza. Wartości niżej to placeholdery do podmiany.

   ⚠ @import musi wyprzedzać wszystkie REGUŁY. Komentarze przed
     nim są dozwolone i nie psują niczego - blok powyżej jest OK.
     Gdyby font się nie wczytał, NIE MA komunikatu o błędzie,
     więc objaw to "wygląda jak przed zmianą".

   ⚠ To NIE jest ten sam plik co CSS Booking Engine. Inne nazwy
     zmiennych, inne miejsce w panelu → notatka 32.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');


/* ============================================================
   1. KOLORY — jedyne miejsce do edycji przy kliencie
   Szablon jest w 100% sterowany zmiennymi. Podmiana tego bloku
   przemalowuje stronę, widget rezerwacji, kalendarz, przyciski,
   ikony i pasek cookies.
   ============================================================ */

:root {

  /* ---- ⭐ PIĘĆ WARTOŚCI DO PODMIANY. Reszta liczy się sama ----
     ⚠ Kolor wiodący podaję JAKO TRÓJKĘ R, G, B - nie jako hex.
       Szablon potrzebuje go w obu postaciach, a trzymanie dwóch
       zapisów tego samego koloru gwarantuje, że kiedyś się
       rozjadą. Tu jest jedno źródło prawdy. */
  --maincolor1_rgba:  47, 93, 80;   /* kolor wiodący obiektu, R, G, B */
  --maincolor2:       #1E3F36;      /* ciemniejszy wariant, hover     */
  --txtcolor1:        #1C1F24;      /* główny kolor tekstu            */
  --bgLight:          #FFFFFF;      /* tło strony, widget, cookies    */
  --bgcolor2:         #F6F7F5;      /* stopka                         */

  /* ---- poniżej nic nie ruszać przy zwykłym wdrożeniu ---- */

  /* kolor wiodący wyprowadzony z trójki wyżej */
  --maincolor1:       rgb(var(--maincolor1_rgba));
  --icons1:           var(--maincolor1);
  --price:            var(--maincolor1);

  /* tekst i tła */
  --txtcolor2:        #FFFFFF;              /* tekst na ciemnym tle */
  --bgBox:            var(--bgLight);       /* karty ofert i sekcje */
  --bgcolor2Contrast: var(--txtcolor1);     /* tekst w stopce       */
  --bgcolor2Border:   #E2E5E1;              /* linie w stopce       */

  /* przyciski */
  --btnBackground:    var(--maincolor1);
  --btnColor:         #FFFFFF;
  --btn_hover:        var(--maincolor2);
  --hovercolor1:      #FFFFFF;

  /* ramki i elementy pomocnicze
     ⚠ --supportcolor1 istnieje TAKŻE w arkuszu Booking Engine,
       ale tam jest kolorem wiodącym. Ta sama nazwa, inna rola -
       nie kopiować wartości między plikami. */
  --bordercolor:      #DCE1E3;
  --supportcolor1:    #EDEFEC;
}

/* --- WARIANT CIEMNY (gdyby klient chciał) ---------------------
   W bloku wyżej podmienić:
     --txtcolor1: #FFFFFF;  --bgLight: #292929;
     --bgcolor2:  #292929;
   dodać osobno:  --bgBox: #121212;
   i dobrać jasny --maincolor1_rgba. Reszta przeliczy się sama.
   ⚠ Przy ciemnym --bgBox NIE dziedziczy już z --bgLight -
     trzeba go podać ręcznie.
   ------------------------------------------------------------ */


/* ============================================================
   2. TYPOGRAFIA
   html ma font-size: 10px, wszystko liczone w rem — jedna
   zmiana tutaj skaluje CAŁĄ stronę proporcjonalnie.
   ============================================================ */

body,
.btn,
#iai_book_form button[type="submit"] {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

/* opcjonalnie: cała strona o ~5% większa
html { font-size: 10.5px; }
*/


/* ============================================================
   3. ODTEMPLATOWANIE — pięć rzeczy, po których widać "gotowca"
   To jest blok, który najmocniej zmienia odbiór strony,
   a nie dotyka ani jednego koloru.
   ============================================================ */

/* 3.1 ⭐ NAJWAŻNIEJSZE: ozdobniki po bokach każdego nagłówka.
   Szablon wstawia romb z fontu ikon przed i po KAŻDYM
   nagłówku sekcji. To jest najbardziej rozpoznawalny
   element "szablonu z systemu". Zdejmuję zawsze. */
.big-label::before,
.big-label::after { display: none !important; }

/* 3.2 Przyciski: bez cienia, bez zaokrągleń, bez wersalików */
.btn,
#iai_book_form button[type="submit"] {
  box-shadow: none;
  border-radius: 2px;
  text-transform: none;
  font-weight: 600;
  letter-spacing: .01em;
}

/* 3.3 Pola wyszukiwarki dat — ten sam zabieg */
#iai_book_se div.widget__option > input {
  box-shadow: none;
  border-radius: 2px;
  border: 1px solid var(--bordercolor);
}

/* 3.4 Karty ofert: cień na hover jest mocny, wyciszam */
@media (min-width: 979px) {
  .offer:hover:before { box-shadow: 0 2px 14px rgba(0,0,0,.08); }
}

/* 3.5 Proporcje — TE liczby da się zmienić, kolejność sekcji NIE
   ⚠ Breakpointy szablonu są nietypowe: 757 / 979 / 1200 px.
     Własne media queries pisać na TYCH progach, nie na 768/992. */

/* wysokość zdjęcia na karcie oferty (domyślnie 218px)
   ⚠ galeria oferty ma sztywne szerokości 265/530 px - przy
     zmianie szerokości kontenera się rozjeżdża. Wysokość jest
     bezpieczna, szerokości nie ruszać. */
.offer .object-icon { height: 240px; }

/* wysokość hero na podstronach (domyślnie 73vh) */
.section.parallax,
.section.parallax .parallax-slide,
div.parallax-slider { height: 62vh; }

/* wysokość hero na stronie głównej (domyślnie 100vh)
.page-index div.section.parallax,
.page-index div.parallax-slider { height: 82vh; }
*/


/* ============================================================
   4. CZEGO TU NIE MA I NIE BĘDZIE
   ------------------------------------------------------------
   Stopka "Powered by IdoBooking" (.powered_by) NIE jest ukrywana.
   Ukrycie jej CSS-em obchodzi płatną funkcję white-label
   i łamie regulamin dostawcy. Jeśli klient jej nie chce —
   wykupuje white-label. Koniec tematu.
   ============================================================ */


/* ============================================================
   5. KONTROLA PO WDROŻENIU
   ------------------------------------------------------------
   1. ⭐ Zaznaczenie ZAKRESU dat w kalendarzu - to sprawdza,
      czy --maincolor1_rgba jest poprawne. Jedyny objaw błędu.
   2. Nagłówki sekcji - czy zniknęły romby.
   3. Font - czy wczytał się Inter (objaw błędu: brak zmiany).
   4. Pinezka na mapie - czy stoi we właściwym miejscu.
   5. Menu - usunąć zdublowane "Rezerwuj online".
   6. Logo obiektu wgrane.
   7. Na telefonie + twarde odświeżenie (Ctrl+Shift+R).
   ============================================================ */