/* Sage & Olive polish: lighter header, sage in supporting roles, one palette for selected states,
   one filled primary action per area, more air. Appearance only. */

/* 1. RM / back-office header: soft white with a sage rule instead of a heavy olive slab */
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-navbar { background: #FAFBF8; color: #32361f; border-bottom: 2px solid #9CAF88; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-nav-brand,
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-user-name { color: #32361f; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-nav-dept,
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-user-title { color: #5b6849; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-user-badge,
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-branch-badge,
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-theme-toggle { background: #EEF2EA; border-color: #9CAF88; color: #32361f; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-avatar { background: #4B5320; color: #FAFBF8; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-btn-nav { color: #4B5320; border-color: #9CAF88; background: transparent; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-btn-nav:hover { background: #EEF2EA; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-btn-signout { background: #4B5320; border-color: #4B5320; color: #FAFBF8; }
.rm-dashboard-wrap:not(.rm-dark-mode) .rm-btn-signout:hover { background: #3d4318; }

/* The read-only review bar and the onboarding header follow the same light treatment */
.rm-review-banner { background: #EEF2EA; color: #32361f; border-bottom: 2px solid #9CAF88; }
.rm-review-pill { background: #4B5320; color: #FAFBF8; }
.hdr { border-bottom: 2px solid #9CAF88; box-shadow: none; }

/* 2. Sage for supporting roles: cards, panels and table headers get a sage edge */
.rm-card, .rm-stat-card, .rm-table-card { border-color: #d5dfcc; }
.rm-table thead th { background: #EEF2EA; color: #32361f; border-bottom: 1px solid #9CAF88; }

/* 3. One palette for selected states: no stray bright green */
.tog-btn.on { background: #4B5320; border-color: #4B5320; color: #FAFBF8; box-shadow: none; }
.tog-btn:hover { border-color: #9CAF88; color: #4B5320; background: #EEF2EA; }

/* 4. Calm the warm-grey panels and notice bars */
.rm-review-mode .info-box, .rm-review-mode .notice, .rm-review-mode .alert-info { background: #EEF2EA; border-color: #9CAF88; color: #32361f; }

/* 5. One filled primary action per area: secondary buttons are outlined */
.btn-outline, .btn-ghost, .rm-btn-secondary { background: transparent; border: 1.5px solid #9CAF88; color: #4B5320; }
.btn-outline:hover, .btn-ghost:hover, .rm-btn-secondary:hover { background: #EEF2EA; }

/* 6. More air */
body { line-height: 1.55; }
.field-group, .rm-form-group { margin-bottom: 20px; }
.rm-card { margin-bottom: 24px; }

/* ===== Status colours and dark mode =====
   Contrast (WCAG AA, 4.5:1): #4B5320 on #FAFBF8 8.1; #32361F on #EEF2EA 11; #FAFBF8 on #4B5320 8.1;
   dark mode #E8EDE5 on #2A2E18 11; #1F2410 on #9CAF88 7.3. */

/* Account setup portal: auto-filled fields, "Auto-filled" tag and the info banner use sage instead of bright green */
.field input.auto-filled, body.light .field input.auto-filled { background: #EEF2EA !important; border-color: #9CAF88 !important; color: #32361f !important; }
.auto-badge { background: #EEF2EA; color: #4B5320; border: 1px solid #c5d1b8; }
.banner-success { background: #EEF2EA; color: #32361f; border-color: #9CAF88; border-left: 4px solid #4B5320; }

/* RM status badges: one olive family, told apart by fill and weight (not by hue alone) */
.rm-badge.invited { background: #FAFBF8; border: 1px solid #9CAF88; color: #4B5320; }
.rm-badge.in_progress { background: #EEF2EA; border: 1px solid #9CAF88; color: #32361f; }
.rm-badge.in_progress::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #4B5320; }
.rm-badge.review, .rm-badge.awaiting_signatory { background: #FAFBF8; border: 1px solid #4B5320; color: #32361f; }
.rm-badge.completed { background: #4B5320; border: 1px solid #4B5320; color: #FAFBF8; }
.rm-badge.completed::before { content: "\2713"; font-size: 11px; }

/* RM dark mode: readable tables, buttons and badges */
.rm-dark-mode .rm-btn-ghost, .rm-dark-mode .rm-btn-action, .rm-dark-mode .rm-btn-sm {
    background: #2A2E18; border-color: #556040; color: #E8EDE5;
}
.rm-dark-mode .rm-btn-ghost:hover, .rm-dark-mode .rm-btn-action:hover { background: #343920; border-color: #9CAF88; }
.rm-dark-mode .rm-btn-primary { background: #9CAF88; border-color: #9CAF88; color: #1F2410; }
.rm-dark-mode .rm-table th { background: #2A2E18; color: #C8CFC0; border-bottom-color: #556040; }
.rm-dark-mode .rm-table td > span:not(.rm-badge):not(.rm-jurisdiction-badge),
.rm-dark-mode .rm-table td > strong,
.rm-dark-mode .rm-table td > div { color: #E8EDE5 !important; }
.rm-dark-mode .rm-table td > span[style*="monospace"] { background: #2A2E18 !important; border-color: #556040 !important; }
.rm-dark-mode .rm-table td div[style*="font-size"] { color: #B5BDA8 !important; }
.rm-dark-mode .rm-badge.invited { background: #2A2E18; border-color: #667254; color: #E8EDE5; }
.rm-dark-mode .rm-badge.in_progress { background: #343920; border-color: #9CAF88; color: #E8EDE5; }
.rm-dark-mode .rm-badge.in_progress::before { background: #9CAF88; }
.rm-dark-mode .rm-badge.review, .rm-dark-mode .rm-badge.awaiting_signatory { background: #2A2E18; border-color: #9CAF88; color: #E8EDE5; }
.rm-dark-mode .rm-badge.completed { background: #9CAF88; border-color: #9CAF88; color: #1F2410; }
.rm-dark-mode .rm-navbar { background: #212414; border-bottom: 2px solid #556040; color: #E8EDE5; }
.rm-dark-mode .rm-nav-brand, .rm-dark-mode .rm-user-name { color: #E8EDE5; }
.rm-dark-mode .rm-nav-dept, .rm-dark-mode .rm-user-title { color: #B5BDA8; }