.btn {
    border-radius: 4px;
    font-weight: 600;
    transition: all 0.2s ease;
}

/* Global horizontal overflow guard:
   avoid horizontal scrollbars caused by oversized blocks/modals. */
html,
body,
#wrapper,
#page-wrapper {
    max-width: 100%;
    overflow-x: hidden;
}

body.modal-open,
.modal,
.modal-dialog,
.modal-content,
.modal-body,
.modal-footer {
    overflow-x: hidden;
}

.btn-primary {
    box-shadow: 0 2px 8px rgba(26, 179, 148, 0.22);
}

.btn-primary:hover,
.btn-primary:focus {
    box-shadow: 0 4px 12px rgba(26, 179, 148, 0.28);
}

.btn-white {
    border-color: #d7dde4;
}

small.text-danger,
label.error,
.text-danger.error {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
}

.form-group.has-error .form-control {
    border-color: #ed5565;
    box-shadow: none;
}

.codexa-form-modal iframe {
    width: 100%;
    height: 78vh;
    border: 0;
    display: block;
    background: #fff;
}

.codexa-form-modal .modal-dialog {
    width: 92%;
    max-width: 1240px;
}

.codexa-form-modal-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #676a6c;
    font-size: 13px;
    font-weight: 600;
    z-index: 2;
}

.codexa-form-modal-loading .fa {
    margin-right: 6px;
}

.codexa-form-modal .modal-body {
    position: relative;
    padding: 0;
    min-height: 120px;
}

.codexa-form-modal .modal-header {
    border-bottom: 1px solid #e7eaec;
}

/* System-wide modal sizing guardrails:
   keep large dialogs compact on wide screens without breaking small dialogs. */
@media (min-width: 768px) {
    .modal-dialog {
        max-width: min(94vw, 940px) !important;
    }

    .modal-dialog.modal-lg {
        max-width: min(96vw, 1040px) !important;
    }

    .modal-dialog.modal-md {
        max-width: min(94vw, 860px) !important;
    }

    .modal-dialog.modal-sm {
        max-width: min(92vw, 520px) !important;
    }
}

@media (max-width: 767px) {
    .modal-dialog,
    .modal-dialog.modal-lg,
    .modal-dialog.modal-md,
    .modal-dialog.modal-sm {
        max-width: 96vw !important;
        margin: 10px auto;
    }
}

html.codexa-modal-mode body {
    background: #fff;
}

html.codexa-modal-mode #wrapper > .navbar-default.navbar-static-side,
html.codexa-modal-mode #wrapper > nav.navbar-default {
    display: none !important;
}

html.codexa-modal-mode #page-wrapper {
    margin: 0 !important;
    min-height: auto !important;
}

html.codexa-modal-mode #page-wrapper > .row.border-bottom {
    display: none !important;
}

html.codexa-modal-mode #page-wrapper .footer,
html.codexa-modal-mode .footer {
    display: none !important;
}

html.codexa-modal-mode .wrapper-content {
    padding: 15px 18px !important;
}

/* Ensure native checkbox/radio rendering stays visible across mixed legacy markup patterns. */
.checkbox label > input[type="checkbox"],
.checkbox-inline > input[type="checkbox"],
label > input[type="checkbox"],
.checkbox input[type="checkbox"],
.checkbox label > input[type="radio"],
.checkbox-inline > input[type="radio"],
label > input[type="radio"],
.checkbox input[type="radio"],
.radio input[type="radio"] {
    position: static !important;
    opacity: 1 !important;
    width: 16px;
    height: 16px;
    margin-right: 8px !important;
    vertical-align: middle;
    -webkit-appearance: checkbox;
    appearance: auto;
    accent-color: #1ab394;
    cursor: pointer;
}

/* Avoid double checkbox/radio squares when legacy pseudo-elements and native controls coexist. */
.checkbox,
.checkbox-inline,
.radio {
    padding-left: 0 !important;
}

.checkbox label,
.checkbox-inline label,
.radio label {
    padding-left: 0 !important;
}

.checkbox label::before,
.checkbox label::after,
.radio label::before,
.radio label::after {
    content: none !important;
    display: none !important;
}

.i-checks > i:empty {
    display: none !important;
}

/* Platform-wide rule: no horizontal scrollbars. */
html,
body,
#wrapper,
#page-wrapper,
.wrapper,
.wrapper-content {
    overflow-x: hidden !important;
}

.table-responsive {
    overflow-x: hidden !important;
}

/* Defensive sidebar constraints:
   keep the left menu strictly inside the sidebar width on desktop. */
@media (min-width: 769px) {
    body:not(.top-navigation) .navbar-static-side {
        width: 220px !important;
        max-width: 220px !important;
        overflow-x: hidden !important;
    }

    body:not(.top-navigation) .sidebar-collapse,
    body:not(.top-navigation) #side-menu {
        width: 100%;
        max-width: 220px;
        overflow-x: hidden;
    }

    body:not(.top-navigation) #side-menu > li,
    body:not(.top-navigation) #side-menu > li > a,
    body:not(.top-navigation) #side-menu > li > .nav-second-level {
        max-width: 220px;
    }

    body.mini-navbar:not(.top-navigation) .navbar-static-side {
        width: 70px !important;
        max-width: 70px !important;
    }

    body.mini-navbar:not(.top-navigation) #side-menu,
    body.mini-navbar:not(.top-navigation) #side-menu > li,
    body.mini-navbar:not(.top-navigation) #side-menu > li > a {
        max-width: 70px;
    }

    /* Keep mini-navbar submenu visible on hover/focus.
       Previous overflow constraints were clipping .nav-second-level. */
    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) .navbar-static-side,
    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) .sidebar-collapse,
    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu,
    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li {
        overflow: visible !important;
    }

    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li {
        position: relative;
    }

    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li > .nav-second-level {
        left: 66px;
        top: 0;
        min-width: 180px;
        max-width: none;
        z-index: 2050;
    }

    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li > .nav-second-level::before {
        content: "";
        position: absolute;
        top: 0;
        left: -14px;
        width: 14px;
        height: 100%;
    }

    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li:hover > .nav-second-level,
    body.mini-navbar:not(.top-navigation):not(.fixed-sidebar):not(.canvas-menu) #side-menu > li:focus-within > .nav-second-level {
        display: block !important;
    }
}

/* Advanced table standardization (system-wide) */
.dataTables_wrapper.codexa-dt-standard {
    padding-bottom: 18px;
}

.dataTables_wrapper.codexa-dt-standard .codexa-dt-toolbar,
.dataTables_wrapper.codexa-dt-standard .codexa-dt-footer {
    margin-left: 0;
    margin-right: 0;
}

.dataTables_wrapper.codexa-dt-standard .codexa-dt-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

/* Bootstrap rows use :before/:after for float clearing. In flex toolbars these
   pseudo-elements become extra flex items and visually center the controls. */
.dataTables_wrapper.codexa-dt-standard .codexa-dt-toolbar::before,
.dataTables_wrapper.codexa-dt-standard .codexa-dt-toolbar::after,
.dataTables_wrapper.codexa-dt-standard .codexa-dt-footer::before,
.dataTables_wrapper.codexa-dt-standard .codexa-dt-footer::after {
    content: none !important;
    display: none !important;
}

.dataTables_wrapper.codexa-dt-standard .codexa-dt-length,
.dataTables_wrapper.codexa-dt-standard .codexa-dt-search {
    float: none !important;
    width: auto;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_length label,
.dataTables_wrapper.codexa-dt-standard .dataTables_filter label {
    margin: 0;
    font-weight: 600;
    color: #3d4c5c;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_length select,
.dataTables_wrapper.codexa-dt-standard .dataTables_filter input {
    min-height: 36px;
    border-radius: 6px;
    border: 1px solid #cfd9e3;
    padding: 6px 10px;
    outline: none;
    box-shadow: none;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_filter {
    text-align: right;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_filter input {
    min-width: 230px;
}

.dataTables_wrapper.codexa-dt-standard .codexa-dt-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_info,
.dataTables_wrapper.codexa-dt-standard .dataTables_paginate {
    float: none !important;
    width: auto;
}

.dataTables_wrapper.codexa-dt-standard .dataTables_info {
    color: #5a6b7d;
    font-weight: 600;
}

.dataTables_wrapper.codexa-dt-standard .pagination > li > a,
.dataTables_wrapper.codexa-dt-standard .pagination > li > span {
    border-radius: 6px !important;
}

.js-codexa-export-toolbar {
    box-sizing: border-box;
    clear: both;
    display: block;
    float: none !important;
    margin: 0 0 10px 0 !important;
    max-width: 100%;
    overflow: visible;
    padding-left: 10px;
    padding-right: 10px;
    text-align: left !important;
    width: 100%;
}

.js-codexa-export-toolbar::before,
.js-codexa-export-toolbar::after {
    content: none !important;
    display: none !important;
}

.js-codexa-export-toolbar .btn-group {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-start;
    max-width: 100%;
    width: 100%;
}

.js-codexa-export-toolbar .btn-group .btn {
    border-radius: 6px !important;
    float: none !important;
    font-weight: 700;
    margin: 0 0 6px 0 !important;
    padding: 6px 10px;
    white-space: nowrap;
}

.js-codexa-export-toolbar .btn-group .btn:first-child {
    margin-left: 0 !important;
}

.js-codexa-export-toolbar .btn i {
    margin-right: 4px;
}

.dataTables_wrapper > .row {
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100%;
}

.dataTables_wrapper > .row > [class*="col-"] {
    box-sizing: border-box;
    min-width: 0;
}

.modal .dataTables_wrapper.codexa-dt-standard .dataTables_filter input {
    min-width: 180px;
}

html.codexa-theme-dark .dataTables_wrapper.codexa-dt-standard .dataTables_length label,
html.codexa-theme-dark .dataTables_wrapper.codexa-dt-standard .dataTables_filter label {
    color: #c8d8e9;
}

html.codexa-theme-dark .dataTables_wrapper.codexa-dt-standard .dataTables_length select {
    border-color: #4f7092;
    background: #13273d;
    color: #edf4fb;
    box-shadow: inset 0 0 0 1px rgba(210, 228, 245, .12);
    font-weight: 700;
}

html.codexa-theme-dark .dataTables_wrapper.codexa-dt-standard .dataTables_filter input {
    border-color: #4f7092;
    background: #081524;
    color: #edf4fb;
}

@media (max-width: 991px) {
    .dataTables_wrapper.codexa-dt-standard .codexa-dt-toolbar,
    .dataTables_wrapper.codexa-dt-standard .codexa-dt-footer {
        flex-wrap: wrap;
    }

    .dataTables_wrapper.codexa-dt-standard .dataTables_filter {
        text-align: left;
    }

    .dataTables_wrapper.codexa-dt-standard .dataTables_filter input {
        min-width: 160px;
        width: 100%;
    }
}

/* Smart select standardization (system-wide) */
:root {
    --codexa-select-visible-items: 5;
    --codexa-select-row-height: 38px;
}

.select2-dropdown.codexa-smart-select-dropdown .select2-results__options {
    max-height: calc(var(--codexa-select-visible-items) * var(--codexa-select-row-height)) !important;
    overflow-y: auto !important;
}

.select2-dropdown.codexa-smart-select-dropdown .select2-search__field {
    border-radius: 4px;
}

.select2-container--open {
    z-index: 21050 !important;
}

.select2-dropdown.codexa-smart-select-dropdown {
    z-index: 21060 !important;
}

.chosen-container .chosen-drop .chosen-results {
    max-height: calc(var(--codexa-select-visible-items) * var(--codexa-select-row-height)) !important;
    overflow-y: auto !important;
}
