/* Default Light Theme - Claude.ai Inspired Clean Aesthetic */
:root[data-theme="light"],
:root[data-theme="default"],
body[data-theme="light"],
body[data-theme="default"] {
    /* Book-Inspired Color Palette - Warm & Scholarly */
    --primary-color: #7C5E3C;        /* Warm brown for CTAs (leather cover) */
    --secondary-color: #10b981;       /* Calm green for success */
    --danger-color: #ef4444;          /* Clear red for errors */
    --personalization-color: #f97316; /* Orange for personalization icons */

    /* Backgrounds - Subtle off-whites, not pure white */
    --bg-color: #FAFAFA;              /* Very light gray background */
    --sidebar-bg: #FFFFFF;            /* Clean white panels */
    --panel-bg: #FFFFFF;              /* Clean white panels */

    /* Typography - Soft blacks, not harsh */
    --text-color: #1a1a1a;            /* Soft black (not #000) */
    --text-muted: #6B7280;            /* Gray for secondary text */

    /* Borders & Shadows - Minimal, subtle */
    --border-color: #E5E7EB;          /* Very light gray borders */
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.04);        /* Barely visible */
    --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.08);    /* Soft elevated shadow */

    /* Book Content - Warm reading experience */
    --book-bg: #FFFFFF;               /* Pure white for reading */
    --book-text: #1a1a1a;             /* Soft black text */
    --book-heading: #0a0a0a;          /* Slightly darker for hierarchy */

    /* Chat Interface - Claude.ai style */
    --message-bg: #F3F4F6;            /* Light gray message bubbles */
    --input-bg: #FFFFFF;              /* White input fields */

    /* Design system color tokens */
    --color-primary: #7C5E3C;
    --color-primary-hover: #634A2E;
    --color-primary-subtle: rgba(124, 94, 60, 0.08);
    --color-primary-subtle-hover: rgba(124, 94, 60, 0.12);
    --color-text: var(--text-color);
    --color-text-secondary: #4B5563;
    --color-text-muted: var(--text-muted);
    --color-text-disabled: #9CA3AF;
    --color-text-inverse: #FFFFFF;
    --color-bg: var(--bg-color);
    --color-bg-elevated: #FFFFFF;
    --color-bg-subtle: #F3F4F6;
    --color-bg-inset: #E5E7EB;
    --color-border: var(--border-color);
    --color-border-subtle: #F3F4F6;
    --color-success: #10b981;
    --color-success-subtle: rgba(16, 185, 129, 0.1);
    --color-warning: #f59e0b;
    --color-warning-subtle: rgba(245, 158, 11, 0.1);
    --color-error: #ef4444;
    --color-error-subtle: rgba(239, 68, 68, 0.1);
    --color-book-bg: #FFFFFF;
    --color-personalized-bg: rgba(249, 115, 22, 0.06);
    --color-personalized-border: #f97316;
    --color-personalized-toggle-bg: linear-gradient(135deg, #fef3c7 0%, #fffbeb 100%);
    --color-personalized-toggle-border: #fbbf24;
    --color-voice-listening: #6B8E5A;
    --color-voice-listening-subtle: rgba(107, 142, 90, 0.1);
    --color-voice-listening-border: #6B8E5A;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);

    /* Compatibility aliases (referenced in style.css) */
    --primary-hover: var(--color-primary-hover);
    --primary-color-10: var(--color-primary-subtle);
    --text-secondary: var(--color-text-secondary);
    --bg-primary: var(--bg-color);
    --bg-secondary: var(--color-bg-subtle);
    --font-serif: var(--font-body);
    --warning-color: var(--color-warning);
}
