:root,
.mud-theme-default,
.mud-theme-dark {
  --cc-bg: #fff8f1;
  --cc-surface: #fffdf9;
  --cc-surface-2: #fff3e6;
  --cc-text: #221810;
  --cc-muted: #5f4a3a;
  --cc-accent: #d0653a;
  --cc-accent-2: #9a3f1f;

  --mud-palette-background: #fff8f1;
  --mud-palette-background-gray: #ffefdf;
  --mud-palette-surface: #fffdf9;
  --mud-palette-appbar-background: #fff1e2;
  --mud-palette-appbar-text: #221810;
  --mud-palette-drawer-background: #fff3e6;
  --mud-palette-drawer-text: #221810;
  --mud-palette-drawer-icon: #7d4c34;
  --mud-palette-text-primary: #221810;
  --mud-palette-text-secondary: #5f4a3a;
  --mud-palette-primary: #d0653a;
  --mud-palette-secondary: #9a3f1f;
  --mud-palette-info: #a64d2a;
  --mud-palette-success: #2f7a45;
  --mud-palette-warning: #9a5e0d;
  --mud-palette-error: #b42532;
  --mud-palette-lines-default: #cfac93;
}

html,
body {
  font-family: "IBM Plex Sans", "Noto Sans TC", "Segoe UI", sans-serif;
  background: radial-gradient(circle at 15% 0%, #fff4e5 0%, #fff8f1 45%, #ffeede 100%);
  color: var(--cc-text);
}

html,
body,
.mud-layout,
.mud-main-content {
  background-color: #fff8f1 !important;
  color: #221810 !important;
}

.mud-appbar {
  border-bottom: 1px solid #cfac93;
  backdrop-filter: blur(6px);
  background: #fff1e2 !important;
  color: #221810 !important;
}

.mud-drawer {
  border-right: 1px solid #d8b9a2;
  background: #fff3e6 !important;
  color: #221810 !important;
}

.mud-main-content {
  background: transparent;
}

.mud-paper,
.mud-card {
  border: 1px solid #d8b9a2;
  box-shadow: 0 10px 24px rgba(130, 73, 41, 0.14);
  background: #fffdf9 !important;
  color: #221810 !important;
}

.mud-button-filled.mud-button-filled-primary {
  background: #d0653a !important;
  color: #ffffff !important;
  border: 1px solid #a64d2a !important;
  font-weight: 700;
}

.mud-button-filled.mud-button-filled-info,
.mud-button-filled.mud-button-filled-secondary {
  color: #0f1621;
  font-weight: 700;
}

.mud-input > input,
.mud-input-slot,
.mud-input-root,
.mud-select {
  background: #fff7ef;
  color: #221810 !important;
}

/* Global form readability on light theme */
.mud-input-control,
.mud-input,
.mud-select,
.mud-picker-input-control {
  color: #221810 !important;
}

.mud-input-control .mud-input-label,
.mud-input-control > label,
.mud-picker-input-control .mud-input-label,
.mud-picker-input-control > label {
  color: #5f4a3a !important;
  background: #fff8f1 !important;
  padding: 0 6px !important;
  border-radius: 4px;
}

.mud-input-control.mud-input-outlined .mud-input-label,
.mud-picker-input-control.mud-input-outlined .mud-input-label,
.mud-input-control .mud-input-label.mud-shrink,
.mud-picker-input-control .mud-input-label.mud-shrink,
.mud-input-control .mud-shrink,
.mud-picker-input-control .mud-shrink {
  background: #fff8f1 !important;
  color: #5f4a3a !important;
}

.mud-input-control .mud-input-slot,
.mud-input-control .mud-input-root,
.mud-input-control .mud-select-input,
.mud-input-control input,
.mud-input-control textarea,
.mud-picker-input-control .mud-input-slot,
.mud-picker-input-control .mud-input-root,
.mud-picker-input-control input {
  background: #fffdf9 !important;
  color: #221810 !important;
  caret-color: #7b4f2c !important;
}

.mud-input-control .mud-icon-root,
.mud-picker-input-control .mud-icon-root,
.mud-input-control .mud-input-adornment,
.mud-picker-input-control .mud-input-adornment {
  color: #3d2d20 !important;
}

.mud-input-outlined .mud-input-outlined-border {
  border-color: #d6bfa5 !important;
}

.mud-input-outlined:hover .mud-input-outlined-border,
.mud-input-outlined.mud-input-focused .mud-input-outlined-border {
  border-color: #b98452 !important;
}

.mud-table-root .mud-table-container {
  border: 1px solid #d8b9a2;
}

.mud-table-root .mud-table-head {
  background: #fff1e2;
}

.mud-data-grid .mud-table-head {
  background: #fff1e2 !important;
}

.mud-table-root .mud-table-head .mud-table-cell,
.mud-table-root .mud-table-head .mud-table-sort-label,
.mud-table-root .mud-table-head .mud-table-sort-label-icon,
.mud-data-grid .mud-table-head .mud-table-cell,
.mud-data-grid .mud-table-head .mud-input,
.mud-data-grid .mud-table-head .mud-input-slot,
.mud-data-grid .mud-table-head .mud-input > input,
.mud-data-grid .mud-table-head .mud-icon-root,
.mud-data-grid .mud-table-head .mud-checkbox,
.mud-data-grid .mud-table-head .mud-typography,
.mud-data-grid .mud-table-head th {
  color: #221810 !important;
}

.mud-table-root .mud-table-head *,
.mud-data-grid .mud-table-head * {
  color: #221810 !important;
  fill: #221810 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.mud-table-root .mud-table-row:hover {
  background: #ffe9d5;
}

/* ApexCharts readability + Claude-like palette */
.apexcharts-canvas text,
.apexcharts-xaxis-label,
.apexcharts-yaxis-label,
.apexcharts-title-text,
.apexcharts-legend-text {
  fill: #2a1a11 !important;
  color: #2a1a11 !important;
}

.apexcharts-tooltip,
.apexcharts-xaxistooltip,
.apexcharts-yaxistooltip {
  background: #f3f5f8 !important;
  color: #111827 !important;
  border: 1px solid #c8ceda !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22) !important;
}

.apexcharts-tooltip *,
.apexcharts-xaxistooltip *,
.apexcharts-yaxistooltip * {
  color: #111827 !important;
}

.apexcharts-tooltip-title {
  background: #e8edf4 !important;
  color: #0f172a !important;
  border-bottom: 1px solid #ccd4e2 !important;
}

.apexcharts-gridline {
  stroke: #d5b9a4 !important;
}

/* MudBlazor date picker readability on light theme */
.mud-picker,
.mud-picker-calendar,
.mud-picker-calendar-container,
.mud-picker-date-container {
  background: #fffdf9 !important;
  color: #221810 !important;
}

.mud-picker-calendar .mud-button-root,
.mud-picker-calendar .mud-button-label,
.mud-picker-calendar .mud-typography,
.mud-picker-calendar .mud-day,
.mud-picker-calendar .mud-picker-calendar-day,
.mud-picker-calendar .mud-current,
.mud-picker-calendar .mud-ripple {
  color: #221810 !important;
}

.mud-picker .mud-typography,
.mud-picker .mud-button-root,
.mud-picker .mud-button-label,
.mud-picker .mud-day,
.mud-picker .mud-picker-calendar-day,
.mud-picker .mud-picker-calendar-week,
.mud-picker .mud-picker-calendar-week .mud-typography,
.mud-picker .mud-picker-calendar-header-transition,
.mud-picker .mud-picker-calendar-header-day,
.mud-picker .mud-picker-calendar-header-year,
.mud-picker .mud-input-slot,
.mud-picker .mud-input > input {
  color: #221810 !important;
}

.mud-picker .mud-picker-calendar-container,
.mud-picker .mud-picker-calendar-content,
.mud-picker .mud-picker-calendar,
.mud-picker .mud-picker-calendar-day,
.mud-picker .mud-picker-calendar-week {
  background: #fffdf9 !important;
}

.mud-picker-calendar .mud-disabled,
.mud-picker-calendar .mud-button-root:disabled {
  color: #b8a79a !important;
}

.mud-picker-calendar .mud-selected,
.mud-picker-calendar .mud-button-root.mud-selected {
  background-color: #d0653a !important;
  color: #ffffff !important;
}

.mud-picker-calendar-header .mud-button-root,
.mud-picker-calendar-header .mud-typography {
  color: #221810 !important;
}

.mud-picker-toolbar {
  background: linear-gradient(135deg, #d0653a, #b6542f) !important;
}

.mud-picker-toolbar .mud-typography,
.mud-picker-toolbar .mud-button-root,
.mud-picker-toolbar .mud-picker-toolbar-text {
  color: #ffffff !important;
}