/* --- EIF Booking Plugin - Frontend CSS --- */

.eif-booking-wrapper {
    width: 1200px;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.eif-booking-wrapper *,
.eif-booking-wrapper *::before,
.eif-booking-wrapper *::after {
    box-sizing: border-box;
}

/* Rács és Helyszínek */
.eif-location-grid-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin: 0 auto;
}

.eif-location-item {
    flex: 1;
    min-width: calc(50% - 10px);
    max-width: 580px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
}

.eif-location-card {
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    overflow: hidden;
    border-radius: 8px;
    position: relative;
    width: 100%;
}

.eif-location-card > img:not(.eif-nike-overlay) {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    transition: transform 0.2s ease;
}

/* Nike overlay */
html body .eif-booking-wrapper .eif-location-card img.eif-nike-overlay {
    display: none !important;
    position: absolute !important;
    top: 59.4% !important;
    left: 16.5% !important;
    transform: translate(-50%, -50%) !important;
    max-width: 20% !important;
    height: auto !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

html body .eif-booking-wrapper .eif-location-item.active .eif-location-card img.eif-nike-overlay {
    display: block !important;
}

/* Űrlap konténer */
div.eif-booking-wrapper #eif-form-container {
    width: 1200px;
    max-width: 100%;
    box-sizing: border-box;
    margin: 30px auto 0 auto;
}

.eif-form-inner {
    width: 100%;
    box-sizing: border-box;
}

/* Mezők és beviteli mezők stílusa */
.eif-field {
    margin-bottom: 20px;
}

.eif-field label {
    display: block;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 8px;
}

.eif-input,
select.eif-input,
textarea.eif-input {
    width: 100%;
    background-color: #161616 !important;
    color: #ffffff !important;
    border: 1px solid #ffc738 !important;
    padding: 12px 15px !important;
    border-radius: 6px !important;
    font-size: 1rem !important;
    outline: none !important;
    box-sizing: border-box !important;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.eif-input:focus,
select.eif-input:focus {
    border-color: #ffc738 !important;
    box-shadow: 0 0 10px rgba(255, 199, 56, 0.4) !important;
}

/* Összesítő doboz */
.eif-booking-summary {
    background: #161616;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 20px;
    margin: 25px 0 20px 0;
    color: #fff;
}

/* FLATPICKR NAPTÁR SÖTÉT / ARANY STÍLUS */
.flatpickr-calendar {
    background: #161616 !important;
    border: 1px solid #ffc738 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8) !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    font-family: inherit !important;
    overflow: hidden;
}

.flatpickr-calendar.arrowTop::before,
.flatpickr-calendar.arrowTop::after {
    border-bottom-color: #161616 !important;
}

.flatpickr-calendar.arrowBottom::before,
.flatpickr-calendar.arrowBottom::after {
    border-top-color: #161616 !important;
}

.flatpickr-months {
    background: #222222 !important;
    border-bottom: 1px solid #333333 !important;
    padding: 8px 0 !important;
}

.flatpickr-months .flatpickr-month {
    background: transparent !important;
    color: #ffc738 !important;
    fill: #ffc738 !important;
    height: 34px !important;
}

.flatpickr-current-month {
    font-size: 1.05rem !important;
    font-weight: bold !important;
    color: #ffc738 !important;
    padding-top: 2px !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
    color: #ffc738 !important;
    font-weight: bold !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
    color: #ffc738 !important;
    fill: #ffc738 !important;
    padding: 8px !important;
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
    fill: #ffffff !important;
}

span.flatpickr-weekday {
    background: #161616 !important;
    color: #888888 !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
}

.flatpickr-days {
    background: #161616 !important;
    padding: 5px !important;
}

.dayContainer {
    justify-content: space-around !important;
}

.flatpickr-day {
    color: #ffffff !important;
    border-radius: 6px !important;
    border: 1px solid transparent !important;
    font-weight: 500 !important;
    margin: 2px 0 !important;
}

.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
    color: #444444 !important;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
    color: #383838 !important;
    background: transparent !important;
    text-decoration: line-through;
    cursor: not-allowed !important;
    border-color: transparent !important;
}

.flatpickr-day:hover,
.flatpickr-day:focus {
    background: #2a2a2a !important;
    color: #ffc738 !important;
    border-color: #ffc738 !important;
}

.flatpickr-day.today {
    border-color: #ffc738 !important;
    color: #ffc738 !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.selected.nextMonthDay {
    background: #ffc738 !important;
    color: #161616 !important;
    border-color: #ffc738 !important;
    font-weight: 800 !important;
    box-shadow: 0 0 8px rgba(255, 199, 56, 0.5) !important;
}

/* REJTÉSI ÉS MEGJELENÍTÉSI OSZTÁLYOK A 3. LÉPÉSHEZ */
.eif-step-confirm.eif-hidden-carousel {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

.eif-step-confirm.eif-visible-carousel {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    transition: opacity 0.3s ease;
}

/* Reszponzív stílusok mobilos nézethez */
@media (max-width: 1024px) {
    .eif-booking-wrapper, 
    div.eif-booking-wrapper #eif-form-container {
        width: 100% !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
    }
    .eif-location-grid-layout {
        gap: 15px !important;
    }
    .eif-location-item {
        min-width: 100% !important;
        max-width: 100% !important;
    }
    html body .eif-booking-wrapper .eif-location-card img.eif-nike-overlay {
        top: 59.5% !important;   /* Itt állíthatod a fenti/alacsonyabb pozíciót mobilon */
        left: 16.5% !important;  /* Itt állíthatod a bal/jobb pozíciót mobilon */
        max-width: 12% !important; /* Itt állíthatod a méretét mobilon, ha szükséges */
    }
}
/* --- 3. LÉPÉS CAROUSEL TELJES ÉS VÉGLEGES FORMÁZÁSA --- */

.eif-step-confirm.eif-hidden-carousel {
    display: none !important;
}

.eif-step-confirm.eif-visible-carousel {
    display: block !important;
}

/* A carousel egységének fixálása, középre rendezése és teljes szélességű belső elemek */
.eif-step-confirm .us-product-carousel {
    max-width: 580px !important;
    margin: 0 auto !important;
    position: relative !important;
    box-sizing: border-box !important;
}

.eif-step-confirm .us-product-carousel .w-grid,
.eif-step-confirm .us-product-carousel .w-grid-list,
.eif-step-confirm .us-product-carousel .w-grid-item,
.eif-step-confirm .us-product-carousel .w-grid-item-h,
.eif-step-confirm .us-product-carousel .owl-stage-outer,
.eif-step-confirm .us-product-carousel .owl-stage {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.eif-step-confirm .us-product-carousel .w-grid-item-h {
    background: #161616 !important;
    border: 1px solid #333 !important;
    border-radius: 8px !important;
    padding: 15px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* Kép méretezése */
.eif-step-confirm .us-product-carousel .w-post-elm.post_image img,
.eif-step-confirm .us-product-carousel .w-grid-item-h img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 6px !important;
}

/* Bal és jobb oldali nyilak kitolása a kereten kívülre, NAGYÍTÁSA és FELJEBB MOZGATÁSA */
.eif-step-confirm .us-product-carousel .owl-prev,
.eif-step-confirm .us-product-carousel .w-slider-arrow.left,
.eif-step-confirm .us-product-carousel [class*="prev"] {
    left: -50px !important;
    position: absolute !important;
    z-index: 10 !important;
    
    /* Nagyítás beállításai */
    font-size: 60px !important; 
    transform: scale(5) !important; 
    transform-origin: center right !important;

    /* Felfelé mozgatás */
    margin-top: -200px !important; 
}

.eif-step-confirm .us-product-carousel .owl-next,
.eif-step-confirm .us-product-carousel .w-slider-arrow.right,
.eif-step-confirm .us-product-carousel [class*="next"] {
    right: -50px !important;
    position: absolute !important;
    z-index: 10 !important;
    
    /* Nagyítás beállításai */
    font-size: 60px !important; 
    transform: scale(5) !important; 
    transform-origin: center left !important;

    /* Felfelé mozgatás */
    margin-top: -200px !important; 
}
/* A kosár oldali összesítő doboz (szállítás kalkulátor és "tovább a pénztárhoz" gomb) elrejtése */
.eif-cart-section .cart-collaterals,
.eif-cart-section .wc-proceed-to-checkout {
    display: none !important;
}
/* A kosár szekció és a táblázat kiterjesztése 100% szélességre */
.eif-checkout-override-wrapper .eif-cart-section,
.eif-checkout-override-wrapper .eif-cart-section .woocommerce,
.eif-checkout-override-wrapper .eif-cart-section table.shop_table {
    width: 100% !important;
    max-width: 100% !important;
}

/* A kosár táblázat oszlopainak elosztása, hogy szépen kitöltsék a teret */
.eif-checkout-override-wrapper .eif-cart-section table.shop_table th,
.eif-checkout-override-wrapper .eif-cart-section table.shop_table td {
    padding: 15px 10px !important;
}

/* A kupon mezők és gombok igazítása/szélessége */
.eif-checkout-override-wrapper .eif-cart-section .coupon {
    display: flex !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: 20px !important;
}

.eif-checkout-override-wrapper .eif-cart-section .coupon input.input-text {
    flex: 1 !important;
    min-height: 45px !important;
}
/* A WooCommerce értesítési üzenetek (kosárba helyezés, törlés, visszavonás) teljes elrejtése */
.eif-checkout-override-wrapper .woocommerce-notices-wrapper,
.woocommerce-cart .woocommerce-notices-wrapper,
.woocommerce-message, 
.woocommerce-info, 
.woocommerce-error {
    display: none !important;
}
/* A "Kosár frissítése" gomb teljes elrejtése */
.eif-checkout-override-wrapper button[name="update_cart"],
.woocommerce-cart-form button[name="update_cart"] {
    display: none !important;
}
.wc-block-components-product-metadata,
.woocommerce-item-meta,
.product-item-meta {
    display: block !important;
    margin-top: 5px !important;
}

.wc-block-components-product-metadata li,
.woocommerce-item-meta li,
.wc-block-components-order-summary__product-description {
    color: #ffc738 !important;
    font-size: 0.9rem !important;
    list-style: none !important;
}