:root {
    --gradient-start: #e8f5e9;
    --gradient-end: #d8e8d8;
    --kolor-akcentu: #2a4030;
    --kolor-glowny: #556b2f;
    --kolor-tekstu: #2a3d45;
    --kolor-bialy: #ffffff;
    --accent-gold: #c5a753;
    --cień: 0 10px 40px rgba(42, 61, 46, 0.15);
    --zaokraglenie: 20px;
}


body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px; 
    line-height: 1.7;
    color: var(--kolor-tekstu);
    background: linear-gradient(180deg, var(--gradient-start) 0%, var(--gradient-end) 100%);
   
}

#pageContent {
    background: none !important;
}


p, li { font-size: 1.1rem; }
h1, h2, h3, h4, h5 {
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
    color: var(--kolor-akcentu);
}
.section-title, h2 { font-size: 2.8rem; margin-bottom: 60px; text-align: center;}
.section-title.text-start { text-align: left !important; }
h3 { font-size: 2.2rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.3rem; }
.lead { font-size: 1.25rem; font-weight: 400; }

/* --- SEKCJA 3: STRUKTURA I PANELE --- */
.panel-section { width: 100%; padding: 4rem 0; overflow-x: hidden; }

/* --- SEKCJA 4: STYLE GŁÓWNYCH ELEMENTÓW --- */

.index-info {
    margin: 0 auto;
    text-align: center;
}

.amenity-item {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    margin-bottom: 2rem;
}
.amenity-item .icon-wrapper {
    width: 100px; height: 100px; margin-bottom: 1.5rem;
    background-color: var(--kolor-bialy);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.07);
    transition: transform 0.3s ease, background-color 0.3s ease;
}
.amenity-item .icon-wrapper i { color: var(--kolor-glowny); font-size: 2.8rem; transition: color 0.3s ease;}
.amenity-item:hover .icon-wrapper { transform: scale(1.1) translateY(-5px); background-color: var(--kolor-akcentu); }
.amenity-item:hover .icon-wrapper i { color: var(--kolor-bialy); }
.amenity-item h5 { font-weight: 700; color: var(--kolor-tekstu); font-size: 1.2rem; }

#kafelki { background: transparent; }
.tile-card {
    display: block; position: relative;
    height: 400px;
    border-radius: var(--zaokraglenie);
    overflow: hidden; text-decoration: none; color: var(--kolor-bialy);
    box-shadow: var(--cień);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    margin-bottom: 1.5rem;
}
.tile-card:hover { transform: scale(1.03); box-shadow: 0 15px 50px rgba(42, 61, 46, 0.25); }
.tile-card img {
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 1;
}
.tile-card::before {
    content: ''; position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 60%);
    z-index: 2;
}
.tile-card-content {
    position: absolute; bottom: 0;
    padding: 1.5rem 2rem; z-index: 3;
    width: 100%; text-align: left;
}
.tile-card-content h3 { font-size: 2rem; color: var(--kolor-bialy); margin-bottom: 0.25rem; font-weight: 700; }
.tile-card-content h4 { font-weight: 400; opacity: 0.9; color: var(--kolor-bialy); font-size: 1.1rem; }

.gradient-border { padding: 6px; background: linear-gradient(45deg, var(--gradient-end), var(--kolor-glowny)); border-radius: var(--zaokraglenie); line-height: 0; box-shadow: var(--cień); }
.gradient-border img { border-radius: calc(var(--zaokraglenie) - 6px); width: 100%;}
.about-section-container { overflow: hidden; }
.about-img { transition: transform 0.6s ease; }
.about-section-container:hover .about-img { transform: scale(1.05); }

.button-group { display: flex; flex-wrap: wrap; gap: 1rem; }
.btn-primary, .btn-outline-primary, .extra-card-back .btn {
    border-radius: 50px;
    text-transform: uppercase;
    font-weight: 900;
    border: 2px solid var(--kolor-akcentu);
    transition: background-color 0.3s, border-color 0.3s, color 0.3s;
    text-decoration: none;
    padding: 0.8rem 2.2rem !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-primary { background-color: var(--kolor-akcentu); color: var(--kolor-bialy) !important; }
.btn-primary:hover { background-color: var(--kolor-glowny); border-color: var(--kolor-glowny); }
.btn-outline-primary { background-color: transparent; color: var(--kolor-akcentu) !important; }
.btn-outline-primary:hover { background-color: var(--kolor-akcentu); color: var(--kolor-bialy) !important; }

.extra-card { perspective: 1000px; height: 350px; cursor: pointer; }
.extra-card-inner { position: relative; width: 100%; height: 100%; transition: transform 0.8s; transform-style: preserve-3d; }
.extra-card:hover .extra-card-inner, .extra-card-inner.is-flipped { transform: rotateY(180deg); }
.extra-card-front, .extra-card-back {
    position: absolute; width: 100%; height: 100%;
    -webkit-backface-visibility: hidden; backface-visibility: hidden;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    border-radius: var(--zaokraglenie); box-shadow: var(--cień);
    padding: 2rem;
}
.extra-card-front { background-color: var(--kolor-bialy); color: var(--kolor-akcentu); text-align: center; }
.extra-card-front i { font-size: 3.5rem; margin-bottom: 1.5rem; }
.extra-card-front h5 { font-size: 1.5rem !important; color: var(--kolor-akcentu); font-weight: 700; }
.extra-card-back {
    background-color: var(--kolor-akcentu); color: var(--kolor-bialy);
    transform: rotateY(180deg); text-align: center;
}
.extra-card-back h5 { font-size: 1.5rem !important; margin-bottom: 12px; color: var(--kolor-bialy); font-weight: 700; }
.extra-card-back p { font-size: 1.1rem !important; line-height: 1.6 !important; flex-grow: 1; }
.extra-card-back .btn { background-color: var(--kolor-bialy); color: var(--kolor-akcentu) !important; border-color: var(--kolor-bialy); margin-top: auto;}
.extra-card-back .btn:hover { background-color: #f0f0f0; }
@media (max-width: 991.98px) { .extra-card { margin-bottom: 2rem; } }




.iai-search,
#iai_book_se,
#iai_book_form {
    background: none !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
}


#iai_book_form .showlocation.widget__option {
    display: none !important;
}


@media (min-width: 979px) {
    .page-index #iai_book_se form {
        grid-template-columns: repeat(3, 1fr) auto !important;
        justify-content: center !important;
        gap: 15px;
    }
}
#iai_book_se form {
    gap: 15px;
}

/* KROK 4: Ogólne style dla "kafelków" (Początek, Koniec, Osoby) */
#iai_book_form .widget__option {
    background-color: white !important;
    border: 1px solid #BDBDBD !important;
    border-radius: 30px !important;
    display: flex;
    align-items: center;
    padding: 0 1.2em; /* Zwiększony odstęp dla estetyki */
    position: relative; /* Niezbędne dla działania z-index */
    min-height: 50px; /* Ustawienie minimalnej wysokości */
}


#iai_book_form .widget__option input {
    position: relative !important; /* Umożliwia użycie z-index */
    z-index: 2 !important; /* Umieszcza pole INPUT NAD etykietą "Początek" */
    

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100%;
    height: 100%;
    
    /* Style tekstu wewnątrz pola */
    color: #333333 !important; /* Widoczny, ciemny kolor tekstu daty */
    text-align: center; /* Wyśrodkowanie daty */
    font-size: 1em;
    font-weight: 500;
}

/* KROK 6: Schowanie etykiet pod spód i wyrównanie */
#iai_book_form .widget__option label {
    position: absolute !important;
    z-index: 1 !important; /* Umieszcza etykietę POD polem input */
    
    /* Ustawienia, aby etykieta idealnie wypełniała kafelek */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    
    /* Ukrywamy oryginalny tekst etykiety, gdy data jest wybrana, dla bezpieczeństwa */
    color: transparent; 
}



#iai_book_form .datefrom label::before { content: "Początek"; color: #555; }
#iai_book_form .dateto label::before { content: "Koniec"; color: #555; }
#iai_book_form #person_section label::before { content: "Osoby"; color: #555; }


#iai_book_form .widget__option i {
    z-index: 3; /* Ikonka zawsze na wierzchu */
    margin-right: 8px; /* Odstęp między ikoną a tekstem */
    color: #333;
}
#iai_book_form #person_section i { margin-right: auto; } /* Poprawka dla pola Osoby */


#iai_book_form .formbutton button {
    background-color: #0F6335 !important;
    color: white !important;
    border: 1px solid #0F6335 !important;
    border-radius: 30px !important;
    width: 100%;
    height: 100%;
    font-weight: bold;
    min-height: 52px;
    transition: all 0.2s ease-in-out;
}
#iai_book_form .formbutton button:hover {
    background-color: #094724 !important;
    border-color: #094724 !important;
    cursor: pointer;
}

.litepicker {
    border-radius: 18px !important;
    border: 2px solid #0F6335 !important; /* Ciemnozielona otoczka */
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
    overflow: hidden; /* "Przycina" wewnętrzne rogi do zaokrąglenia */
}


.litepicker .month-item-header {
    background-color: #0F6335 !important;
    color: white !important;
}
.litepicker .month-item-header svg {
    fill: white !important;
}


.litepicker .day-item.is-start-date,
.litepicker .day-item.is-end-date {
    background-color: #0F6335 !important;
    color: white !important;
}
.litepicker .day-item.is-in-range {
    background-color: #DCEEE4 !important; /* Jasny odcień zielonego dla zakresu */
    color: #0F6335 !important;
}



.fp-section:not(.parallax) {
    background-color: #eaf7ec;
}



