:root {
    /* FONTS */
    --system-fonts: "Inter", -apple-system, BlinkMacSystemFont, Arial, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

    /* LAYOUT */
    --top-nav-height: 50px;
    --main-nav-height: 80px;

    /* THEME (default = dark) */
    --page-bg: #151b28;
    --page-text: #ffffff;
    --border-color: rgba(255, 255, 255, 0.10);

    --top-nav-bg: rgba(12, 15, 20, 1);
    --surface-bg: #111418;
    --menu-bg: rgba(11, 16, 26, 1);
    --submenu-bg: rgb(23, 29, 41);

    --accent: #00D5F6;
    --accent-soft: rgba(0, 213, 246, 0.50);

    --primary-btn-bg: linear-gradient(180deg, #00D5F6 0%, #0080FF 100%);
    --primary-btn-text: #1a1f2e;
    --primary-btn-border-color: 1.5px solid #00D5F6;
    
    --hover: rgba(11, 16, 26, 0.25); ;

    --secondary-btn-text: #ffffff;

    /* drop-shadow(0px 0px 4px rgba(0, 225, 255, 0.842)); */
}

/* Light theme overrides */
:root[data-theme="light"] {
    --page-bg: rgba(237, 237, 234, 1);
    --page-text: #1a1f2e; 
    --border-color: rgba(0, 0, 0, 0.08);

    --top-nav-bg: rgba(255, 255, 255, 1);
    --surface-bg: #ffffff;    
    --menu-bg: rgba(248, 248, 246, 1);
    
    --accent: #00B8D4;
    --accent-soft: rgba(0, 184, 212, 0.15);

    --secondary-btn-text: #1a1f2e;
}