
.acb-admin-card{
background:#fff;
padding:20px;
border:1px solid #ddd;
border-radius:8px;
max-width:700px;
margin-bottom:30px;
}

/* Airports grid */

.acb-airports-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(380px,1fr));
gap:20px;
margin-top:20px;
}

/* Airport card */

.acb-airport-card{
background:#fff;
border:1px solid #ddd;
border-radius:8px;
padding:15px;
box-shadow:0 2px 5px rgba(0,0,0,0.05);
}

/* Airport header */

.acb-airport-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:10px;
}

/* Cities */

.acb-city-list{
list-style:none;
margin:0;
padding:0;
}

.acb-city-list li{
display:flex;
justify-content:space-between;
align-items:center;
padding:8px 0;
border-bottom:1px solid #eee;
}

.acb-city-list li:last-child{
border-bottom:none;
}

.acb-city-left{
display:flex;
gap:8px;
align-items:center;
}

.acb-city-actions button{
margin-left:5px;
}



.car-disabled{
opacity:0.5;
border:2px dashed #ccc;
pointer-events:none;
}

.car-busy-msg{
color:#d63638;
font-size:13px;
margin-top:6px;
}


#cb-booking{max-width:1200px;margin:0 auto;}
.tabs{display:flex;gap:10px;cursor:pointer}
.tabs li.active{font-weight:bold}
.step{display:none;padding:10px;border:1px solid #ddd;margin-top:10px}
.step-1{display:block}
.cb-trip-tabs {
    display: flex;
    gap: 10px;
    margin: 20px 0;
}

.cb-trip-tab {
    padding: 10px 20px;
    border: 1px solid #ccc;
    background: #f7f7f7;
    cursor: pointer;
    font-weight: 600;
}

.cb-trip-tab.active {
    background: #000;
    color: #fff;
    border-color: #000;
}


#acb_step_2 {
    display: flex;
    flex-direction: column;
    gap: 20px; /* vertical spacing between sections */
}

/* Step title full width */
#acb_step_2 .step-title {
    width: 100%;
}

#acb_step_2 .step-title h2 {
    margin: 0;
    text-align: center; /* optional */
}

/* Luggage items container: 2 columns */
#acb_step_2 .single-luggage {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 equal columns */
    gap: 20px; /* space between items */
}

/* Individual luggage item */
.acb_luggage_item {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: center;
    border-radius: 6px;
    background-color: #f9f9f9;
}

/* Image styling */
.acb_luggage_item img {
    display: block;
    margin: 0 auto 10px;
}

/* Quantity buttons */
.acb_luggage_item button {
    padding: 4px 8px;
    margin: 0 4px;
    cursor: pointer;
}

/* Quantity span */
.acb_luggage_item .qty {
    display: inline-block;
    min-width: 20px;
    text-align: center;
}

/* Buttons section full width */
#acb_step_2 .btns {
    width: 100%;
    display: flex;
    justify-content: space-between; /* left and right alignment */
    margin-top: 20px;
}

#acb_step_2 .btns button {
    width: 48%; /* roughly half each button */
    padding: 10px;
    border: 1px solid #333;
    border-radius: 5px;
    background-color: #eee;
    cursor: pointer;
}

.single-luggage {
    display: grid;
    column-width: 50%;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}



/* STEP 3 container */
#acb_step_3 {
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-family: Arial, sans-serif;
}

/* Step title */
#acb_step_3 .step-title h2 {
    margin: 0;
    text-align: center;
    font-size: 1.8em;
    color: #333;
}

/* Cars container: 2-column grid */
#acb_step_3 .single-luggage {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

/* Car card as button */
.acb_car_item {
    border: 2px solid #ddd;
    padding: 15px;
    border-radius: 10px;
    background-color: #fff;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* Hover effect */
.acb_car_item:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}

/* Selected car highlight */
.acb_car_item.selected {
    border-color: #0073e6;
    box-shadow: 0 4px 12px rgba(0, 115, 230, 0.3);
    background-color: #f0f8ff;
}

/* Car image */
.acb_car_image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 10px;
}

/* Car title */
.acb_car_item strong {
    display: block;
    margin-bottom: 5px;
    font-size: 1.2em;
    color: #222;
}

/* Price info */
.acb_car_item .price-info {
    display: block;
    font-size: 0.95em;
    margin-top: 5px;
    color: #555;
}

/* Total price */
#acb_step_3 h3 {
    width: 100%;
    text-align: center;
    font-size: 1.4em;
    color: #0073e6;
    margin-top: 10px;
}

/* Buttons section */
#acb_step_3 .btns {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

#acb_step_3 .btns button, #acb_step_2 .btns button {
    width: 48%;
    padding: 12px;
    font-size: 1em;
    border-radius: 6px;
        background: transparent;
    border: 2px solid #ffa503;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #222;
}

#acb_step_3 .btns button:hover, #acb_step_2 .btns button:hover {
    background-color: #ffa503;
    border-color: #ffa503;
}

/* Responsive: 1 column on mobile */
@media (max-width: 768px) {
    #acb_step_3 .single-luggage {
        grid-template-columns: 1fr;
    }

    #acb_step_3 .btns {
        flex-direction: column;
        gap: 10px;
    }

    #acb_step_3 .btns button {
        width: 100%;
    }
}