/* ==========================================================================
   PURE CLEAN LIGHT MODE (Ultra-Clean Apple / Linear Minimalist White & Black)
   ========================================================================== */
html[data-theme="light"],
body[data-theme="light"] {
  color-scheme: light;
  --color-theme-bg: #ffffff;
  --color-theme-fg: #0a0a0a;
  --color-theme-fg-02: #171717;
  --color-theme-text: #0a0a0a;
  --color-theme-text-sec: #525252;
  --color-theme-text-tertiary: #737373;

  --color-theme-card-hex: #ffffff;
  --color-theme-card-01-hex: #fafafa;
  --color-theme-card-02-hex: #f5f5f5;
  --color-theme-card-03-hex: #e5e5e5;
  --color-theme-card-04-hex: #d4d4d4;

  --color-theme-border-01: rgba(0, 0, 0, 0.08);
  --color-theme-border-02: rgba(0, 0, 0, 0.14);
  --color-theme-border-03: rgba(0, 0, 0, 0.25);

  --color-theme-accent: #f54e00;
  --color-theme-accent-bg: rgba(245, 78, 0, 0.08);

  background-color: #ffffff !important;
  color: #0a0a0a !important;
}

/* Light Theme Scrollbars */
html[data-theme="light"] *,
body[data-theme="light"] * {
  scrollbar-color: rgba(0, 0, 0, 0.18) #f5f5f5;
}

html[data-theme="light"] ::-webkit-scrollbar,
body[data-theme="light"] ::-webkit-scrollbar {
  background-color: #f5f5f5;
  width: 6px;
  height: 6px;
}

html[data-theme="light"] ::-webkit-scrollbar-track,
body[data-theme="light"] ::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb,
body[data-theme="light"] ::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.18);
  border-radius: 9999px;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb:hover,
body[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.32);
}

/* ==========================================================================
   DASHBOARD LIGHT MODE OVERRIDES
   ========================================================================== */
body[data-theme="light"].dashboard-body,
body[data-theme="light"] .dashboard-layout,
body[data-theme="light"] .dash-layout {
  background-color: #ffffff !important;
  color: #0a0a0a !important;
}

/* Sidebar */
body[data-theme="light"] .dash-sidebar {
  background-color: #fafafa !important;
  border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .dash-sidebar-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  background-color: #fafafa !important;
}

body[data-theme="light"] .dash-brand-title {
  color: #0a0a0a !important;
}

body[data-theme="light"] .dash-sidebar-banner {
  background: rgba(245, 78, 0, 0.06) !important;
  border-color: rgba(245, 78, 0, 0.2) !important;
}

body[data-theme="light"] .dash-sidebar-banner div,
body[data-theme="light"] .dash-sidebar-banner span {
  color: #404040 !important;
}

body[data-theme="light"] .dash-sidebar-banner strong {
  color: #0a0a0a !important;
}

body[data-theme="light"] .btn-dash-new-chat {
  background-color: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.14) !important;
  color: #0a0a0a !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

body[data-theme="light"] .btn-dash-new-chat:hover {
  background-color: #f5f5f5 !important;
  border-color: rgba(0, 0, 0, 0.22) !important;
}

body[data-theme="light"] .kbd-badge {
  color: rgba(0, 0, 0, 0.4) !important;
}

body[data-theme="light"] .dash-nav-header,
body[data-theme="light"] .dash-nav-item {
  color: #525252 !important;
}

body[data-theme="light"] .dash-nav-header:hover,
body[data-theme="light"] .dash-nav-item:hover {
  background-color: rgba(0, 0, 0, 0.04) !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .dash-nav-header.active,
body[data-theme="light"] .dash-nav-item.active {
  background-color: rgba(0, 0, 0, 0.07) !important;
  color: #0a0a0a !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
  font-weight: 500;
}

body[data-theme="light"] .dash-svg-chevron {
  color: rgba(0, 0, 0, 0.35) !important;
}

body[data-theme="light"] .dash-sub-menu {
  border-left-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .dash-chat-item {
  color: #525252 !important;
}

body[data-theme="light"] .dash-chat-item:hover {
  color: #0a0a0a !important;
  background-color: rgba(0, 0, 0, 0.04) !important;
}

body[data-theme="light"] .dash-chat-item.active {
  color: #0a0a0a !important;
  background-color: rgba(0, 0, 0, 0.06) !important;
  font-weight: 500;
}

body[data-theme="light"] .dash-chat-item--new {
  color: #737373 !important;
}

body[data-theme="light"] .chat-item-bullet {
  color: rgba(0, 0, 0, 0.3) !important;
}

body[data-theme="light"] .dash-user-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  background-color: #fafafa !important;
}

body[data-theme="light"] .dash-user-avatar {
  background-color: #0a0a0a !important;
  color: #ffffff !important;
}

body[data-theme="light"] .dash-user-name {
  color: #0a0a0a !important;
}

body[data-theme="light"] .dash-user-email {
  color: #737373 !important;
}

body[data-theme="light"] .btn-logout {
  color: #737373 !important;
}

body[data-theme="light"] .btn-logout:hover {
  color: #dc2626 !important;
}

/* Main Workspace */
body[data-theme="light"] .dash-main-area,
body[data-theme="light"] .dash-view {
  background-color: #ffffff !important;
}

/* Chat Header */
body[data-theme="light"] .dash-chat-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .active-chat-heading {
  color: #0a0a0a !important;
}

/* Model Selector Trigger */
body[data-theme="light"] .custom-model-trigger {
  background-color: #f5f5f5 !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .custom-model-current-name {
  color: #0a0a0a !important;
}

body[data-theme="light"] .custom-model-badge {
  background-color: rgba(0, 0, 0, 0.06) !important;
  color: #404040 !important;
}

body[data-theme="light"] .custom-model-badge--free {
  background-color: rgba(0, 0, 0, 0.08) !important;
  color: #171717 !important;
}

body[data-theme="light"] .custom-model-badge--pro {
  background-color: rgba(245, 78, 0, 0.14) !important;
  color: #d94300 !important;
}

body[data-theme="light"] .custom-model-badge--proplus {
  background-color: rgba(147, 51, 234, 0.14) !important;
  color: #7e22ce !important;
}

body[data-theme="light"] .custom-model-badge--ultra {
  background-color: rgba(37, 99, 235, 0.14) !important;
  color: #1d4ed8 !important;
}

body[data-theme="light"] .custom-model-trigger:hover {
  background-color: #ededed !important;
  border-color: rgba(0, 0, 0, 0.22) !important;
}

body[data-theme="light"] .custom-model-chevron {
  color: rgba(0, 0, 0, 0.55) !important;
  opacity: 1 !important;
}

/* Model Popover Dropdown */
body[data-theme="light"] .custom-model-menu {
  background-color: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="light"] .custom-model-group-title {
  color: #737373 !important;
  background-color: #ffffff !important;
}

body[data-theme="light"] .custom-model-item {
  color: #171717 !important;
}

body[data-theme="light"] .custom-model-item:hover {
  background-color: #f5f5f5 !important;
  color: #000000 !important;
}

body[data-theme="light"] .custom-model-item.active {
  background-color: rgba(245, 78, 0, 0.08) !important;
}

body[data-theme="light"] .custom-model-item.active .model-item-name {
  color: #0a0a0a !important;
}

body[data-theme="light"] .model-item-name {
  color: #171717 !important;
}

body[data-theme="light"] .custom-model-item--locked:hover {
  background-color: rgba(0, 0, 0, 0.04) !important;
}

body[data-theme="light"] .custom-model-item--locked .model-item-name {
  color: rgba(0, 0, 0, 0.35) !important;
}

body[data-theme="light"] .custom-model-item--locked .custom-model-badge {
  background-color: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.4) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .model-lock-icon {
  color: rgba(0, 0, 0, 0.4) !important;
}

body[data-theme="light"] .btn-icon-ghost {
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #525252 !important;
}

body[data-theme="light"] .btn-icon-ghost:hover {
  background-color: rgba(0, 0, 0, 0.05) !important;
  color: #0a0a0a !important;
}

/* Chat Stream & Empty State */
body[data-theme="light"] .dash-chat-stream {
  background-color: #ffffff !important;
}

body[data-theme="light"] .empty-state-icon {
  background-color: #f5f5f5 !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .empty-state-title {
  color: #0a0a0a !important;
}

body[data-theme="light"] .empty-state-desc {
  color: #525252 !important;
}

/* Chat Bubbles */
body[data-theme="light"] .chat-bubble--assistant {
  background-color: #f9f9f9 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

body[data-theme="light"] .chat-bubble--assistant .bubble-sender {
  color: #0a0a0a !important;
}

body[data-theme="light"] .chat-bubble--assistant .bubble-model-tag,
body[data-theme="light"] .chat-bubble--assistant .bubble-time {
  color: #737373 !important;
}

body[data-theme="light"] .chat-bubble--assistant .stream-text,
body[data-theme="light"] .chat-bubble--assistant .md-stream-body {
  color: #0a0a0a !important;
}

body[data-theme="light"] .md-stream-body h1,
body[data-theme="light"] .md-stream-body h2,
body[data-theme="light"] .md-stream-body h3,
body[data-theme="light"] .md-stream-body h4,
body[data-theme="light"] .md-stream-body strong {
  color: #000000 !important;
}

body[data-theme="light"] .md-inline-code {
  background-color: rgba(0, 0, 0, 0.06) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #c2410c !important;
}

body[data-theme="light"] .chat-action-btn {
  color: #737373 !important;
}

body[data-theme="light"] .chat-action-btn:hover {
  background-color: rgba(0, 0, 0, 0.08) !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .chat-action-btn--delete:hover {
  background-color: rgba(220, 38, 38, 0.12) !important;
  color: #dc2626 !important;
}

body[data-theme="light"] .chat-rename-input {
  background-color: #ffffff !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .chat-bubble--user {
  background-color: #0a0a0a !important;
  border: 1px solid #0a0a0a !important;
  color: #ffffff !important;
}

body[data-theme="light"] .chat-bubble--user .bubble-sender {
  color: #ffffff !important;
}

body[data-theme="light"] .chat-bubble--user .bubble-time {
  color: rgba(255, 255, 255, 0.6) !important;
}

body[data-theme="light"] .chat-bubble--user p {
  color: #ffffff !important;
}

/* Circled Prompt Bar */
body[data-theme="light"] .dash-prompt-wrapper {
  background-color: #ffffff !important;
}

body[data-theme="light"] .circled-prompt-bar {
  background-color: #f8f8f8 !important;
  border: 1px solid rgba(0, 0, 0, 0.14) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

body[data-theme="light"] .circled-prompt-bar:focus-within {
  background-color: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.35) !important;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .prompt-model-pill {
  background-color: #ffffff !important;
  color: #525252 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .circled-prompt-input {
  color: #0a0a0a !important;
}

body[data-theme="light"] .circled-prompt-input::placeholder {
  color: #8c8c8c !important;
}

body[data-theme="light"] .circled-send-btn {
  background-color: #0a0a0a !important;
  color: #ffffff !important;
}

body[data-theme="light"] .circled-send-btn:hover {
  background-color: #262626 !important;
}

body[data-theme="light"] .prompt-hint-row {
  color: #737373 !important;
}

body[data-theme="light"] .prompt-hint-row kbd {
  background: #f0f0f0 !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #262626 !important;
}

/* ==========================================================================
   USAGE VIEW LIGHT MODE OVERRIDES
   ========================================================================== */
body[data-theme="light"] .view-panel-header {
  background-color: #ffffff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .view-heading {
  color: #0a0a0a !important;
}

body[data-theme="light"] .view-subheading {
  color: #525252 !important;
}

body[data-theme="light"] .usage-grid {
  background-color: #ffffff !important;
}

body[data-theme="light"] .dash-card {
  background-color: #fafafa !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

body[data-theme="light"] .dash-card-title {
  color: #262626 !important;
}

body[data-theme="light"] .usage-stat-val {
  color: #0a0a0a !important;
}

body[data-theme="light"] .usage-stat-unit {
  color: #737373 !important;
}

body[data-theme="light"] .dash-card p {
  color: #525252 !important;
}

body[data-theme="light"] .quota-meta {
  color: #525252 !important;
}

body[data-theme="light"] .progress-track {
  background-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .progress-bar {
  background-color: #0a0a0a !important;
}

body[data-theme="light"] .btn-card-action {
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: #0a0a0a !important;
  background-color: #ffffff !important;
}

body[data-theme="light"] .btn-card-action:hover {
  background-color: #f5f5f5 !important;
  border-color: rgba(0, 0, 0, 0.25) !important;
}

/* ==========================================================================
   SETTINGS VIEW LIGHT MODE OVERRIDES
   ========================================================================== */
body[data-theme="light"] .settings-content-wrap {
  background-color: #ffffff !important;
}

body[data-theme="light"] .settings-card {
  background-color: #fafafa !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

body[data-theme="light"] .settings-card-title {
  color: #0a0a0a !important;
}

body[data-theme="light"] .settings-card-desc {
  color: #525252 !important;
}

body[data-theme="light"] .theme-option-card {
  background: #ffffff !important;
  border: 2px solid rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .theme-option-card:hover {
  border-color: rgba(0, 0, 0, 0.25) !important;
}

body[data-theme="light"] .theme-option-card.active {
  border-color: #f54e00 !important;
  box-shadow: 0 0 16px rgba(245, 78, 0, 0.15) !important;
}

body[data-theme="light"] .theme-preview-box {
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .theme-option-title {
  color: #0a0a0a !important;
}

body[data-theme="light"] .theme-option-desc {
  color: #525252 !important;
}

body[data-theme="light"] .settings-profile-name {
  color: #0a0a0a !important;
}

body[data-theme="light"] .settings-profile-email {
  color: #525252 !important;
}

body[data-theme="light"] .settings-info-item {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .settings-info-label {
  color: #737373 !important;
}

body[data-theme="light"] .settings-info-value {
  color: #0a0a0a !important;
}

/* Reasoning Toggle & Meta Pills in Light Mode */
body[data-theme="light"] .custom-model-meta-pill {
  color: #525252 !important;
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .reasoning-toggle-group {
  background-color: #f5f5f5 !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="light"] .reasoning-toggle-label {
  color: #262626 !important;
}

body[data-theme="light"] .reasoning-segmented {
  background: rgba(0, 0, 0, 0.07) !important;
}

body[data-theme="light"] .reasoning-seg-btn {
  color: #525252 !important;
}

body[data-theme="light"] .reasoning-seg-btn:hover {
  color: #0a0a0a !important;
}

body[data-theme="light"] .reasoning-seg-btn.active {
  background: linear-gradient(135deg, #f54e00, #ea3326) !important;
  color: #ffffff !important;
}

body[data-theme="light"] .prompt-reasoning-pill {
  background: rgba(245, 78, 0, 0.1) !important;
  border-color: rgba(245, 78, 0, 0.3) !important;
  color: #171717 !important;
}

body[data-theme="light"] .prompt-reasoning-pill strong {
  color: #d94300 !important;
}

body[data-theme="light"] .reasoning-thought-box {
  background: rgba(245, 158, 11, 0.06) !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
}

body[data-theme="light"] .reasoning-thought-summary {
  color: #b45309 !important;
}

body[data-theme="light"] .reasoning-thought-body {
  color: #404040 !important;
  border-top-color: rgba(245, 158, 11, 0.2) !important;
}

/* Usage Logs in Light Mode */
body[data-theme="light"] #viewUsageLogs {
  background-color: #ffffff !important;
}

body[data-theme="light"] .usage-stat-box {
  background-color: #fafafa !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .usage-stat-box-label {
  color: #737373 !important;
}

body[data-theme="light"] .usage-stat-box-val {
  color: #0a0a0a !important;
}

body[data-theme="light"] .usage-logs-table-wrap {
  background-color: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .usage-logs-table th {
  background-color: #f5f5f5 !important;
  color: #525252 !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .usage-logs-table td {
  color: #171717 !important;
  border-bottom-color: rgba(0, 0, 0, 0.05) !important;
}

body[data-theme="light"] .usage-logs-table tr:hover td {
  background-color: rgba(0, 0, 0, 0.02) !important;
}

body[data-theme="light"] .usage-logs-ip {
  color: #0284c7 !important;
  background: rgba(2, 132, 199, 0.08) !important;
}

body[data-theme="light"] .usage-logs-empty {
  color: #737373 !important;
}

/* Sidebar Chats Collapsible & Scroll in Light Mode */
body[data-theme="light"] .dash-sidebar-scroll {
  scrollbar-color: rgba(0, 0, 0, 0.12) transparent !important;
}

body[data-theme="light"] .dash-sidebar-scroll::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="light"] .dash-sub-menu {
  border-left-color: rgba(0, 0, 0, 0.1) !important;
  scrollbar-color: rgba(0, 0, 0, 0.15) transparent !important;
}

body[data-theme="light"] .dash-sub-menu::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15) !important;
}

body[data-theme="light"] .chats-count-badge {
  background: rgba(0, 0, 0, 0.07) !important;
  color: #525252 !important;
}

/* Admin Panel in Light Mode */
body[data-theme="light"] #viewAdmin {
  background-color: #ffffff !important;
}

body[data-theme="light"] .admin-stat-card {
  background-color: #fafafa !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .admin-stat-label {
  color: #737373 !important;
}

body[data-theme="light"] .admin-stat-value {
  color: #0a0a0a !important;
}

body[data-theme="light"] .admin-section-title {
  color: #0a0a0a !important;
}

body[data-theme="light"] .admin-section-desc {
  color: #737373 !important;
}

body[data-theme="light"] .admin-table-wrap {
  background-color: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .admin-table th {
  background-color: #f5f5f5 !important;
  color: #525252 !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .admin-table td {
  color: #171717 !important;
  border-bottom-color: rgba(0, 0, 0, 0.05) !important;
}

body[data-theme="light"] .admin-table tr:hover td {
  background-color: rgba(0, 0, 0, 0.02) !important;
}

body[data-theme="light"] .admin-plan-select {
  background: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: #0a0a0a !important;
}

body[data-theme="light"] .admin-role-badge--user {
  background: rgba(0, 0, 0, 0.05) !important;
  color: #525252 !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .admin-ip-badge--masked {
  background: rgba(2, 132, 199, 0.08) !important;
  color: #0284c7 !important;
  border-color: rgba(2, 132, 199, 0.25) !important;
}

body[data-theme="light"] .admin-ip-badge--revealed {
  background: rgba(147, 51, 234, 0.1) !important;
  color: #7e22ce !important;
  border-color: rgba(147, 51, 234, 0.35) !important;
}

