/* =========================================================================
   Sales Ray Theme — Jeeves Executive Dashboard parity
   Drop-in stylesheet, injected via nginx sub_filter into Twenty's index.html.

   Aligned with /home/nathanadmin/apps/jeeves-dashboard/dashboard.css :
       --bg-primary    #0f172a        deep navy (page bg)
       --bg-secondary  #1e293b        elevated surfaces / cards
       --bg-card-hover #253349
       --border        #334155
       --text          #e2e8f0
       --text-primary  #f1f5f9
       --text-secondary#94a3b8
       --text-muted    #64748b
       --accent        #f59e0b        warm amber (matches dashboard)
       --accent-hover  #f97316        orange
       --gold-hi       #FFC700        bright gold highlight (per spec)

   Background gradient mirrors dashboard "fixed" feel:
       linear-gradient(135deg, #0f1520 0%, #0f172a 50%, #1a1f2e 100%)

   Font: Inter (same as dashboard)
   Version: 10  (font + avatar brand fix)
   ========================================================================= */

/* ============================================================
   0. Inter font — preconnect hints + import
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ============================================================
   1. Fade-in (matches executive dashboard)
   ============================================================ */
@keyframes srFadeIn {
    0%   { opacity: 0; transform: translateY(8px); }
    100% { opacity: 1; transform: none; }
}

/* ============================================================
   2. Force dark theme on document root
   ============================================================ */
html.sunrise-theme,
html.sunrise-theme.light,
html.sunrise-theme.dark {
    background: linear-gradient(135deg, #0f1520 0%, #0f172a 50%, #1a1f2e 100%) !important;
    background-attachment: fixed !important;
    color-scheme: dark;
    min-height: 100vh;
}

html.sunrise-theme body {
    background: transparent !important;
    color: #e2e8f0 !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================================
   2b. Inter font — MAXIMUM SPECIFICITY universal override
       Targets every element, pseudo-element, and Twenty's
       specific hashed CSS classes that set font-family.
       The * selector with html.sunrise-theme prefix has higher
       specificity than any single-class Twenty rule.
   ============================================================ */

/* Universal override — catches all elements */
html.sunrise-theme *,
html.sunrise-theme *::before,
html.sunrise-theme *::after {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
}

/* Override the --t-font-family CSS variable at the root level
   so all var(--t-font-family) references resolve to Inter */
html.sunrise-theme,
html.sunrise-theme.dark,
html.sunrise-theme .dark,
html.sunrise-theme.light,
html.sunrise-theme .light {
    --t-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif !important;
}

/* Explicit overrides for Twenty's hashed component classes
   that set font-family via CSS variables or directly.
   These are the classes identified in index-k0Z7lzj0.css: */
html.sunrise-theme .s12e8o4d,
html.sunrise-theme .s14cjsu4,
html.sunrise-theme .s14j53j7,
html.sunrise-theme .s17l3xsm,
html.sunrise-theme .s17ni0pf,
html.sunrise-theme .s1a0c8w6,
html.sunrise-theme .s1ab7wqo,
html.sunrise-theme .s1hgpe6x,
html.sunrise-theme .s1hvfzim,
html.sunrise-theme .s1hzrpf3,
html.sunrise-theme .s1kfpd8m,
html.sunrise-theme .s1ktfsj4,
html.sunrise-theme .s1pmufn7,
html.sunrise-theme .s1v80m03,
html.sunrise-theme .s1viq0d,
html.sunrise-theme .s1w3fbr1,
html.sunrise-theme .s1w9v9bi,
html.sunrise-theme .s1y6epzy,
html.sunrise-theme .s2k9jwx,
html.sunrise-theme .s5aojvy,
html.sunrise-theme .s8pzt7p,
html.sunrise-theme .s9cxgro,
html.sunrise-theme .sdrewyk,
html.sunrise-theme .se5o8nq,
html.sunrise-theme .seo7n1c,
html.sunrise-theme .sfcmfho,
html.sunrise-theme .smzhf8i,
html.sunrise-theme .splre37,
html.sunrise-theme .sqrzk4i,
html.sunrise-theme .sqtrnip,
html.sunrise-theme .ssah544 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
}

/* Headings */
html.sunrise-theme h1,
html.sunrise-theme h2,
html.sunrise-theme h3,
html.sunrise-theme h4,
html.sunrise-theme h5,
html.sunrise-theme h6 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
}

/* Form elements (browsers often resist inheriting font on these) */
html.sunrise-theme input,
html.sunrise-theme textarea,
html.sunrise-theme select,
html.sunrise-theme button {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
}

/* Inline/text elements */
html.sunrise-theme label,
html.sunrise-theme span,
html.sunrise-theme p,
html.sunrise-theme a,
html.sunrise-theme li,
html.sunrise-theme td,
html.sunrise-theme th {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
                 system-ui, sans-serif !important;
}

/* ============================================================
   3. Re-declare Twenty's design tokens to match Jeeves dashboard
   ============================================================ */
html.sunrise-theme,
html.sunrise-theme.light,
html.sunrise-theme.dark,
html.sunrise-theme .light,
html.sunrise-theme .dark,
.sunrise-theme {
    /* Surfaces */
    --t-background-primary:           #1e293b !important;        /* card */
    --t-background-secondary:         rgba(30, 41, 59, 0.85) !important;
    --t-background-tertiary:          #0f172a !important;        /* page */
    --t-background-quaternary:        rgba(30, 41, 59, 0.6) !important;
    --t-background-noisy:             #0f172a !important;

    --t-background-inverted-primary:  #f1f5f9 !important;
    --t-background-inverted-secondary:#cbd5e1 !important;
    --t-background-primary-inverted:  #f1f5f9 !important;
    --t-background-primary-inverted-hover: #e2e8f0 !important;

    --t-background-overlay-primary:   rgba(0, 0, 0, 0.78) !important;
    --t-background-overlay-secondary: rgba(0, 0, 0, 0.55) !important;
    --t-background-overlay-tertiary:  rgba(0, 0, 0, 0.30) !important;

    --t-background-transparent-primary:   rgba(15, 23, 42, 0.55) !important;
    --t-background-transparent-secondary: rgba(30, 41, 59, 0.55) !important;
    --t-background-transparent-strong:    rgba(255, 255, 255, 0.10) !important;
    --t-background-transparent-medium:    rgba(255, 255, 255, 0.06) !important;
    --t-background-transparent-light:     rgba(255, 255, 255, 0.035) !important;
    --t-background-transparent-lighter:   rgba(255, 255, 255, 0.02) !important;

    /* Tag/accent transparent backgrounds → amber */
    --t-background-transparent-blue:    rgba(245, 158, 11, 0.15) !important;
    --t-background-transparent-orange:  rgba(245, 158, 11, 0.20) !important;
    --t-background-transparent-success: rgba(16, 185, 129, 0.18) !important;
    --t-background-transparent-danger:  rgba(239, 68, 68, 0.18) !important;
    --t-background-danger:              #2a0f14 !important;

    --t-background-radial-gradient:       radial-gradient(60% 60% at 50% 0%, #253349 0%, #0f172a 100%) !important;
    --t-background-radial-gradient-hover: radial-gradient(70% 70% at 50% 0%, #2c3a55 0%, #0f172a 100%) !important;

    /* Borders */
    --t-border-color-light:             #1e293b !important;
    --t-border-color-medium:            #334155 !important;
    --t-border-color-strong:            #475569 !important;
    --t-border-color-inverted:          #f1f5f9 !important;
    --t-border-color-secondary-inverted:#cbd5e1 !important;
    --t-border-color-blue:              rgba(245, 158, 11, 0.55) !important;
    --t-border-color-danger:            #4b1d27 !important;
    --t-border-color-transparent-strong:rgba(255, 255, 255, 0.08) !important;

    /* Typography */
    --t-font-color-primary:     #f1f5f9 !important;
    --t-font-color-secondary:   #e2e8f0 !important;
    --t-font-color-tertiary:    #cbd5e1 !important;
    --t-font-color-light:       #94a3b8 !important;
    --t-font-color-extra-light: #64748b !important;
    --t-font-color-inverted:    #0f172a !important;
    --t-font-color-danger:      #f87171 !important;

    /* Accent — warm amber (dashboard parity) with gold highlight */
    --t-accent-primary:    #f59e0b !important;
    --t-accent-secondary:  rgba(245, 158, 11, 0.22) !important;
    --t-accent-tertiary:   rgba(245, 158, 11, 0.14) !important;
    --t-accent-quaternary: rgba(245, 158, 11, 0.08) !important;

    --t-buttons-secondary-text-color: #f1f5f9 !important;

    /* Shadows */
    --t-box-shadow-color:       rgba(0, 0, 0, 0.55) !important;
    --t-box-shadow-light:       0 1px 2px rgba(0, 0, 0, 0.5) !important;
    --t-box-shadow-strong:      0 12px 32px rgba(0, 0, 0, 0.55), 0 1px 2px rgba(0, 0, 0, 0.6) !important;
    --t-box-shadow-super-heavy: 0 24px 64px rgba(0, 0, 0, 0.7),  0 2px 4px rgba(0, 0, 0, 0.6) !important;

    --t--illustration-icon-color-blue: #f59e0b !important;
    --t--illustration-icon-fill-blue:  rgba(245, 158, 11, 0.18) !important;
    --t--illustration-icon-color-gray: #94a3b8 !important;
    --t--illustration-icon-fill-gray:  rgba(148, 163, 184, 0.12) !important;

    --t-snack-bar-default-color:           #f1f5f9 !important;
    --t-snack-bar-success-background-color:#0e2a1a !important;
    --t-snack-bar-success-color:           #34d399 !important;
    --t-snack-bar-info-background-color:   #142036 !important;
    --t-snack-bar-info-color:              #f59e0b !important;
    --t-snack-bar-warning-background-color:#2a1f0a !important;
    --t-snack-bar-warning-color:           #fbbf24 !important;
    --t-snack-bar-error-background-color:  #2a0f14 !important;
    --t-snack-bar-error-color:             #f87171 !important;
}

/* ---------- Tag colour adjustments ---------- */
.sunrise-theme {
    --t-tag-background-blue: rgba(245, 158, 11, 0.16) !important;
    --t-tag-text-blue:       #fbbf24 !important;
    --t-tag-background-gold: rgba(255, 199, 0, 0.20) !important;
    --t-tag-text-gold:       #FFC700 !important;
}

/* ============================================================
   3b. COMPANY AVATAR BRAND COLORS
       Twenty generates avatar backgrounds by hashing the company
       name to pick one of 25 color names, then uses
       theme.color[colorName + '4'] for background and
       theme.color[colorName + '12'] for text.
       These resolve to CSS variables --t-color-{name}4/12.
       Override ALL of them to use Sunrise brand palette:
         Background: #253349 (brand dark navy / card-hover)
         Text:       #f59e0b (brand amber/orange)
       This makes every company avatar consistent regardless
       of which color the hash picks.
   ============================================================ */
html.sunrise-theme,
html.sunrise-theme.dark,
html.sunrise-theme .dark {
    /* red */
    --t-color-red4:        #253349 !important;
    --t-color-red12:       #f59e0b !important;
    /* ruby */
    --t-color-ruby4:       #253349 !important;
    --t-color-ruby12:      #f59e0b !important;
    /* crimson */
    --t-color-crimson4:    #253349 !important;
    --t-color-crimson12:   #f59e0b !important;
    /* tomato */
    --t-color-tomato4:     #253349 !important;
    --t-color-tomato12:    #f59e0b !important;
    /* orange */
    --t-color-orange4:     #253349 !important;
    --t-color-orange12:    #f59e0b !important;
    /* amber */
    --t-color-amber4:      #253349 !important;
    --t-color-amber12:     #f59e0b !important;
    /* yellow */
    --t-color-yellow4:     #253349 !important;
    --t-color-yellow12:    #f59e0b !important;
    /* lime */
    --t-color-lime4:       #253349 !important;
    --t-color-lime12:      #f59e0b !important;
    /* grass */
    --t-color-grass4:      #253349 !important;
    --t-color-grass12:     #f59e0b !important;
    /* green */
    --t-color-green4:      #253349 !important;
    --t-color-green12:     #f59e0b !important;
    /* jade */
    --t-color-jade4:       #253349 !important;
    --t-color-jade12:      #f59e0b !important;
    /* mint */
    --t-color-mint4:       #253349 !important;
    --t-color-mint12:      #f59e0b !important;
    /* turquoise */
    --t-color-turquoise4:  #253349 !important;
    --t-color-turquoise12: #f59e0b !important;
    /* cyan */
    --t-color-cyan4:       #253349 !important;
    --t-color-cyan12:      #f59e0b !important;
    /* sky */
    --t-color-sky4:        #253349 !important;
    --t-color-sky12:       #f59e0b !important;
    /* blue */
    --t-color-blue4:       #253349 !important;
    --t-color-blue12:      #f59e0b !important;
    /* iris */
    --t-color-iris4:       #253349 !important;
    --t-color-iris12:      #f59e0b !important;
    /* violet */
    --t-color-violet4:     #253349 !important;
    --t-color-violet12:    #f59e0b !important;
    /* purple */
    --t-color-purple4:     #253349 !important;
    --t-color-purple12:    #f59e0b !important;
    /* plum */
    --t-color-plum4:       #253349 !important;
    --t-color-plum12:      #f59e0b !important;
    /* pink */
    --t-color-pink4:       #253349 !important;
    --t-color-pink12:      #f59e0b !important;
    /* bronze */
    --t-color-bronze4:     #253349 !important;
    --t-color-bronze12:    #f59e0b !important;
    /* gold */
    --t-color-gold4:       #253349 !important;
    --t-color-gold12:      #f59e0b !important;
    /* brown */
    --t-color-brown4:      #253349 !important;
    --t-color-brown12:     #f59e0b !important;
    /* gray */
    --t-color-gray4:       #253349 !important;
    --t-color-gray12:      #f59e0b !important;
}

/* Direct override on the Avatar component (.skj0go6) as a safety net.
   The background and color are set via CSS custom properties on the element;
   this rule catches any case where the variable chain doesn't resolve. */
html.sunrise-theme .skj0go6 {
    background: #253349 !important;
    color: #f59e0b !important;
}

/* ============================================================
   4. Page-level surfaces — transparent so gradient shows through
   ============================================================ */
html.sunrise-theme,
html.sunrise-theme body,
html.sunrise-theme #root,
html.sunrise-theme .s1nbwame,
html.sunrise-theme .s17gs6x9,
html.sunrise-theme .s1ea0qva {
    background-color: transparent !important;
}

/* ============================================================
   5. Sidebar / nav rail — dashboard parity (#0c1322 with subtle
      amber gradient header)
   ============================================================ */
html.sunrise-theme nav,
html.sunrise-theme aside,
html.sunrise-theme [class*="s1nh5wpf"] {
    background: #0c1322 !important;
    border-right: 1px solid #334155 !important;
}

/* Active sidebar item — amber/gold treatment from dashboard */
html.sunrise-theme a[aria-current="page"],
html.sunrise-theme [data-selected="true"],
html.sunrise-theme [aria-selected="true"],
html.sunrise-theme nav a.active,
html.sunrise-theme nav [class*="active"] {
    background: linear-gradient(135deg, rgba(245,158,11,0.15), rgba(249,115,22,0.10)) !important;
    box-shadow: inset 3px 0 0 0 #FFC700 !important;
    color: #FFC700 !important;
    font-weight: 600 !important;
}

/* Sidebar item hover */
html.sunrise-theme nav a:hover,
html.sunrise-theme aside a:hover {
    background-color: rgba(245, 158, 11, 0.08) !important;
    color: #f1f5f9 !important;
}

/* ============================================================
   6. Cards / modals / popovers — solid dark card (dashboard parity)
   ============================================================ */
html.sunrise-theme [role="dialog"],
html.sunrise-theme [role="menu"],
html.sunrise-theme [role="listbox"],
html.sunrise-theme [role="tooltip"],
html.sunrise-theme .s1oglphl,
html.sunrise-theme .s1i9am7s,
html.sunrise-theme .splre37 {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6),
                0 2px 4px  rgba(0, 0, 0, 0.5) !important;
    color: #f1f5f9 !important;
    border-radius: 10px !important;
}

/* Hover treatment matching dashboard .card:hover */
html.sunrise-theme [role="dialog"]:hover,
html.sunrise-theme .s1oglphl:hover {
    border-color: rgba(245, 158, 11, 0.25) !important;
}

/* ============================================================
   7. Inputs & form fields
   ============================================================ */
html.sunrise-theme input,
html.sunrise-theme textarea,
html.sunrise-theme select {
    background: rgba(30, 41, 59, 0.85) !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
    border-radius: 8px !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}

html.sunrise-theme input::placeholder,
html.sunrise-theme textarea::placeholder {
    color: #64748b !important;
}

html.sunrise-theme input:focus,
html.sunrise-theme textarea:focus,
html.sunrise-theme select:focus {
    outline: none !important;
    border-color: #FFC700 !important;
    box-shadow: 0 0 0 3px rgba(255, 199, 0, 0.18) !important;
}

/* Kill Chrome's white autofill background */
html.sunrise-theme input:-webkit-autofill,
html.sunrise-theme input:-webkit-autofill:hover,
html.sunrise-theme input:-webkit-autofill:focus,
html.sunrise-theme textarea:-webkit-autofill {
    -webkit-text-fill-color: #e2e8f0 !important;
    -webkit-box-shadow: 0 0 0 1000px rgba(30, 41, 59, 0.95) inset !important;
    caret-color: #e2e8f0 !important;
    transition: background-color 99999s ease-in-out 0s;
}

/* ============================================================
   8. Buttons — gold primary (dashboard .btn-primary parity)
   ============================================================ */
html.sunrise-theme button[data-variant="primary"],
html.sunrise-theme button[type="submit"],
html.sunrise-theme button.primary,
html.sunrise-theme .sr-btn-primary {
    background: #FFC700 !important;
    color: #0f172a !important;
    border: none !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    border-radius: 6px !important;
    transition: background 0.15s, box-shadow 0.15s !important;
    box-shadow: 0 4px 14px rgba(255, 199, 0, 0.25) !important;
}

html.sunrise-theme button[data-variant="primary"]:hover,
html.sunrise-theme button[type="submit"]:hover,
html.sunrise-theme button.primary:hover {
    background: #f97316 !important;
    color: #0f172a !important;
}

html.sunrise-theme button[data-variant="primary"]:focus,
html.sunrise-theme button[type="submit"]:focus {
    box-shadow: 0 0 0 3px rgba(255, 199, 0, 0.30) !important;
}

html.sunrise-theme button[data-variant="secondary"],
html.sunrise-theme button[data-variant="tertiary"] {
    background-color: transparent !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
    border-radius: 6px !important;
}

html.sunrise-theme button[data-variant="secondary"]:hover,
html.sunrise-theme button[data-variant="tertiary"]:hover {
    background-color: rgba(245, 158, 11, 0.08) !important;
    border-color: #FFC700 !important;
    color: #f1f5f9 !important;
}

/* ============================================================
   9. Tables / data grids — dashboard .data-table parity
   ============================================================ */
html.sunrise-theme table,
html.sunrise-theme [role="grid"],
html.sunrise-theme [role="table"] {
    background-color: transparent !important;
    color: #f1f5f9 !important;
}

html.sunrise-theme thead,
html.sunrise-theme [role="rowgroup"]:first-child,
html.sunrise-theme [role="columnheader"] {
    background: rgba(15, 23, 42, 0.6) !important;
    color: #94a3b8 !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    font-size: 0.65rem !important;
    border-bottom: 1px solid #334155 !important;
}

html.sunrise-theme tr:hover,
html.sunrise-theme [role="row"]:hover {
    background-color: rgba(245, 158, 11, 0.04) !important;
}

html.sunrise-theme td,
html.sunrise-theme [role="gridcell"] {
    border-bottom: 1px solid rgba(51, 65, 85, 0.5) !important;
    color: #e2e8f0 !important;
}

/* ============================================================
   10. Scrollbars (subtle, dashboard-style)
   ============================================================ */
html.sunrise-theme ::-webkit-scrollbar { width: 10px; height: 10px; }
html.sunrise-theme ::-webkit-scrollbar-track { background: rgba(15, 23, 42, 0.5); }
html.sunrise-theme ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: content-box;
}
html.sunrise-theme ::-webkit-scrollbar-thumb:hover { background: #475569; background-clip: content-box; }
html.sunrise-theme { scrollbar-color: #334155 transparent; scrollbar-width: thin; }

/* ============================================================
   11. Selection & focus ring — gold
   ============================================================ */
html.sunrise-theme ::selection {
    background: rgba(255, 199, 0, 0.35);
    color: #0f172a;
}

html.sunrise-theme *:focus-visible {
    outline-color: #FFC700 !important;
    outline-offset: 2px;
}

/* ============================================================
   12. Links — amber/gold
   ============================================================ */
html.sunrise-theme a { color: #FFC700; }
html.sunrise-theme a:hover { color: #fbbf24; }

/* ============================================================
   13. Skeleton loaders
   ============================================================ */
html.sunrise-theme .react-loading-skeleton {
    --base-color: rgba(15, 23, 42, 0.8) !important;
    --highlight-color: rgba(30, 41, 59, 0.85) !important;
}

/* ============================================================
   14. HR / dividers
   ============================================================ */
html.sunrise-theme hr { border-color: #334155 !important; }

/* ============================================================
   15. BRANDING CLEANUP — HIDE TWENTY LOGOS (preserved from v8)
   ============================================================ */
/* html.sunrise-theme .s1u3xbtx { display: none !important; } */
/* html.sunrise-theme .s1fiw0wm { display: none !important; } */
/* html.sunrise-theme .si03ohs { display: none !important; } */
html.sunrise-theme img[alt="Twenty"],
html.sunrise-theme img[alt="twenty logo"] {
    content: url('/salesray_wordmark.png') !important;
    height: 20px !important;
    width: auto !important;
}

/* ============================================================
   16. LOGIN PAGE — glass card (preserved)
   ============================================================ */
html.sunrise-theme .scpim0n {
    background: rgba(15, 23, 42, 0.92) !important;
    border: 1px solid #334155 !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-radius: 16px !important;
    padding: 32px !important;
    max-width: 440px !important;
    width: 100% !important;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6), 0 2px 4px rgba(0, 0, 0, 0.5) !important;
    animation: srFadeIn 0.4s ease-out !important;
    position: relative !important;
}

/* ============================================================
   17. Sales Ray wordmark on login (injected by salesray-boot.js)
   ============================================================ */
html.sunrise-theme #salesray-logo-wrap {
    text-align: center !important;
    margin-bottom: 28px !important;
    display: block !important;
}

html.sunrise-theme #salesray-login-logo {
    display: block !important;
    margin: 0 auto 12px auto !important;
    height: 80px !important;
    width: auto !important;
    filter: drop-shadow(0 0 14px rgba(255, 199, 0, 0.55)) !important;
}

html.sunrise-theme #salesray-login-title {
    display: block !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-align: center !important;
    margin: 0 0 4px 0 !important;
    font-family: 'Inter', sans-serif !important;
    line-height: 1.2 !important;
}

html.sunrise-theme #salesray-login-subtitle {
    display: block !important;
    font-size: 0.875rem !important;
    color: #94a3b8 !important;
    text-align: center !important;
    margin: 0 0 8px 0 !important;
    font-family: 'Inter', sans-serif !important;
}

/* ============================================================
   18. Sidebar workspace icon swap
   ============================================================ */
html.sunrise-theme [data-testid="workspace-dropdown"] img.s11vr7rx {
    content: url('/salesray_icon_v2.png') !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
}

html.sunrise-theme a[href="/welcome"]::before { content: none !important; }
html.sunrise-theme a[href="/welcome"] svg { display: none !important; }

/* ============================================================
   19. Eye toggle (password show/hide) — preserved
   ============================================================ */
html.sunrise-theme #sr-eye-btn {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    color: #94a3b8 !important;
    padding: 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
}

html.sunrise-theme #sr-eye-btn:hover { color: #FFC700 !important; }
html.sunrise-theme .sr-pw-wrap { position: relative !important; display: block !important; }
html.sunrise-theme .sr-pw-wrap input[type="password"],
html.sunrise-theme .sr-pw-wrap input[type="text"] { padding-right: 44px !important; }

/* ============================================================
   20. Footer trademark line
   ============================================================ */
html.sunrise-theme #sr-footer {
    position: fixed !important;
    bottom: 12px !important;
    left: 0 !important;
    right: 0 !important;
    text-align: center !important;
    font-size: 10px !important;
    color: #475569 !important;
    font-family: 'Inter', sans-serif !important;
    pointer-events: none !important;
    z-index: 9999 !important;
    line-height: 1.4 !important;
}

/* ============================================================
   21. Final safety net
   ============================================================ */
html.sunrise-theme dialog,
html.sunrise-theme select,
html.sunrise-theme option {
    background: #1e293b;
    color: #f1f5f9;
}

/* Native menus / system pickers */
html.sunrise-theme option { background-color: #1e293b !important; color: #e2e8f0 !important; }

/* SIDEBAR TEXT FIX */
html.sunrise-theme nav a,
html.sunrise-theme aside a,
html.sunrise-theme nav span,
html.sunrise-theme aside span,
html.sunrise-theme [class*="sidebar"] span,
html.sunrise-theme [class*="sidebar"] a {
    color: #e2e8f0 !important;
}

html.sunrise-theme nav a:hover span,
html.sunrise-theme aside a:hover span {
    color: #f1f5f9 !important;
}

html.sunrise-theme nav a.active span,
html.sunrise-theme aside a.active span {
    color: #FFC700 !important;
}