/*
 * Theme Variables — OnlyFansPorno
 * Design Tokens: Paleta Pink-Red Premium Dark
 */

:root {

    /* ─── Typography ───────────────────────────────────────── */
    --font-family: 'Inter', Arial, 'Helvetica Neue', Helvetica, sans-serif;

    --font-size-xs:   11px;
    --font-size-sm:   12px;
    --font-size-base: 14px;
    --font-size-lg:   16px;
    --font-size-xl:   18px;
    --font-size-2xl:  26px;

    --font-weight-normal:   400;
    --font-weight-medium:   500;
    --font-weight-semibold: 600;
    --font-weight-bold:     700;

    --line-height-tight:   1.25;
    --line-height-normal:  1.5;
    --line-height-relaxed: 1.75;

    /* ─── Brand Colors ──────────────────────────────────────── */
    --color-accent:       #ff2d55;
    --color-accent-glow:  rgba(255, 45, 85, 0.30);

    --color-primary:      #ff2d55;
    --color-primary-glow: rgba(255, 45, 85, 0.25);

    --color-success: #10b981;
    --color-error:   #ef4444;
    --color-warning: #f59e0b;

    /* ─── Gradients ─────────────────────────────────────────── */
    --gradient-primary: linear-gradient(135deg, #ff2d55 0%, #e60040 100%);
    --gradient-accent:  linear-gradient(135deg, #ff2d55 0%, #ff6b35 100%);
    --gradient-pink:    linear-gradient(135deg, #ff2d55 0%, #c0004e 100%);

    /* ─── Backgrounds ───────────────────────────────────────── */
    --bg-body:     #0d0d0f;
    --bg-card:     #18181c;
    --bg-elevated: #222228;
    --bg-input:    #18181c;

    /* ─── Borders ───────────────────────────────────────────── */
    --border-default: #2e2e36;

    /* ─── Text ──────────────────────────────────────────────── */
    --text-primary:   #f0f0f4;
    --text-secondary: #c0c0cc;
    --text-muted:     #8a8a9a;
    --text-inverse:   #0d0d0f;

    /* ─── Spacing ───────────────────────────────────────────── */
    --spacing-xs:  4px;
    --spacing-sm:  8px;
    --spacing-md: 12px;
    --spacing-lg: 20px;
    --spacing-xl: 32px;

    /* ─── Border Radius ─────────────────────────────────────── */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:  12px;
    --radius-full: 9999px;

    /* ─── Transitions ───────────────────────────────────────── */
    --transition-fast:   200ms ease;
    --transition-normal: 350ms ease;

    /* ─── Shadows ───────────────────────────────────────────── */
    --shadow-md:        0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg:        0 8px 24px rgba(0, 0, 0, 0.5);
    --shadow-glow-cyan: 0 0 20px rgba(255, 45, 85, 0.20);

    /* ─── Z-index ───────────────────────────────────────────── */
    --z-sticky: 1000;
}