/*
 * BreadDoodle theme for Excalidraw
 * Palette: tangerine #eb7006 · sprout #099808 · raspberry #e20f44
 *          cocoa #4d241e · cobalt #000cb6 · breeze #91c0f8
 *
 * Targets confirmed selectors from the built CSS:
 *   .excalidraw { }           — light mode
 *   .excalidraw.theme--dark { } — dark mode
 *
 * Only overrides color tokens that carry brand personality.
 * Canvas, geometry, layout, shadows — untouched.
 */

/* ── Light mode ──────────────────────────────────────────────────────────── */

.excalidraw {
  /* Primary: tangerine */
  --color-primary:                   #eb7006;
  --color-primary-darker:            #c2410c;
  --color-primary-darkest:           #4d241e;
  --color-primary-light:             #fff0e6;
  --color-primary-light-darker:      #ffe4cc;
  --color-primary-hover:             #c2410c;
  --color-brand-hover:               #c2410c;
  --color-brand-active:              #4d241e;

  /* Danger: raspberry */
  --color-danger:                    #e20f44;
  --color-danger-dark:               #e20f44;
  --color-danger-darker:             #cc0d3d;
  --color-danger-darkest:            #b00a35;
  --color-danger-text:               #1a0006;
  --color-danger-background:         #fff0f3;
  --color-danger-icon-background:    #ffd6df;
  --color-danger-color:              #b00a35;
  --color-danger-icon-color:         #b00a35;

  /* Success: sprout */
  --color-success:                   #d4f8d4;
  --color-success-darker:            #c1f5c1;
  --color-success-darkest:           #a8efaa;
  --color-success-text:              #099808;
  --color-success-contrast:          #099808;
  --color-success-contrast-hover:    #0aac09;
  --color-success-contrast-active:   #0bbf0a;

  /* Links: cobalt */
  --link-color:                      #000cb6;
  --link-color-hover:                #0a069e;
  --link-color-active:               #91c0f8;

  /* Surfaces: warm cream / paper feel */
  --color-surface-high:              #ffe9d4;
  --color-surface-mid:               #fdf6e3;
  --color-surface-low:               #f7e9d0;
  --color-surface-lowest:            #ffffff;
  --color-surface-primary-container: #fff0e6;
  --color-on-primary-container:      #4d241e;

  /* Selection */
  --color-selection:                 rgba(235, 112, 6, 0.15);
  --focus-highlight-color:           rgba(235, 112, 6, 0.4);
}

/* ── Dark mode ───────────────────────────────────────────────────────────── */

.excalidraw.theme--dark {
  /* Primary: bright tangerine on dark */
  --color-primary:                   #f59f40;
  --color-primary-darker:            #eb7006;
  --color-primary-darkest:           #f7b76b;
  --color-primary-light:             #3d1a00;
  --color-primary-light-darker:      #2e1300;
  --color-primary-hover:             #eb7006;
  --color-brand-hover:               #eb7006;
  --color-brand-active:              #f7b76b;

  /* Danger: brighter raspberry for dark backgrounds */
  --color-danger:                    #ff4d6d;
  --color-danger-dark:               #ff4d6d;
  --color-danger-darker:             #e20f44;
  --color-danger-darkest:            #cc0d3d;
  --color-danger-text:               #ffd6df;
  --color-danger-background:         #3d0015;
  --color-danger-icon-background:    #5a0020;
  --color-danger-color:              #ffd6df;
  --color-danger-icon-color:         #ffd6df;

  /* Success: bright sprout on dark */
  --color-success:                   #1a3d1a;
  --color-success-text:              #12c410;
  --color-success-contrast:          #12c410;
  --color-success-contrast-hover:    #15d913;

  /* Links: breeze (soft sky blue — readable on dark) */
  --link-color:                      #91c0f8;
  --link-color-hover:                #b8d9fb;
  --link-color-active:               #cce8fd;

  /* Surfaces: warm dark / deep cocoa */
  --color-surface-high:              #3d1f10;
  --color-surface-mid:               #2a1810;
  --color-surface-low:               #1a0f0a;
  --color-surface-lowest:            #120a06;
  --color-surface-primary-container: #3d1f10;
  --color-on-primary-container:      #f7b76b;

  /* Panels/islands: warm dark brown */
  --island-bg-color:                 #2a1810;
  --island-bg-color-alt:             #221209;
  --input-bg-color:                  #1a0f0a;
  --sidebar-bg-color:                var(--island-bg-color);
  --popup-bg-color:                  var(--island-bg-color);

  /* Selection */
  --color-selection:                 rgba(245, 159, 64, 0.2);
  --focus-highlight-color:           rgba(245, 159, 64, 0.45);
}

/* ── Footer credit ───────────────────────────────────────────────────────── */

body::after {
  content: "BreadDoodle · powered by Excalidraw";
  position: fixed;
  bottom: 6px;
  right: 10px;
  font-size: 10px;
  font-family: system-ui, sans-serif;
  color: rgba(235, 112, 6, 0.4);
  pointer-events: none;
  z-index: 9999;
  letter-spacing: 0.04em;
}

/* ── Home link (bottom-left, sibling of #root) ───────────────────────────── */

.bt-home-link {
  position: fixed;
  bottom: 6px;
  left: 10px;
  font-size: 11px;
  font-family: system-ui, sans-serif;
  color: rgba(235, 112, 6, 0.6);
  text-decoration: none;
  letter-spacing: 0.04em;
  z-index: 9999;
  transition: color 0.15s ease;
}

.bt-home-link:hover {
  color: rgba(235, 112, 6, 1);
  text-decoration: underline;
}

/* Dark mode: brighter amber (#f59f40) to read on dark backgrounds.
   Uses :has() to detect theme--dark anywhere in the tree from body. */
body:has(.excalidraw.theme--dark) .bt-home-link {
  color: rgba(245, 159, 64, 0.6);
}

body:has(.excalidraw.theme--dark) .bt-home-link:hover {
  color: rgba(245, 159, 64, 1);
}