/* ===========================
   INTERNET FOGLALÓ PRO V2
=========================== */

.if-booking-widget{

    max-width:700px;
    margin:40px auto;
    padding:35px;

    background:#ffffff;

    border-radius:20px;

    border:1px solid #e2e8f0;

    box-shadow:
        0 10px 40px rgba(15,23,42,.08);

}

/* ===========================
   FEJLÉC
=========================== */

.if-booking-widget::before{

    content:"Internet szolgáltatás felmérés";

    display:block;

    font-size:28px;

    font-weight:800;

    color:#0f172a;

    margin-bottom:10px;

}

.if-booking-widget::after{

    content:"Válasszon időpontot és kollégánk felkeresi Önt.";

    display:block;

    color:#64748b;

    font-size:15px;

    margin-bottom:25px;

    padding-bottom:20px;

    border-bottom:1px solid #e2e8f0;

}

/* ===========================
   ELRENDEZÉS
=========================== */

.if-booking-widget p{

    margin:0 0 18px 0;

}

/* ===========================
   LABEL
=========================== */

.if-booking-widget label{

    display:block;

    margin-bottom:8px;

    font-size:14px;

    font-weight:700;

    color:#334155;

}

/* ===========================
   INPUTOK
=========================== */

.if-booking-widget input,
.if-booking-widget select,
.if-booking-widget .flatpickr-input{

    width:100% !important;

    height:56px;

    padding:0 16px;

    border:1px solid #dbe3ee;

    border-radius:12px;

    background:#ffffff;

    font-size:15px;

    color:#0f172a;

    transition:.25s;

    box-sizing:border-box;

}

/* ===========================
   FÓKUSZ
=========================== */

.if-booking-widget input:focus,
.if-booking-widget select:focus,
.if-booking-widget .flatpickr-input:focus{

    outline:none;

    border-color:#2563eb;

    box-shadow:
        0 0 0 4px rgba(37,99,235,.12);

}

/* ===========================
   PLACEHOLDER
=========================== */

.if-booking-widget input::placeholder{

    color:#94a3b8;

}

/* ===========================
   SELECT
=========================== */

.if-booking-widget select{

    cursor:pointer;

}

/* ===========================
   GOMB
=========================== */

.if-booking-widget button{

    width:100%;

    height:58px;

    border:none;

    border-radius:14px;

    background:linear-gradient(
        135deg,
        #2563eb,
        #1d4ed8
    );

    color:#ffffff;

    font-size:17px;

    font-weight:700;

    cursor:pointer;

    transition:.25s;

}

.if-booking-widget button:hover{

    transform:translateY(-2px);

    box-shadow:
        0 15px 35px rgba(37,99,235,.25);

}

.if-booking-widget button:active{

    transform:translateY(0);

}

/* ===========================
   ÜZENETEK
=========================== */

.if-booking-success{

    background:#ecfdf5;

    border:1px solid #86efac;

    color:#166534;

    padding:15px;

    border-radius:12px;

    margin-bottom:20px;

}

.if-booking-error{

    background:#fef2f2;

    border:1px solid #fca5a5;

    color:#991b1b;

    padding:15px;

    border-radius:12px;

    margin-bottom:20px;

}

/* ===========================
   FLATPICKR
=========================== */

.flatpickr-input{

    background:#ffffff !important;

    border:1px solid #dbe3ee !important;

    border-radius:12px !important;

    height:56px !important;

    padding:0 16px !important;

}

.flatpickr-calendar{

    border:none !important;

    border-radius:18px !important;

    overflow:hidden;

    box-shadow:
        0 15px 40px rgba(15,23,42,.18) !important;

}

.flatpickr-day.selected{

    background:#2563eb !important;

    border-color:#2563eb !important;

}

.flatpickr-day.today{

    border-color:#2563eb !important;

}

/* ===========================
   MOBIL
=========================== */

@media(max-width:768px){

    .if-booking-widget{

        margin:15px;
        padding:20px;
        border-radius:16px;

    }

    .if-booking-widget::before{

        font-size:22px;

    }

    .if-booking-widget input,
    .if-booking-widget select,
    .if-booking-widget .flatpickr-input{

        height:52px;
        font-size:16px;

    }

    .if-booking-widget button{

        height:54px;

    }

}

/* MINDEN INPUT EGYSÉGES */

.if-booking-widget input[type="text"],
.if-booking-widget input[type="email"],
.if-booking-widget input[type="tel"],
.if-booking-widget input[type="date"],
.if-booking-widget select,
.if-booking-widget .flatpickr-input{

    width:100% !important;

    height:56px !important;

    padding:0 16px !important;

    background:#fff !important;

    border:1px solid #dbe3ee !important;

    border-radius:12px !important;

    font-size:15px !important;

    color:#0f172a !important;

    box-sizing:border-box !important;

    transition:.25s !important;

    -webkit-appearance:none;
    appearance:none;

}

/* FÓKUSZ */

.if-booking-widget input[type="text"]:focus,
.if-booking-widget input[type="email"]:focus,
.if-booking-widget input[type="tel"]:focus,
.if-booking-widget input[type="date"]:focus,
.if-booking-widget select:focus,
.if-booking-widget .flatpickr-input:focus{

    outline:none !important;

    border-color:#2563eb !important;

    box-shadow:
        0 0 0 4px rgba(37,99,235,.12) !important;

}

.if-consent{
    margin:20px 0;
}

.if-consent label{

    display:flex;

    align-items:flex-start;

    gap:12px;

    font-size:14px;

    line-height:1.6;

    font-weight:400;

}

.if-consent input[type="checkbox"]{

    width:22px !important;

    min-width:22px;

    height:22px;

    margin-top:2px;

}

.if-consent a{

    color:#3b5ddd;

    font-weight:600;

    text-decoration:none;

}

.if-consent a:hover{

    text-decoration:underline;

}

.if-consent span{
    display:block;
}

@media(max-width:768px){

    .if-booking-widget{

        width:calc(100% - 20px);

        max-width:none;

        margin:10px auto;

        padding:20px;

        border-radius:20px;

    }

}


/* ===================================
   LEFEDETT TELEPÜLÉSEK
=================================== */

.if-coverage-section{

    margin-top:40px;

}

.if-locations-grid{

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(180px,1fr));

    gap:16px;

}

.if-location-card{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:14px;

    padding:16px;

    font-size:15px;

    font-weight:600;

    color:#1e293b;

    transition:all .25s ease;

    box-shadow:
    0 4px 12px rgba(0,0,0,.05);

}

.if-location-card:hover{

    transform:translateY(-3px);

    box-shadow:
    0 12px 24px rgba(0,0,0,.08);

}

.if-location-card svg{

    width:16px;

    height:16px;

    color:#2563eb;

    flex-shrink:0;

}

.if-coverage-count{

    text-align:center;

    margin-top:25px;

    font-size:15px;

    color:#64748b;

}

.if-coverage-count strong{

    color:#2563eb;

}

/* ===================================
   TABLET
=================================== */

@media (max-width:1024px){

    .if-locations-grid{

        grid-template-columns:
        repeat(3,1fr);

    }

}

/* ===================================
   MOBIL
=================================== */

@media (max-width:768px){

    .if-locations-grid{

        grid-template-columns:
        repeat(2,1fr);

        gap:10px;

    }

    .if-location-card{

        padding:14px;

        font-size:14px;

    }

}

/* ===================================
   KIS TELEFON
=================================== */

@media (max-width:480px){

    .if-location-card{

        font-size:13px;

        padding:12px;

    }

}