/* =========================================================
   ETNawlonERP — Unified Professional Theme Engine
   Single-Source Dark/Light Mode System (Zero Duplication)
   ========================================================= */

/* --- 1. TYPOGRAPHY SCALING --- */
html[data-font-size="S"] { font-size: 12px !important; }
html[data-font-size="M"] { font-size: 13.5px !important; }
html[data-font-size="L"] { font-size: 15px !important; }

/* --- 2. GLOBAL THEME DESIGN TOKENS --- */
html,
html[data-theme="dark"] {
    --et-bg-canvas: #070c19;
    --et-bg-surface: #0e172a;
    --et-bg-card: #0f1c34;
    --et-bg-sidebar: #091122;
    --et-bg-topbar: #0b1428;
    --et-bg-input: #0a1324;
    --et-bg-subtle: #162644;
    --et-border-color: #1a2a47;
    --et-text-primary: #f8fafc;
    --et-text-muted: #94a3b8;
    --et-accent-cyan: #38bdf8;

    /* OSRAD & ERP Compatibility Variables */
    --osrad-bg-primary: #0f1c34 !important;
    --osrad-bg-secondary: #070c19 !important;
    --osrad-bg-tertiary: #0b1428 !important;
    --osrad-text-primary: #f8fafc !important;
    --osrad-text-secondary: #94a3b8 !important;
    --osrad-border: #1a2a47 !important;
    --erp-bg-page: #070c19 !important;
    --erp-border: #1a2a47 !important;

    background-color: #070c19 !important;
    color: #f8fafc !important;
}

html[data-theme="light"] {
    --et-bg-canvas: #f8fafc;
    --et-bg-surface: #ffffff;
    --et-bg-card: #ffffff;
    --et-bg-sidebar: #0f172a;
    --et-bg-topbar: #ffffff;
    --et-bg-input: #ffffff;
    --et-bg-subtle: #edf2f7;
    --et-border-color: #e2e8f0;
    --et-text-primary: #0f172a;
    --et-text-muted: #64748b;
    --et-accent-cyan: #0284c7;

    background-color: #f8fafc !important;
    color: #0f172a !important;
}

/* --- 3. UNIFIED DATA GRIDS STYLED EXACTLY LIKE SHIPMENTS GRID IN DARK MODE --- */

html:not([data-theme="light"]) table,
html:not([data-theme="light"]) .table,
html:not([data-theme="light"]) .data-table,
html:not([data-theme="light"]) .et-grid,
html:not([data-theme="light"]) .osrad-grid,
html:not([data-theme="light"]) .dxbl-grid,
html:not([data-theme="light"]) .rate-table,
html:not([data-theme="light"]) .et-lookup-grid,
html:not([data-theme="light"]) .booking-charges-grid,
html:not([data-theme="light"]) .quotation-charges-grid,
html:not([data-theme="light"]) .rate-register-grid,
html:not([data-theme="light"]) .quote-register-grid,
html:not([data-theme="light"]) .rate-register-card,
html:not([data-theme="light"]) .admin-data-card,
html:not([data-theme="light"]) .rate-filter-strip {
    background-color: #0f1c34 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid #1a2a47 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    width: 100% !important;
    color: #f8fafc !important;
}

/* Header style like Shipments Grid (Dark Slate Header #0b1428) */
html:not([data-theme="light"]) table thead,
html:not([data-theme="light"]) .table thead,
html:not([data-theme="light"]) .data-table thead,
html:not([data-theme="light"]) .et-grid thead,
html:not([data-theme="light"]) .osrad-grid thead,
html:not([data-theme="light"]) .dxbl-grid thead,
html:not([data-theme="light"]) .rate-table thead,
html:not([data-theme="light"]) .rate-register-grid thead,
html:not([data-theme="light"]) .quote-register-grid thead,
html:not([data-theme="light"]) .table-dark-slate thead {
    background-color: #0b1428 !important;
    color: #f8fafc !important;
    border-bottom: 2px solid #1a2a47 !important;
}

html:not([data-theme="light"]) table thead th,
html:not([data-theme="light"]) .table thead th,
html:not([data-theme="light"]) .data-table thead th,
html:not([data-theme="light"]) .et-grid thead th,
html:not([data-theme="light"]) .osrad-grid thead th,
html:not([data-theme="light"]) .dxbl-grid thead th,
html:not([data-theme="light"]) .rate-table thead th,
html:not([data-theme="light"]) .rate-register-grid thead th,
html:not([data-theme="light"]) .quote-register-grid thead th,
html:not([data-theme="light"]) .table-dark-slate thead th {
    background-color: #0b1428 !important;
    color: #f8fafc !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 0.5rem 0.65rem !important;
    border-bottom: 2px solid #1a2a47 !important;
    border-right: 1px solid #1a2a47 !important;
}

/* Dense Cells style like Shipments Grid (#0f1c34) */
html:not([data-theme="light"]) table tbody td,
html:not([data-theme="light"]) .table tbody td,
html:not([data-theme="light"]) .data-table tbody td,
html:not([data-theme="light"]) .et-grid tbody td,
html:not([data-theme="light"]) .osrad-grid tbody td,
html:not([data-theme="light"]) .dxbl-grid tbody td,
html:not([data-theme="light"]) .rate-table tbody td,
html:not([data-theme="light"]) .rate-register-grid tbody td,
html:not([data-theme="light"]) .quote-register-grid tbody td,
html:not([data-theme="light"]) .table-dense tbody td {
    background-color: #0f1c34 !important;
    color: #f8fafc !important;
    padding: 0.42rem 0.65rem !important;
    font-size: 0.82rem !important;
    border-bottom: 1px solid #1a2a47 !important;
    border-right: 1px solid #1a2a47 !important;
    vertical-align: middle !important;
}

/* Hover Rows */
html:not([data-theme="light"]) table tbody tr:hover,
html:not([data-theme="light"]) .table tbody tr:hover,
html:not([data-theme="light"]) .data-table tbody tr:hover,
html:not([data-theme="light"]) .et-grid tbody tr:hover,
html:not([data-theme="light"]) .rate-register-grid tbody tr:hover {
    background-color: rgba(56, 189, 248, 0.08) !important;
}

/* --- 4. UNIFIED DARK MODE OVERRIDES (UNIVERSAL WILDCARDS) --- */

/* ALL FOOTERS IN ENTIRE APPLICATION */
html:not([data-theme="light"]) footer,
html:not([data-theme="light"]) .footer,
html:not([data-theme="light"]) .modal-footer,
html:not([data-theme="light"]) .et-drawer-footer,
html:not([data-theme="light"]) .et-dynamic-drawer__footer,
html:not([data-theme="light"]) .et-modal-footer,
html:not([data-theme="light"]) .et-confirm-dialog__actions,
html:not([data-theme="light"]) .shared-dialog-actions,
html:not([data-theme="light"]) .admin-actions,
html:not([data-theme="light"]) .row-actions,
html:not([data-theme="light"]) .et-grid-pager,
html:not([data-theme="light"]) div[class*="footer"],
html:not([data-theme="light"]) footer[class*="footer"] {
    background: #0b1428 !important;
    background-color: #0b1428 !important;
    border-top: 1px solid #1a2a47 !important;
    color: #f8fafc !important;
}

/* ALL POPUP EDIT PANELS & DRAWERS IN ENTIRE APPLICATION */
html:not([data-theme="light"]) .admin-form,
html:not([data-theme="light"]) .admin-form--popup,
html:not([data-theme="light"]) .admin-grid-two:has(.admin-data-card) > .admin-form,
html:not([data-theme="light"]) .et-dynamic-drawer__panel,
html:not([data-theme="light"]) .et-dynamic-drawer__panel--popup,
html:not([data-theme="light"]) .et-dynamic-drawer--popup,
html:not([data-theme="light"]) .admin-dialog,
html:not([data-theme="light"]) .shared-dialog,
html:not([data-theme="light"]) .modal-content,
html:not([data-theme="light"]) .modal-dialog,
html:not([data-theme="light"]) .drawer,
html:not([data-theme="light"]) .child-drawer,
html:not([data-theme="light"]) .et-modal,
html:not([data-theme="light"]) div[class*="panel"],
html:not([data-theme="light"]) div[class*="drawer"],
html:not([data-theme="light"]) div[class*="popup"] {
    background: #0f1c34 !important;
    background-color: #0f1c34 !important;
    border-color: #1a2a47 !important;
    color: #f8fafc !important;
}

/* ALL HEADERS IN ENTIRE APPLICATION */
html:not([data-theme="light"]) .admin-form h2,
html:not([data-theme="light"]) .admin-form-header,
html:not([data-theme="light"]) .et-dynamic-drawer__header,
html:not([data-theme="light"]) .modal-header,
html:not([data-theme="light"]) .drawer-header,
html:not([data-theme="light"]) .et-modal-header,
html:not([data-theme="light"]) div[class*="header"],
html:not([data-theme="light"]) header[class*="header"] {
    background: #0b1428 !important;
    background-color: #0b1428 !important;
    border-bottom: 1px solid #1a2a47 !important;
    color: #f8fafc !important;
}

/* Canvas & Main Structural Wrappers */
html:not([data-theme="light"]) body,
html:not([data-theme="light"]) .et-shell,
html:not([data-theme="light"]) main,
html:not([data-theme="light"]) .content,
html:not([data-theme="light"]) .rate-workspace,
html:not([data-theme="light"]) .booking-workspace,
html:not([data-theme="light"]) .quote-workspace,
html:not([data-theme="light"]) .quotation-workspace,
html:not([data-theme="light"]) .et-crud,
html:not([data-theme="light"]) .osrad-workspace,
html:not([data-theme="light"]) .et-dynamic-page,
html:not([data-theme="light"]) .dashboard-container {
    background: #070c19 !important;
    color: #f8fafc !important;
}

/* Sidebars & Top Navigation Bars */
html:not([data-theme="light"]) .et-sidebar { background: #091122 !important; border-right-color: #1a2a47 !important; }
html:not([data-theme="light"]) .et-topbar { background: #0b1428 !important; border-bottom-color: #1a2a47 !important; color: #f8fafc !important; }

/* All Cards, Panels, Drawers, Modals, Shared Dialogs & Popups */
html:not([data-theme="light"]) .card,
html:not([data-theme="light"]) .rate-card,
html:not([data-theme="light"]) .booking-card,
html:not([data-theme="light"]) .quotation-card,
html:not([data-theme="light"]) .quote-register-card,
html:not([data-theme="light"]) .rate-register-card,
html:not([data-theme="light"]) .admin-data-card,
html:not([data-theme="light"]) .admin-card,
html:not([data-theme="light"]) .et-card,
html:not([data-theme="light"]) .et-panel,
html:not([data-theme="light"]) .osrad-panel,
html:not([data-theme="light"]) .shared-panel,
html:not([data-theme="light"]) .shared-dialog,
html:not([data-theme="light"]) .foundation-card,
html:not([data-theme="light"]) .detail-panel,
html:not([data-theme="light"]) .form-panel,
html:not([data-theme="light"]) .kpi-card,
html[data-theme="dark"] .card-box,
html:not([data-theme="light"]) .dashboard-header,
html:not([data-theme="light"]) .modal-content,
html:not([data-theme="light"]) .admin-form--popup,
html:not([data-theme="light"]) .et-modal,
html:not([data-theme="light"]) .et-toast,
html:not([data-theme="light"]) .et-confirm-dialog,
html:not([data-theme="light"]) .et-alert-dialog,
html:not([data-theme="light"]) .et-lookup-dialog__panel,
html:not([data-theme="light"]) .et-dynamic-drawer__panel,
html:not([data-theme="light"]) .et-dynamic-drawer__panel--popup,
html:not([data-theme="light"]) .admin-grid-two:has(.admin-data-card) > .admin-form,
html:not([data-theme="light"]) .admin-form,
html:not([data-theme="light"]) .child-drawer,
html:not([data-theme="light"]) .drawer,
html:not([data-theme="light"]) .admin-dialog,
html:not([data-theme="light"]) .et-audit-panel,
html:not([data-theme="light"]) .bg-white,
html:not([data-theme="light"]) .bg-light {
    background-color: #0f1c34 !important;
    border-color: #1a2a47 !important;
    color: #f8fafc !important;
}

/* Toolbars & Action Bars */
html:not([data-theme="light"]) .admin-toolbar,
html:not([data-theme="light"]) .et-command-bar,
html:not([data-theme="light"]) .et-grid-toolbar,
html:not([data-theme="light"]) .rate-register-toolbar,
html:not([data-theme="light"]) .quote-register-toolbar,
html:not([data-theme="light"]) .quotation-toolbar,
html:not([data-theme="light"]) .booking-toolbar,
html:not([data-theme="light"]) .et-master-tabs,
html:not([data-theme="light"]) .modal-header,
html:not([data-theme="light"]) .modal-footer,
html:not([data-theme="light"]) .drawer-header,
html:not([data-theme="light"]) .drawer-footer,
html:not([data-theme="light"]) .et-modal-header,
html:not([data-theme="light"]) .et-modal-footer,
html:not([data-theme="light"]) .et-dynamic-drawer__header,
html:not([data-theme="light"]) .et-dynamic-drawer__footer,
html:not([data-theme="light"]) .admin-grid-two:has(.admin-data-card) > .admin-form h2,
html:not([data-theme="light"]) .admin-grid-two:has(.admin-data-card) > .admin-form .admin-actions {
    background: #0b1428 !important;
    border-color: #1a2a47 !important;
    color: #f8fafc !important;
}

/* Inputs, Selects, Searches & Textareas */
html:not([data-theme="light"]) input[type="text"],
html:not([data-theme="light"]) input[type="number"],
html:not([data-theme="light"]) input[type="date"],
html:not([data-theme="light"]) input[type="search"],
html:not([data-theme="light"]) select,
html:not([data-theme="light"]) textarea,
html:not([data-theme="light"]) .form-control,
html:not([data-theme="light"]) .form-select,
html:not([data-theme="light"]) .admin-input,
html:not([data-theme="light"]) .et-input,
html[data-theme="dark"] .et-select,
html:not([data-theme="light"]) .et-textbox,
html:not([data-theme="light"]) .et-grid-search,
html:not([data-theme="light"]) .et-lookup-dialog__search,
html:not([data-theme="light"]) .et-input-wrapper__control > input,
html:not([data-theme="light"]) .et-input-wrapper__control > select,
html:not([data-theme="light"]) .et-input-wrapper__control > textarea {
    background-color: #0a1324 !important;
    border-color: #1a2a47 !important;
    color: #f8fafc !important;
}

html:not([data-theme="light"]) input:focus,
html:not([data-theme="light"]) select:focus,
html:not([data-theme="light"]) textarea:focus,
html:not([data-theme="light"]) .form-control:focus,
html:not([data-theme="light"]) .form-select:focus {
    background-color: #0d1a30 !important;
    border-color: #38bdf8 !important;
    box-shadow: 0 0 0 0.2rem rgba(56, 189, 248, 0.2) !important;
    color: #ffffff !important;
}

/* Buttons, Micro-Actions & Chips */
html:not([data-theme="light"]) .et-command-button,
html:not([data-theme="light"]) .et-drawer-action,
html:not([data-theme="light"]) .et-grid-row-action,
html:not([data-theme="light"]) .et-button,
html:not([data-theme="light"]) .et-button--ghost,
html:not([data-theme="light"]) .et-icon-button,
html:not([data-theme="light"]) .link-button,
html:not([data-theme="light"]) .et-lookup-input button,
html:not([data-theme="light"]) .et-lookup-dialog__header button,
html:not([data-theme="light"]) .et-lookup-action,
html:not([data-theme="light"]) .et-audit-chip,
html:not([data-theme="light"]) .shared-dialog-actions button,
html:not([data-theme="light"]) .et-confirm-dialog__cancel,
html:not([data-theme="light"]) .et-confirm-dialog__confirm,
html:not([data-theme="light"]) .et-alert-dialog__button {
    background-color: #162644 !important;
    border-color: #1a2a47 !important;
    color: #38bdf8 !important;
}

/* Typography & Labels */
html:not([data-theme="light"]) h1, html:not([data-theme="light"]) h2, html:not([data-theme="light"]) h3,
html:not([data-theme="light"]) h4, html:not([data-theme="light"]) h5, html:not([data-theme="light"]) h6,
html:not([data-theme="light"]) strong, html:not([data-theme="light"]) b, html:not([data-theme="light"]) label,
html:not([data-theme="light"]) .shared-dialog h2,
html:not([data-theme="light"]) .et-toast strong,
html:not([data-theme="light"]) .et-confirm-dialog h2,
html:not([data-theme="light"]) .et-alert-dialog h2,
html:not([data-theme="light"]) .text-dark {
    color: #f8fafc !important;
}

html:not([data-theme="light"]) p, html:not([data-theme="light"]) small, html:not([data-theme="light"]) .text-muted,
html:not([data-theme="light"]) .et-toast p,
html:not([data-theme="light"]) .et-confirm-dialog p,
html:not([data-theme="light"]) .et-alert-dialog p,
html:not([data-theme="light"]) .et-grid-page-size {
    color: #94a3b8 !important;
}
