@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap');

/* ─── Design Tokens ─── */
:root {
    --font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif;
    --bg-page: #F8F8F6;
    --bg-surface: #FFFFFF;
    --bg-hover: #F0F0EC;
    --border-color: #E5E5E0;
    --border-muted: #D5D5D0;
    --text-primary: #1a1a1a;
    --text-secondary: #555;
    --text-muted: #888;
    --text-faint: #999;
    --text-dim: #bbb;
    --accent-indigo: #4338CA;
    --accent-indigo-light: #6366F1;
    --accent-indigo-dark: #3730A3;
    --accent-indigo-bg: #EEF2FF;
    --accent-indigo-border: #818CF8;
    --accent-indigo-border-light: #C7D2FE;
    --accent-purple: #6d28d9;
    --accent-purple-bg: #f5f3ff;
    --accent-purple-border: #c4b5fd;
    --accent-purple-hover: #ede9fe;
    --danger: #DC2626;
    --danger-dark: #B91C1C;
    --danger-bg: #FEE2E2;
    --danger-bg-light: #FEF2F2;
    --toggle-inactive: #d1d5db;
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 10px;
    --radius-2xl: 12px;
    --shadow-modal: 0 20px 60px rgba(0, 0, 0, 0.2);
    --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.04);
    --transition-fast: 0.15s ease;
    --transition-normal: 0.2s ease;
}

/* ─── Reset ─── */
html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
    font-family: var(--font-family);
    color: var(--text-primary);
    background: var(--bg-page);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

input[type="date"] {
    font-family: inherit;
}

/* ─── Focus Styles ─── */
input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: var(--accent-indigo) !important;
    box-shadow: 0 0 0 2px rgba(67, 56, 202, 0.12);
}

/* ─── Scrollbar (subtle) ─── */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #d5d5d0;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #bbb;
}