@media print {
    .page-break {
        page-break-before: always; /* or page-break-after: always */
        break-before: page; /* modern syntax */
    }

    .page-title-box {
        display: block !important;
    }

    /* If it’s inside something that is hidden in print: */
    .content .page-title-box {
        display: block !important;
    }

    /* Optional: neutralize sticky/spacing chrome so it prints nicely */
    .page-title-box {
        position: static !important;
        box-shadow: none !important;
    }
}

.border-right-light {
    border-right: 1px solid #ccc;
}


.icon-when-closed {
    display: none;
}

[aria-expanded="false"] .icon-when-open {
    display: none;
}

[aria-expanded="false"] .icon-when-closed {
    display: inline-block;
}

/*
 * HyperSage theme overrides
 *
 * Keep vendor theme files unchanged. This stylesheet loads after app.css,
 * so shared colors can be adjusted here without rebuilding the template.
 */
:root,
[data-bs-theme="light"] {
    --ct-primary: #d1d5db;
    --ct-primary-rgb: 209, 213, 219;
    --ct-primary-text-emphasis: #52525b;
    --ct-primary-bg-subtle: #e5e7eb;
    --ct-primary-border-subtle: #d1d5db;
    --ct-link-color: #9f1d2d;
    --ct-link-color-rgb: 159, 29, 45;
    --ct-link-hover-color: #791622;
    --ct-link-hover-color-rgb: 121, 22, 34;
    --ct-focus-ring-color: rgba(209, 213, 219, 0.35);
    --ct-body-color: #52525b;
    --ct-body-color-rgb: 82, 82, 91;
    --ct-body-bg: #f3f4f6;
    --ct-body-bg-rgb: 243, 244, 246;
    --ct-secondary-color: #71717a;
    --ct-secondary-color-rgb: 113, 113, 122;
    --ct-secondary-bg: #ffffff;
    --ct-secondary-bg-rgb: 255, 255, 255;
    --ct-tertiary-color: #9f1d2d;
    --ct-tertiary-color-rgb: 159, 29, 45;
    --ct-tertiary: #9f1d2d;
    --ct-tertiary-rgb: 159, 29, 45;
    --ct-tertiary-lighten: #f8e8ea;
    --ct-tertiary-lighten-rgb: 248, 232, 234;
    --ct-tertiary-bg: #f8e8ea;
    --ct-tertiary-bg-rgb: 248, 232, 234;
    --ct-border-color: #d1d5db;
    --ct-border-color-translucent: #e5e7eb;
    --ct-menu-condensed-link-bg: #9f1d2d;
}

[data-bs-theme="dark"] {
    --ct-primary: #52525b;
    --ct-primary-rgb: 82, 82, 91;
    --ct-body-color: #e4e4e7;
    --ct-body-color-rgb: 228, 228, 231;
    --ct-emphasis-color: #fafafa;
    --ct-emphasis-color-rgb: 250, 250, 250;
    --ct-secondary-color: #aeaeb6;
    --ct-secondary-color-rgb: 174, 174, 182;
    --ct-tertiary-color: #e5aeb6;
    --ct-tertiary-color-rgb: 229, 174, 182;
    --ct-heading-color: #f4f4f5;
    --ct-primary-text-emphasis: #d4d4d8;
    --ct-primary-bg-subtle: #52525b;
    --ct-primary-border-subtle: #71717a;
    --ct-link-color: #e5aeb6;
    --ct-link-color-rgb: 229, 174, 182;
    --ct-link-hover-color: #f0cbd0;
    --ct-link-hover-color-rgb: 240, 203, 208;
    --ct-body-bg: #27272a;
    --ct-body-bg-rgb: 39, 39, 42;
    --ct-secondary-bg: #3f3f46;
    --ct-secondary-bg-rgb: 63, 63, 70;
    --ct-tertiary: #9f1d2d;
    --ct-tertiary-rgb: 159, 29, 45;
    --ct-tertiary-lighten: rgba(159, 29, 45, 0.22);
    --ct-tertiary-lighten-rgb: 159, 29, 45;
    --ct-tertiary-bg: rgba(159, 29, 45, 0.22);
    --ct-tertiary-bg-rgb: 159, 29, 45;
    --ct-border-color: #52525b;
    --ct-border-color-translucent: #3f3f46;
}

.bg-tertiary {
    --ct-bg-opacity: 1;
    background-color: rgba(var(--ct-tertiary-rgb), var(--ct-bg-opacity)) !important;
}

.bg-tertiary-lighten {
    --ct-bg-opacity: 1;
    background-color: rgba(var(--ct-tertiary-lighten-rgb), var(--ct-bg-opacity)) !important;
}

.text-bg-tertiary {
    color: var(--ct-white) !important;
    background-color: var(--ct-tertiary) !important;
}

[data-bs-theme="dark"] .text-bg-tertiary {
    color: var(--ct-light) !important;
}

html[data-menu-color="light"] {
    --ct-menu-bg: #f5f5f5;
    --ct-menu-item-color: #52525b;
    --ct-menu-item-hover-color: #9f1d2d;
    --ct-menu-item-active-color: #9f1d2d;
    --ct-help-box-bg: #9f1d2d;
}

html[data-menu-color="brand"] {
    --ct-menu-bg: linear-gradient(135deg, #292929 0%, #58151d 100%);
}

html[data-topbar-color="light"] {
    --ct-topbar-bg: #fafafa;
    --ct-topbar-item-color: #52525b;
    --ct-topbar-item-hover-color: #9f1d2d;
    --ct-topbar-search-bg: #e5e7eb;
    --ct-topbar-user-bg: #f4f4f5;
    --ct-topbar-user-border: #d1d5db;
}

html[data-topbar-color="brand"] {
    --ct-topbar-bg: linear-gradient(135deg, #292929 0%, #58151d 100%);
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .wrapper .leftside-menu .side-nav .side-nav-item:hover .side-nav-link {
    background: var(--ct-menu-condensed-link-bg);
}

.btn-primary {
    --ct-btn-color: #292929;
    --ct-btn-bg: #d1d5db;
    --ct-btn-border-color: #d1d5db;
    --ct-btn-hover-color: #292929;
    --ct-btn-hover-bg: #c4c9d1;
    --ct-btn-hover-border-color: #c4c9d1;
    --ct-btn-active-color: #292929;
    --ct-btn-active-bg: #b8bec8;
    --ct-btn-active-border-color: #b8bec8;
    --ct-btn-disabled-color: #292929;
    --ct-btn-disabled-bg: #d1d5db;
    --ct-btn-disabled-border-color: #d1d5db;
    --ct-btn-focus-shadow-rgb: 209, 213, 219;
}

.btn-outline-primary {
    --ct-btn-color: #52525b;
    --ct-btn-border-color: #d1d5db;
    --ct-btn-hover-color: #292929;
    --ct-btn-hover-bg: #d1d5db;
    --ct-btn-hover-border-color: #d1d5db;
    --ct-btn-active-color: #292929;
    --ct-btn-active-bg: #c4c9d1;
    --ct-btn-active-border-color: #c4c9d1;
    --ct-btn-disabled-color: #71717a;
    --ct-btn-disabled-border-color: #d1d5db;
    --ct-btn-focus-shadow-rgb: 209, 213, 219;
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--ct-primary);
    border-color: var(--ct-primary);
}

.form-range::-webkit-slider-thumb,
.form-range::-moz-range-thumb {
    background-color: var(--ct-primary);
}

.form-range::-webkit-slider-thumb:active,
.form-range::-moz-range-thumb:active {
    background-color: #e5e7eb;
}

.nav-pills {
    --ct-nav-pills-link-active-bg: var(--ct-primary);
}

.pagination {
    --ct-pagination-active-bg: var(--ct-primary);
    --ct-pagination-active-border-color: var(--ct-primary);
}

.progress {
    --ct-progress-bar-bg: var(--ct-primary);
}

.list-group {
    --ct-list-group-active-bg: var(--ct-primary);
    --ct-list-group-active-border-color: var(--ct-primary);
}

.table-striped {
    --ct-table-striped-bg: var(--ct-primary-bg-subtle);
}

input[data-switch="primary"]:checked + label {
    background-color: var(--ct-primary);
}