/*
|--------------------------------------------------------------------------
| Itinerak Sidebar Planner
|--------------------------------------------------------------------------
*/

.itinerak-sidebar-planner{

    width:100%;

    max-width:100%;

    background:#ffffff;

    border:1px solid #e6e6e6;

    border-radius:12px;

    padding:18px;

    box-sizing:border-box;

    box-shadow:0 8px 24px rgba(0,0,0,.06);

}

/*
|--------------------------------------------------------------------------
| Form
|--------------------------------------------------------------------------
*/

.itinerak-sidebar-planner form{

    margin:0;

}

/*
|--------------------------------------------------------------------------
| Fields
|--------------------------------------------------------------------------
*/

.itinerak-sidebar-fields{

    display:flex;

    flex-direction:column;

    gap:12px;

}

.itinerak-sidebar-fields > *{

    width:100%;

    box-sizing:border-box;

}

/*
|--------------------------------------------------------------------------
| Inputs
|--------------------------------------------------------------------------
*/

.itinerak-sidebar-fields select,

.itinerak-sidebar-fields input{

    width:100%;

    height:48px;

    padding:0 14px;

    background:#ffffff;

    color:#222222;

    font-size:14px;

    border:1px solid #d9d9d9;

    border-radius:10px;

    outline:none;

    transition:all .20s ease;

    box-sizing:border-box;

}

.itinerak-sidebar-fields input::placeholder{

    color:#999999;

}

.itinerak-sidebar-fields select:hover,

.itinerak-sidebar-fields input:hover{

    border-color:#c9c9c9;

}

.itinerak-sidebar-fields select:focus,

.itinerak-sidebar-fields input:focus{

    border-color:var(--itinerak-primary-color);

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

}

/*
|--------------------------------------------------------------------------
| Button
|--------------------------------------------------------------------------
*/

.itinerak-sidebar-action{

    margin-top:16px;

}

.itinerak-sidebar-action button{

    width:100%;

    height:48px;

    border:none;

    border-radius:10px;

    background:var(--itinerak-primary-color);

    color:#ffffff;

    font-size:15px;

    font-weight:600;

    cursor:pointer;

    transition:all .20s ease;

}

.itinerak-sidebar-action button:hover{

    filter:brightness(.92);

}

.itinerak-sidebar-action button:active{

    transform:scale(.98);

}

/*
|--------------------------------------------------------------------------
| Responsive
|--------------------------------------------------------------------------
*/

@media (max-width:768px){

    .itinerak-sidebar-planner{

        padding:16px;

    }

}