/*
Theme Name:  Filmy Network
Theme URI:   https://filmynetwork.com
Author:      Filmy Network Team
Author URI:  https://filmynetwork.com
Description: A premium dark cinematic media platform theme for Filmy Network — fully responsive, IMDb-inspired UI for movies, people, reviews and more.
Version:     2.3.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.1
License:     Proprietary
Text Domain: filmy-network
Tags:        cinema, dark, responsive, entertainment, movies
*/

/* ==========================================================================
   FILMY NETWORK — Design System: CSS Custom Properties (Dark Cinematic)
   All component and layout styles live in assets/css/main.css.
   This file contains only the mandatory theme header and global tokens.
   ========================================================================== */

:root {
    /* Colour palette */
    --fn-bg-primary:        #0a0a0f;
    --fn-bg-secondary:      #12121a;
    --fn-bg-tertiary:       #181824;
    --fn-bg-card:           #14141e;
    --fn-bg-card-hover:     #1c1c2b;
    --fn-bg-input:          #161622;
    --fn-border:            #262638;
    --fn-border-subtle:     #1c1c28;
    --fn-border-focus:      #e50914;

    /* Brand Accents */
    --fn-red:               #e50914;
    --fn-red-dark:          #b80710;
    --fn-red-hover:         #f40612;
    --fn-red-subtle:        rgba(229, 9, 20, 0.12);

    --fn-gold:              #f5c518;
    --fn-gold-dark:         #d4a800;
    --fn-gold-light:        #ffd740;
    --fn-gold-subtle:       rgba(245, 197, 24, 0.12);

    --fn-green:             #43a047;
    --fn-blue:              #1e88e5;

    --fn-text-primary:      #f0f0f5;
    --fn-text-secondary:    #a0a0b8;
    --fn-text-tertiary:     #8e8ea6;
    --fn-text-inverse:      #0a0a0f;

    /* Aspect Ratios */
    --fn-aspect-poster:     2 / 3;
    --fn-aspect-backdrop:   16 / 9;
    --fn-aspect-square:     1 / 1;

    --fn-border-width:      1px;

    /* Typography */
    --fn-font-sans:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --fn-font-display: 'Montserrat', 'Inter', sans-serif;
    --fn-font-mono:    'JetBrains Mono', 'Fira Code', monospace;

    --fn-text-xs:   0.75rem;
    --fn-text-sm:   0.875rem;
    --fn-text-base: 1rem;
    --fn-text-lg:   1.125rem;
    --fn-text-xl:   1.25rem;
    --fn-text-2xl:  1.5rem;
    --fn-text-3xl:  1.875rem;
    --fn-text-4xl:  2.25rem;
    --fn-text-5xl:  3rem;

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

    --fn-leading-tight:   1.25;
    --fn-leading-snug:    1.375;
    --fn-leading-normal:  1.5;
    --fn-leading-relaxed: 1.625;

    /* Spacing (8-pt grid) */
    --fn-space-1:  0.25rem;
    --fn-space-2:  0.5rem;
    --fn-space-3:  0.75rem;
    --fn-space-4:  1rem;
    --fn-space-5:  1.25rem;
    --fn-space-6:  1.5rem;
    --fn-space-8:  2rem;
    --fn-space-10: 2.5rem;
    --fn-space-12: 3rem;
    --fn-space-16: 4rem;
    --fn-space-20: 5rem;

    /* Borders & Radii */
    --fn-radius-sm:   4px;
    --fn-radius-md:   8px;
    --fn-radius-lg:   12px;
    --fn-radius-xl:   16px;
    --fn-radius-full: 9999px;

    /* Shadows */
    --fn-shadow-sm:   0 1px 3px rgba(0,0,0,.5);
    --fn-shadow-md:   0 4px 16px rgba(0,0,0,.6);
    --fn-shadow-lg:   0 8px 32px rgba(0,0,0,.75);
    --fn-shadow-glow: 0 0 20px rgba(245,197,24,.15);

    /* Transitions */
    --fn-transition-fast: 150ms ease;
    --fn-transition-base: 250ms ease;
    --fn-transition-slow: 400ms ease;

    /* Layout */
    --fn-container-sm:  640px;
    --fn-container-md:  768px;
    --fn-container-lg:  1024px;
    --fn-container-xl:  1280px;
    --fn-container-2xl: 1536px;

    --fn-header-height: 64px;
    --fn-sidebar-width: 280px;
    --fn-z-header:      100;
    --fn-z-overlay:     200;
    --fn-z-modal:       300;
    --fn-z-toast:       400;
}