:root {
    --base10: #F7F7FA;
    --base20: #E5E7EC;
    --base30: #BBC0CE;
    --base50: #77819C;
    --base70: #646E8A;
    --base80: #47516E;
    --base90: #353F5E;
    --base-black: #08031D;
    --informative10: #E2DEF7;
    --informative50: #705CD6;
    --informative70: #4F37C9;
    --base-white: #FFFFFF;
    --primary10: #E8F0FF;
    --primary20: #B5CFFE;
    --primary30: #7DABFF;
    --primary50: #1769FF;
    --primary70: #1254CC;
    --primary80: #0E3F99;
    --primary90: #092A66;
    --warning10: #FCF1D9;
    --warning20: #FFE5B4;
    --warning30: #FFD27B;
    --warning50: #FFC043;
    --warning70: #FFB234;
    --warning80: #FFB234;
    --warning90: #A15D24;
    --danger10: #F8DDDD;
    --danger20: #FCBCBB;
    --danger30: #F97877;
    --danger50: #F73E3C;
    --danger70: #B92624;
    --danger80: #A41313;
    --danger90: #8C0000;
    --success10: #CCEEDC;
    --success30: #4DC484;
    --success70: #00893F;
    --success80: #00672F;
    --emerald70: #008F29;
    --coral50: #FF587A;
    --grid-row-height: 52px;
    --lightBase: #B0B9C9;
    --lightBrand: #044FDC;

    /*
    -------------------------
    -- COMPLETE BOOTSTRAP & DASHKIT COLOR OVERRIDES
    -------------------------
    */
    
    /* Override Dashkit's root colors first */
    --bs-blue: #3e5c82;
    --bs-indigo: #6b5eae;
    --bs-purple: #6b5eae;
    --bs-pink: #ff679b;
    --bs-red: #c62828;
    --bs-orange: #ee8f4e;
    --bs-yellow: #ffb300;
    --bs-green: #2e8b57;
    --bs-teal: #4682b4;
    --bs-cyan: #4682b4;
    --bs-black: #333333;
    --bs-white: #ffffff;
    
    /* Primary Theme Colors with RGB variants */
    --bs-primary: #3e5c82;
    --bs-primary-rgb: 62, 92, 130;
    --bs-secondary: #9ac2d9;
    --bs-secondary-rgb: 154, 194, 217;
    --bs-success: #2e8b57;
    --bs-success-rgb: 46, 139, 87;
    --bs-info: #4682b4;
    --bs-info-rgb: 70, 130, 180;
    --bs-warning: #ffb300;
    --bs-warning-rgb: 255, 179, 0;
    --bs-danger: #c62828;
    --bs-danger-rgb: 198, 40, 40;
    --bs-light: #e4f4f7;
    --bs-light-rgb: 228, 244, 247;
    --bs-dark: #333333;
    --bs-dark-rgb: 51, 51, 51;
    
    /* Gray Scale Override */
    --bs-gray: #95aac9;
    --bs-gray-dark: #3b506c;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    
    /* Body & Background Colors */
    --bs-body-color: #333333;
    --bs-body-color-rgb: 51, 51, 51;
    --bs-body-bg: #ffffff;
    --bs-body-bg-rgb: 255, 255, 255;
    
    /* Border & Link Colors */
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(51, 51, 51, 0.175);
    --bs-link-color: #3e5c82;
    --bs-link-hover-color: #253849;
    --bs-code-color: #3e5c82;
    --bs-highlight-bg: #fff0cc;
    
    /* Card Colors */
    --bs-card-color: #3e5c82;
    --bs-card-bg: #ffffff;
    --bs-card-border-color: rgba(62, 92, 130, 0.125);
    --bs-card-cap-color: #3e5c82;
}

/* 
-------------------------
-- BUTTON CLASS OVERRIDES
-------------------------
*/

/* Base Button Styles */
.btn {
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
}

/* Primary Button */
.btn-primary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #3e5c82;
    --bs-btn-border-color: #3e5c82;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #324a68;
    --bs-btn-hover-border-color: #2f455f;
    --bs-btn-focus-shadow-rgb: 94, 122, 160;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #2a3e57;
    --bs-btn-active-border-color: #253849;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #3e5c82;
    --bs-btn-disabled-border-color: #3e5c82;
}

/* Secondary Button */
.btn-secondary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #9ac2d9;
    --bs-btn-border-color: #9ac2d9;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #7fb4ce;
    --bs-btn-hover-border-color: #77adc8;
    --bs-btn-focus-shadow-rgb: 174, 208, 227;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #6ea5c2;
    --bs-btn-active-border-color: #6ba0bd;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #9ac2d9;
    --bs-btn-disabled-border-color: #9ac2d9;
}

/* Success Button */
.btn-success {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #2e8b57;
    --bs-btn-border-color: #2e8b57;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #267645;
    --bs-btn-hover-border-color: #246d41;
    --bs-btn-focus-shadow-rgb: 78, 159, 115;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #21633c;
    --bs-btn-active-border-color: #1f5e39;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #2e8b57;
    --bs-btn-disabled-border-color: #2e8b57;
}

/* Info Button */
.btn-info {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #4682b4;
    --bs-btn-border-color: #4682b4;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #3a6d95;
    --bs-btn-hover-border-color: #37668c;
    --bs-btn-focus-shadow-rgb: 100, 150, 196;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #345e82;
    --bs-btn-active-border-color: #315879;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #4682b4;
    --bs-btn-disabled-border-color: #4682b4;
}

/* Warning Button */
.btn-warning {
    --bs-btn-color: #000000;
    --bs-btn-bg: #ffb300;
    --bs-btn-border-color: #ffb300;
    --bs-btn-hover-color: #000000;
    --bs-btn-hover-bg: #d99600;
    --bs-btn-hover-border-color: #cc8f00;
    --bs-btn-focus-shadow-rgb: 217, 151, 0;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: #cc8f00;
    --bs-btn-active-border-color: #bf8700;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000000;
    --bs-btn-disabled-bg: #ffb300;
    --bs-btn-disabled-border-color: #ffb300;
}

/* Danger Button */
.btn-danger {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #c62828;
    --bs-btn-border-color: #c62828;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #a52020;
    --bs-btn-hover-border-color: #9c1e1e;
    --bs-btn-focus-shadow-rgb: 218, 70, 70;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #931d1d;
    --bs-btn-active-border-color: #8a1b1b;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #c62828;
    --bs-btn-disabled-border-color: #c62828;
}

/* Light Button */
.btn-light {
    --bs-btn-color: #000000;
    --bs-btn-bg: #e4f4f7;
    --bs-btn-border-color: #e4f4f7;
    --bs-btn-hover-color: #000000;
    --bs-btn-hover-bg: #c2d3d6;
    --bs-btn-hover-border-color: #b8cccf;
    --bs-btn-focus-shadow-rgb: 193, 207, 210;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: #b8cccf;
    --bs-btn-active-border-color: #b1c7ca;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000000;
    --bs-btn-disabled-bg: #e4f4f7;
    --bs-btn-disabled-border-color: #e4f4f7;
}

/* Dark Button */
.btn-dark {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #333333;
    --bs-btn-border-color: #333333;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #2b2b2b;
    --bs-btn-hover-border-color: #292929;
    --bs-btn-focus-shadow-rgb: 79, 79, 79;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #262626;
    --bs-btn-active-border-color: #242424;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #333333;
    --bs-btn-disabled-border-color: #333333;
}

/* Outline Button Variants */
.btn-outline-primary {
    --bs-btn-color: #3e5c82;
    --bs-btn-border-color: #3e5c82;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #3e5c82;
    --bs-btn-hover-border-color: #3e5c82;
    --bs-btn-focus-shadow-rgb: 62, 92, 130;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #3e5c82;
    --bs-btn-active-border-color: #3e5c82;
}

.btn-outline-secondary {
    --bs-btn-color: #9ac2d9;
    --bs-btn-border-color: #9ac2d9;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #9ac2d9;
    --bs-btn-hover-border-color: #9ac2d9;
    --bs-btn-focus-shadow-rgb: 154, 194, 217;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #9ac2d9;
    --bs-btn-active-border-color: #9ac2d9;
}

/* 
-------------------------
-- COMPONENT OVERRIDES
-------------------------
*/

/* Link Colors */
a {
    color: var(--bs-link-color);
}

a:hover, 
a:focus {
    color: var(--bs-link-hover-color);
}

/* Nav Pills */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #ffffff;
    background-color: #3e5c82;
}

/* Table Colors */
.table-primary {
    --bs-table-color: #253849;
    --bs-table-bg: #d8dee6;
    --bs-table-border-color: #c5cdd8;
}

.table-secondary {
    --bs-table-color: #3d4e56;
    --bs-table-bg: #ebf3f7;
    --bs-table-border-color: #d8e5ec;
}

/* Badge Colors */
.badge.bg-primary {
    background-color: #3e5c82 !important;
}

.badge.bg-secondary {
    background-color: #9ac2d9 !important;
}

.card-body {
    color: var(--bs-card-color);
}

/* 
-------------------------
-- SOFT COLOR OVERRIDES
-------------------------
*/

/* primary-soft: #d8dee6 (Calculated 20% tint of #3e5c82) */
.bg-primary-soft,
.bg-primary-soft .plane-primary {
    background-color: #d8dee6 !important;
    color: var(--bs-primary) !important;
}

.badge.bg-primary-soft[href]:focus, 
.badge.bg-primary-soft[href]:hover {
    background-color: #c5cdd8 !important;
}

/* secondary-soft: #ebf3f7 (Calculated 20% tint of #9ac2d9) */
.bg-secondary-soft {
    background-color: #ebf3f7 !important;
}

.badge.bg-secondary-soft[href]:focus, 
.badge.bg-secondary-soft[href]:hover {
    background-color: #d8e5ec !important;
}

/* success-soft: #d4f4e4 (From brand palette) */
.bg-success-soft,
.bg-success-soft .plane-success {
    background-color: #d4f4e4 !important;
    color: var(--bs-success) !important;
}

.badge.bg-success-soft[href]:focus, 
.badge.bg-success-soft[href]:hover {
    background-color: #b9ecd1 !important;
}

/* info-soft: #dde6ef (Calculated 20% tint of #4682b4) */
.bg-info-soft {
    background-color: #dde6ef !important;
    color: var(--bs-info) !important;
}

.badge.bg-info-soft[href]:focus, 
.badge.bg-info-soft[href]:hover {
    background-color: #c9d5e1 !important;
}

/* warning-soft: #fff0cc (From brand palette) */
.bg-warning-soft,
.bg-warning-soft .plane-warning {
    background-color: #fff0cc !important;
    color: var(--bs-warning) !important;
}

.badge.bg-warning-soft[href]:focus, 
.badge.bg-warning-soft[href]:hover {
    background-color: #ffe8b3 !important;
}

/* danger-soft: #f4d4d4 (From brand palette) */
.bg-danger-soft {
    background-color: #f4d4d4 !important;
    color: var(--bs-danger) !important;
}

.badge.bg-danger-soft[href]:focus, 
.badge.bg-danger-soft[href]:hover {
    background-color: #eac1c1 !important;
}

/* light-soft: #f7fbfc (Calculated 20% tint of #e4f4f7) */
.bg-light-soft {
    background-color: #f7fbfc !important;
    color: var(--bs-light) !important;
}

.badge.bg-light-soft[href]:focus, 
.badge.bg-light-soft[href]:hover {
    background-color: #e4f4f7 !important;
}

/* dark-soft: #d6d6d6 (Calculated 20% tint of #333333) */
.bg-dark-soft {
    background-color: #d6d6d6 !important;
    color: var(--bs-dark) !important;
}

.badge.bg-dark-soft[href]:focus, 
.badge.bg-dark-soft[href]:hover {
    background-color: #c4c4c4 !important;
}

/* 
-------------------------
-- PLANE-OF-MOTION COLORS
-------------------------
   Used on Routine Add/Edit pages and anywhere GetCardCssClass() is applied.
   Transverse = warning (yellow), Frontal = success (green), Sagittal = primary (blue).
*/
.plane-warning {
    background-color: #fff3cd;
}

.plane-success {
    background-color: #d1e7dd;
}

.plane-primary {
    background-color: #cff4fc;
}

/* Accent color utilities */
.text-accent {
    color: #ee8f4e !important;
}

.text-accent:hover {
    color: #d97934 !important;
}

html {
    font-size: 16px;
}

body {
    font-family: 'Poppins', sans-serif;
    font-size: 0.875rem;
    color: var(--base-black);
}

/* Messaging System Styles */
.message-thread {
    transition: all 0.2s ease;
}

.message-thread:hover {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.message-thread.unread {
    border-left: 4px solid #007bff;
    background-color: #f8f9fa;
}

.message-preview {
    line-height: 1.5;
    max-height: 3em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Message conversation styles */
.message-left {
    width: fit-content;
    max-width: 80%;
    min-width: 250px;
}

.message-right {
    width: fit-content;
    max-width: 80%;
    min-width: 250px;
    margin-left: auto;
    background-color: #f8f9fa;
}

.message-right .col-auto .avatar {
    margin-right: 0;
    margin-left: 0.25rem;
}

.message-content {
    line-height: 1.6;
}

.message-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.375rem;
    margin: 0.5rem 0;
}

/* Tom Select customization */
.ts-control {
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
}

.ts-control.focus {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

/* Quill editor customization */
.ql-container.ql-snow {
    border: none !important;
}

/* Add border only when editing (when toolbar is present) */
.ql-container.ql-snow:has(.ql-toolbar) {
    border: 1px solid var(--base30) !important;
}

.ql-container.ql-snow:has(.ql-toolbar) .ql-editor {
    border-top: 1px solid var(--base30) !important;
}

/* Display mode should have no borders and size to content */
.quill-display .ql-editor {
    border: none !important;
    padding: 0 !important;
    background: inherit;
    min-height: auto !important;
    height: auto !important;
}

.quill-display .ql-container.ql-snow {
    border: none !important;
    height: auto !important;
}

.ql-toolbar.ql-snow {
    border: 1px solid var(--bs-gray-400);
}

/* ===================================
   RESPONSIVE TABLE & CLICKABLE ROWS
   =================================== */

/* Clickable row styles */
.table-clickable tbody tr {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.table-clickable tbody tr:hover {
    background-color: var(--bs-gray-50, #f8f9fa);
}

/* Prevent double-click styling on buttons within clickable rows */
.table-clickable tbody tr .btn {
    pointer-events: auto;
}

/* Mobile responsive card layout */
@media (max-width: 768px) {
    /* Hide table on mobile */
    .responsive-table-mobile .table-responsive {
        display: none;
    }
    
    /* Show card layout on mobile */
    .responsive-table-mobile .mobile-card-layout {
        display: block;
    }
    
    /* Card styles */
    .mobile-card {
        border: 1px solid var(--bs-border-color);
        border-radius: 0.375rem;
        margin-bottom: 1rem;
        background: white;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        cursor: pointer;
        transition: all 0.2s ease;
    }
    
    .mobile-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }
    
    .mobile-card-header {
        padding: 0.75rem;
        border-bottom: 1px solid var(--bs-border-color);
        background-color: var(--bs-gray-50, #f8f9fa);
        font-weight: 600;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .mobile-card-body {
        padding: 0.75rem;
    }
    
    .mobile-card-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.5rem;
        padding: 0.25rem 0;
        border-bottom: 1px solid var(--bs-gray-100, #f8f9fa);
    }
    
    .mobile-card-row:last-child {
        margin-bottom: 0;
        border-bottom: none;
    }
    
    .mobile-card-label {
        font-weight: 500;
        color: var(--bs-gray-600);
        font-size: 0.8rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    .mobile-card-value {
        text-align: right;
        flex-shrink: 0;
        margin-left: 1rem;
    }
    
    .mobile-card-footer {
        padding: 0.75rem;
        background-color: var(--bs-gray-50, #f8f9fa);
        border-top: 1px solid var(--bs-border-color);
        text-align: right;
    }
    
    /* Avatar in cards */
    .mobile-card-avatar {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
}

/* Desktop: Hide mobile cards */
@media (min-width: 769px) {
    .responsive-table-mobile .mobile-card-layout {
        display: none;
    }
}

/* Mobile card layout spacing */
@media (max-width: 768px) {
    .mobile-card-layout {
        padding: 1rem;
    }
}

/* Pagination styling for card footers */
#paginationFooter .pagination,
#paginationFooter .page-item {
    display: flex;
}

#paginationFooter .page-link {
    display: flex;
    align-items: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* ===================================
   OVERALL SCORE STATUS ICON
   =================================== */

.overall-score-status-icon {
    font-size: 72px;
    line-height: 1;
    display: block;
}

/* Print-specific styles for overall score status */
@media print {
    .overall-score-status-icon {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* ===================================
   MEASUREMENT CANVAS — TOUCH & MOBILE
   =================================== */

/* Prevent default touch actions on Fabric.js canvas containers so that
   touch events are handled by the canvas (keypoint dragging) rather than
   scrolling the page. Applied as a CSS fallback; also set via JS in
   posture-canvas.js for runtime-created wrappers. */
.posture-canvas-wrapper {
    touch-action: none;
}

/* Responsive toolbar buttons on small screens — ensure minimum 44×44 px
   touch targets per WCAG / mobile UX guidelines. */
@media (max-width: 768px) {
    .canvas-toolbar .btn,
    .canvas-toolbar .canvas-tool-btn,
    .canvas-toolbar .canvas-zoom-in,
    .canvas-toolbar .canvas-zoom-out {
        min-width: 44px;
        min-height: 44px;
        padding: 0.5rem;
        font-size: 1rem;
    }

    .canvas-toolbar .canvas-zoom-level {
        min-height: 44px;
        line-height: 44px;
    }

    .canvas-toolbar .form-check {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    /* Stack toolbar items more compactly on very small screens */
    .canvas-toolbar .d-flex {
        flex-wrap: wrap;
        gap: 0.25rem;
    }
}

/* ===================================
   DATATABLES OVERRIDES
   =================================== */

/* Remove default DataTables margins inside cards */
.card .dataTables_wrapper {
    padding: 0;
}

/* Pagination — match Dashkit card-pagination (Prev / Page X of Y / Next) */
.dataTables_wrapper .dataTables_paginate {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem 1.5rem;
}

/* Hide numbered page buttons, keep only prev/next */
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.previous):not(.next) {
    display: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: none !important;
    background: none !important;
    color: var(--bs-body-color) !important;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous {
    padding-right: 1rem;
    border-right: 1px solid var(--bs-border-color) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.next {
    padding-left: 1rem;
    border-left: 1px solid var(--bs-border-color) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled) {
    background: none !important;
    color: var(--bs-primary) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: var(--bs-gray-400) !important;
    cursor: default;
}

/* Info + pagination footer — match Dashkit card-footer layout */
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    border-top: 1px solid var(--bs-border-color);
}

.dataTables_wrapper .dataTables_info {
    color: #95aac9;
    font-size: 0.8125rem;
    padding: 0.75rem 1.5rem;
    float: left;
}

.dataTables_wrapper .dataTables_paginate {
    float: right;
}

/* Hide default DataTables length/filter when we provide our own */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    display: none;
}

/* Export button group styling */
#compliance-export-buttons .dt-buttons {
    display: flex;
    gap: 0.25rem;
}

#compliance-export-buttons .dt-button {
    font-size: 0.8125rem;
    padding: 0.25rem 0.75rem;
    border: 1px solid var(--bs-gray-300);
    border-radius: 0.375rem;
    background: #fff;
    color: var(--bs-body-color);
    cursor: pointer;
    white-space: nowrap;
}

#compliance-export-buttons .dt-button:hover {
    background: var(--bs-gray-100);
    border-color: var(--bs-gray-400);
}

/* Ensure table header sort arrows don't conflict with card-table styling */
.card-table.dataTable thead th {
    border-bottom-width: 1px;
}