/**
 * Glass theme — page-level overrides (loads after page <style> blocks)
 * Unifies Salaries, Invoices, Tasks, Training Matrix, etc.
 */

/* —— Contrast tokens (readable on glass) —— */
body.app-dashboard {
    --glass-bg-solid: rgba(255, 255, 255, 0.88);
    --glass-bg-muted: rgba(255, 255, 255, 0.62);
    --text-on-glass: #0a0f1a;
    --text-on-glass-muted: #334155;
    --text-on-glass-subtle: #475569;
    color: var(--text-on-glass-muted);
}

body.app-dashboard h1,
body.app-dashboard h2,
body.app-dashboard h3,
body.app-dashboard .page-title,
body.app-dashboard .dc-title,
body.app-dashboard .salary-doc__title,
body.app-dashboard .invoice-card h2 {
    color: var(--text-on-glass) !important;
}

/* Kill per-page flat backgrounds (screen only) */
@media screen {
    body.app-dashboard,
    html body.app-dashboard {
        background: var(--workspace-bg-mesh, #0b1220) !important;
        background-attachment: fixed !important;
    }

    body.app-dashboard .main-content,
    body.app-dashboard .main-content--dense,
    body.salary-modern-page .main-content.main-content--dense {
        background: transparent !important;
    }
}

/* —— Shared glass surface mixin targets —— */
.salary-doc,
.salary-page,
.invoice-page,
.invoice-card,
.invoice-doc,
.tasks-page .task-form,
.tasks-page .table-wrap,
.teams-page .panel,
.cert-page .cert-table-wrap,
.tm-shell,
.tm-modal__panel,
.tm-table-wrap,
.timesheet-shell,
.timesheet-card,
.timesheet-table-wrap,
.data-center-page .table-wrap,
.data-center-page .preview-panel,
.data-center-page .id-card-item,
.doc-card,
.upload-section,
.employee-docs-page .table-wrap,
.preview-panel,
.employee-page .employees-preview,
.employee-page .filter-panel,
.sal-dash,
.sal-kpi-tile,
.inv-kpi-tile,
.salary-doc__meta,
.salary-doc__controls,
.sal-dash-input,
.panel,
.task-tab,
.team-btn,
.tab-btn,
.invoice-project-select,
.invoice-tool-btn,
.dz-default.dz-message,
.dropzone {
    background: var(--glass-bg-solid) !important;
    backdrop-filter: blur(var(--glass-blur, 20px)) saturate(var(--glass-saturate, 160%));
    -webkit-backdrop-filter: blur(var(--glass-blur, 20px)) saturate(var(--glass-saturate, 160%));
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted);
    box-shadow: var(--glass-shadow) !important;
}

/* —— Salaries (full glass) —— */
body.app-dashboard .salary-doc {
    background: var(--glass-bg-solid) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

body.app-dashboard .salary-doc__header {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(255, 255, 255, 0.78) 55%,
        color-mix(in srgb, var(--primary) 14%, rgba(255, 255, 255, 0.72)) 100%
    ) !important;
    color: var(--text-on-glass) !important;
    border-bottom: 4px solid var(--brand) !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5) !important;
}

body.app-dashboard .salary-doc__title,
body.app-dashboard .sal-kpi-strip__title,
body.app-dashboard .sal-kpi-tile__val,
body.app-dashboard .salary-section-label {
    color: var(--text-on-glass) !important;
}

body.app-dashboard .salary-doc__company,
body.app-dashboard .salary-doc__placeholder,
body.app-dashboard .salary-toolbar__title,
body.app-dashboard .salary-note,
body.app-dashboard .sal-kpi-strip__title-note,
body.app-dashboard .sal-kpi-strip__hint,
body.app-dashboard .sal-kpi-tile__lab,
body.app-dashboard .salary-section-label span {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .salary-doc__meta {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
}

body.app-dashboard .salary-doc__meta .meta-k { color: var(--brand) !important; }
body.app-dashboard .salary-doc__meta .meta-v { color: var(--text-on-glass-muted) !important; font-weight: 700; }

body.app-dashboard .salary-doc__controls,
body.app-dashboard .sal-dash {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .sal-welcome-banner {
    background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 12%, transparent), var(--glass-bg-muted)) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted) !important;
}

body.app-dashboard .sal-welcome-banner i { color: var(--brand) !important; }

body.app-dashboard .sal-payroll-kpis--all-sites {
    border-top-color: var(--glass-border) !important;
}

body.app-dashboard .sal-kpi-tile {
    background: var(--glass-bg-solid) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
}

body.app-dashboard .sal-kpi-tile::before { background: var(--brand) !important; }
body.app-dashboard .sal-kpi-tile--scope::before { background: var(--brand) !important; }
body.app-dashboard .sal-kpi-tile--emp::before { background: var(--primary) !important; }
body.app-dashboard .sal-kpi-tile--gross::before { background: #d97706 !important; }
body.app-dashboard .sal-kpi-tile--ins::before { background: color-mix(in srgb, var(--brand) 60%, #8b5cf6) !important; }
body.app-dashboard .sal-kpi-tile--net::before { background: var(--color-success) !important; }

body.app-dashboard .sal-kpi-tile--scope .sal-kpi-tile__icon { background: var(--glass-bg-muted) !important; color: var(--brand) !important; }
body.app-dashboard .sal-kpi-tile--emp .sal-kpi-tile__icon { background: var(--glass-bg-muted) !important; color: var(--primary) !important; }

body.app-dashboard .salary-table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .salary-table tbody tr:nth-child(even) td,
body.app-dashboard .salary-table tbody tr:nth-child(odd) td {
    background: rgba(255, 255, 255, 0.42) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .salary-table tbody tr:hover td {
    background: rgba(255, 255, 255, 0.72) !important;
}

body.app-dashboard .sal-kpi-tile,
body.app-dashboard .inv-kpi-tile {
    border: 1px solid var(--glass-border) !important;
}

body.app-dashboard .sal-dash-btn-secondary,
body.app-dashboard .sal-dash-btn-ghost,
body.app-dashboard .sal-dash-input,
body.app-dashboard .sal-dash-toolbar select.cell-input {
    background: var(--glass-bg-solid) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .salary-badge {
    background: var(--color-warning-bg) !important;
    border-color: rgba(245, 158, 11, 0.45) !important;
    color: #92400e !important;
}

/* —— Invoices (full glass unification) —— */
body.app-dashboard .invoice-page {
    background: transparent !important;
}

body.app-dashboard .invoice-doc,
body.app-dashboard .invoice-card {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

body.app-dashboard .invoice-doc__header {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(255, 255, 255, 0.78) 55%,
        color-mix(in srgb, var(--primary) 14%, rgba(255, 255, 255, 0.72)) 100%
    ) !important;
    color: var(--text-on-glass) !important;
    border-bottom: 4px solid var(--brand) !important;
}

body.app-dashboard .invoice-doc__title {
    color: var(--text-on-glass) !important;
}

body.app-dashboard .invoice-doc__company,
body.app-dashboard .invoice-doc__active,
body.app-dashboard .invoice-doc__placeholder {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .invoice-doc__active {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .invoice-doc__meta {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-doc__meta .meta-k {
    color: var(--brand) !important;
}

body.app-dashboard .invoice-doc__meta .meta-v {
    color: var(--text-on-glass-muted) !important;
}

body.app-dashboard .invoice-toolbar {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
}

body.app-dashboard .invoice-toolbar__label {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .invoice-toolbar__divider {
    background: var(--glass-border) !important;
}

body.app-dashboard .invoice-tool-btn {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted) !important;
}

body.app-dashboard .invoice-tool-btn:hover {
    background: var(--glass-bg-solid) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 4px 16px var(--accent-shadow) !important;
}

body.app-dashboard .invoice-tool-btn--primary,
body.app-dashboard .btn-refresh {
    background: linear-gradient(135deg, var(--primary), var(--brand)) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 8px 24px var(--accent-shadow) !important;
}

body.app-dashboard .invoice-project-row__lab,
body.app-dashboard .invoice-subject,
body.app-dashboard .invoice-meta,
body.app-dashboard .invoice-note,
body.app-dashboard .inv-kpi-strip__title,
body.app-dashboard .inv-kpi-strip__hint,
body.app-dashboard .inv-kpi-tile__lab {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .invoice-card h2,
body.app-dashboard .invoice-card-head h2,
body.app-dashboard .inv-kpi-strip__title,
body.app-dashboard .inv-kpi-tile__val {
    color: var(--text-on-glass) !important;
}

body.app-dashboard .invoice-project-select,
body.app-dashboard .invoice-rate-input,
body.app-dashboard .invoice-day-input {
    color: var(--text-on-glass) !important;
    -webkit-text-fill-color: var(--text-on-glass) !important;
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-project-select:hover {
    border-color: var(--primary) !important;
}

body.app-dashboard .invoice-table-wrap {
    border-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.38) !important;
}

body.app-dashboard .invoice-table td {
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-table tfoot td {
    background: rgba(16, 185, 129, 0.2) !important;
    color: #065f46 !important;
    font-weight: 800;
}

body.app-dashboard .invoice-alert {
    background: rgba(245, 158, 11, 0.2) !important;
    border-color: rgba(245, 158, 11, 0.45) !important;
    color: #92400e !important;
}

body.app-dashboard .inv-kpi-tile {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
}

body.app-dashboard .inv-kpi-tile::before {
    background: var(--brand) !important;
}

body.app-dashboard .inv-kpi-tile--scope::before { background: var(--brand) !important; }
body.app-dashboard .inv-kpi-tile--emp::before { background: var(--primary) !important; }
body.app-dashboard .inv-kpi-tile--days::before { background: #d97706 !important; }
body.app-dashboard .inv-kpi-tile--rows::before { background: color-mix(in srgb, var(--brand) 70%, #7c3aed) !important; }
body.app-dashboard .inv-kpi-tile--total::before,
body.app-dashboard .inv-kpi-tile--combined::before { background: var(--color-success) !important; }

body.app-dashboard .inv-kpi-tile__icon {
    background: var(--glass-bg-muted) !important;
}

body.app-dashboard .inv-kpi-tile--scope .inv-kpi-tile__icon,
body.app-dashboard .inv-kpi-tile--emp .inv-kpi-tile__icon {
    color: var(--brand) !important;
}

body.app-dashboard .inv-kpi-strip--all {
    border-top-color: var(--glass-border) !important;
}

body.app-dashboard .invoice-inline-btn {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
    color: var(--brand) !important;
}

body.app-dashboard .invoice-inline-btn:hover {
    background: rgba(255, 255, 255, 0.75) !important;
    border-color: var(--primary) !important;
}

body.app-dashboard .invoice-badge-edit {
    background: rgba(245, 158, 11, 0.2) !important;
    color: #92400e !important;
}

/* —— Tasks & Teams —— */
.task-tab {
    background: var(--glass-bg-muted) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

.task-tab.is-active {
    background: linear-gradient(135deg, var(--primary), var(--brand)) !important;
    color: #fff !important;
    border-color: transparent !important;
}

.tasks-table th,
.members-table th,
.cert-table thead th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
}

.tasks-table td,
.members-table td,
.cert-table td {
    background: rgba(255, 255, 255, 0.4) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

.cert-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.28) !important;
}

.cert-toolbar label,
.cert-hint,
.cert-names-cell {
    color: var(--text-on-glass-muted) !important;
}

.team-btn {
    color: var(--text-on-glass) !important;
}

.team-btn.is-active {
    background: linear-gradient(135deg, var(--primary), var(--brand)) !important;
    color: #fff !important;
}

/* —— Training Matrix (full glass) —— */
body.app-dashboard .main-content:has(.tm-page) {
    overflow-y: auto !important;
    overflow-x: hidden;
    min-height: 0;
    flex: 1;
}

body.app-dashboard .tm-main-panel,
body.app-dashboard .tm-grid-wrap,
body.app-dashboard .preview-panel,
body.app-dashboard .tm-cert-head-input,
body.app-dashboard .tm-btn-not-required,
body.app-dashboard .tm-cert-na-restore {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted) !important;
    box-shadow: var(--glass-shadow) !important;
}

body.app-dashboard .tm-main-panel__head,
body.app-dashboard .tm-main-panel__body {
    border-color: var(--glass-border) !important;
}

body.app-dashboard .tm-main-panel__head {
    color: var(--text-on-glass) !important;
    background: rgba(15, 23, 42, 0.05) !important;
}

body.app-dashboard .tm-toolbar label,
body.app-dashboard .tm-hint,
body.app-dashboard .tm-orphan-note,
body.app-dashboard .tm-modal-hint {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .tm-grid {
    background: var(--glass-bg-solid) !important;
}

body.app-dashboard .tm-grid thead th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .tm-grid th.tm-th-emp {
    background: rgba(15, 23, 42, 0.06) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .tm-grid th.tm-th--start {
    background: rgba(16, 185, 129, 0.25) !important;
    color: #065f46 !important;
}

body.app-dashboard .tm-grid th.tm-th--end {
    background: rgba(220, 38, 38, 0.2) !important;
    color: #991b1b !important;
}

body.app-dashboard .tm-grid th.tm-th-cert-title {
    background: color-mix(in srgb, var(--primary) 15%, var(--glass-bg-solid)) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .tm-grid td.tm-row-num,
body.app-dashboard .tm-grid td.tm-td-emp,
body.app-dashboard .tm-grid td.tm-td-pos {
    background: rgba(255, 255, 255, 0.4) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .tm-cert-head-input {
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .tm-cert-head-input:disabled {
    background: var(--glass-bg-muted) !important;
}

body.app-dashboard .tm-btn-not-required:hover,
body.app-dashboard .tm-cert-na-restore:hover {
    border-color: var(--primary) !important;
    background: var(--glass-bg-muted) !important;
}

body.app-dashboard .preview-modal {
    background: rgba(11, 18, 32, 0.65) !important;
    backdrop-filter: blur(8px);
}

/* semantic cert cells — keep meaning, soften to glass */
body.app-dashboard .tm-grid td.tm-cert-pair--active {
    background: rgba(22, 163, 74, 0.75) !important;
    color: #f0fdf4 !important;
}

body.app-dashboard .tm-grid td.tm-cert-pair--expired {
    background: rgba(185, 28, 28, 0.8) !important;
    color: #fef2f2 !important;
}

body.app-dashboard .tm-grid td.tm-cert-pair--empty {
    background: rgba(148, 163, 184, 0.35) !important;
    color: var(--text-on-glass-muted) !important;
}

/* —— TimeSheet (full glass) —— */
body.app-dashboard .main-content:has(.container) {
    overflow-y: auto !important;
    overflow-x: hidden;
    min-height: 0;
    flex: 1;
}

body.app-dashboard .container .card,
body.app-dashboard .timesheet-add-row,
body.app-dashboard .container .table-wrap {
    background: var(--glass-bg-solid) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

body.app-dashboard .container table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .container table td {
    background: rgba(255, 255, 255, 0.42) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .container table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.28) !important;
}

body.app-dashboard #attendanceTable tbody tr:hover td {
    background: color-mix(in srgb, var(--primary) 20%, rgba(255, 255, 255, 0.55)) !important;
}

body.app-dashboard .container .field label {
    color: var(--text-on-glass-subtle) !important;
}

/* —— Employee page —— */
.employee-page .filter-panel,
.employee-page .employees-preview,
.employee-page .table-wrap {
    background: var(--glass-bg-solid) !important;
}

/* Employee list — scrolling (override glass-theme) */
body.app-dashboard .employee-page .table-wrap {
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
}

body.app-dashboard .main-content:has(.employee-page) {
    overflow-y: auto !important;
    overflow-x: hidden;
    min-height: 0;
    flex: 1;
}

.header-mgr-emp-count {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
}

.header-mgr-emp-count__num,
.header-mgr-emp-count__label {
    color: var(--text-on-glass) !important;
}

/* —— Data Center (full glass) —— */
body.app-dashboard .main-content:has(.data-center-page) {
    overflow-y: auto !important;
    overflow-x: hidden;
    min-height: 0;
    flex: 1;
}

body.app-dashboard .data-center-page .table-wrap,
body.app-dashboard .data-center-page .profile-shell,
body.app-dashboard .data-center-page .doc-card,
body.app-dashboard .data-center-page .preview-box,
body.app-dashboard .data-center-page .id-card-item,
body.app-dashboard .data-center-page .preview-panel,
body.app-dashboard .data-center-page .preview-panel-body,
body.app-dashboard .data-center-page .trash-panel,
body.app-dashboard .data-center-page .trash-table,
body.app-dashboard .data-center-page .tab-btn {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
    color: var(--text-on-glass-muted) !important;
}

body.app-dashboard .data-center-page .dc-title {
    color: var(--text-on-glass) !important;
}

body.app-dashboard .data-center-page .dc-title-count,
body.app-dashboard .data-center-page .profile-meta p,
body.app-dashboard .data-center-page .doc-card .meta {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .data-center-page .profile-meta h3 {
    color: var(--text-on-glass) !important;
}

body.app-dashboard .data-center-page .name-link {
    color: var(--brand) !important;
}

body.app-dashboard .data-center-page .name-link:hover {
    color: var(--primary) !important;
}

body.app-dashboard .data-center-page .doc-link-btn {
    background: var(--glass-bg-muted) !important;
    color: var(--brand) !important;
    border: 1px solid var(--glass-border) !important;
}

body.app-dashboard .data-center-page .doc-link-btn:hover {
    background: var(--glass-bg-solid) !important;
    border-color: var(--primary) !important;
}

body.app-dashboard .data-center-page .dc-zip-link.tab-btn,
body.app-dashboard .data-center-page a.dc-zip-link.tab-btn {
    background: linear-gradient(135deg, var(--primary), var(--brand)) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.app-dashboard .data-center-page .dc-zip-link.tab-btn:hover {
    filter: brightness(1.05);
    color: #fff !important;
}

body.app-dashboard .data-center-page .profile-tabs-inline .tab-btn {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted) !important;
}

body.app-dashboard .data-center-page .tab-btn.is-active,
body.app-dashboard .data-center-page .profile-tabs-inline .tab-btn.is-active {
    background: linear-gradient(135deg, var(--primary), var(--brand)) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.app-dashboard .data-center-page .employees-table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .data-center-page .employees-table td {
    background: rgba(255, 255, 255, 0.42) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .data-center-page .employees-table tbody tr:hover td {
    background: rgba(255, 255, 255, 0.65) !important;
}

body.app-dashboard .data-center-page .profile-photo,
body.app-dashboard .data-center-page .id-thumb {
    border-color: var(--glass-border) !important;
    background: var(--glass-bg-muted) !important;
}

body.app-dashboard .data-center-page .profile-header {
    border-color: var(--glass-border) !important;
}

body.app-dashboard .data-center-page .tabs-row {
    border-color: var(--glass-border) !important;
}

body.app-dashboard .data-center-page .missing-alert {
    background: var(--color-danger-bg) !important;
    color: var(--color-danger) !important;
    border-color: rgba(220, 38, 38, 0.35) !important;
}

body.app-dashboard .data-center-page .trash-table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .data-center-page .preview-modal,
body.app-dashboard .data-center-page .trash-modal {
    background: rgba(11, 18, 32, 0.65) !important;
    backdrop-filter: blur(8px);
}

body.app-dashboard .data-center-page .preview-panel-head,
body.app-dashboard .data-center-page .trash-panel-head {
    background: rgba(15, 23, 42, 0.06) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass) !important;
}

/* —— Certificates (full glass) —— */
body.app-dashboard .main-content:has(.cert-page) {
    overflow-y: auto !important;
    overflow-x: hidden;
    min-height: 0;
    flex: 1;
}

body.app-dashboard .cert-page .cert-table-wrap {
    background: var(--glass-bg-solid) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--glass-shadow) !important;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

body.app-dashboard .cert-table thead th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .cert-table td {
    background: rgba(255, 255, 255, 0.42) !important;
    color: var(--text-on-glass-muted) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .cert-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.28) !important;
}

body.app-dashboard .cert-table tbody tr:hover td {
    background: rgba(255, 255, 255, 0.58) !important;
}

body.app-dashboard .cert-toolbar label,
body.app-dashboard .cert-hint,
body.app-dashboard .cert-meta,
body.app-dashboard .cert-empty-panel,
body.app-dashboard .cert-names-cell {
    color: var(--text-on-glass-subtle) !important;
}

body.app-dashboard .cert-table select.status-select,
body.app-dashboard .cert-input-num,
body.app-dashboard .cert-input-names,
body.app-dashboard .cert-reset-row {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass) !important;
}

body.app-dashboard .cert-reset-row:hover {
    background: var(--glass-bg-muted) !important;
    border-color: var(--primary) !important;
}

body.app-dashboard .cert-manual-badge {
    background: color-mix(in srgb, var(--primary) 18%, var(--glass-bg-solid)) !important;
    color: var(--brand) !important;
    border: 1px solid var(--glass-border);
}

/* —— Employee Docs —— */
.employee-docs-page .doc-card,
.employee-docs-page table,
.dropzone {
    background: var(--glass-bg-solid) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard .doc-card p {
    color: var(--text-on-glass-muted) !important;
}

.employee-docs-page th,
body.app-dashboard table th {
    background: rgba(15, 23, 42, 0.08) !important;
    color: var(--text-on-glass) !important;
}

.employee-docs-page td {
    color: var(--text-on-glass-muted) !important;
}

/* —— Modals / preview —— */
.preview-panel,
.preview-panel-body,
.trash-modal__panel {
    background: var(--glass-bg-solid) !important;
    backdrop-filter: blur(24px) saturate(180%);
    color: var(--text-on-glass-muted) !important;
}

.preview-panel-header {
    background: rgba(15, 23, 42, 0.06) !important;
    color: var(--text-on-glass) !important;
    border-bottom: 1px solid var(--glass-border) !important;
}

#editUserPermGrid,
#addUserPermGrid {
    background: var(--glass-bg-muted) !important;
    border-color: var(--glass-border) !important;
    color: var(--text-on-glass-muted) !important;
}

/* —— Attendance night mode (keep readable) —— */
body.day-shift-night-mode.app-dashboard {
    --glass-bg-solid: rgba(15, 23, 42, 0.88);
    --glass-bg-muted: rgba(15, 23, 42, 0.72);
    --text-on-glass: #f8fafc;
    --text-on-glass-muted: #e2e8f0;
    --text-on-glass-subtle: #cbd5e1;
}

body.day-shift-night-mode .attendance-table th {
    background: rgba(0, 0, 0, 0.35) !important;
    color: #e2e8f0 !important;
}

body.day-shift-night-mode .attendance-table td {
    background: rgba(15, 23, 42, 0.55) !important;
    color: #f1f5f9 !important;
}

/* Status colors — keep semantic contrast */
.status-expired { background: rgba(254, 226, 226, 0.85) !important; color: #991b1b !important; }
.status-warn { background: rgba(255, 251, 235, 0.9) !important; color: #92400e !important; }
.status-ok { background: rgba(236, 253, 245, 0.9) !important; color: #065f46 !important; }

.task-priority-low { color: #0369a1 !important; }
.task-priority-high { color: #b91c1c !important; }
.task-status-pending { color: #b45309 !important; }
.task-status-completed { color: #15803d !important; }

/* Inputs on glass — stronger contrast */
body.app-dashboard input:not([type="checkbox"]):not([type="radio"]),
body.app-dashboard select,
body.app-dashboard textarea,
body.app-dashboard .cell-input {
    background: var(--glass-bg-solid) !important;
    color: var(--text-on-glass) !important;
    border-color: var(--glass-border) !important;
}

body.app-dashboard input::placeholder,
body.app-dashboard textarea::placeholder {
    color: #64748b !important;
    opacity: 1;
}

body.app-dashboard option {
    color: var(--text-on-glass);
    background: #fff;
}

/* —— Dashboard pro text contrast —— */
.dash-hero-pro__title,
.dash-hero-pro__sub,
.dash-kpi__value,
.dash-kpi__label,
.dash-panel__title,
.dash-chart-card__title,
.dash-quick__label,
.dash-insight,
.dash-task__title,
.dash-activity-item,
.dash-exp-item {
    color: var(--text-on-glass-muted) !important;
}

.dash-hero-pro__title,
.dash-kpi__value,
.dash-panel__title {
    color: var(--text-on-glass) !important;
}

.dash-hero-pro__sub,
.dash-kpi__label {
    color: var(--text-on-glass-subtle) !important;
}

/* —— Print: solid white for documents —— */
@media print {
    body.app-dashboard,
    body.app-dashboard .main-content,
    .salary-doc,
    .salary-doc__header,
    .salary-doc__meta,
    .salary-doc__controls,
    .invoice-page,
    .invoice-card,
    .invoice-doc,
    .invoice-table th,
    .invoice-table td,
    .salary-table th,
    .salary-table td {
        background: #fff !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        color: #0f172a !important;
        box-shadow: none !important;
    }
}