/* Channel Plus / warm ivory, charcoal and gold.
 * Same variables as colors-dark.css; data-cp-color selects the active palette.
 * Product images and actual product color values are not recolored.
 * Logo filters below adapt monochrome artwork to the lighter background.
 */
:root:not([data-cp-color]),
:root[data-cp-color="light"] {
  --cp-color-scheme: light;

  /* Sun/moon switch artwork; the two palettes intentionally share these colors. */
  --cp-toggle-day-sky: #2196f3;
  --cp-toggle-night-sky: #000000;
  --cp-toggle-sun: #ffff00;
  --cp-toggle-moon: #ffffff;
  --cp-toggle-crater: #808080;
  --cp-toggle-ray: #ffffff;
  --cp-toggle-cloud-light: #eeeeee;
  --cp-toggle-cloud-dark: #cccccc;
  --cp-toggle-star: #ffffff;

  /* Canvas, cards and controls. */
  --cp-page: #f5f2eb;
  --cp-pattern: #eee9de;
  --cp-surface-1: #ffffff;
  --cp-surface-2: #faf8f2;
  --cp-surface-3: #eee9de;
  --cp-surface-hover: #e8dfcf;
  --cp-field: #ffffff;
  --cp-header: #fcfaf5;
  --cp-footer: #eee9de;
  --cp-heading: #242118;
  --cp-text: #3e392f;
  --cp-muted: #655f53;
  --cp-border: #d4cbbb;
  --cp-border-strong: #928570;
  --cp-border-accent: #9a7a35;

  /* Dark gold for small text; brighter gold for button fills. */
  --cp-accent: #795617;
  --cp-accent-hover: #53390d;
  --cp-accent-fill: #d5b15e;
  --cp-accent-fill-light: #edce84;
  --cp-accent-fill-hover: #e4bf6b;
  --cp-accent-soft: #f3e8ca;
  --cp-on-accent: #211807;
  --cp-focus: #805b16;
  --cp-shadow-color: #4a3c23;
  --cp-swatch-fallback: #999999;

  /* Semantic states. */
  --cp-danger: #a52c24;
  --cp-danger-fill: #aa2c31;
  --cp-danger-soft: #fff0ed;
  --cp-on-danger: #ffffff;
  --cp-success: #27613b;
  --cp-success-soft: #edf7ef;
  --cp-info: #235b7b;
  --cp-info-soft: #edf5fa;
  --cp-warning: #72500f;
  --cp-warning-soft: #fff4d7;

  /* Keep words readable over unpredictable photographs and moving video. */
  --cp-media-bg: #080808;
  --cp-on-media: #ffffff;
  --cp-on-media-muted: #dedbd3;
  --cp-media-accent: #e8c875;
  --cp-media-panel: #171714;
  --cp-media-panel-hover: #3c3017;
  --cp-media-border: #7f704c;
  --cp-media-overlay: rgb(0 0 0 / .58);
  --cp-modal-backdrop: rgb(24 20 12 / .76);
  --cp-expired-overlay: rgb(0 0 0 / .55);
  --cp-shadow-card: 0 12px 30px rgb(74 60 35 / .09);
  --cp-shadow-floating: 0 20px 55px rgb(74 60 35 / .18);

  /* Gradient recipes; geometry remains independent of page layout. */
  --cp-gradient-accent: linear-gradient(120deg, var(--cp-accent-fill-light), var(--cp-accent-fill));
  --cp-gradient-panel: linear-gradient(135deg, var(--cp-surface-1), var(--cp-surface-2));
  --cp-gradient-card: linear-gradient(180deg, #ffffff 8%, #faf7ee 48%, #ede5d4 67%, #ffffff 100%);
  --cp-gradient-gallery: radial-gradient(ellipse at center, #ffffff 0%, #f3efe5 50%, #e9e2d4 100%);
  --cp-gradient-divider: linear-gradient(90deg, transparent, var(--cp-border-accent) 18%, var(--cp-border-accent) 82%, transparent);
  --cp-gradient-footer: linear-gradient(90deg, transparent, var(--cp-surface-3) 18%, var(--cp-footer) 82%, transparent);
  --cp-gradient-hero: linear-gradient(90deg, rgb(0 0 0 / .86), rgb(0 0 0 / .36) 50%, rgb(0 0 0 / .53)), linear-gradient(0deg, var(--cp-media-bg), transparent 40%);
  --cp-gradient-shop-hero: linear-gradient(180deg, rgb(0 0 0 / .05) 8%, rgb(0 0 0 / .25) 35%, rgb(0 0 0 / .82) 100%);
  --cp-gradient-event: linear-gradient(90deg, var(--cp-media-bg) 0%, rgb(8 8 8 / .95) 28%, rgb(8 8 8 / .45) 58%, rgb(8 8 8 / .05) 100%);
  --cp-gradient-event-rtl: linear-gradient(270deg, var(--cp-media-bg) 0%, rgb(8 8 8 / .95) 28%, rgb(8 8 8 / .45) 58%, rgb(8 8 8 / .05) 100%);
  --cp-gradient-photo-cta: linear-gradient(180deg, rgb(0 0 0 / .82), rgb(0 0 0 / .18) 65%, rgb(0 0 0 / .56));
  --cp-gradient-text: linear-gradient(135deg, var(--cp-accent-hover), var(--cp-accent));
  --cp-gradient-shine: linear-gradient(110deg, rgb(255 255 255 / .27), transparent 42%, rgb(0 0 0 / .4) 50%, rgb(255 255 255 / .2) 82%, rgb(0 0 0 / .33));
  --cp-pattern-image: repeating-linear-gradient(135deg, rgb(75 60 25 / .025) 0 2px, transparent 2px 7px);
  --cp-site-logo-filter: brightness(0) saturate(100%);
  --cp-map-icon-filter: none;
  --cp-brand-logo-filter: grayscale(1) brightness(0) invert(.18);
  --cp-brand-logo-hover-filter: brightness(0) saturate(100%) invert(32%) sepia(42%) saturate(936%) hue-rotate(3deg) brightness(94%) contrast(91%);
}