/*==================================
PARTNER COLORS
===================================*/

:root{

    --partner:#003B95;

    --partner-light:#EDF5FF;

}

/* ==========================================
   EKDROMISTAS TRAVEL WIDGET
   ========================================== */

*{
    box-sizing:border-box;
}

/* ==========================================
   WIDGET WRAPPER
   ========================================== */

.travel-widget{

    max-width:1000px;
    margin:0 auto;

}

/* ==========================================
   TABS
   ========================================== */

.travel-widget-tabs{

    display:grid;

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

    gap:10px;

    padding:14px 18px;

    background:#fff;

    border-radius:28px;

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

}

.tab{

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;

    gap:12px;

    min-height:78px;

    border:none;

    border-radius:20px;

    background:transparent;

    cursor:pointer;

    transition:all .25s ease;

    color:#475569;

    font-size:15px;

    font-weight:700;

}

.tab:hover .tab-icon{

    transform:scale(1.08);

    opacity:1;

}

.tab.active{

    background:var(--partner-light);

    color:var(--partner);

    transform:translateY(-2px);

    box-shadow:0 16px 35px rgba(15,23,42,.10);
}

/* ==========================================
   PANEL
   ========================================== */

.travel-widget-content{

    margin-top:8px;

    background:#fff;

    border-radius:26px;

    padding:36px;

    border:1px solid rgba(15,23,42,.06);

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

}

/* ==========================================
   HEADER
   ========================================== */

.widget-header{

    margin-bottom:34px;

}

.widget-header h2{

    font-size:42px;

    color:#0f172a;

    margin-bottom:8px;

}

.widget-header p{

    color:#64748b;

    font-size:18px;

}

/* ==========================================
   FORM
   ========================================== */

.travel-form{

    display:flex;
    flex-direction:column;

    gap:24px;

}

.travel-row{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:22px;

}

.travel-field{

    display:flex;

    flex-direction:column;

}

.travel-field label{

    margin-bottom:8px;

    font-size:14px;

    font-weight:700;

    color:#64748b;

}

.travel-field input,
.travel-field select{

    width:100%;

    height:58px;

    border:1px solid #dbe4ef;

    border-radius:16px;

    padding:0 18px;

    font-size:16px;

    background:#fff;

    transition:.25s;

}

.travel-field input:focus,
.travel-field select:focus{

    outline:none;

    border-color:var(--partner);

    box-shadow:0 0 0 4px color-mix(in srgb,var(--partner) 16%,transparent);

}

/* ==========================================
   BUTTON
   ========================================== */

.travel-search-btn{

    width:100%;

    height:64px;

    border:none;

    border-radius:18px;

    background:linear-gradient(135deg,var(--partner),color-mix(in srgb,var(--partner) 72%,black));

    color:#fff;

    font-size:20px;

    font-weight:700;

    cursor:pointer;

    transition:.25s;

    box-shadow:0 10px 24px color-mix(in srgb,var(--partner) 30%,transparent);

}

.travel-search-btn:hover{

    transform:translateY(-2px);

    box-shadow:0 16px 38px color-mix(in srgb,var(--partner) 42%,transparent);

}

.travel-search-btn:active{

    transform:translateY(0);

}

/* ==========================================
   MOBILE
   ========================================== */

@media(max-width:768px){

    .travel-widget-tabs{

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

    }

    .travel-row{

        grid-template-columns:1fr;

    }

    .travel-widget-content{

        padding:24px;

    }

}
/* ==========================
   PARTNER HEADER
========================== */

.partner-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:24px;

    margin-bottom:32px;

}

.widget-header-text h2{

    font-size:42px;

    margin-bottom:8px;

    color:#0f172a;

}

.widget-header-text p{

    color:#64748b;

    font-size:18px;

}

.travel-widget-content{

    position:relative;

}
.travel-widget-content::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:5px;

    background:var(--partner);

    border-radius:28px 28px 0 0;

}
.tab-icon{

    width:28px;

    height:28px;

    object-fit:contain;

    opacity:.75;

    transition:all .25s ease;

}

.tab.active .tab-icon{

    transform:scale(1.12);

    opacity:1;

}
/*=========================
PARTNER LOGOS
=========================*/

.partner-logo{

    display:block;

    width:auto;
    height:auto;

    max-height:44px;

    object-fit:contain;

}

/* Booking */

.booking-logo{

    width:150px;

    border-radius:8px;

}

/* Kiwi */

.kiwi-logo{

    width:112px;

}

/* Ferryhopper */

.ferryhopper-logo{

    width:156px;

}

/* GetYourGuide */

.getyourguide-logo{

    width:168px;

}

/* DiscoverCars */

.discovercars-logo{

    width:184px;

}

/* Yesim */

.yesim-logo{

    width:112px;

}
/*=========================
eSIM PROVIDERS
=========================*/

.esim-providers{

    display:grid;

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

    gap:14px;

}

.provider-card{

    border:2px solid #e5e7eb;

    border-radius:16px;

    padding:18px;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    transition:.25s;

    background:#fff;

    min-width:0;

    overflow:hidden;

}

.provider-card img{

    max-width:100%;

    max-height:34px;

    object-fit:contain;

    min-width:0;

}

.provider-card:hover{

    border-color:var(--partner);

}

.provider-card.active{

    border-color:var(--partner);

    background:var(--partner-light);

}
.autocomplete{
    position:relative;
}

.autocomplete-results{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:12px;
    margin-top:6px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    z-index:1000;
    max-height:280px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}

.travel-field{
    position:relative;
}

.travel-field.disabled{
    pointer-events:none;
}

.travel-field.disabled label{
    color:#cbd5e1;
}

.travel-field.disabled input,
.travel-field.disabled select{
    background:#f1f5f9;
    border-color:#e2e8f0;
    color:#94a3b8;
}

.autocomplete-item{
    padding:10px 16px;
    cursor:pointer;
}

.autocomplete-item:hover{
    background:#f4f8ff;
}

.autocomplete-item .autocomplete-title{
    font-size:14px;
    font-weight:600;
    line-height:1.3;
    color:#0f172a;
}

.autocomplete-item .autocomplete-subtitle{
    font-size:12px;
    line-height:1.3;
    color:#94a3b8;
    margin-top:2px;
}