/**
 * NextLVL — Global frontend styles.
 *
 * Shared CSS variables, resets, and utility classes
 * used across all widgets.
 *
 * @package NextLVL
 */

/* ==========================================================================
   CSS Custom Properties (Design Tokens)
   ========================================================================== */

:root {
    /* Colors */
    --nextlvl-primary: #3b82f6;
    --nextlvl-primary-hover: #2563eb;
    --nextlvl-secondary: #64748b;
    --nextlvl-accent: #8b5cf6;
    --nextlvl-success: #22c55e;
    --nextlvl-warning: #f59e0b;
    --nextlvl-error: #ef4444;
    --nextlvl-text: #1e293b;
    --nextlvl-text-muted: #94a3b8;
    --nextlvl-bg: #ffffff;
    --nextlvl-bg-alt: #f8fafc;
    --nextlvl-border: #e2e8f0;

    /* Typography */
    --nextlvl-font-family: inherit;
    --nextlvl-font-size-xs: 0.75rem;
    --nextlvl-font-size-sm: 0.875rem;
    --nextlvl-font-size-base: 1rem;
    --nextlvl-font-size-lg: 1.125rem;
    --nextlvl-font-size-xl: 1.25rem;
    --nextlvl-font-size-2xl: 1.5rem;
    --nextlvl-font-size-3xl: 1.875rem;

    /* Spacing */
    --nextlvl-space-xs: 0.25rem;
    --nextlvl-space-sm: 0.5rem;
    --nextlvl-space-md: 1rem;
    --nextlvl-space-lg: 1.5rem;
    --nextlvl-space-xl: 2rem;
    --nextlvl-space-2xl: 3rem;

    /* Border Radius */
    --nextlvl-radius-sm: 0.25rem;
    --nextlvl-radius-md: 0.5rem;
    --nextlvl-radius-lg: 0.75rem;
    --nextlvl-radius-full: 9999px;

    /* Shadows */
    --nextlvl-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --nextlvl-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --nextlvl-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);

    /* Transitions */
    --nextlvl-transition-fast: 150ms ease;
    --nextlvl-transition-base: 250ms ease;
    --nextlvl-transition-slow: 350ms ease;
}

/* ==========================================================================
   Base Widget Reset
   ========================================================================== */

[class^="nextlvl-"],
[class*=" nextlvl-"] {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

[class^="nextlvl-"] *,
[class*=" nextlvl-"] * {
    box-sizing: border-box;
}
