/* =====================================================
FIXA LIGHT MODE — WHITE + BLACK + GOLD + BLUE
Add at the VERY END of theme.css
===================================================== */

html[data-theme="light"] {
color-scheme: light;

/* Core colors */
--fixa-bg: #ffffff;
--fixa-card: #ffffff;
--fixa-surface: #f5f8fc;
--fixa-border: rgba(11, 42, 74, 0.14);
--fixa-text: #111111;
--fixa-muted: #555f6d;

/* Brand colors */
--fixa-blue: #0b3a6b;
--fixa-blue-deep: #0b2a4a;
--fixa-gold: #ffd700;
--fixa-gold-text: #8a6700;

/* Chat bubbles */
--fixa-incoming: #edf3fa;
--fixa-outgoing: #ffd700;
--fixa-outgoing-text: #111111;

/* Customer page variables */
--bg-dark: #ffffff;
--bg-card: #f5f8fc;
--bg-glass: #ffffff;
--text-main: #111111;
--text-muted: #555f6d;
--line: rgba(11, 42, 74, 0.14);
--surface-2: #edf3fa;
--gold: #ffd700;
--gold-text: #8a6700;

/* Artisan page variables */
--fixa-muted: #555f6d;
--fixa-incoming: #edf3fa;
}

/* Main page and chat backgrounds */
html[data-theme="light"] body,
html[data-theme="light"] #app,
html[data-theme="light"] .page,
html[data-theme="light"] #messagesPage,
html[data-theme="light"] #jobsPage,
html[data-theme="light"] #individualChatView,
html[data-theme="light"] .messages-shell {
background: #ffffff !important;
color: #111111;
}

/* Headers and navigation */
html[data-theme="light"] .home-header,
html[data-theme="light"] .msg-header,
html[data-theme="light"] .conv-header,
html[data-theme="light"] .chat-header,
html[data-theme="light"] .chat-list-header,
html[data-theme="light"] .bottom-nav {
background: #ffffff !important;
color: #111111;
border-color: var(--fixa-border);
}

/* Cards and panels */
html[data-theme="light"] .glass,
html[data-theme="light"] .artisan-card,
html[data-theme="light"] .account-card,
html[data-theme="light"] .appearance-card,
html[data-theme="light"] #chatListView,
html[data-theme="light"] #jobList .card,
html[data-theme="light"] .history-modal-box {
background: #f5f8fc;
color: #111111;
border-color: var(--fixa-border);
}

/* Text should remain readable */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] p,
html[data-theme="light"] label,
html[data-theme="light"] .chat-name,
html[data-theme="light"] #chatRecipientName,
html[data-theme="light"] .chat-item-name {
color: #111111;
}

/* Gold buttons with black text */
html[data-theme="light"] .send-btn,
html[data-theme="light"] .book-btn,
html[data-theme="light"] .btn-fill,
html[data-theme="light"] .rebook-btn,
html[data-theme="light"] .theme-seg button.active,
html[data-theme="light"] #sendBtn {
background: #ffd700 !important;
color: #111111 !important;
border-color: #e6b800;
}

/* Received and sent messages */
html[data-theme="light"] .msg-row.recv .bubble {
background: #edf3fa;
color: #111111;
}

html[data-theme="light"] .msg-row.sent .bubble {
background: #ffd700;
color: #111111;
}

/* Message composer */
html[data-theme="light"] .chat-footer textarea,
html[data-theme="light"] #msgInput {
background: #ffffff !important;
color: #111111 !important;
border-color: #cbd5e1;
}

html[data-theme="light"] .chat-footer textarea::placeholder,
html[data-theme="light"] #msgInput::placeholder {
color: #687386;
}

/* Input focus */
html[data-theme="light"] .chat-footer textarea:focus,
html[data-theme="light"] #msgInput:focus {
border-color: #0b3a6b;
outline: 2px solid rgba(11, 58, 107, 0.12);
}

/* Navigation */
html[data-theme="light"] .nav-item,
html[data-theme="light"] .nav-btn,
html[data-theme="light"] .nav-item.active,
html[data-theme="light"] .nav-btn.active {
color: #0b3a6b;
}

/* Keep secondary text visible */
html[data-theme="light"] .chat-preview,
html[data-theme="light"] .chat-preview-text,
html[data-theme="light"] .bubble-meta,
html[data-theme="light"] .date-sep {
color: #555f6d;
}
