/**
 * Chakula Smart — Theme bridge
 * Aligns dashboard, messages, and app shells with global design tokens (style.css).
 * Load last in head-assets.php (after dark-mode + responsive-core).
 */

/* Dashboard shell → global brand tokens */
.dash-user-app {
    --dash-green: var(--brand-800, #1b4332);
    --dash-green-mid: var(--brand-600, #2d6a4f);
    --dash-green-light: var(--brand-500, #40916c);
    --dash-surface: var(--surface-base, #f4f7f5);
    --dash-card: var(--surface-card, #ffffff);
    --dash-border: var(--border-subtle, rgba(15, 31, 23, 0.08));
    --dash-shadow: var(--shadow-card, 0 4px 24px rgba(15, 31, 23, 0.06));
    --dash-text: var(--text-primary, #0f1f17);
    --dash-text-muted: var(--text-secondary, #5c6b63);
}

/* Messaging — shared tokens (light + dark via global vars) */
.messages-page {
    --msg-surface: var(--surface-card, #ffffff);
    --msg-muted: var(--surface-muted, #f6f9f7);
    --msg-base: var(--surface-base, #f0f4f1);
    --msg-border: var(--border-subtle, rgba(15, 31, 23, 0.08));
    --msg-border-strong: var(--border-default, #d4ddd8);
    --msg-text: var(--text-primary, #0f1f17);
    --msg-text-muted: var(--text-secondary, #5c6b63);
    --msg-brand: var(--brand-600, #2d6a4f);
    --msg-brand-deep: var(--brand-800, #1b4332);
    --msg-brand-light: var(--brand-500, #40916c);
    --msg-sent-bg: linear-gradient(135deg, var(--brand-700, #1a5c3a), var(--brand-600, #2d6a4f));
    --msg-header-bg: linear-gradient(135deg, var(--brand-900, #0d2818), var(--brand-700, #1a5c3a));
    --msg-radius: var(--radius-lg, 18px);
    --msg-radius-sm: var(--radius-sm, 10px);
}

html[data-theme="dark"] .dash-user-app {
    --dash-surface: var(--surface-base);
    --dash-card: var(--surface-card);
    --dash-border: var(--border-subtle);
    --dash-text: var(--text-primary);
    --dash-text-muted: var(--text-secondary);
}

html[data-theme="dark"] .messages-page {
    --msg-surface: var(--surface-card);
    --msg-muted: var(--surface-muted);
    --msg-base: var(--surface-base);
    --msg-border: var(--border-subtle);
    --msg-border-strong: var(--border-default);
    --msg-text: var(--text-primary);
    --msg-text-muted: var(--text-secondary);
}

html[data-theme="dark"] .messages-page .chat-shell {
    background: var(--surface-card) !important;
    border-color: var(--border-subtle) !important;
    box-shadow: var(--shadow-card) !important;
}

html[data-theme="dark"] .fx-app.messages-page:not(.dash-user-app) .chat-shell {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}