/* Apply styles to the Select2 container */
.select2-container--default .select2-selection--single {
    width: 100%;
    height: calc(2.25rem + 2px) !important;
    border-radius: 3px !important;
    box-shadow: none !important;
    border-color: #c8cdd8 !important;
}

.select2-selection__rendered {
    line-height: calc(2.25rem + 2px) !important;
}

*:focus {
    outline: none;
}

/* Disable focus styles only for keyboard navigation */
*:focus:not(:focus-visible) {
    outline: none;
}

.page-sidebar-menu ul li a:link {
    font-size: 14px !important;
}

.input,
.custom-file,
.custom-select,
.form-control {
    border-color: #c8cdd8 !important;
}

/* ---- Mobile layout: sidebar drawer + calendar report table ---- */
@media (max-width: 991px) {
    body.page-sidebar-fixed .page-content,
    body.page-sidebar-fixed.page-sidebar-collapsed .page-content {
        margin-left: 0 !important;
        width: 100% !important;
        float: none;
    }

    body .page-sidebar {
        width: 260px !important;
        left: -280px !important;
        z-index: 1050;
        transition: left 0.2s ease-in-out;
    }

    body.page-sidebar-visible .page-sidebar {
        left: 0 !important;
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.25);
    }

    /* Full-width drawer on mobile (not the 60px icon strip) */
    body.page-sidebar-collapsed .page-sidebar,
    body.page-sidebar-collapsed.page-sidebar-visible .page-sidebar {
        width: 260px !important;
    }

    body.page-sidebar-collapsed .page-sidebar .logo,
    body.page-sidebar-collapsed.page-sidebar-visible .page-sidebar .logo {
        width: 260px !important;
    }

    body.page-sidebar-collapsed.page-sidebar-visible .page-sidebar-menu ul li a span,
    body.page-sidebar-collapsed.page-sidebar-visible .page-sidebar-menu ul li a i.accordion-icon {
        display: inline !important;
    }

    body.page-sidebar-collapsed.page-sidebar-visible .page-sidebar-menu > ul > li > a {
        width: auto !important;
        padding: 7px 15px !important;
    }

    body.page-sidebar-collapsed.page-sidebar-visible .logo a.logo-img img.desktop-logo {
        display: block !important;
    }

    body.page-sidebar-collapsed.page-sidebar-visible .logo a.logo-img img.small-logo {
        display: none !important;
    }

    body.page-sidebar-visible .page-inner,
    body.page-sidebar-visible .page-header {
        pointer-events: none;
    }

    body.page-sidebar-visible .page-sidebar {
        pointer-events: auto;
    }
}

#exampleModal .modal-dialog {
    max-width: calc(100vw - 1rem);
    margin: 0.5rem auto;
}

#exampleModal .modal-body {
    overflow-x: hidden;
}

#exampleModal .calendar-report-results {
    overflow-x: hidden;
}

#exampleModal .calendar-report-table {
    width: 100%;
    margin-bottom: 0;
    table-layout: fixed;
}

#exampleModal .calendar-report-table th,
#exampleModal .calendar-report-table td {
    padding: 0.5rem 0.4rem;
    vertical-align: middle;
    word-wrap: break-word;
    overflow-wrap: anywhere;
    font-size: 0.8125rem;
}

@media (max-width: 767px) {
    #exampleModal .calendar-report-table thead {
        display: none;
    }

    #exampleModal .calendar-report-table,
    #exampleModal .calendar-report-table tbody,
    #exampleModal .calendar-report-table tr,
    #exampleModal .calendar-report-table td {
        display: block;
        width: 100%;
    }

    #exampleModal .calendar-report-table tr {
        margin-bottom: 0.75rem;
        padding: 0.5rem 0.65rem;
        border: 1px solid #dee2e6;
        border-radius: 6px;
        background: #fff;
    }

    #exampleModal .calendar-report-table tr:last-child {
        margin-bottom: 0;
    }

    #exampleModal .calendar-report-table td {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.35rem 0;
        border: none;
        text-align: right;
    }

    #exampleModal .calendar-report-table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #495057;
        text-align: left;
        flex: 0 0 42%;
        max-width: 42%;
    }
}