/* ==========================================================================
   ABRN Theme — Default
   Warm cream palette with burgundy accent, serif typography, radial mesh blobs
   ========================================================================== */

[data-theme="abrn"] {
  /* — Surface & Background — */
  --color-bg:              #faf8f5;
  --color-bg-alt:          #f5f0eb;
  --color-bg-elevated:     #ffffff;
  --color-surface:         #faf8f5;
  --color-surface-hover:   #f5f0eb;

  /* — Text & Ink — */
  --color-text:            #1c1810;
  --color-text-secondary:  #5c554a;
  --color-text-muted:      #8a8279;
  --color-heading:         #1c1810;

  /* — Accent & Primary — */
  --color-primary:         #8a1538;
  --color-primary-hover:   #6e1030;
  --color-primary-light:   rgba(138, 21, 56, 0.08);
  --color-primary-text:    #ffffff;
  --color-accent:          #8a1538;
  --color-accent-hover:    #6e1030;

  /* — Borders & Hairlines — */
  --color-border:          #ece5dc;
  --color-border-light:    #f0ebe4;
  --color-border-focus:    #8a1538;
  --color-divider:         #ece5dc;

  /* — Status Colors — */
  --color-success:         #2d6a4f;
  --color-success-bg:      #d8f3dc;
  --color-warning:         #b45309;
  --color-warning-bg:      #fef3c7;
  --color-danger:          #991b1b;
  --color-danger-bg:       #fee2e2;
  --color-info:            #1e40af;
  --color-info-bg:         #dbeafe;

  /* — Typography — */
  --font-heading:          'Libre Baskerville', 'Georgia', serif;
  --font-body:             'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:             'JetBrains Mono', 'Fira Code', monospace;

  /* — Shadows — */
  --shadow-sm:             0 1px 2px rgba(28, 24, 16, 0.04);
  --shadow-md:             0 4px 12px rgba(28, 24, 16, 0.06);
  --shadow-lg:             0 8px 24px rgba(28, 24, 16, 0.08);
  --shadow-xl:             0 16px 48px rgba(28, 24, 16, 0.10);

  /* — Focus — */
  --color-focus-ring:      rgba(138, 21, 56, 0.4);

  /* — Decorative: Radial Mesh Blobs — */
  --mesh-blob-1:           radial-gradient(ellipse 600px 400px at 10% 20%, rgba(138, 21, 56, 0.04), transparent);
  --mesh-blob-2:           radial-gradient(ellipse 500px 500px at 80% 60%, rgba(212, 157, 169, 0.06), transparent);
  --mesh-blob-3:           radial-gradient(ellipse 400px 300px at 50% 90%, rgba(236, 229, 220, 0.08), transparent);
}

/* Body background with mesh blobs */
[data-theme="abrn"] body {
  background-color: var(--color-bg);
  background-image: var(--mesh-blob-1), var(--mesh-blob-2), var(--mesh-blob-3);
  background-attachment: fixed;
}

/* Heading font override */
[data-theme="abrn"] h1,
[data-theme="abrn"] .page-title {
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* ==========================================================================
   ABRN Dark Variant
   ========================================================================== */

[data-theme="abrn-dark"] {
  /* — Surface & Background — */
  --color-bg:              #1c1810;
  --color-bg-alt:          #252017;
  --color-bg-elevated:     #2e281e;
  --color-surface:         #252017;
  --color-surface-hover:   #2e281e;

  /* — Text & Ink — */
  --color-text:            #f5f0eb;
  --color-text-secondary:  #c4bdb4;
  --color-text-muted:      #8a8279;
  --color-heading:         #f5f0eb;

  /* — Accent & Primary — */
  --color-primary:         #d49da9;
  --color-primary-hover:   #e0b3bd;
  --color-primary-light:   rgba(212, 157, 169, 0.12);
  --color-primary-text:    #1c1810;
  --color-accent:          #d49da9;
  --color-accent-hover:    #e0b3bd;

  /* — Borders & Hairlines — */
  --color-border:          #3d3629;
  --color-border-light:    #2e281e;
  --color-border-focus:    #d49da9;
  --color-divider:         #3d3629;

  /* — Status Colors — */
  --color-success:         #6ee7b7;
  --color-success-bg:      rgba(110, 231, 183, 0.1);
  --color-warning:         #fbbf24;
  --color-warning-bg:      rgba(251, 191, 36, 0.1);
  --color-danger:          #fca5a5;
  --color-danger-bg:       rgba(252, 165, 165, 0.1);
  --color-info:            #93c5fd;
  --color-info-bg:         rgba(147, 197, 253, 0.1);

  /* — Typography — */
  --font-heading:          'Libre Baskerville', 'Georgia', serif;
  --font-body:             'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:             'JetBrains Mono', 'Fira Code', monospace;

  /* — Shadows — */
  --shadow-sm:             0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md:             0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg:             0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-xl:             0 16px 48px rgba(0, 0, 0, 0.4);

  /* — Focus — */
  --color-focus-ring:      rgba(212, 157, 169, 0.5);

  /* — Decorative: Radial Mesh Blobs — */
  --mesh-blob-1:           radial-gradient(ellipse 600px 400px at 10% 20%, rgba(212, 157, 169, 0.06), transparent);
  --mesh-blob-2:           radial-gradient(ellipse 500px 500px at 80% 60%, rgba(138, 21, 56, 0.08), transparent);
  --mesh-blob-3:           radial-gradient(ellipse 400px 300px at 50% 90%, rgba(61, 54, 41, 0.1), transparent);
}

[data-theme="abrn-dark"] body {
  background-color: var(--color-bg);
  background-image: var(--mesh-blob-1), var(--mesh-blob-2), var(--mesh-blob-3);
  background-attachment: fixed;
}

[data-theme="abrn-dark"] h1,
[data-theme="abrn-dark"] .page-title {
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.01em;
}