@import 'tailwindcss';

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

@theme {
    --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --color-studio-950: #07090E;
    --color-studio-900: #0D111A;
    --color-studio-850: #121824;
    --color-studio-800: #182030;
    --color-studio-700: #222D42;
    --color-studio-600: #334155;
    --color-accent-amber: #F59E0B;
    --color-accent-gold: #FBBF24;
    --color-accent-hover: #D97706;
}

:root {
    color-scheme: dark;
}

body {
    background-color: #0B0F17;
    color: #F1F5F9;
    font-family: var(--font-sans);
}

/* Custom scrollbar for desktop editor */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #0D111A;
}
::-webkit-scrollbar-thumb {
    background: #222D42;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #F59E0B;
}

/* Restrained yellow glows and badges */
.badge-amber {
    background-color: rgba(245, 158, 11, 0.12);
    color: #FBBF24;
    border: 1px solid rgba(245, 158, 11, 0.25);
}

.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background-color: #F59E0B;
    color: #0B0F17;
    font-weight: 600;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    transition: all 0.15s ease-in-out;
}
.btn-primary:hover {
    background-color: #FBBF24;
    box-shadow: 0 0 15px rgba(245, 158, 11, 0.25);
}

.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background-color: #182030;
    color: #F1F5F9;
    border: 1px solid #222D42;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    transition: all 0.15s ease-in-out;
}
.btn-secondary:hover {
    background-color: #222D42;
    border-color: #334155;
}

.studio-card {
    background-color: #121824;
    border: 1px solid #1E293B;
    border-radius: 0.75rem;
}