/* ==========================================================================
   Theme Variables
   ========================================================================== */

:root {
  color-scheme: dark;
  /* Backgrounds */
  --bg-primary: #0a0a0a;
  --bg-secondary: #1a1a1a;
  --bg-tertiary: #111;
  --bg-elevated: #252525;
  --bg-hover: #222;
  --bg-muted: #050505;
  --bg-overlay: rgba(0, 0, 0, 0.75);

  /* Text */
  --text-primary: #fafafa;
  --text-secondary: #9a9a9a;
  --text-muted: #888;
  --text-disabled: #6a6a6a;
  --text-faint: #444;
  --text-soft: #ccc;
  --text-on-color: #fff;

  /* Borders */
  --border-primary: #333;
  --border-secondary: #222;
  --border-subtle: #2a2a2a;
  --border-hover: #444;

  /* Accent */
  --accent-primary: #60a5fa;
  --accent-hover: #3b82f6;
  --accent-dark: #2563eb;

  /* Status */
  --color-success: #22c55e;
  --color-success-dark: #065f46;
  --color-warning: #f59e0b;
  --color-danger: #ef4444;
  --color-danger-text: #f87171;
  --color-danger-bg: #dc2626;
  --color-danger-hover: #b91c1c;

  /* Special */
  --bg-today: #1a1a2e;
  --bg-info: #1e3a5f;
  --bg-danger-subtle: #2a1515;
  --bg-drag-over: #151520;
  --bg-form-alt: #151515;
  --bg-closed: #0f0f0f;

  /* Google Calendar */
  --gcal-event: #0891b2;
  --gcal-event-hover: #0e7490;

  /* Outlook Calendar */
  --ocal-event: #0078d4;
  --ocal-event-hover: #106ebe;

  /* Status badge backgrounds */
  --status-blue-bg: rgba(96, 165, 250, 0.15);
  --status-green-bg: rgba(34, 197, 94, 0.15);
  --status-amber-bg: rgba(245, 158, 11, 0.15);
  --status-red-bg: rgba(239, 68, 68, 0.15);
  --status-purple-bg: rgba(139, 92, 246, 0.15);
  --status-neutral-bg: rgba(102, 102, 102, 0.15);
  --status-purple-text: #8b5cf6;

  /* Buttons */
  --btn-primary-bg: #fafafa;
  --btn-primary-text: #0a0a0a;
  --btn-secondary-bg: #333;
  --btn-secondary-text: #fafafa;
}

/* Cool Slate - blue-tinted light theme */
[data-theme="light-slate"] {
  color-scheme: light;
  /* Backgrounds - white with blue accents */
  --bg-primary: #ffffff;
  --bg-secondary: #f8fafc;
  --bg-tertiary: #e3ecf4;
  --bg-elevated: #d5e2ef;
  --bg-hover: #dce7f2;
  --bg-muted: #f8fafc;
  --bg-overlay: rgba(15, 40, 80, 0.5);

  /* Text - blue-gray tones */
  --text-primary: #0a1628;
  --text-secondary: #2d4a6e;
  --text-muted: #3a5778;
  --text-disabled: #5a8ab8;
  --text-faint: #a8c5e0;
  --text-soft: #1e3a5c;
  --text-on-color: #fff;

  /* Borders */
  --border-primary: #c4d7ea;
  --border-secondary: #d5e2ef;
  --border-subtle: #cddced;
  --border-hover: #7a9fc4;

  /* Accent */
  --accent-primary: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-dark: #1e40af;

  /* Status */
  --color-success: #16a34a;
  --color-success-dark: #15803d;
  --color-warning: #d97706;
  --color-danger: #dc2626;
  --color-danger-text: #dc2626;
  --color-danger-bg: #dc2626;
  --color-danger-hover: #b91c1c;

  /* Special */
  --bg-today: #ccddef;
  --bg-info: #ccddef;
  --bg-danger-subtle: #fef2f2;
  --bg-drag-over: #d5e3f1;
  --bg-form-alt: #dce7f2;
  --bg-closed: #e3ecf4;

  /* Google Calendar */
  --gcal-event: #0e7490;
  --gcal-event-hover: #155e75;

  /* Outlook Calendar */
  --ocal-event: #0078d4;
  --ocal-event-hover: #106ebe;

  --status-purple-text: #7c3aed;

  /* Buttons */
  --btn-primary-bg: #2563eb;
  --btn-primary-text: #ffffff;
  --btn-secondary-bg: #ccddef;
  --btn-secondary-text: #1e3a5c;
}

/* Warm Cream - soft, organic, premium feel */
[data-theme="light-cream"] {
  color-scheme: light;
  /* Backgrounds - warm off-whites */
  --bg-primary: #fefdfb;
  --bg-secondary: #faf8f5;
  --bg-tertiary: #f5f0e8;
  --bg-elevated: #ebe4d8;
  --bg-hover: #ebe4d8;
  --bg-muted: #fefdfb;
  --bg-overlay: rgba(41, 37, 36, 0.5);

  /* Text - warm browns */
  --text-primary: #1c1917;
  --text-secondary: #57534e;
  --text-muted: #5c5652;
  --text-disabled: #8a847f;
  --text-faint: #d6d3d1;
  --text-soft: #44403c;
  --text-on-color: #fff;

  /* Borders */
  --border-primary: #d6d3d1;
  --border-secondary: #e7e5e4;
  --border-subtle: #dfdddb;
  --border-hover: #a8a29e;

  /* Accent - warm amber instead of blue */
  --accent-primary: #b45309;
  --accent-hover: #92400e;
  --accent-dark: #78350f;

  /* Status */
  --color-success: #15803d;
  --color-success-dark: #166534;
  --color-warning: #d97706;
  --color-danger: #dc2626;
  --color-danger-text: #b91c1c;
  --color-danger-bg: #dc2626;
  --color-danger-hover: #b91c1c;

  /* Special */
  --bg-today: #fef3c7;
  --bg-info: #fef3c7;
  --bg-danger-subtle: #fef2f2;
  --bg-drag-over: #fef9c3;
  --bg-form-alt: #faf8f5;
  --bg-closed: #f5f0e8;

  /* Google Calendar */
  --gcal-event: #0e7490;
  --gcal-event-hover: #155e75;

  /* Outlook Calendar */
  --ocal-event: #0078d4;
  --ocal-event-hover: #106ebe;

  --status-purple-text: #7c3aed;

  /* Buttons */
  --btn-primary-bg: #b45309;
  --btn-primary-text: #ffffff;
  --btn-secondary-bg: #e7e0d4;
  --btn-secondary-text: #44403c;
}

/* Soft Sage - muted green-gray, calming (default light theme) */
[data-theme="light"],
[data-theme="light-sage"] {
  color-scheme: light;
  /* Backgrounds - sage/stone tints */
  --bg-primary: #fafbfa;
  --bg-secondary: #f3f5f3;
  --bg-tertiary: #e4e9e4;
  --bg-elevated: #d1d9d1;
  --bg-hover: #d1d9d1;
  --bg-muted: #fafbfa;
  --bg-overlay: rgba(28, 33, 28, 0.5);

  /* Text - muted greens */
  --text-primary: #14201a;
  --text-secondary: #4a5d52;
  --text-muted: #4d5f54;
  --text-disabled: #6b7d70;
  --text-faint: #c8d4cc;
  --text-soft: #3a4a40;
  --text-on-color: #fff;

  /* Borders */
  --border-primary: #c8d4cc;
  --border-secondary: #dce4de;
  --border-subtle: #d2dcd5;
  --border-hover: #97a89d;

  /* Accent - teal */
  --accent-primary: #0d9488;
  --accent-hover: #0f766e;
  --accent-dark: #115e59;

  /* Status */
  --color-success: #16a34a;
  --color-success-dark: #15803d;
  --color-warning: #d97706;
  --color-danger: #dc2626;
  --color-danger-text: #b91c1c;
  --color-danger-bg: #dc2626;
  --color-danger-hover: #b91c1c;

  /* Special */
  --bg-today: #ccfbf1;
  --bg-info: #ccfbf1;
  --bg-danger-subtle: #fef2f2;
  --bg-drag-over: #d1fae5;
  --bg-form-alt: #f3f5f3;
  --bg-closed: #e4e9e4;

  /* Google Calendar */
  --gcal-event: #7c3aed;
  --gcal-event-hover: #6d28d9;

  /* Outlook Calendar */
  --ocal-event: #5b5fc7;
  --ocal-event-hover: #4f52b2;

  --status-purple-text: #7c3aed;

  /* Buttons */
  --btn-primary-bg: #0d9488;
  --btn-primary-text: #ffffff;
  --btn-secondary-bg: #d1d9d1;
  --btn-secondary-text: #3a4a40;
}

/* ==========================================================================
   Base Styles
   ========================================================================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: system-ui, -apple-system, sans-serif;
  background: var(--bg-primary);
  color: var(--text-primary);
  min-height: 100vh;
  transition: background-color 0.2s, color 0.2s;
}

a {
  color: var(--accent-primary);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* Auth pages */
.auth-container {
  max-width: 400px;
  margin: 0 auto;
  padding: 4rem 2rem;
}

.auth-container h1 {
  font-size: 2rem;
  margin-bottom: 2rem;
  text-align: center;
}

.form-group {
  margin-bottom: 1rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--text-secondary);
  font-size: 0.875rem;
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--border-primary);
  border-radius: 4px;
  background: var(--bg-secondary);
  color: var(--text-primary);
  font-size: 1rem;
  font-family: inherit;
  line-height: 1.5;
  box-sizing: border-box;
  height: 3rem;
}

.form-group textarea {
  height: auto;
  resize: vertical;
  min-height: 80px;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  outline: none;
  border-color: var(--accent-primary);
}

/* Form Layout Helpers */
.form-row {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
}

.form-row .form-group {
  flex: 1;
  margin-bottom: 0;
}

@media (max-width: 600px) {
  .form-row {
    flex-direction: column;
    gap: 1rem;
  }
}

.error {
  color: var(--color-danger-text);
  font-size: 0.875rem;
  margin-bottom: 1rem;
  min-height: 1.25rem;
}

.auth-container button {
  width: 100%;
  margin-top: 0.5rem;
}

.auth-link {
  text-align: center;
  margin-top: 1.5rem;
  color: var(--text-secondary);
}

/* Partner offer badge on signup */
.partner-offer {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.1), rgba(96, 165, 250, 0.1));
  border: 1px solid var(--color-success);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}

.partner-offer-title {
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--color-success);
  margin-bottom: 0.75rem;
}

.partner-offer-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.partner-offer-list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--text-primary);
  padding: 0.25rem 0;
}

.partner-offer-list .check {
  color: var(--color-success);
  font-weight: 600;
}

/* Buttons */
button {
  background: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  border: none;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  cursor: pointer;
  border-radius: 4px;
  transition: opacity 0.2s;
}

button:hover {
  opacity: 0.9;
}

button.secondary {
  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
}

/* ==========================================================================
   Consolidated Dark-mode Icon Inversions
   ========================================================================== */

:root trix-toolbar .trix-button--icon::before { filter: invert(1); }
[data-theme^="light"] trix-toolbar .trix-button--icon::before { filter: none; }

:root input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.5); }
[data-theme^="light"] input[type="date"]::-webkit-calendar-picker-indicator { filter: none; }

:root input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: invert(1); }
[data-theme^="light"] input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: none; }