/*==========================================================
    Binarylogin
    variables.css
==========================================================*/

/*====================================
    Theme Variables
====================================*/

:root{

    /* Primary Colors */

    --primary:#0D6EFD;
    --primary-light:#4D9BFF;
    --primary-dark:#0047B3;

    /* Secondary */

    --secondary:#00BCD4;
    --secondary-light:#4DDFF1;
    --secondary-dark:#0097A7;

    /* Status Colors */

    --success:#198754;
    --warning:#FFC107;
    --danger:#DC3545;
    --info:#0DCAF0;

    /* Neutral Colors */

    --white:#FFFFFF;
    --black:#000000;

    --dark:#081423;
    --dark-2:#11243C;
    --dark-3:#1E293B;

    --light:#F8FAFC;
    --light-2:#EEF3F8;
    --light-3:#E5E7EB;

    --gray:#6C757D;
    --gray-light:#ADB5BD;
    --gray-dark:#495057;

    /* Text */

    --text-primary:#081423;
    --text-secondary:#555555;
    --text-light:#777777;

    /* Borders */

    --border:#E5E7EB;
    --border-dark:#D6DCE3;

    /* Background */

    --body-bg:#FFFFFF;
    --section-bg:#F8FAFC;
    --card-bg:#FFFFFF;

    /* Gradient */

    --gradient-primary:
        linear-gradient(135deg,#0D6EFD,#00BCD4);

    --gradient-dark:
        linear-gradient(135deg,#081423,#11243C);

    --gradient-light:
        linear-gradient(135deg,#F8FAFC,#FFFFFF);

    /* Shadows */

    --shadow-sm:
        0 4px 10px rgba(0,0,0,.08);

    --shadow:
        0 12px 35px rgba(0,0,0,.12);

    --shadow-lg:
        0 20px 60px rgba(0,0,0,.18);

    /* Border Radius */

    --radius-sm:8px;
    --radius:15px;
    --radius-lg:25px;
    --radius-xl:40px;

    /* Spacing */

    --space-xs:5px;
    --space-sm:10px;
    --space-md:20px;
    --space-lg:40px;
    --space-xl:80px;

    /* Navbar */

    --navbar-height:80px;

    /* Buttons */

    --btn-padding:
        14px 35px;

    --btn-radius:50px;

    /* Transition */

    --transition:
        all .35s ease;

    /* Font */

    --font-family:
        'Poppins',
        sans-serif;

    --font-size-xs:12px;
    --font-size-sm:14px;
    --font-size:16px;
    --font-size-lg:18px;
    --font-size-xl:22px;

    --h1:62px;
    --h2:46px;
    --h3:34px;
    --h4:28px;
    --h5:22px;
    --h6:18px;

    /* Z-index */

    --z-dropdown:1000;
    --z-sticky:1020;
    --z-fixed:1030;
    --z-modal:1055;
    --z-tooltip:1080;

}

/*====================================
Typography Helpers
====================================*/

:root{

    --fw-light:300;
    --fw-normal:400;
    --fw-medium:500;
    --fw-semibold:600;
    --fw-bold:700;
    --fw-extrabold:800;

    --line-height:1.7;

}

/*====================================
Animation Variables
====================================*/

:root{

    --animation-fast:.25s;

    --animation-normal:.4s;

    --animation-slow:.8s;

}

/*====================================
Glassmorphism
====================================*/

:root{

    --glass-bg:
        rgba(255,255,255,.12);

    --glass-border:
        rgba(255,255,255,.18);

    --glass-blur:15px;

}

/*====================================
Scrollbar
====================================*/

:root{

    --scrollbar-width:10px;

    --scrollbar-thumb:#0D6EFD;

    --scrollbar-track:#EEF3F8;

}

/*====================================
Container Width
====================================*/

:root{

    --container-width:1200px;

}

/*====================================
Image Radius
====================================*/

:root{

    --image-radius:18px;

}

/*====================================
Card Settings
====================================*/

:root{

    --card-padding:30px;

    --card-radius:18px;

}

/*====================================
Opacity
====================================*/

:root{

    --opacity-light:.75;

    --opacity-medium:.90;

    --opacity-full:1;

}