/* Organizei - Design System iOS Premium */

:root {
    /* Fonts */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    /* Base Palette - iOS Dark Default */
    --color-primary: #007AFF;
    --color-primary-hover: #0056B3;
    --color-primary-light: rgba(0, 122, 255, 0.15);
    
    --color-success: #34C759;
    --color-success-light: rgba(52, 199, 89, 0.15);
    --color-warning: #FF9500;
    --color-warning-light: rgba(255, 149, 0, 0.15);
    --color-danger: #FF3B30;
    --color-danger-light: rgba(255, 59, 48, 0.15);
    
    --color-bg: #000000;
    --color-surface: #1C1C1E;
    --color-surface-elevated: #2C2C2E;
    --color-border: rgba(255, 255, 255, 0.12);
    --color-border-subtle: rgba(255, 255, 255, 0.06);

    --color-text: #FFFFFF;
    --color-text-secondary: #8E8E93;
    --color-text-tertiary: #636366;
    --color-button-text: #FFFFFF;

    /* Form Inputs Dark Mode */
    --input-bg: rgba(255, 255, 255, 0.06);
    --input-border: rgba(255, 255, 255, 0.18);
    --input-text: #FFFFFF;
    --input-placeholder: #8E8E93;

    /* Glassmorphism Effects */
    --glass-bg: rgba(28, 28, 30, 0.75);
    --glass-blur: blur(20px) saturate(180%);
    --glass-border: 1px solid rgba(255, 255, 255, 0.12);
    --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);

    /* Radius & Spacing */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    --transition-fast: 0.15s ease;
    --transition-normal: 0.25s ease;
    --transition-bounce: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

    /* Theme-aware Scrollbars */
    --scrollbar-track: rgba(255, 255, 255, 0.03);
    --scrollbar-thumb: rgba(255, 255, 255, 0.18);
    --scrollbar-thumb-hover: rgba(0, 122, 255, 0.6);
}

/* Light Theme Override */
[data-theme="light"] {
    --color-bg: #F2F2F7;
    --color-surface: #FFFFFF;
    --color-surface-elevated: #E5E5EA;
    --color-border: rgba(0, 0, 0, 0.12);
    --color-border-subtle: rgba(0, 0, 0, 0.06);

    --color-text: #000000;
    --color-text-secondary: #6C6C70;
    --color-text-tertiary: #AEAEC0;

    /* Form Inputs Light Mode */
    --input-bg: rgba(0, 0, 0, 0.04);
    --input-border: rgba(0, 0, 0, 0.18);
    --input-text: #000000;
    --input-placeholder: #8E8E93;

    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: 1px solid rgba(0, 0, 0, 0.1);
    --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.06);

    /* Theme-aware Scrollbars Light */
    --scrollbar-track: rgba(0, 0, 0, 0.03);
    --scrollbar-thumb: rgba(0, 0, 0, 0.22);
    --scrollbar-thumb-hover: rgba(0, 122, 255, 0.6);
}

/* Global Reset & Layout Stability */
html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
}

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

/* Custom Theme-Aware Scrollbars (Dark / Light Mode) */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
    border-radius: 99px;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 99px;
    border: 1px solid transparent;
    background-clip: content-box;
    transition: background var(--transition-fast);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

body {
    font-family: var(--font-family);
    background-color: var(--color-bg);
    color: var(--color-text);
    min-height: 100vh;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

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

a:hover {
    color: var(--color-primary-hover);
}

[data-icon] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}