/**************************************************
PHOENIX BIGO — BASE.CSS
Global Reset + Phoenix Color System + Foundations
**************************************************/

/* ==============================================
COLOR SYSTEM
============================================== */

:root{

    /* Phoenix Primary */
    --phoenix-primary:#f97316;

    /* Hover */
    --phoenix-primary-hover:#ea580c;

    /* Light Background */
    --phoenix-background:#fff7ed;

    /* Surface */
    --phoenix-surface:#ffffff;

    /* Border */
    --phoenix-border:#fed7aa;

    /* Text Primary */
    --phoenix-text:#111827;

    /* Text Secondary */
    --phoenix-text-secondary:#6b7280;

    /* Shadow */
    --phoenix-shadow:0 2px 8px rgba(0,0,0,0.06);

}


/* ==============================================
RESET
============================================== */

*,
*::before,
*::after{

    box-sizing:border-box;

    margin:0;

    padding:0;

}


/* ==============================================
HTML / BODY
============================================== */

html{

    -webkit-text-size-adjust:100%;

}


body{

    background:var(--phoenix-background);

    font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif;

    font-size:14px;

    line-height:1.5;

    color:var(--phoenix-text);

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}


/* ==============================================
LINKS
============================================== */

a{

    text-decoration:none;

    color:inherit;

    transition:color 0.2s ease;

}


a:hover{

    color:var(--phoenix-primary);

}


/* ==============================================
IMAGES
============================================== */

img{

    display:block;

    max-width:100%;

    height:auto;

}


/* ==============================================
BUTTON RESET
============================================== */

button{

    font-family:inherit;

    border:none;

    background:none;

    cursor:pointer;

}


/* ==============================================
INPUT RESET
============================================== */

input,
textarea,
select{

    font-family:inherit;

    font-size:inherit;

    border:none;

    outline:none;

}


/* ==============================================
LIST RESET
============================================== */

ul,
ol{

    list-style:none;

}


/* ==============================================
SELECTION
============================================== */

::selection{

    background:var(--phoenix-primary);

    color:#ffffff;

}


/* ==============================================
SCROLLBAR (Modern)
============================================== */

::-webkit-scrollbar{

    width:8px;

}


::-webkit-scrollbar-thumb{

    background:var(--phoenix-border);

    border-radius:10px;

}


::-webkit-scrollbar-thumb:hover{

    background:var(--phoenix-primary);

}