:root,
:root[data-theme="light"] {
  color-scheme: light;
  --x-bg: #f6f4ee;
  --x-surface: #fffdf7;
  --x-surface-raised: #ffffff;
  --x-text: #20231f;
  --x-muted: #667067;
  --x-primary: #176b4d;
  --x-primary-hover: #10543c;
  --x-primary-contrast: #ffffff;
  --x-border: #d8d8cd;
  --x-focus: #f0a629;
  --x-success: #247a52;
  --x-warning: #a35f00;
  --x-danger: #b42318;
  --x-info: #176b87;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --x-bg: #151815;
  --x-surface: #1d221e;
  --x-surface-raised: #252b26;
  --x-text: #edf2eb;
  --x-muted: #aeb9af;
  --x-primary: #66d4a4;
  --x-primary-hover: #8be3bd;
  --x-primary-contrast: #0e2b20;
  --x-border: #3a453c;
  --x-focus: #f7bd52;
  --x-success: #66d4a4;
  --x-warning: #f7bd52;
  --x-danger: #ff8177;
  --x-info: #76cae7;
}

:root[data-theme="ocean"] {
  color-scheme: dark;
  --x-bg: #071722;
  --x-surface: #0c2432;
  --x-surface-raised: #123345;
  --x-text: #e5f6ff;
  --x-muted: #9dbdcb;
  --x-primary: #52c7d9;
  --x-primary-hover: #7ddbe7;
  --x-primary-contrast: #06202a;
  --x-border: #285064;
  --x-focus: #ffcc66;
  --x-success: #5bd1a2;
  --x-warning: #ffcc66;
  --x-danger: #ff8177;
  --x-info: #52c7d9;
}

:root[data-theme="sand"] {
  color-scheme: light;
  --x-bg: #f4ecdc;
  --x-surface: #fff9ed;
  --x-surface-raised: #ffffff;
  --x-text: #352b20;
  --x-muted: #756656;
  --x-primary: #875a2b;
  --x-primary-hover: #67431f;
  --x-primary-contrast: #ffffff;
  --x-border: #d9c7ad;
  --x-focus: #cc6b2c;
  --x-success: #4e7654;
  --x-warning: #a65e00;
  --x-danger: #b23a31;
  --x-info: #386f86;
}

:root[data-theme="graphite"] {
  color-scheme: dark;
  --x-bg: #111214;
  --x-surface: #1b1d21;
  --x-surface-raised: #25282e;
  --x-text: #f2f3f5;
  --x-muted: #a8abb2;
  --x-primary: #d0d4dc;
  --x-primary-hover: #ffffff;
  --x-primary-contrast: #17191d;
  --x-border: #3b3e46;
  --x-focus: #f2c14e;
  --x-success: #6fcf97;
  --x-warning: #f2c14e;
  --x-danger: #eb7770;
  --x-info: #75b9e7;
}

:root[data-theme="mint"] {
  color-scheme: light;
  --x-bg: #edf8f1;
  --x-surface: #fafffb;
  --x-surface-raised: #ffffff;
  --x-text: #173529;
  --x-muted: #587264;
  --x-primary: #157a52;
  --x-primary-hover: #0f5e3e;
  --x-primary-contrast: #ffffff;
  --x-border: #bfddca;
  --x-focus: #d18b18;
  --x-success: #157a52;
  --x-warning: #9c6300;
  --x-danger: #b52d3a;
  --x-info: #23758c;
}

:root[data-theme="amber"] {
  color-scheme: light;
  --x-bg: #fff5db;
  --x-surface: #fffaf0;
  --x-surface-raised: #ffffff;
  --x-text: #3c2c10;
  --x-muted: #77613b;
  --x-primary: #9a5c00;
  --x-primary-hover: #744500;
  --x-primary-contrast: #ffffff;
  --x-border: #e3c98d;
  --x-focus: #b23a31;
  --x-success: #50764b;
  --x-warning: #9a5c00;
  --x-danger: #b23a31;
  --x-info: #2d7184;
}

:root[data-theme="rose"] {
  color-scheme: light;
  --x-bg: #fff1f2;
  --x-surface: #fffafb;
  --x-surface-raised: #ffffff;
  --x-text: #421f29;
  --x-muted: #805c66;
  --x-primary: #a92f55;
  --x-primary-hover: #82213f;
  --x-primary-contrast: #ffffff;
  --x-border: #e6c3cd;
  --x-focus: #d4771d;
  --x-success: #397654;
  --x-warning: #9a6100;
  --x-danger: #b4234d;
  --x-info: #356f89;
}

:root[data-theme="slate"] {
  color-scheme: dark;
  --x-bg: #101820;
  --x-surface: #17232e;
  --x-surface-raised: #213140;
  --x-text: #eef5f8;
  --x-muted: #a9bbc4;
  --x-primary: #92c8d8;
  --x-primary-hover: #b7dce7;
  --x-primary-contrast: #10232b;
  --x-border: #3d5362;
  --x-focus: #f3b953;
  --x-success: #75d0a2;
  --x-warning: #f3b953;
  --x-danger: #fb8178;
  --x-info: #82c9e8;
}

:root[data-theme="high-contrast"] {
  color-scheme: dark;
  --x-bg: #000000;
  --x-surface: #000000;
  --x-surface-raised: #101010;
  --x-text: #ffffff;
  --x-muted: #e4e4e4;
  --x-primary: #ffff00;
  --x-primary-hover: #ffffff;
  --x-primary-contrast: #000000;
  --x-border: #ffffff;
  --x-focus: #00ffff;
  --x-success: #00ff88;
  --x-warning: #ffff00;
  --x-danger: #ff6b6b;
  --x-info: #00ffff;
}