/* ============================================================
   RTGN Modern Theme — Light + Dark Mode
   Version: 1.0 (2026-04-01)
   Loaded AFTER uikit.min.css, overrides UIkit defaults
   ============================================================ */

/* --- CSS Variables: Light Mode (default) --- */
:root {
    --rtgn-bg: #f8fafc;
    --rtgn-bg-alt: #ffffff;
    --rtgn-bg-stripe: #f1f5f9;
    --rtgn-bg-hover: #e2e8f0;
    --rtgn-border: #e2e8f0;
    --rtgn-border-strong: #cbd5e1;
    --rtgn-text: #1e293b;
    --rtgn-text-muted: #64748b;
    --rtgn-text-faint: #94a3b8;
    --rtgn-nav-bg: #1e293b;
    --rtgn-nav-border: #334155;
    --rtgn-nav-text: #94a3b8;
    --rtgn-nav-text-hover: #ffffff;
    --rtgn-primary: #1e87f0;
    --rtgn-primary-hover: #0d6edb;
    --rtgn-focus-ring: 30,135,240;
    --rtgn-card-shadow: 0 1px 3px rgba(0,0,0,0.04);
    --rtgn-input-bg: #ffffff;
    --rtgn-input-readonly-bg: #f5f5f5;
    --rtgn-dropdown-shadow: 0 8px 30px rgba(0,0,0,0.1);
    --rtgn-modal-overlay: rgba(0,0,0,0.3);
    --rtgn-summary-bg: #f8f8f8;
    --rtgn-badge-bg: #e8e8e8;
    --rtgn-badge-text: #333;
    --rtgn-notification-success: rgba(50,210,150,1);
    --rtgn-notification-danger: rgba(240,80,110,1);
    --rtgn-logo-filter: none;
}

/* --- CSS Variables: Dark Mode --- */
[data-theme="dark"] {
    --rtgn-bg: #0f172a;
    --rtgn-bg-alt: #1e293b;
    --rtgn-bg-stripe: #1a2332;
    --rtgn-bg-hover: #334155;
    --rtgn-border: #334155;
    --rtgn-border-strong: #475569;
    --rtgn-text: #e2e8f0;
    --rtgn-text-muted: #94a3b8;
    --rtgn-text-faint: #64748b;
    --rtgn-nav-bg: #0b1120;
    --rtgn-nav-border: #1e293b;
    --rtgn-nav-text: #94a3b8;
    --rtgn-nav-text-hover: #ffffff;
    --rtgn-primary: #3b82f6;
    --rtgn-primary-hover: #60a5fa;
    --rtgn-focus-ring: 59,130,246;
    --rtgn-card-shadow: 0 1px 3px rgba(0,0,0,0.3);
    --rtgn-input-bg: #1e293b;
    --rtgn-input-readonly-bg: #263246;
    --rtgn-dropdown-shadow: 0 8px 30px rgba(0,0,0,0.4);
    --rtgn-modal-overlay: rgba(0,0,0,0.6);
    --rtgn-summary-bg: #1e293b;
    --rtgn-badge-bg: #334155;
    --rtgn-badge-text: #e2e8f0;
    --rtgn-notification-success: rgba(34,160,110,1);
    --rtgn-notification-danger: rgba(200,60,90,1);
    --rtgn-logo-filter: brightness(1.5);
}

/* --- Base --- */
body {
    background: var(--rtgn-bg) !important;
    color: var(--rtgn-text) !important;
    transition: background 0.2s, color 0.2s;
}

/* --- Navbar --- */
.uk-navbar-container {
    background: var(--rtgn-nav-bg) !important;
    border-bottom: 1px solid var(--rtgn-nav-border) !important;
}
.uk-navbar-nav > li > a {
    color: var(--rtgn-nav-text) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: color 0.15s !important;
}
.uk-navbar-nav > li > a:hover,
.uk-navbar-nav > li.uk-active > a {
    color: var(--rtgn-nav-text-hover) !important;
}
.uk-logo img { filter: var(--rtgn-logo-filter); }

/* --- Navbar Dropdown --- */
.uk-navbar-dropdown {
    background: var(--rtgn-bg-alt) !important;
    border: 1px solid var(--rtgn-border) !important;
    border-radius: 8px !important;
    box-shadow: var(--rtgn-dropdown-shadow) !important;
    padding: 8px !important;
}
.uk-navbar-dropdown-nav > li > a {
    color: var(--rtgn-text) !important;
    font-size: 13px !important;
    padding: 7px 12px !important;
    border-radius: 5px !important;
}
.uk-navbar-dropdown-nav > li > a:hover {
    background: var(--rtgn-bg-hover) !important;
    color: var(--rtgn-primary) !important;
}
.uk-nav-header {
    color: var(--rtgn-text-muted) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    padding: 8px 12px 4px !important;
}
.uk-nav-divider {
    margin: 4px 12px !important;
    border-color: var(--rtgn-border) !important;
}

/* --- Buttons --- */
.uk-button {
    border-radius: 6px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    transition: all 0.15s !important;
}
.uk-button-default {
    background: var(--rtgn-bg-alt) !important;
    border: 1px solid var(--rtgn-border) !important;
    color: var(--rtgn-text) !important;
}
.uk-button-default:hover {
    background: var(--rtgn-bg-stripe) !important;
    border-color: var(--rtgn-border-strong) !important;
    color: var(--rtgn-text) !important;
}
.uk-button-primary {
    background: var(--rtgn-primary) !important;
    color: #fff !important;
    border: 1px solid var(--rtgn-primary) !important;
}
.uk-button-primary:hover {
    background: var(--rtgn-primary-hover) !important;
}
.uk-button-secondary {
    background: var(--rtgn-nav-bg) !important;
    color: #fff !important;
}
.uk-button-danger {
    background: #dc2626 !important;
    color: #fff !important;
    border: 1px solid #dc2626 !important;
}
.uk-button-success {
    color: #fff !important;
    background: #16a34a !important;
}
.uk-icon-button {
    border-radius: 6px !important;
    background: var(--rtgn-bg-alt) !important;
    color: var(--rtgn-text) !important;
    border: 1px solid var(--rtgn-border) !important;
}

/* --- Forms --- */
.uk-input, .uk-select, .uk-textarea {
    border: 1px solid var(--rtgn-border) !important;
    border-radius: 6px !important;
    background: var(--rtgn-input-bg) !important;
    color: var(--rtgn-text) !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
}
.uk-input:focus, .uk-select:focus, .uk-textarea:focus {
    border-color: var(--rtgn-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--rtgn-focus-ring),0.15) !important;
    outline: none !important;
}
.uk-input[readonly] {
    background: var(--rtgn-input-readonly-bg) !important;
    color: var(--rtgn-text-muted) !important;
}

/* --- Tables --- */
.uk-table th {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: var(--rtgn-text-muted) !important;
    border-bottom: 2px solid var(--rtgn-border) !important;
}
.uk-table td {
    border-bottom: 1px solid var(--rtgn-border) !important;
}
[data-theme="dark"] .uk-table td {
    color: var(--rtgn-text) !important;
}
.uk-table-striped tbody tr:nth-of-type(odd) { background: var(--rtgn-bg-stripe) !important; }
.uk-table-striped tbody tr:nth-of-type(even) { background: var(--rtgn-bg-alt) !important; }
.uk-table-hover tbody tr:hover { background: var(--rtgn-bg-hover) !important; }

/* --- Cards --- */
.uk-card-default {
    background: var(--rtgn-bg-alt) !important;
    border: 1px solid var(--rtgn-border) !important;
    border-radius: 8px !important;
    box-shadow: var(--rtgn-card-shadow) !important;
    color: var(--rtgn-text) !important;
}
.uk-card-title { font-size: 15px !important; font-weight: 600 !important; color: var(--rtgn-text) !important; }

/* --- Labels & Badges --- */
.uk-label { border-radius: 4px !important; font-size: 11px !important; font-weight: 600 !important; }
.uk-badge { border-radius: 6px !important; font-size: 11px !important; font-weight: 600 !important; }

/* --- Tabs --- */
.uk-tab > li > a {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--rtgn-text-muted) !important;
}
.uk-tab > .uk-active > a {
    color: var(--rtgn-primary) !important;
    border-bottom-color: var(--rtgn-primary) !important;
}
.uk-tab::before { border-bottom-color: var(--rtgn-border) !important; }

/* --- Alerts --- */
.uk-alert { border-radius: 6px !important; }
.uk-alert-primary {
    background: rgba(var(--rtgn-focus-ring),0.1) !important;
    color: var(--rtgn-primary) !important;
}

/* --- Progress --- */
.uk-progress { border-radius: 99px !important; height: 8px !important; background: var(--rtgn-border) !important; }
.uk-progress::-webkit-progress-value { border-radius: 99px !important; background: var(--rtgn-primary) !important; }
.uk-progress::-moz-progress-bar { border-radius: 99px !important; background: var(--rtgn-primary) !important; }

/* --- Modal --- */
.uk-modal-dialog {
    background: var(--rtgn-bg-alt) !important;
    color: var(--rtgn-text) !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25) !important;
}
.uk-modal-title { font-size: 18px !important; font-weight: 600 !important; color: var(--rtgn-text) !important; }

/* --- Notifications --- */
.uk-notification-message { border-radius: 6px !important; }
.uk-notification-message-success { background: var(--rtgn-notification-success) !important; }
.uk-notification-message-danger { background: var(--rtgn-notification-danger) !important; }

/* --- Headings --- */
h3, h4, h5, h6 { color: var(--rtgn-text) !important; }

/* --- Loader overlay --- */
div.rtgnloader,
div.dataTables_wrapper div.dataTables_processing {
    background-color: var(--rtgn-modal-overlay) !important;
}

/* --- DataTables dark mode --- */
[data-theme="dark"] div.dataTables_wrapper div.dataTables_info,
[data-theme="dark"] div.dataTables_wrapper div.dataTables_paginate { color: var(--rtgn-text-muted) !important; }
[data-theme="dark"] div.dataTables_wrapper div.dataTables_filter input { background: var(--rtgn-input-bg) !important; color: var(--rtgn-text) !important; border-color: var(--rtgn-border) !important; }
[data-theme="dark"] div.dataTables_wrapper div.dataTables_length select { background: var(--rtgn-input-bg) !important; color: var(--rtgn-text) !important; border-color: var(--rtgn-border) !important; }
[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--rtgn-text-muted) !important; }
[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current { color: var(--rtgn-primary) !important; }

/* --- Dark Mode: Inline style overrides ---
   Many views use inline style="color:#333" etc.
   These selectors catch the most common ones.
*/
[data-theme="dark"] [style*="background:#f8f8f8"],
[data-theme="dark"] [style*="background: #f8f8f8"] {
    background: var(--rtgn-summary-bg) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] [style*="color:#999"] { color: var(--rtgn-text-faint) !important; }
[data-theme="dark"] [style*="color:#666"] { color: var(--rtgn-text-muted) !important; }
[data-theme="dark"] [style*="color:#333"] { color: var(--rtgn-text) !important; }
[data-theme="dark"] [style*="color:#0064d2"] { color: #60a5fa !important; }
[data-theme="dark"] [style*="background:#e8e8e8"] { background: var(--rtgn-badge-bg) !important; color: var(--rtgn-badge-text) !important; }
[data-theme="dark"] [style*="background:#f5f5f5"] { background: var(--rtgn-input-readonly-bg) !important; }
[data-theme="dark"] [style*="background:#fff8f0"] { background: #2d2006 !important; }
[data-theme="dark"] [style*="background:#f0f0f0"] { background: var(--rtgn-bg-stripe) !important; }

/* --- Theme Toggle Button (in navbar) --- */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px;
    background: var(--rtgn-nav-border);
    border-radius: 6px;
    margin-right: 4px;
}
.theme-toggle-btn {
    width: 26px; height: 26px;
    border: none; border-radius: 5px;
    background: transparent; color: var(--rtgn-nav-text);
    cursor: pointer; font-size: 12px;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.15s;
    padding: 0;
}
.theme-toggle-btn.active {
    background: var(--rtgn-primary);
    color: #fff;
}
.theme-toggle-btn:hover:not(.active) {
    color: #fff;
}

/* --- Dark Mode: Filter/Action buttons with inline background:#fff --- */
[data-theme="dark"] #purchaseFilter .uk-button[style*="background:#fff"],
[data-theme="dark"] #purchaseFilter a.uk-button[style*="background:#fff"] {
    background: var(--rtgn-bg-alt) !important;
}
[data-theme="dark"] .uk-button[style*="background:#fff"] {
    background: var(--rtgn-bg-alt) !important;
}
[data-theme="dark"] .uk-form-label {
    color: var(--rtgn-text-muted) !important;
}
/* DataTables search + show entries */
[data-theme="dark"] div.dataTables_wrapper div.dataTables_filter label,
[data-theme="dark"] div.dataTables_wrapper div.dataTables_length label {
    color: var(--rtgn-text-muted) !important;
}

/* --- Fix: html background for short pages --- */
html {
    background: var(--rtgn-bg) !important;
    min-height: 100%;
}
/* Radio buttons / checkboxes labels */
[data-theme="dark"] label {
    color: var(--rtgn-text) !important;
}

/* --- Dark Mode: table-divider borders --- */
[data-theme="dark"] .uk-table-divider > tr:not(:first-child),
[data-theme="dark"] .uk-table-divider > :not(:first-child) > tr,
[data-theme="dark"] .uk-table-divider > :first-child > tr:not(:first-child) {
    border-top-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .uk-table-divider > tr:first-child,
[data-theme="dark"] .uk-table-divider > :first-child > tr:first-child {
    border-top-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .uk-table th {
    border-bottom-color: var(--rtgn-border) !important;
}

/* --- Dark Mode: alert classes on table cells (Sales Price rows) --- */
[data-theme="dark"] td.uk-alert-success {
    background: rgba(50,210,150,0.15) !important;
    color: #6ee7b7 !important;
}
[data-theme="dark"] td.uk-alert-warning {
    background: rgba(250,160,90,0.15) !important;
    color: #fcd34d !important;
}
[data-theme="dark"] td.uk-alert-danger {
    background: rgba(240,80,110,0.15) !important;
    color: #fca5a5 !important;
}

/* --- Dark Mode: productTable/salesTable text colors --- */
[data-theme="dark"] .productTable th,
[data-theme="dark"] .salesTable th {
    color: var(--rtgn-text-muted) !important;
}
[data-theme="dark"] .productTable td,
[data-theme="dark"] .salesTable td {
    color: var(--rtgn-text) !important;
}

/* --- Dark Mode: uk-alert boxes (divs, not just td) --- */
[data-theme="dark"] .uk-alert-danger {
    background: rgba(240,80,110,0.15) !important;
    color: #fca5a5 !important;
}
[data-theme="dark"] .uk-alert-success {
    background: rgba(50,210,150,0.15) !important;
    color: #6ee7b7 !important;
}
[data-theme="dark"] .uk-alert-warning {
    background: rgba(250,160,90,0.15) !important;
    color: #fcd34d !important;
}
/* Close button in dark modals */
[data-theme="dark"] .uk-modal-close-default,
[data-theme="dark"] .uk-close {
    color: var(--rtgn-text-muted) !important;
}
[data-theme="dark"] .uk-modal-close-default:hover,
[data-theme="dark"] .uk-close:hover {
    color: var(--rtgn-text) !important;
}

/* --- Dark Mode: Footer overlays (KIGN integration) --- */
[data-theme="dark"] #productDetailOverlay iframe,
[data-theme="dark"] #ebayAuctionOverlay iframe {
    background: var(--rtgn-bg-alt) !important;
}
[data-theme="dark"] #ebayAuctionOverlay > div {
    background: var(--rtgn-bg-alt) !important;
}
[data-theme="dark"] #productDetailOverlay button,
[data-theme="dark"] #ebayAuctionOverlay button {
    color: var(--rtgn-text) !important;
}

/* --- Dark Mode: Perplexity Research Widget --- */
[data-theme="dark"] .gn-rp-panel {
    background: var(--rtgn-bg-alt) !important;
    border: 1px solid var(--rtgn-border) !important;
}
[data-theme="dark"] .gn-rp-messages {
    background: var(--rtgn-bg) !important;
}
[data-theme="dark"] .gn-rp-msg.assistant {
    background: var(--rtgn-bg-stripe) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] .gn-rp-input-area {
    background: var(--rtgn-bg-alt) !important;
    border-top-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .gn-rp-input-area input {
    background: var(--rtgn-input-bg) !important;
    color: var(--rtgn-text) !important;
    border-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .gn-rp-chat-list {
    background: var(--rtgn-bg-alt) !important;
}
[data-theme="dark"] .gn-rp-chat-list-header {
    background: var(--rtgn-bg-alt) !important;
    border-bottom-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .gn-rp-chat-item {
    color: var(--rtgn-text) !important;
    border-bottom-color: var(--rtgn-border) !important;
}
[data-theme="dark"] .gn-rp-chat-item:hover {
    background: var(--rtgn-bg-hover) !important;
}
/* Bot toggle button stays bright in dark mode */
[data-theme="dark"] .gn-rp-toggle {
    box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
}

/* --- Dark Mode: uk-background-default (e.g. tab bars) --- */
[data-theme="dark"] .uk-background-default {
    background: var(--rtgn-bg-alt) !important;
}

/* --- Dark Mode: inline background:#fff overrides --- */
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#fff"] {
    background: var(--rtgn-bg-alt) !important;
    color: var(--rtgn-text) !important;
}

/* --- Dark Mode: uk-list-striped (autocomplete dropdowns) --- */
[data-theme="dark"] .uk-list-striped > li:nth-of-type(odd) {
    background: var(--rtgn-bg-stripe) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] .uk-list-striped > li:nth-of-type(even) {
    background: var(--rtgn-bg-alt) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] .uk-list-striped > li {
    border-bottom: 1px solid var(--rtgn-border) !important;
}
/* Autocomplete dropdown container */
[data-theme="dark"] .autocompleteField {
    background: var(--rtgn-bg-alt) !important;
    border-color: var(--rtgn-border) !important;
}
[data-theme="dark"] [style*="border: 1px solid #e5e5e5"] {
    border-color: var(--rtgn-border) !important;
}

/* --- Dark Mode: Modal header/body/footer --- */
[data-theme="dark"] .uk-modal-header {
    background: var(--rtgn-bg-alt) !important;
    border-bottom-color: var(--rtgn-border) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] .uk-modal-body {
    background: var(--rtgn-bg-alt) !important;
    color: var(--rtgn-text) !important;
}
[data-theme="dark"] .uk-modal-footer {
    background: var(--rtgn-bg-alt) !important;
    border-top-color: var(--rtgn-border) !important;
    color: var(--rtgn-text) !important;
}