


/**
 * Risviel Design System — Design Tokens
 *
 * Single source of truth for all visual properties across the ecosystem.
 * Themes override these variables to change the entire look & feel.
 *
 * Namespace: --rs-* (Risviel System)
 * Replaces: --mg-* (ModuleGenerator), --sidebar-* (inline layouts)
 *
 * Usage: var(--rs-card-bg), var(--rs-sidebar-bg), etc.
 *
 * @version 1.0.0
 * @since   2026-04-11
 */

/* ============================================================================
   1. DESIGN TOKENS — Light Mode (Default)
   ============================================================================ */

:root {
    /* ── Brand Colors ── */
    --rs-primary:           #0d6efd;
    --rs-primary-rgb:       13, 110, 253;
    --rs-secondary:         #6c757d;
    --rs-secondary-rgb:     108, 117, 125;
    --rs-success:           #198754;
    --rs-success-rgb:       25, 135, 84;
    --rs-warning:           #ffc107;
    --rs-warning-rgb:       255, 193, 7;
    --rs-danger:            #dc3545;
    --rs-danger-rgb:        220, 53, 69;
    --rs-info:              #0dcaf0;
    --rs-info-rgb:          13, 202, 240;
    --rs-orange:            #fd7e14;
    --rs-orange-rgb:        253, 126, 20;
    --rs-purple:            #6f42c1;
    --rs-purple-rgb:        111, 66, 193;

    /* ── Accent (used by some modules for primary accent) ── */
    --rs-accent:            #667eea;
    --rs-accent-rgb:        102, 126, 234;

    /* ── Typography ── */
    --rs-font-sans:         system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
    --rs-font-mono:         "Fira Code", "Cascadia Code", "JetBrains Mono", "Consolas", "Monaco", "Courier New", monospace;
    --rs-font-size-base:    0.875rem;     /* 14px — compact admin UI */
    --rs-font-size-xs:      0.65rem;      /* 10.4px — section headers, badges, micro text */
    --rs-font-size-sm:      0.8rem;       /* 12.8px — nav links, small labels */
    --rs-font-size-md:      0.875rem;     /* 14px — body */
    --rs-font-size-lg:      1rem;         /* 16px — larger text */
    --rs-font-size-xl:      1.25rem;      /* 20px — headings */
    --rs-font-size-xxl:     1.5rem;       /* 24px — page titles */
    --rs-line-height:       1.5;
    --rs-line-height-sm:    1.25;
    --rs-line-height-lg:    1.75;

    /* ── Spacing Scale ── */
    --rs-space-0:           0;
    --rs-space-1:           0.25rem;      /* 4px */
    --rs-space-2:           0.5rem;       /* 8px */
    --rs-space-3:           0.75rem;      /* 12px */
    --rs-space-4:           1rem;         /* 16px */
    --rs-space-5:           1.5rem;       /* 24px */
    --rs-space-6:           2rem;         /* 32px */
    --rs-space-8:           3rem;         /* 48px */

    /* ── Border & Radius ── */
    --rs-border-radius:     0.375rem;     /* 6px — Bootstrap default */
    --rs-border-radius-sm:  0.25rem;      /* 4px */
    --rs-border-radius-lg:  0.5rem;       /* 8px */
    --rs-border-radius-xl:  1rem;         /* 16px */
    --rs-border-width:      1px;

    /* ── Shadows ── */
    --rs-shadow-sm:         0 1px 4px rgba(0, 0, 0, 0.06);
    --rs-shadow:            0 2px 10px rgba(0, 0, 0, 0.05);  /* Matches existing card/section shadow */
    --rs-shadow-md:         0 4px 12px rgba(0, 0, 0, 0.1);
    --rs-shadow-lg:         0 8px 24px rgba(0, 0, 0, 0.12);

    /* ── Transitions ── */
    --rs-transition-fast:   0.15s ease;
    --rs-transition:        0.3s ease;
    --rs-transition-slow:   0.5s ease;

    /* ── Touch Target ── */
    --rs-touch-target:      44px;         /* Minimum tap target for mobile */

    /* ── Sidebar ── */
    --rs-sidebar-width:     240px;
    --rs-sidebar-width-collapsed: 60px;
    --rs-sidebar-bg:        #212529;
    --rs-sidebar-text:      rgba(255, 255, 255, 0.8);
    --rs-sidebar-text-hover: #ffffff;
    --rs-sidebar-border:    rgba(255, 255, 255, 0.1);
    --rs-sidebar-hover-bg:  rgba(255, 255, 255, 0.1);
    --rs-sidebar-active-bg: rgba(255, 255, 255, 0.15);
    --rs-sidebar-section-text: rgba(255, 255, 255, 0.5);

    /* ── Portal Sidebar (Customer Portal) ── */
    --rs-portal-sidebar-width: 250px;
    --rs-portal-active-bg:  rgba(var(--rs-primary-rgb), 0.3);
    --rs-portal-active-border: #667eea;

    /* ── Content Colors ── */
    --rs-text-color:        #212529;
    --rs-text-muted:        #6c757d;
    --rs-link-color:        var(--rs-primary);
    --rs-border-color:      #dee2e6;

    /* ── Card ── */
    --rs-card-bg:           #ffffff;
    --rs-card-border:       rgba(0, 0, 0, 0.125);
    --rs-card-header-bg:    #ffffff;
    --rs-card-body-bg:      #fdfdfe;       /* Lieve contrasto rispetto a card-bg */

    /* ── Table ── */
    --rs-table-header-bg:   #f8f9fa;
    --rs-table-hover-bg:    rgba(0, 0, 0, 0.075);
    --rs-table-secondary-bg: rgba(0, 0, 0, 0.05);
    --rs-table-striped-bg:  rgba(0, 0, 0, 0.05);

    /* ── Form ── */
    --rs-input-bg:          #ffffff;
    --rs-input-border:      #ced4da;
    --rs-input-focus-border: #86b7fe;
    --rs-input-focus-shadow: rgba(var(--rs-primary-rgb), 0.25);

    /* ── Code ── */
    --rs-code-bg:           #f8f9fa;
    --rs-code-color:        #d63384;
    --rs-pre-bg:            #f8f9fa;
    --rs-pre-color:         #212529;

    /* ── Modal ── */
    --rs-modal-bg:          #ffffff;
    --rs-modal-header-bg:   #ffffff;

    /* ── List Group ── */
    --rs-list-group-bg:     #ffffff;
    --rs-list-group-hover:  #f8f9fa;
    --rs-list-group-active-bg: var(--rs-primary);

    /* ── Alert ── */
    --rs-alert-info-bg:     #cff4fc;
    --rs-alert-info-border: #b6effb;
    --rs-alert-info-text:   #055160;
    --rs-alert-warning-bg:  #fff3cd;
    --rs-alert-warning-border: #ffecb5;
    --rs-alert-warning-text: #664d03;
    --rs-alert-danger-bg:   #f8d7da;
    --rs-alert-danger-border: #f5c2c7;
    --rs-alert-danger-text: #842029;
    --rs-alert-success-bg:  #d1e7dd;
    --rs-alert-success-border: #badbcc;
    --rs-alert-success-text: #0f5132;
    --rs-alert-secondary-bg: #e2e3e5;
    --rs-alert-secondary-border: #d3d6d8;
    --rs-alert-secondary-text: #41464b;

    /* ── Dropdown ── */
    --rs-dropdown-bg:       #ffffff;
    --rs-dropdown-border:   rgba(0, 0, 0, 0.15);
    --rs-dropdown-link-color: #212529;
    --rs-dropdown-link-hover-bg: #e9ecef;

    /* ── Breadcrumb ── */
    --rs-breadcrumb-divider-color: #6c757d;
    --rs-breadcrumb-active-color: #6c757d;

    /* ── Badge ── */
    --rs-badge-light-bg:    #f8f9fa;
    --rs-badge-light-color: #212529;

    /* ── Tooltip & Popover ── */
    --rs-tooltip-bg:        #000000;
    --rs-tooltip-color:     #ffffff;
    --rs-popover-bg:        #ffffff;
    --rs-popover-border:    rgba(0, 0, 0, 0.2);
}

/* ============================================================================
   2. DESIGN TOKENS — Dark Mode
   ============================================================================ */

[data-bs-theme="dark"] {
    /* ── Sidebar (Dark) ── */
    --rs-sidebar-bg:        #1a1d20;
    --rs-sidebar-text:      rgba(255, 255, 255, 0.75);
    --rs-sidebar-text-hover: #ffffff;
    --rs-sidebar-border:    rgba(255, 255, 255, 0.08);
    --rs-sidebar-hover-bg:  rgba(255, 255, 255, 0.08);
    --rs-sidebar-active-bg: rgba(99, 132, 255, 0.25);
    --rs-sidebar-section-text: rgba(255, 255, 255, 0.4);

    /* ── Portal (Dark) ── */
    --rs-portal-active-bg:  rgba(99, 132, 255, 0.25);

    /* ── Shadows (Dark) ── */
    --rs-shadow-sm:         0 1px 4px rgba(0, 0, 0, 0.2);
    --rs-shadow:            0 2px 10px rgba(0, 0, 0, 0.2);
    --rs-shadow-md:         0 4px 12px rgba(0, 0, 0, 0.3);
    --rs-shadow-lg:         0 8px 24px rgba(0, 0, 0, 0.4);

    /* ── Content Colors (Dark) ── */
    --rs-text-color:        #e9ecef;
    --rs-text-muted:        #adb5bd;
    --rs-link-color:        #6ea8fe;
    --rs-border-color:      #495057;

    /* ── Card (Dark) ── */
    --rs-card-bg:           #212529;
    --rs-card-border:       rgba(255, 255, 255, 0.1);
    --rs-card-header-bg:    #2b3035;
    --rs-card-body-bg:      #252a2f;       /* Lieve contrasto rispetto a card-bg */

    /* ── Table (Dark) ── */
    --rs-table-header-bg:   #343a40;
    --rs-table-hover-bg:    rgba(255, 255, 255, 0.075);
    --rs-table-secondary-bg: rgba(255, 255, 255, 0.05);
    --rs-table-striped-bg:  rgba(255, 255, 255, 0.05);

    /* ── Form (Dark) ── */
    --rs-input-bg:          #2b3035;
    --rs-input-border:      #495057;
    --rs-input-focus-border: #86b7fe;
    --rs-input-focus-shadow: rgba(var(--rs-primary-rgb), 0.25);

    /* ── Code (Dark) ── */
    --rs-code-bg:           #343a40;
    --rs-code-color:        #e685b5;
    --rs-pre-bg:            #1e1e1e;
    --rs-pre-color:         #d4d4d4;

    /* ── Modal (Dark) ── */
    --rs-modal-bg:          #212529;
    --rs-modal-header-bg:   #2b3035;

    /* ── List Group (Dark) ── */
    --rs-list-group-bg:     #2b3035;
    --rs-list-group-hover:  #343a40;

    /* ── Alert (Dark) ── */
    --rs-alert-info-bg:     rgba(13, 202, 240, 0.15);
    --rs-alert-info-border: rgba(13, 202, 240, 0.4);
    --rs-alert-info-text:   #6edff6;
    --rs-alert-warning-bg:  rgba(255, 193, 7, 0.15);
    --rs-alert-warning-border: rgba(255, 193, 7, 0.4);
    --rs-alert-warning-text: #ffda6a;
    --rs-alert-danger-bg:   rgba(220, 53, 69, 0.15);
    --rs-alert-danger-border: rgba(220, 53, 69, 0.4);
    --rs-alert-danger-text: #ea868f;
    --rs-alert-success-bg:  rgba(25, 135, 84, 0.15);
    --rs-alert-success-border: rgba(25, 135, 84, 0.4);
    --rs-alert-success-text: #75b798;
    --rs-alert-secondary-bg: rgba(108, 117, 125, 0.15);
    --rs-alert-secondary-border: rgba(108, 117, 125, 0.4);
    --rs-alert-secondary-text: #a7acb1;

    /* ── Dropdown (Dark) ── */
    --rs-dropdown-bg:       #2b3035;
    --rs-dropdown-border:   rgba(255, 255, 255, 0.15);
    --rs-dropdown-link-color: #e9ecef;
    --rs-dropdown-link-hover-bg: #343a40;

    /* ── Breadcrumb (Dark) ── */
    --rs-breadcrumb-divider-color: #adb5bd;
    --rs-breadcrumb-active-color: #adb5bd;

    /* ── Badge (Dark) ── */
    --rs-badge-light-bg:    #495057;
    --rs-badge-light-color: #e9ecef;

    /* ── Tooltip & Popover (Dark) ── */
    --rs-tooltip-bg:        #f8f9fa;
    --rs-tooltip-color:     #212529;
    --rs-popover-bg:        #2b3035;
    --rs-popover-border:    rgba(255, 255, 255, 0.2);
}

/* ============================================================================
   3. COMPONENT STYLES — Bootstrap Overrides (theme-aware via tokens)
   ============================================================================ */

/* ── Body ── */
body {
    font-family: var(--rs-font-sans);
    font-size: var(--rs-font-size-base);
    line-height: var(--rs-line-height);
    color: var(--rs-text-color);
}

/* ── Headings ── */
h1, h2, h3, h4, h5, h6 {
    color: var(--rs-text-color);
}

/* ── Links ── */
a {
    color: var(--rs-link-color);
}

a:hover {
    color: var(--rs-link-color);
}

/* ── Cards ── */
.card {
    background-color: var(--rs-card-bg);
    border-color: var(--rs-card-border);
    color: var(--rs-text-color);
}

.card-header {
    background-color: var(--rs-card-header-bg);
    border-bottom-color: var(--rs-card-border);
    color: var(--rs-text-color);
}

.card-body {
    background-color: var(--rs-card-body-bg);
    color: var(--rs-text-color);
}

.card-footer {
    background-color: var(--rs-card-header-bg);
    border-top-color: var(--rs-card-border);
    color: var(--rs-text-color);
}

.card-title,
.card-text {
    color: var(--rs-text-color);
}

/* Card header contextual colors (dark mode) */
[data-bs-theme="dark"] .card-header.bg-info   { background-color: #0dcaf0 !important; color: #000 !important; }
[data-bs-theme="dark"] .card-header.bg-warning { background-color: #ffc107 !important; color: #000 !important; }
[data-bs-theme="dark"] .card-header.bg-danger  { background-color: #dc3545 !important; color: #fff !important; }
[data-bs-theme="dark"] .card-header.bg-success { background-color: #198754 !important; color: #fff !important; }
[data-bs-theme="dark"] .card-header.bg-primary { background-color: #0d6efd !important; color: #fff !important; }

/* ── Tables ── */
.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--rs-text-color);
    --bs-table-border-color: var(--rs-border-color);
    color: var(--rs-text-color);
}

.table > :not(caption) > * > * {
    background-color: var(--bs-table-bg);
    border-bottom-color: var(--rs-border-color);
    color: var(--rs-text-color);
}

.table th,
.table td {
    border-color: var(--rs-border-color);
    color: var(--rs-text-color);
}

.table-light,
thead.table-light,
.table-light > th,
.table-light > td {
    --bs-table-bg: var(--rs-table-header-bg);
    --bs-table-color: var(--rs-text-color);
    background-color: var(--rs-table-header-bg) !important;
    color: var(--rs-text-color) !important;
}

.table-hover > tbody > tr:hover > * {
    --bs-table-hover-bg: var(--rs-table-hover-bg);
    --bs-table-hover-color: var(--rs-text-color);
    background-color: var(--rs-table-hover-bg);
    color: var(--rs-text-color);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-striped-bg: var(--rs-table-striped-bg);
    --bs-table-striped-color: var(--rs-text-color);
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
    --bs-table-bg: var(--rs-table-secondary-bg);
    --bs-table-color: var(--rs-text-color);
}

.table-bordered,
.table-bordered > :not(caption) > * > * {
    border-color: var(--rs-border-color);
}

.table-responsive {
    color: var(--rs-text-color);
}

/* ── Forms ── */
.form-control,
.form-select {
    background-color: var(--rs-input-bg);
    border-color: var(--rs-input-border);
    color: var(--rs-text-color);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--rs-input-bg);
    border-color: var(--rs-input-focus-border);
    color: var(--rs-text-color);
    box-shadow: 0 0 0 0.25rem var(--rs-input-focus-shadow);
}

.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
    background-color: var(--rs-table-secondary-bg);
    color: var(--rs-text-muted);
    opacity: 1;
}

.form-control::placeholder {
    color: var(--rs-text-muted);
    opacity: 1;
}

.form-control-plaintext { color: var(--rs-text-color); }
.form-text              { color: var(--rs-text-muted); }
.form-label             { color: var(--rs-text-color); }
.form-check-label       { color: var(--rs-text-color); }

.form-check-input {
    background-color: var(--rs-input-bg);
    border-color: var(--rs-input-border);
}

.form-check-input:checked {
    background-color: var(--rs-primary);
    border-color: var(--rs-primary);
}

.form-check-input:focus {
    border-color: var(--rs-input-focus-border);
    box-shadow: 0 0 0 0.25rem var(--rs-input-focus-shadow);
}

.form-switch .form-check-input {
    background-color: var(--rs-input-bg);
    border-color: var(--rs-input-border);
}

.form-switch .form-check-input:checked {
    background-color: var(--rs-primary);
    border-color: var(--rs-primary);
}

.input-group-text {
    background-color: var(--rs-table-header-bg);
    border-color: var(--rs-input-border);
    color: var(--rs-text-color);
}

.form-floating > label {
    color: var(--rs-text-muted);
}

.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
    color: var(--rs-text-muted);
}

/* ── Code & Pre ── */
code {
    background-color: var(--rs-code-bg);
    color: var(--rs-code-color);
    padding: 0.125rem 0.375rem;
    border-radius: var(--rs-border-radius-sm);
}

pre {
    background-color: var(--rs-pre-bg);
    color: var(--rs-pre-color);
    border-radius: var(--rs-border-radius);
}

pre code {
    background-color: transparent;
    color: inherit;
    padding: 0;
}

/* ── List Groups ── */
.list-group-item {
    background-color: var(--rs-list-group-bg);
    border-color: var(--rs-border-color);
    color: var(--rs-text-color);
}

.list-group-item:hover,
.list-group-item-action:hover {
    background-color: var(--rs-list-group-hover);
    color: var(--rs-text-color);
}

.list-group-item-action:focus {
    background-color: var(--rs-list-group-hover);
    color: var(--rs-text-color);
}

.list-group-item.active {
    background-color: var(--rs-list-group-active-bg);
    border-color: var(--rs-list-group-active-bg);
    color: #fff;
}

.list-group-item.disabled {
    color: var(--rs-text-muted);
    background-color: var(--rs-list-group-bg);
}

/* ── Alerts ── */
.alert              { color: var(--rs-text-color); }
.alert-info         { background-color: var(--rs-alert-info-bg);      border-color: var(--rs-alert-info-border);      color: var(--rs-alert-info-text); }
.alert-warning      { background-color: var(--rs-alert-warning-bg);   border-color: var(--rs-alert-warning-border);   color: var(--rs-alert-warning-text); }
.alert-danger       { background-color: var(--rs-alert-danger-bg);    border-color: var(--rs-alert-danger-border);    color: var(--rs-alert-danger-text); }
.alert-success      { background-color: var(--rs-alert-success-bg);   border-color: var(--rs-alert-success-border);   color: var(--rs-alert-success-text); }
.alert-secondary    { background-color: var(--rs-alert-secondary-bg); border-color: var(--rs-alert-secondary-border); color: var(--rs-alert-secondary-text); }

.alert a            { color: inherit; text-decoration: underline; }
.alert .btn-close   { filter: var(--bs-btn-close-white-filter, none); }
[data-bs-theme="dark"] .alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Modals ── */
.modal-content {
    background-color: var(--rs-modal-bg);
    border-color: var(--rs-card-border);
    color: var(--rs-text-color);
}

.modal-header {
    background-color: var(--rs-modal-header-bg);
    border-bottom-color: var(--rs-card-border);
    color: var(--rs-text-color);
}

.modal-title { color: var(--rs-text-color); }

.modal-body {
    background-color: var(--rs-modal-bg);
    color: var(--rs-text-color);
}

.modal-footer {
    background-color: var(--rs-modal-header-bg);
    border-top-color: var(--rs-card-border);
}

/* Forms/tables inside modals inherit automatically via tokens */

/* ── Dropdowns ── */
.dropdown-menu {
    background-color: var(--rs-dropdown-bg);
    border-color: var(--rs-dropdown-border);
    color: var(--rs-text-color);
}

.dropdown-item { color: var(--rs-dropdown-link-color); }

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--rs-dropdown-link-hover-bg);
    color: var(--rs-dropdown-link-color);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--rs-primary);
    color: #fff;
}

.dropdown-divider { border-top-color: var(--rs-border-color); }
.dropdown-header  { color: var(--rs-text-muted); }

/* ── Nav Tabs & Pills ── */
.nav-tabs { border-bottom-color: var(--rs-border-color); }

.nav-tabs .nav-link {
    color: var(--rs-text-muted);
    border-color: transparent;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    border-color: var(--rs-border-color) var(--rs-border-color) transparent;
    color: var(--rs-text-color);
}

.nav-tabs .nav-link.active {
    background-color: var(--rs-card-bg);
    border-color: var(--rs-border-color) var(--rs-border-color) var(--rs-card-bg);
    color: var(--rs-text-color);
}

.nav-tabs .nav-link.disabled { color: var(--rs-text-muted); }

.tab-content {
    background-color: var(--rs-card-bg);
    color: var(--rs-text-color);
}

.nav-pills .nav-link { color: var(--rs-text-color); }
.nav-pills .nav-link.active { background-color: var(--rs-primary); color: #fff; }

/* ── Breadcrumbs ── */
.breadcrumb {
    --bs-breadcrumb-divider-color: var(--rs-breadcrumb-divider-color);
    background-color: transparent;
}

.breadcrumb-item a           { color: var(--rs-link-color); }
.breadcrumb-item a:hover     { color: var(--rs-link-color); text-decoration: underline; }
.breadcrumb-item.active      { color: var(--rs-breadcrumb-active-color); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--rs-breadcrumb-divider-color); }

/* ── Badges ── */
.badge.bg-light { background-color: var(--rs-badge-light-bg) !important; color: var(--rs-badge-light-color) !important; }
.badge.text-dark { color: var(--rs-badge-light-color) !important; }

/* ── Borders ── */
.border        { border-color: var(--rs-border-color) !important; }
.border-top    { border-top-color: var(--rs-border-color) !important; }
.border-bottom { border-bottom-color: var(--rs-border-color) !important; }
.border-start  { border-inline-start-color: var(--rs-border-color) !important; }
.border-end    { border-inline-end-color: var(--rs-border-color) !important; }

/* ── Text Utilities ── */
.text-muted { color: var(--rs-text-muted) !important; }
.text-dark  { color: var(--rs-text-color) !important; }

/* ── Background Utilities ── */
.bg-light { background-color: var(--rs-table-header-bg) !important; }
.bg-white { background-color: var(--rs-card-bg) !important; }
.bg-body  { background-color: var(--rs-card-bg) !important; }

/* ── Definition Lists ── */
dt          { color: var(--rs-text-muted); }
dd, dl      { color: var(--rs-text-color); }

/* ── Typography ── */
small       { color: var(--rs-text-muted); }
strong      { color: var(--rs-text-color); }
hr          { border-color: var(--rs-border-color); opacity: 1; }
blockquote  { border-inline-start-color: var(--rs-border-color); color: var(--rs-text-color); }
figcaption  { color: var(--rs-text-muted); }

/* ── Tooltips & Popovers ── */
.tooltip-inner { background-color: var(--rs-tooltip-bg); color: var(--rs-tooltip-color); }
.tooltip .tooltip-arrow::before { border-top-color: var(--rs-tooltip-bg); }
.popover       { background-color: var(--rs-popover-bg); border-color: var(--rs-popover-border); }
.popover-header { background-color: var(--rs-table-header-bg); border-bottom-color: var(--rs-border-color); color: var(--rs-text-color); }
.popover-body   { color: var(--rs-text-color); }

/* ── Accordions ── */
.accordion-item   { background-color: var(--rs-card-bg); border-color: var(--rs-border-color); color: var(--rs-text-color); }
.accordion-button { background-color: var(--rs-card-header-bg); color: var(--rs-text-color); }
.accordion-button:not(.collapsed) { background-color: var(--rs-table-header-bg); color: var(--rs-text-color); }
.accordion-button:focus { border-color: var(--rs-input-focus-border); box-shadow: 0 0 0 0.25rem var(--rs-input-focus-shadow); }
.accordion-body   { background-color: var(--rs-card-bg); color: var(--rs-text-color); }

/* ── Progress ── */
.progress { background-color: var(--rs-table-secondary-bg); }

/* ── Toast ── */
.toast { background-color: var(--rs-card-bg); border-color: var(--rs-card-border); color: var(--rs-text-color); }

/* ── Close Button (Dark) ── */
[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Selection ── */
::selection { background-color: rgba(var(--rs-primary-rgb), 0.3); color: var(--rs-text-color); }

/* ── Scrollbar (WebKit) ── */
::-webkit-scrollbar       { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--rs-table-secondary-bg); border-radius: 4px; }
::-webkit-scrollbar-thumb { background: var(--rs-text-muted); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--rs-text-color); }

/* ── Print ── */
@media print {
    * { background-color: #fff !important; color: #000 !important; }
}
