/* =========================================================
   Theme: epayus  (temp/ePayUs Color Palette.html)
   Selected by <add key="uiTheme" value="epayus" /> in Web.config.
   Deep Navy #16222F · Slate #556575 (accent) · Warm Cream #FAF7F2 · Sand #E5DFD5
   Accent switched from amber to slate #556575 on 2026-10-12 (amber version: _themeBackups/theme-epayus_amber_2026-10-12.css).
   Values marked "derived" are tints/shades of the palette, not in the palette file.

   Layout of the UI in this theme:
     sidebar  = white, sand border, soft-slate active state
     top bar  = white, sand bottom border
     canvas   = warm cream, cards white with sand borders
     actions  = slate fill (primary), navy fill (secondary)
     status   = green success · golden warning · amber danger/errors · navy info
   Text links use the darker slate #3F4D5B (8.5:1 on white) so they stand apart from #556575 secondary text.
   ========================================================= */

:root {
    /* ── brand ── */
    --ep-primary:          #556575;   /* Slate accent (5.9:1 on white) */
    --ep-primary-rgb:      85,101,117;
    --ep-primary-hover:    #3F4D5B;   /* derived: darker slate - hover / text links */
    --ep-primary-strong:   #16222F;   /* Deep Navy - text on soft slate */
    --ep-primary-soft:     #EEF1F4;   /* derived: soft slate fill */
    --ep-primary-border:   #CBD5E1;   /* Light slate */
    --ep-brand:            #556575;
    --ep-brand-rgb:        85,101,117;
    --ep-brand-strong:     #16222F;
    --ep-brand-soft:       #EEF1F4;

    /* ── text ── */
    --ep-heading:          #16222F;   /* Deep Navy */
    --ep-ink:              #16222F;   /* Deep Navy */
    --ep-text-1:           #334354;   /* Body text */
    --ep-text-1-rgb:       51,67,84;
    --ep-text-2:           #556575;   /* Muted slate */
    --ep-text-2-rgb:       85,101,117;
    --ep-text-3:           #8A96A3;   /* derived: faint slate (labels, placeholders) */
    --ep-text-3-rgb:       138,150,163;
    --ep-muted:            #556575;

    /* ── surfaces & lines ── */
    --ep-canvas:           #FAF7F2;   /* Warm cream */
    --ep-canvas-rgb:       250,247,242;
    --ep-bg-subtle:        #FAF7F2;   /* table heads, subtle panels */
    --ep-bg-muted:         #F3EEE6;   /* derived: hover rows, wells */
    --ep-bg-muted-rgb:     243,238,230;
    --ep-border:           #E5DFD5;   /* Sand border */
    --ep-line:             #E5DFD5;
    --ep-line-rgb:         229,223,213;
    --ep-line-strong:      #D6CDBF;   /* derived */
    --ep-shadow-rgb:       22,34,47;

    /* ── status ── */
    --ep-success:          #10B981;   /* Status green */
    --ep-success-rgb:      16,185,129;
    --ep-success-strong:   #047857;   /* derived */
    --ep-success-soft:     #ECFDF5;   /* derived */
    --ep-success-border:   #A7F3D0;   /* derived */
    --ep-warning:          #CA8A04;   /* derived: golden, kept distinct from the amber brand */
    --ep-warning-rgb:      202,138,4;
    --ep-warning-strong:   #854D0E;   /* derived */
    --ep-warning-soft:     #FEF9E7;   /* derived */
    --ep-warning-border:   #F5D98B;   /* derived */
    --ep-danger:           #D97706;   /* Amber (replaces red on request) */
    --ep-danger-rgb:       217,119,6;
    --ep-danger-strong:    #92400E;   /* derived: dark amber text */
    --ep-danger-soft:      #FEF3E2;   /* derived: soft amber */
    --ep-info:             #1E2D3E;   /* Panel Navy */
    --ep-info-rgb:         30,45,62;
    --ep-info-strong:      #16222F;   /* Deep Navy */
    --ep-info-soft:        #EDF1F5;   /* derived */
    --ep-info-border:      #CBD5E1;   /* Light slate */

    /* ── sidebar (light) ── */
    --ep-sb-bg:            #FFFFFF;
    --ep-sb-footer-bg:     #FAF7F2;   /* Warm cream */
    --ep-sb-border:        #E5DFD5;   /* Sand border */
    --ep-sb-card-bg:       #FAF7F2;
    --ep-sb-text:          #334354;   /* Body text */
    --ep-sb-text-strong:   #16222F;   /* Deep Navy */
    --ep-sb-label:         #6B7887;   /* derived: section labels, 4.5:1 on white */
    --ep-sb-hover-bg:      #F3EEE6;   /* derived: muted cream */
    --ep-sb-active-bg:     #EEF1F4;   /* soft slate */
    --ep-sb-active-text:   #16222F;   /* Deep Navy */
    --ep-sb-active-icon:   #556575;   /* Slate */
    --ep-sb-active-bar:    #10B981;   /* Status green - edge bar of the selected item */

    /* ── shared stripe_override.css tokens ── */
    --gst-text:            #334354;
    --gst-text-muted:      #556575;
    --gst-text-light:      #8A96A3;
    --gst-text-strong:     #16222F;
    --gst-success:         #10B981;
    --gst-warning:         #CA8A04;
    --gst-danger:          #B45309;   /* darker amber: .text-danger / .btn-danger stay readable (5:1) */
    --gst-info:            #1E2D3E;
}

/* ── Bootstrap / SB Admin components that still carry the old blue (#4e73df) ── */
a                                   { color: var(--ep-primary-hover); }
a:hover                             { color: var(--ep-primary-strong); }
.text-primary                       { color: var(--ep-primary-hover) !important; }
.bg-primary, .badge-primary         { background-color: var(--ep-primary) !important; }
.border-primary                     { border-color: var(--ep-primary) !important; }
.bg-gradient-primary                { background: var(--ep-ink) !important; }
.bg-success                         { background-color: var(--ep-success) !important; }
.bg-info                            { background-color: var(--ep-info) !important; }
.bg-warning                         { background-color: var(--ep-warning) !important; }
.bg-danger                          { background-color: var(--ep-danger) !important; }
.border-left-primary                { border-left-color: var(--ep-primary) !important; }
.border-left-success                { border-left-color: var(--ep-success) !important; }
.border-left-info                   { border-left-color: var(--ep-info) !important; }
.border-left-warning                { border-left-color: var(--ep-warning) !important; }
.border-left-danger                 { border-left-color: var(--ep-danger) !important; }

.text-gray-900, .text-gray-800      { color: var(--ep-ink) !important; }
.text-gray-700, .text-gray-600      { color: var(--ep-text-1) !important; }
.text-gray-500, .text-gray-400,
.text-gray-300                      { color: var(--ep-text-3) !important; }
.bg-gray-100, .bg-light             { background-color: var(--ep-bg-subtle) !important; }
.bg-gray-200                        { background-color: var(--ep-bg-muted) !important; }

.btn-info                           { background-color: var(--ep-info) !important; border-color: var(--ep-info) !important; color: #fff !important; }
.btn-info:hover                     { background-color: var(--ep-ink) !important; border-color: var(--ep-ink) !important; }
.btn-outline-info                   { color: var(--ep-info) !important; border-color: var(--ep-info) !important; background: transparent !important; }
.btn-outline-info:hover             { background-color: var(--ep-info) !important; color: #fff !important; }
.btn-warning                        { background-color: var(--ep-warning) !important; border-color: var(--ep-warning) !important; color: var(--ep-ink) !important; }
.btn-outline-warning                { color: var(--ep-warning-strong) !important; border-color: var(--ep-warning) !important; background: transparent !important; }
.btn-outline-warning:hover          { background-color: var(--ep-warning) !important; color: var(--ep-ink) !important; }
.btn-link                           { color: var(--ep-primary-hover) !important; }

.alert-success { background-color: var(--ep-success-soft) !important; border-color: var(--ep-success-border) !important; color: var(--ep-success-strong) !important; }
.alert-warning { background-color: var(--ep-warning-soft) !important; border-color: var(--ep-warning-border) !important; color: var(--ep-warning-strong) !important; }
.alert-danger  { background-color: var(--ep-danger-soft) !important; border-color: #F5CF9B !important; color: var(--ep-danger-strong) !important; }
.alert-info,
.alert-primary { background-color: var(--ep-info-soft) !important; border-color: var(--ep-info-border) !important; color: var(--ep-info-strong) !important; }

.page-link                                  { color: var(--ep-primary-hover); }
.page-item.active .page-link                { background-color: var(--ep-primary) !important; border-color: var(--ep-primary) !important; color: #fff !important; }
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link                { background-color: var(--ep-primary) !important; color: #fff !important; }
.nav-tabs .nav-link.active                  { color: var(--ep-ink) !important; border-bottom-color: var(--ep-primary) !important; }
.progress-bar                               { background-color: var(--ep-primary); }
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--ep-primary) !important; border-color: var(--ep-primary) !important;
}
.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 0.2rem rgba(var(--ep-primary-rgb),0.2) !important;
}
input[type=checkbox], input[type=radio]     { accent-color: var(--ep-primary); }
::selection                                 { background: rgba(var(--ep-primary-rgb),0.22); }

/* bootstrap-datepicker + chosen dropdown highlights */
.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.active,
.datepicker table tr td span.active,
.datepicker table tr td span.active:hover   { background: var(--ep-primary) !important; border-color: var(--ep-primary) !important; color: #fff !important; text-shadow: none !important; }
.datepicker table tr td.today               { background: var(--ep-primary-soft) !important; color: var(--ep-primary-strong) !important; }
.chosen-container .chosen-results li.highlighted { background: var(--ep-primary) !important; color: #fff !important; }
