/* assets/css/booking/responsive.css */

@media (max-width: 1100px) {
    .booking-shot-layout {
        grid-template-columns: 210px minmax(0, 1fr);
        gap: 16px;
    }

    .booking-shot-datetime-layout {
        grid-template-columns: 1fr;
    }

    .booking-shot-staff-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .booking-shot-summary-layout {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media (max-width: 860px) {
    .booking-shot-layout {
        grid-template-columns: 1fr;
    }

    .booking-shot-sidebar {
        position: static;
    }

    .booking-shot-stepbar {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 4px;
        padding: 8px;
    }

    .booking-shot-step {
        flex: 1 1 auto;
        min-width: 100px;
        justify-content: center;
        font-size: 12px;
        padding: 0 6px;
    }

    .booking-shot-sidebar-summary {
        display: none;
    }

    .booking-shot-service-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .booking-shot-header-inner {
        flex-direction: column;
        padding: 10px;
    }

    .booking-shot-nav {
        gap: 14px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .booking-shot-stepbar {
        flex-direction: column;
    }

    .booking-shot-step {
        min-width: 0;
        justify-content: flex-start;
    }

    .booking-shot-footer-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .booking-shot-next-btn,
    .booking-shot-book-btn,
    .booking-shot-back-btn {
        width: 100%;
    }

    .booking-shot-staff-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .booking-shot-form-grid {
        grid-template-columns: 1fr;
    }
}