/* Cashiee — sunny, confident "petty cash made cheerful" palette.
   Warm ivory paper with a bold golden-yellow accent for in/out money. */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  --canvas: #fbf6e6;
  --surface: #ffffff;
  --surface-2: #f6edd0;
  --border: #e9dda3;
  --border-strong: #d3bd6d;
  --ink: #26210f;
  --muted: #756a3f;
  --accent: #f5b900;
  --accent-hover: #dba500;
  --accent-ink: #2a1f00;
  --accent-text: #8a6300;
  --accent-strong: #6e4e00;
  --accent-soft: #fdedb0;
  --accent-border: #f0cf5c;
  --success: #2f9e63;
  --success-ink: #ffffff;
  --success-soft: #e3ebd6;
  --success-strong: #227047;
  --warning: #c15b12;
  --warning-ink: #ffffff;
  --warning-soft: #f4e3cd;
  --warning-strong: #a44d10;
  --danger: #d84343;
  --danger-ink: #ffffff;
  --danger-soft: #f7e1d2;
  --danger-strong: #b73939;
  --chart-1: #f5b900;
  --chart-2: #2f9e63;
  --chart-3: #4f8cc9;
  --chart-4: #c15b12;
  --chart-5: #a06bd8;
  --chart-6: #d84343;

  --font-display: "Baloo 2", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --display-weight: 700;
  --display-tracking: -0.01em;
  --eyebrow-tracking: 0.08em;
  --radius-card: 18px;
  --radius-btn: 12px;
  --radius-input: 10px;
  --shadow-card: 0 1px 2px rgba(60, 45, 0, 0.05), 0 10px 24px -14px rgba(60, 45, 0, 0.18);
  --shadow-raised: 0 20px 45px -18px rgba(60, 45, 0, 0.35);
  --card-pad: 1.5rem;
  --x-mint: #d9f2e3;
  --x-mint-ink: #1f6b46;
  --x-coral: #ffe0b8;
  --x-yellow: #fff0a8;
  --x-piggy: #ffd9e6;
}

html[data-theme="dark"] {
  --canvas: #0f0c00;
  --surface: #27241a;
  --surface-2: #1b180d;
  --border: #312e24;
  --border-strong: #57554d;
  --ink: #fbf6e6;
  --muted: #9d988a;
  --accent: #f5b900;
  --accent-hover: #f7c426;
  --accent-ink: #221a00;
  --accent-text: #f5b900;
  --accent-strong: #f5b900;
  --accent-soft: #423200;
  --accent-border: #765a00;
  --success: #2f9e63;
  --success-ink: #ffffff;
  --success-soft: #162c16;
  --success-strong: #40a66f;
  --warning: #c15b12;
  --warning-ink: #ffffff;
  --warning-soft: #361d04;
  --warning-strong: #cb7436;
  --danger: #d84343;
  --danger-ink: #ffffff;
  --danger-soft: #3b180f;
  --danger-strong: #e16d6d;
  --chart-1: #f5b900;
  --chart-2: #70d976;
  --chart-3: #24c0ce;
  --chart-4: #a0bdfb;
  --chart-5: #db7ee1;
  --chart-6: #fda19a;
}

/* Cashiee — subtle money-pattern texture + a few app-specific bits. */

.cashiee-pattern {
  background-image: radial-gradient(color-mix(in srgb, var(--accent) 14%, transparent) 1.5px, transparent 1.5px);
  background-size: 26px 26px;
}

.cashiee-emoji-field {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  opacity: 0.5;
}
.cashiee-emoji-field span {
  position: absolute;
  font-size: 1.4rem;
  opacity: 0.22;
  filter: saturate(0.9);
}

@keyframes cashiee-float {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-10px) rotate(6deg); }
  100% { transform: translateY(0) rotate(0deg); }
}
.cashiee-float { animation: cashiee-float 5s ease-in-out infinite; }
html.reduced-motion .cashiee-float { animation: none; }

.cashiee-sidebar {
  scrollbar-width: thin;
}

.cashiee-stat-icon {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius-btn, 12px);
  font-size: 1.25rem;
}

.cashiee-progress-track {
  background: color-mix(in srgb, var(--border) 60%, transparent);
}