@import "tailwindcss";

:root {
    /* Apple-inspired Dark Theme - Clean & Minimal */
    --background: 0 0% 0%;
    /* Pure black #000000 */
    --foreground: 0 0% 98%;
    /* Near white #FAFAFA */

    --card: 0 0% 7%;
    /* #121212 - Subtle elevation */
    --card-foreground: 0 0% 98%;

    --popover: 0 0% 9%;
    /* #171717 */
    --popover-foreground: 0 0% 98%;

    --primary: 0 0% 100%;
    /* White - Apple style primary */
    --primary-foreground: 0 0% 0%;
    /* Black text on white */

    --secondary: 0 0% 15%;
    /* #262626 */
    --secondary-foreground: 0 0% 98%;

    --muted: 0 0% 15%;
    --muted-foreground: 0 0% 64%;
    /* #A3A3A3 - Subtle gray */

    --accent: 0 0% 15%;
    --accent-foreground: 0 0% 98%;

    --destructive: 0 72% 51%;
    /* Red */
    --destructive-foreground: 0 0% 98%;

    --success: 142 71% 45%;
    /* Green */
    --warning: 38 92% 50%;
    /* Amber */

    --border: 0 0% 15%;
    /* Very subtle border */
    --input: 0 0% 15%;
    --ring: 0 0% 100%;
    /* White focus ring */

    --radius: 0.75rem;
    /* 12px - Refined, not too round */
}

* {
    border-color: hsl(var(--border));
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    font-feature-settings: "rlig" 1, "calt" 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Utility Classes - Minimal & Purposeful */
.glass {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.mask-linear-gradient {
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.mask-radial-faded {
    mask-image: radial-gradient(circle, black 60%, transparent 100%);
    -webkit-mask-image: radial-gradient(circle, black 60%, transparent 100%);
}

.surface {
    background-color: hsl(var(--card));
}

.surface-elevated {
    background-color: hsl(0 0% 10%);
}

/* Typography */
.text-balance {
    text-wrap: balance;
}

/* Animations - Subtle & Fast */
@keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slide-up {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scale-in {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.animate-fade-in {
    animation: fade-in 0.2s ease-out;
}

.animate-slide-up {
    animation: slide-up 0.3s ease-out;
}

.animate-scale-in {
    animation: scale-in 0.2s ease-out;
}

.animate-scroll-left {
    animation: scroll-left 20s linear infinite;
}

/* Focus States - Apple style */
:focus-visible {
    outline: 2px solid hsl(var(--ring));
    outline-offset: 2px;
}

/* Scrollbar - Minimal */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

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

::-webkit-scrollbar-thumb {
    background: hsl(0 0% 30%);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: hsl(0 0% 40%);
}

/* Selection */
::selection {
    background: hsl(0 0% 100% / 0.2);
}