@import 'tailwindcss';
@import 'tw-animate-css';

@source '../views';
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';

@custom-variant dark (&:is(.dark *));

@theme inline {
    /* ── Typography ─────────────────────────────────── */
    --font-sans: 'Public Sans', ui-sans-serif, system-ui, sans-serif;
    --font-heading: 'Public Sans', ui-sans-serif, system-ui, sans-serif;
    --font-mono: ui-monospace, 'Courier New', monospace;
    --font-serif: ui-serif, Georgia, serif;

    /* ── Breakpoints ─────────────────────────────────── */
    --breakpoint-xl1800: 1800px;
    --breakpoint-xl1700: 1700px;
    --breakpoint-xl1660: 1660px;
    --breakpoint-xl1600: 1600px;
    --breakpoint-xl1580: 1580px;
    --breakpoint-xl1500: 1500px;
    --breakpoint-xl1470: 1470px;
    --breakpoint-xl1400: 1400px;
    --breakpoint-xl1366: 1366px;
    --breakpoint-xl1299: 1299px;
    --breakpoint-xl1280: 1280px;
    --breakpoint-xl1200: 1200px;
    --breakpoint-md810: 810px;
    --breakpoint-md640: 640px;
    --breakpoint-sm480: 480px;
    --breakpoint-sm439: 439px;
    --breakpoint-sm420: 420px;
    --breakpoint-sm404: 404px;
    --breakpoint-sm360: 360px;
    --breakpoint-xxl: 1399px;
    --breakpoint-xl: 1199px;
    --breakpoint-lg: 991px;
    --breakpoint-md: 767px;
    --breakpoint-sm: 575px;

    /* ── Color tokens ────────────────────────────────── */
    --color-background: var(--background);
    --color-foreground: var(--foreground);
    --color-card: var(--card);
    --color-card-foreground: var(--card-foreground);
    --color-popover: var(--popover);
    --color-popover-foreground: var(--popover-foreground);
    --color-primary: hsl(var(--primary));
    --color-primary-foreground: hsl(var(--primary-foreground));
    --color-primary-soft: hsl(var(--primary-soft));
    --color-primary-soft-foreground: hsl(var(--primary-soft-foreground));
    --color-secondary: var(--secondary);
    --color-secondary-foreground: var(--secondary-foreground);
    --color-secondary-soft: var(--secondary-soft);
    --color-secondary-soft-foreground: var(--secondary-soft-foreground);
    --color-muted: var(--muted);
    --color-muted-foreground: var(--muted-foreground);
    --color-accent: var(--accent);
    --color-accent-foreground: var(--accent-foreground);
    --color-destructive: var(--destructive);
    --color-destructive-foreground: var(--destructive-foreground);
    --color-info: var(--info);
    --color-info-foreground: var(--info-foreground);
    --color-info-soft: var(--info-soft);
    --color-info-soft-foreground: var(--info-soft-foreground);
    --color-success: var(--success);
    --color-success-foreground: var(--success-foreground);
    --color-success-soft: var(--success-soft);
    --color-success-soft-foreground: var(--success-soft-foreground);
    --color-warning: var(--warning);
    --color-warning-foreground: var(--warning-foreground);
    --color-warning-soft: var(--warning-soft);
    --color-warning-soft-foreground: var(--warning-soft-foreground);
    --color-border: var(--border);
    --color-input: var(--input);
    --color-ring: hsl(var(--ring));
    --color-chart-1: var(--chart-1);
    --color-chart-2: var(--chart-2);
    --color-chart-3: var(--chart-3);
    --color-chart-4: var(--chart-4);
    --color-chart-5: var(--chart-5);
    --color-sidebar: var(--sidebar);
    --color-sidebar-foreground: var(--sidebar-foreground);
    --color-sidebar-primary: hsl(var(--sidebar-primary));
    --color-sidebar-primary-foreground: hsl(var(--sidebar-primary-foreground));
    --color-sidebar-accent: var(--sidebar-accent);
    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
    --color-sidebar-border: var(--sidebar-border);
    --color-sidebar-ring: hsl(var(--sidebar-ring));

    /* ── Radius ──────────────────────────────────────── */
    --radius-sm: calc(var(--radius) * 0.6);
    --radius-md: calc(var(--radius) * 0.8);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) * 1.4);
    --radius-2xl: calc(var(--radius) * 1.8);
    --radius-3xl: calc(var(--radius) * 2.2);
    --radius-4xl: calc(var(--radius) * 2.6);
}

/* ══════════════════════════════════════════════════════
   LIGHT MODE
   ══════════════════════════════════════════════════════ */
:root {
    /* Primary — teal mai închis pentru contrast pe fundal deschis */
    --primary: 162 60% 46%;
    --primary-foreground: 0 0% 100%;
    --primary-soft: 162 35% 93%;
    --primary-soft-foreground: 162 40% 20%;

    /* Secondary — gri neutru cald */
    --secondary: oklch(0.93 0.003 264);
    --secondary-foreground: oklch(0.25 0.005 264);
    --secondary-soft: oklch(0.96 0.002 264);
    --secondary-soft-foreground: oklch(0.38 0.008 264);

    /* Backgrounds */
    --background: oklch(1 0 0); /* #ffffff */
    --foreground: oklch(0.19 0.015 243); /* #1c252e */

    /* Card / Paper */
    --card: oklch(1 0 0);
    --card-foreground: oklch(0.19 0.015 243);

    /* Popover */
    --popover: oklch(1 0 0);
    --popover-foreground: oklch(0.19 0.015 243);

    /* Muted */
    --muted: oklch(0.96 0.003 264);
    --muted-foreground: oklch(0.5 0.015 243); /* #637381 */

    /* Accent */
    --accent: oklch(0.96 0.003 264);
    --accent-foreground: oklch(0.19 0.015 243);

    /* Destructive / Error */
    --destructive: oklch(0.6 0.22 25); /* #ff5630 */
    --destructive-foreground: oklch(1 0 0);

    /* Info */
    --info: oklch(0.7 0.14 210); /* #00b8d9 */
    --info-foreground: oklch(1 0 0);
    --info-soft: oklch(0.94 0.04 210);
    --info-soft-foreground: oklch(0.38 0.09 210);

    /* Success */
    --success: oklch(0.7 0.18 155); /* #22c55e */
    --success-foreground: oklch(1 0 0);
    --success-soft: oklch(0.94 0.05 155);
    --success-soft-foreground: oklch(0.38 0.1 155);

    /* Warning */
    --warning: oklch(0.78 0.17 75); /* #ffab00 */
    --warning-foreground: oklch(0.19 0.015 243);
    --warning-soft: oklch(0.95 0.06 82);
    --warning-soft-foreground: oklch(0.42 0.1 75);

    /* Border / input / ring: light neutral edges */
    --border: oklch(0.945 0.002 264);
    --input: oklch(0.945 0.002 264);
    --ring: 162 68% 46%;

    /* Charts */
    --chart-1: oklch(0.905 0.182 98.111);
    --chart-2: oklch(0.795 0.184 86.047);
    --chart-3: oklch(0.681 0.162 75.834);
    --chart-4: oklch(0.554 0.135 66.442);
    --chart-5: oklch(0.476 0.114 61.907);

    /* Radius */
    --radius: 0.5rem;

    /* Sidebar */
    --sidebar: oklch(1 0 0);
    --sidebar-foreground: oklch(0.19 0.015 243);
    --sidebar-primary: 162 68% 46%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: oklch(0.96 0.003 264);
    --sidebar-accent-foreground: oklch(0.19 0.015 243);
    --sidebar-border: oklch(0.945 0.002 264);
    --sidebar-ring: 162 68% 46%;

    --shadow-surface:
        0 0 2px 0 oklch(0.656 0.028 243 / 0.2),
        0 12px 24px -4px oklch(0.656 0.028 243 / 0.12);

    --shadow-float:
        0 0 2px 0 oklch(0.656 0.028 243 / 0.24),
        -20px 20px 40px -4px oklch(0.656 0.028 243 / 0.24);

    /* Document discussions — chat panel */
    --chat-panel-bg: #e5ddd5;
    --chat-panel-dot: #b8b4ad;
    --chat-panel-border: rgb(209 204 196 / 0.8);
    --chat-composer-bg: rgb(240 235 227 / 0.95);
    --chat-composer-border: rgb(209 204 196 / 0.9);
    --chat-bubble-own-bg: #dcf8c6;
    --chat-bubble-own-fg: #1f3b2c;
    --chat-bubble-own-name: #1b5e3b;
    --chat-bubble-own-divider: rgb(197 232 183 / 0.8);
    --chat-bubble-own-badge-bg: rgb(255 255 255 / 0.7);
    --chat-bubble-own-badge-border: #b8dcb0;
    --chat-bubble-own-badge-fg: #4a6b52;
    --chat-bubble-own-meta: rgb(74 107 82 / 0.9);
    --chat-bubble-other-bg: #ffffff;
    --chat-bubble-shadow: 0 1px 2px rgb(0 0 0 / 0.12);
}

/* ══════════════════════════════════════════════════════
   DARK MODE
   ══════════════════════════════════════════════════════ */
.dark {
    /* Primary — slightly lighter on dark UI for readability */
    --primary: 162 68% 50%;
    --primary-foreground: 0 0% 100%;
    --primary-soft: 162 28% 18%;
    --primary-soft-foreground: 162 40% 90%;

    /* Secondary */
    --secondary: oklch(0.28 0.006 264);
    --secondary-foreground: oklch(0.97 0 0);
    --secondary-soft: oklch(0.32 0.008 264);
    --secondary-soft-foreground: oklch(0.91 0.005 264);

    /* Backgrounds */
    --background: oklch(0.17 0.012 243); /* #141a21 */
    --foreground: oklch(0.97 0 0);

    /* Card / Paper */
    --card: oklch(0.22 0.013 243); /* #1c252e */
    --card-foreground: oklch(0.97 0 0);

    /* Popover */
    --popover: oklch(0.22 0.013 243);
    --popover-foreground: oklch(0.97 0 0);

    /* Muted */
    --muted: oklch(0.28 0.01 243);
    --muted-foreground: oklch(0.6 0.012 243);

    /* Accent */
    --accent: oklch(0.28 0.01 243);
    --accent-foreground: oklch(0.97 0 0);

    /* Destructive */
    --destructive: oklch(0.65 0.2 25);
    --destructive-foreground: oklch(1 0 0);

    /* Info */
    --info: oklch(0.74 0.13 210);
    --info-foreground: oklch(0.19 0.04 210);
    --info-soft: oklch(0.3 0.05 210);
    --info-soft-foreground: oklch(0.87 0.06 210);

    /* Success */
    --success: oklch(0.76 0.17 155);
    --success-foreground: oklch(0.19 0.04 155);
    --success-soft: oklch(0.3 0.06 155);
    --success-soft-foreground: oklch(0.88 0.07 155);

    /* Warning */
    --warning: oklch(0.82 0.15 75);
    --warning-foreground: oklch(0.19 0.04 75);
    --warning-soft: oklch(0.32 0.06 75);
    --warning-soft-foreground: oklch(0.91 0.07 75);

    /* Border / Input / Ring — softer edges on dark */
    --border: oklch(1 0 0 / 8%);
    --input: oklch(1 0 0 / 12%);
    --ring: 162 68% 50%;

    /* Charts */
    --chart-1: oklch(0.905 0.182 98.111);
    --chart-2: oklch(0.795 0.184 86.047);
    --chart-3: oklch(0.681 0.162 75.834);
    --chart-4: oklch(0.554 0.135 66.442);
    --chart-5: oklch(0.476 0.114 61.907);

    /* Sidebar */
    --sidebar: oklch(0.22 0.013 243);
    --sidebar-foreground: oklch(0.97 0 0);
    --sidebar-primary: 162 68% 50%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: oklch(0.28 0.01 243);
    --sidebar-accent-foreground: oklch(0.97 0 0);
    --sidebar-border: oklch(1 0 0 / 8%);
    --sidebar-ring: 162 68% 50%;

    --shadow-surface: 0 1px 2px oklch(0 0 0 / 0.22);
    --shadow-float:
        0 1px 2px oklch(0 0 0 / 0.26), 0 4px 12px oklch(0 0 0 / 0.2);

    /* Document discussions — chat panel */
    --chat-panel-bg: oklch(0.2 0.01 243);
    --chat-panel-dot: oklch(0.32 0.008 243);
    --chat-panel-border: oklch(1 0 0 / 10%);
    --chat-composer-bg: oklch(0.19 0.012 243 / 0.96);
    --chat-composer-border: oklch(1 0 0 / 10%);
    --chat-bubble-own-bg: oklch(0.32 0.055 155);
    --chat-bubble-own-fg: oklch(0.94 0.02 155);
    --chat-bubble-own-name: oklch(0.9 0.04 155);
    --chat-bubble-own-divider: oklch(0.4 0.05 155 / 0.55);
    --chat-bubble-own-badge-bg: oklch(0.26 0.04 155 / 0.65);
    --chat-bubble-own-badge-border: oklch(0.45 0.06 155 / 0.5);
    --chat-bubble-own-badge-fg: oklch(0.88 0.03 155);
    --chat-bubble-own-meta: oklch(0.78 0.03 155 / 0.9);
    --chat-bubble-other-bg: oklch(0.26 0.013 243);
    --chat-bubble-shadow: 0 1px 3px oklch(0 0 0 / 0.35);
}

/* ══════════════════════════════════════════════════════
   BASE
   ══════════════════════════════════════════════════════ */
@layer base {
    * {
        @apply border-border outline-ring/50;
    }
    body {
        @apply bg-background text-foreground;
        -webkit-font-smoothing: antialiased;
        font-feature-settings: 'cv11', 'ss01';
    }
    h1,
    h2 {
        @apply font-extrabold tracking-tight;
    }
    h3,
    h4 {
        @apply font-bold;
    }
    h5,
    h6 {
        @apply font-semibold;
    }
}

@keyframes mui-ripple {
    0% {
        transform: scale(0);
        opacity: 0.35;
    }
    100% {
        transform: scale(2.8);
        opacity: 0;
    }
}

.ui-ripple-host {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.ui-global-ripple {
    position: absolute;
    border-radius: 9999px;
    pointer-events: none;
    transform: scale(0);
    opacity: 0.35;
    background-color: currentColor;
    animation: mui-ripple 550ms ease-out;
}

/* ══════════════════════════════════════════════════════
   UTILITIES
   ══════════════════════════════════════════════════════ */

/* Primary */
@utility bg-primary {
    background-color: hsl(var(--primary));
}
@utility text-primary {
    color: hsl(var(--primary));
}
@utility border-primary {
    border-color: hsl(var(--primary));
}
@utility bg-primary-soft {
    background-color: hsl(var(--primary-soft));
}
@utility text-primary-soft {
    color: hsl(var(--primary-soft-foreground));
}
@utility border-primary-soft {
    border-color: hsl(var(--primary-soft));
}

/* Secondary */
@utility bg-secondary-soft {
    background-color: var(--secondary-soft);
}
@utility text-secondary-soft {
    color: var(--secondary-soft-foreground);
}
@utility border-secondary-soft {
    border-color: var(--secondary-soft);
}

/* Info */
@utility bg-info {
    background-color: var(--info);
}
@utility text-info {
    color: var(--info-foreground);
}
@utility border-info {
    border-color: var(--info);
}
@utility bg-info-soft {
    background-color: var(--info-soft);
}
@utility text-info-soft {
    color: var(--info-soft-foreground);
}
@utility border-info-soft {
    border-color: var(--info-soft);
}

/* Success */
@utility bg-success {
    background-color: var(--success);
}
@utility text-success {
    color: var(--success-foreground);
}
@utility border-success {
    border-color: var(--success);
}
@utility bg-success-soft {
    background-color: var(--success-soft);
}
@utility text-success-soft {
    color: var(--success-soft-foreground);
}
@utility border-success-soft {
    border-color: var(--success-soft);
}

/* Warning */
@utility bg-warning {
    background-color: var(--warning);
}
@utility text-warning {
    color: var(--warning-foreground);
}
@utility border-warning {
    border-color: var(--warning);
}
@utility bg-warning-soft {
    background-color: var(--warning-soft);
}
@utility text-warning-soft {
    color: var(--warning-soft-foreground);
}
@utility border-warning-soft {
    border-color: var(--warning-soft);
}

/* Destructive soft */
@utility bg-destructive-soft {
    background-color: oklch(from var(--destructive) l c h / 0.12);
}
@utility text-destructive-soft {
    color: var(--destructive);
}
@utility border-destructive-soft {
    border-color: oklch(from var(--destructive) l c h / 0.3);
}

/* Helpers Minimal */
@utility bg-paper {
    background-color: var(--card);
}

@utility shadow-card {
    box-shadow:
        0 0 2px 0 oklch(0.5 0.015 243 / 20%),
        0 12px 24px -4px oklch(0.5 0.015 243 / 12%);
}

@utility shadow-card-hover {
    box-shadow:
        0 0 2px 0 oklch(0.5 0.015 243 / 20%),
        0 20px 40px -4px oklch(0.5 0.015 243 / 15%);
}
