/* Set padding to keep content from hitting the edges */
.body-content {
    margin-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.sidebar {
    /*width: 200px;
        height: 400px;*/ /* adjust to your needs */
    overflow-y: scroll; /* enables scrolling */
    scrollbar-width: none; /* for Firefox */
    -ms-overflow-style: none; /* for Internet Explorer and Edge */
}

    .sidebar::-webkit-scrollbar {
        display: none; /* for Chrome, Safari, and Opera */
    }

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}
.card_body {
    padding-top: 5px !important;
    padding-left: 17px !important;
    padding-right: 17px !important;
    padding-bottom: 5px !important;
}



.soft-ui {
    background-color: #ffffff !important;
    padding: 20px !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08) !important;
    border-radius: 15px !important;
}

.soft-ui1 {
    background-color: #ffffff !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08) !important;
    border-radius: 15px !important;
}

.soft-ui-btn {
    background-color: #4CAF50; /* Green background */
    color: white;
    border: none;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.3s;
}

    .soft-ui-btn:hover {
        background-color: #45a049;
    }


/*.soft-ui {
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    background-color: #f5f5f5;*/ /* Soft background color */
/*transition: all 0.3s ease;*/ /* Smooth transition */
/*}

    .soft-ui:hover {
        transform: translateY(-2px);*/ /* Add a subtle lift on hover */
/*box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15), 0 3px 6px rgba(0, 0, 0, 0.1);
    }*/

/*_______________________--------FONTS---------________________*/
.form-control {
    font-size: 14px !important;
}

.small-box p {
    font-size: 14px !important;
}



.card-body {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}


.vertical-center {
    vertical-align: middle !important;
    padding: 2px !important;
}

.card {
    border-radius: 20px !important;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2) !important;
}
/* Existing media queries for mobile devices */
@media (max-width: 767px) {
    .card {
        width: 100% !important; /* Make the cards full width */
    }

    /* Adjust table styles for better mobile display */
    .table {
        font-size: 12px; /* Decrease font size for better readability on smaller screens */
    }

    .card-body {
        max-height: calc(100vh - 200px); /* Limit card-body height on small screens to prevent overflow */
        overflow-y: auto; /* Enable vertical scrolling if content exceeds the card height */
        padding-top: 5px; /* Adjust top padding for better spacing */
    }

    /* Optional: Adjust button styles for better mobile display */
    .btn-sm {
        padding: 3px 6px; /* Adjust padding for smaller buttons */
        font-size: 10px; /* Decrease font size for better button visibility */
    }
}

@media (max-width: 576px) {
    .custom-modal-dialog {
        max-width: 90% !important;
    }

    .card {
        width: 95% !important;
        justify-content: center !important;
        align-content: center !important;
        display: flex !important;
    }

    .appointment-modal {
        width: 80% !important;
    }
}

@media(min-width: 768px) {
    .modal-dialog {
        max-width: 1200px !important;
    }
}

/* New media queries for MacBooks */

/* For MacBook Air and Pro 13-inch */
@media only screen and (min-device-width: 1280px) and (max-device-width: 1440px) and (-webkit-min-device-pixel-ratio: 2) {
    .card {
        width: 70% !important; /* Adjust card width for MacBook */
    }

    .table {
        font-size: 14px; /* Adjust table font size for MacBook */
    }

    .card-body {
        max-height: calc(100vh - 150px); /* Adjust card-body height for MacBook */
        padding-top: 10px; /* Adjust top padding */
    }

    .btn-sm {
        padding: 5px 10px; /* Adjust button padding */
        font-size: 12px; /* Adjust button font size */
    }

    .modal-dialog {
        max-width: 900px !important; /* Adjust modal width for MacBook Air and Pro 13-inch */
    }
}

/* For MacBook Pro 15-inch and 16-inch */
@media only screen and (min-device-width: 1440px) and (max-device-width: 1920px) and (-webkit-min-device-pixel-ratio: 2) {
    .card {
        width: 65% !important; /* Adjust card width for MacBook */
    }

    .table {
        font-size: 15px; /* Adjust table font size for MacBook */
    }

    .card-body {
        max-height: calc(100vh - 150px); /* Adjust card-body height for MacBook */
        padding-top: 15px; /* Adjust top padding */
    }

    .btn-sm {
        padding: 6px 12px; /* Adjust button padding */
        font-size: 13px; /* Adjust button font size */
    }

    .modal-dialog {
        max-width: 1100px !important; /* Adjust modal width for MacBook Pro 15-inch and 16-inch */
    }
}

/* For Retina MacBook Pro */
@media only screen and (min-device-width: 2560px) and (max-device-width: 2880px) and (-webkit-min-device-pixel-ratio: 2) {
    .card {
        width: 60% !important; /* Adjust card width for MacBook */
    }

    .table {
        font-size: 16px; /* Adjust table font size for MacBook */
    }

    .card-body {
        max-height: calc(100vh - 150px); /* Adjust card-body height for MacBook */
        padding-top: 20px; /* Adjust top padding */
    }

    .btn-sm {
        padding: 8px 16px; /* Adjust button padding */
        font-size: 14px; /* Adjust button font size */
    }

    .modal-dialog {
        max-width: 1300px !important; /* Adjust modal width for Retina MacBook Pro */
    }
}
    #loader {
        display: none; /* Initially hide the loader */
        text-align: center;
        margin: 20px 0;
    }

    .spinner {
        border: 8px solid #f3f3f3; /* Light grey */
        border-top: 8px solid #3498db; /* Blue */
        border-radius: 50%;
        width: 40px;
        height: 40px;
        margin: auto;
    }

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.body1 {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    font-size: 1rem;
}

@media print {
    .table-bordered th, .table-bordered td {
        border: 1.5px solid black !important;
    }

    .table-print {
        page-break-inside: avoid;
    }

    .table-bordered th[increase-width] {
        width: 150px; /* Adjust the width as needed */
    }
}

.info-box-text {
    line-height: 50px!important; /* Adjust the value to vertically center the text */
    text-align: center!important; /* Horizontal centering */
}

.btn {
    padding: 8px 16px;
    border-radius: 8px !important;
    border: none;
    cursor: pointer;
    border-radius: 10px !important;
}


.btn-outline-33acc1 {
    color: #33acc1!important;

}

    .btn-outline-33acc1:hover {
    }





.btn-outline-info {
    --bs-btn-color: #33acc1 !important;
    --bs-btn-border-color: #33acc1 !important;
    --bs-btn-hover-color: #fff !important;
    --bs-btn-hover-bg: #33acc1 !important;
    --bs-btn-hover-border-color: #33acc1 !important;
    --bs-btn-focus-shadow-rgb: 13, 202, 240 !important;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #33acc1 !important;
    --bs-btn-active-border-color: #33acc1 !important;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #33acc1 !important;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #33acc1 !important;
    --bs-gradient: none;
}
.logos {
    width: 25% !important;
    aspect-ratio: 3/2 !important;
    object-fit: contain !important;
    /*mix-blend-mode: color-burn !important;*/
}





.btn-outline-primary {
    color: #007bff !important;
    border: 1px solid #007bff !important;
    background-color: transparent !important;
    background-image: none !important;
}

    .btn-outline-primary:hover {
        color: #fff !important;
        background-color: #007bff !important;
        border-color: #007bff !important;
    }

    .btn-outline-primary:focus, .btn-outline-primary.focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5) !important;
    }

    .btn-outline-primary.disabled, .btn-outline-primary:disabled {
        color: #007bff !important;
        background-color: transparent !important;
    }

    .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
    .show > .btn-outline-primary.dropdown-toggle {
        color: #fff !important;
        background-color: #007bff !important;
        border-color: #007bff !important;
    }

        .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-primary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5) !important;
        }

/* Outline Secondary */
.btn-outline-secondary {
    color: #6c757d !important;
    border: 1px solid #6c757d !important;
    background-color: transparent !important;
}

    .btn-outline-secondary:hover {
        color: #fff !important;
        background-color: #6c757d !important;
        border-color: #6c757d !important;
    }

    .btn-outline-secondary:focus, .btn-outline-secondary.focus {
        box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5) !important;
    }

    .btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
        color: #6c757d !important;
        background-color: transparent !important;
    }

    .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
    .show > .btn-outline-secondary.dropdown-toggle {
        color: #fff !important;
        background-color: #6c757d !important;
        border-color: #6c757d !important;
    }

        .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-secondary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5) !important;
        }



/* Outline Info */
.btn-outline-info {
    color: #17a2b8 !important;
    border: 1px solid #17a2b8 !important;
    background-color: transparent !important;
}

    .btn-outline-info:hover {
        color: #fff !important;
        background-color: #17a2b8 !important;
        border-color: #17a2b8 !important;
    }

    .btn-outline-info:focus, .btn-outline-info.focus {
        box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5) !important;
    }

    .btn-outline-info.disabled, .btn-outline-info:disabled {
        color: #17a2b8 !important;
        background-color: transparent !important;
    }

    .btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
    .show > .btn-outline-info.dropdown-toggle {
        color: #fff !important;
        background-color: #17a2b8 !important;
        border-color: #17a2b8 !important;
    }

        .btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-info.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5) !important;
        }

/* Outline Warning */
.btn-outline-warning {
    color: #ff9f07 !important;
    border: 1px solid #ffc107 !important;
    background-color: transparent !important;
}

    .btn-outline-warning:hover {
        color: #212529 !important;
        background-color: #ffc107 !important;
        border-color: #ffc107 !important;
    }

    .btn-outline-warning:focus, .btn-outline-warning.focus {
        box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5) !important;
    }

    .btn-outline-warning.disabled, .btn-outline-warning:disabled {
        color: #ffc107 !important;
        background-color: transparent;
    }

    .btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
    .show > .btn-outline-warning.dropdown-toggle {
        color: #212529 !important;
        background-color: #ffc107 !important;
        border-color: #ffc107 !important;
    }

        .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-warning.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5) !important;
        }

/* Outline Danger */
.btn-outline-danger {
    color: #dc3545 !important;
    border: 1px solid #dc3545 !important;
    background-color: transparent !important;
}

    .btn-outline-danger:hover {
        color: #fff !important;
        background-color: #dc3545 !important;
        border-color: #dc3545 !important;
    }

    .btn-outline-danger:focus, .btn-outline-danger.focus {
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5) !important;
    }

    .btn-outline-danger.disabled, .btn-outline-danger:disabled {
        color: #dc3545 !important;
        background-color: transparent !important;
    }

    .btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
    .show > .btn-outline-danger.dropdown-toggle {
        color: #fff !important;
        background-color: #dc3545 !important;
        border-color: #dc3545 !important;
    }

        .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-danger.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5) !important;
        }


/* Outline Success */
.btn-outline-success {
    color: #28a745 !important;
    border: 1px solid #28a745 !important;
    background-color: transparent !important;
}

    .btn-outline-success:hover {
        color: #fff !important;
        background-color: #28a745 !important;
        border-color: #28a745 !important;
    }

    .btn-outline-success:focus, .btn-outline-success.focus {
        box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5) !important;
    }

    .btn-outline-success.disabled, .btn-outline-success:disabled {
        color: #28a745 !important;
        background-color: transparent !important;
    }

    .btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
    .show > .btn-outline-success.dropdown-toggle {
        color: #fff !important;
        background-color: #28a745 !important;
        border-color: #28a745 !important;
    }

        .btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-success.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5) !important;
        }

.btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    /*border-radius: 0.2rem !important;*/
    /* Additional properties if needed */
   /* color: #fff !important;
    background-color: #007bff !important;
    border: 1px solid #007bff !important;*/
}