/*

Theme Name: Salient Child Theme

Description: This is a custom child theme for Salient

Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266

Author: ThemeNectar

Author URI:  https://themeforest.net/user/themenectar

Template: salient

Version: 1.0

*/

#all-time-slots .item {
    width: 90px;
    margin-right: 20px;
    border: 1px solid #fff;
    padding: 10px;
    border-radius: 4px;
    color: #fff;
    text-align: center;
    font-size: 20px;
    position: relative;
}

div#all-time-slots {
    display: flex;
}

.form-step ul li {
    font-size: 14px !important;
}

/* Base styles for time slots container */
div#all-time-slots {
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap to the next line if needed */
    /* width: 200px;  */
    gap: 10px; /* Space between items */
    padding: 10px; /* Optional padding around items */
    box-sizing: border-box; /* Include padding in container's total width and height */
}

/* Styles for each time slot item */
div#all-time-slots .item {
    flex: 0 0 60px; /* Fixed size for items */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px; /* Adjust as needed */
}

/* Responsive styles for mobile */
@media (max-width: 600px) {
    div#all-time-slots {
        /* width: 100%;  */
        width: 400px;
    }

    div#all-time-slots .item {
        flex: 0 0 50px; /* Adjust fixed size for smaller screens */
        height: 30px; /* Adjust as needed */
    }
}