/**
 * Marky Mark — Base
 * CSS custom properties, reset, and root typography.
 */

:root {
    --primary-color: #000000;
    --bg-color: #ffffff;
    --border-color: #e5e5e5;
    --sidebar-width: 260px;
    --chat-sidebar-width: 350px;
    --max-width: 760px;
    --transition: 300ms cubic-bezier(0.4, 0, 0.2, 1);

    --bg-secondary: #f9f9f9;
    --bg-tertiary: #f4f4f4;
    --bg-hover: #ececec;
    --text-primary: #0f172a;
    --text-secondary: #64748b;
    --text-tertiary: #aaa;
    --border-subtle: #f0f0f0;
    --shadow-sm: rgba(0,0,0,0.05);
    --shadow-md: rgba(0,0,0,0.10);
    --input-bg: #ffffff;
    --chip-bg: #ffffff;
    --chip-border: #e2e8f0;
}

[data-theme="dark"] {
    --primary-color: #f1f5f9;
    --bg-color: #0a0f1e;
    --bg-secondary: #0f172a;
    --bg-tertiary: #1e293b;
    --bg-hover: #1e293b;
    --text-primary: #f1f5f9;
    --text-secondary: #94a3b8;
    --text-tertiary: #64748b;
    --border-color: rgba(255,255,255,0.1);
    --border-subtle: rgba(255,255,255,0.05);
    --shadow-sm: rgba(0,0,0,0.3);
    --shadow-md: rgba(0,0,0,0.5);
    --input-bg: rgba(255,255,255,0.07);
    --chip-bg: rgba(255,255,255,0.05);
    --chip-border: rgba(255,255,255,0.12);
}

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: var(--bg-color);
    color: var(--text-primary);
    overflow: hidden;
}

body {
    transition: background 280ms ease, color 280ms ease;
}

/* Smooth theme switch — class added briefly by JS during toggle */
.theme-transitioning *,
.theme-transitioning *::before,
.theme-transitioning *::after {
    transition: background-color 250ms ease, border-color 250ms ease,
                color 250ms ease, box-shadow 250ms ease !important;
}