/* =====================================================
   SPI UI
   File      : core.css
   Version   : 1.0.0
   Author    : StudioProjectID
   Description : Core Reset & Base Style
===================================================== */

/* =====================================================
   RESET
===================================================== */

*,
*::before,
*::after{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* =====================================================
   HTML
===================================================== */

html{

    scroll-behavior:smooth;

    -webkit-text-size-adjust:100%;

}

/* =====================================================
   BODY
===================================================== */

body{

    font-family:"Inter",sans-serif;

    font-size:15px;

    font-weight:400;

    line-height:1.7;

    color:var(--spi-text);

    background:var(--spi-bg);

    overflow-x:hidden;

    text-rendering:optimizeLegibility;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}

/* =====================================================
   HEADINGS
===================================================== */

h1,
h2,
h3,
h4,
h5,
h6{

    color:var(--spi-text);

    font-weight:700;

    line-height:1.3;

    margin:0;

}

p{

    margin:0;

    color:var(--spi-text-secondary);

}

/* =====================================================
   LINK
===================================================== */

a{

    text-decoration:none;

    color:inherit;

    transition:var(--spi-transition);

}

a:hover{

    color:var(--spi-primary);

}

/* =====================================================
   IMAGE
===================================================== */

img{

    display:block;

    max-width:100%;

    height:auto;

}

/* =====================================================
   BUTTON
===================================================== */

button{

    font-family:inherit;

    background:none;

    border:none;

    outline:none;

}

/* =====================================================
   FORM
===================================================== */

input,
textarea,
select{

    font-family:inherit;

    font-size:14px;

    color:var(--spi-text);

    outline:none;

    background:#fff;

}

textarea{

    resize:vertical;

}

/* =====================================================
   PLACEHOLDER
===================================================== */

::placeholder{

    color:var(--spi-text-muted);

    opacity:1;

}

/* =====================================================
   LIST
===================================================== */

ul,
ol{

    list-style:none;

}

/* =====================================================
   TABLE
===================================================== */

table{

    width:100%;

    border-collapse:collapse;

}

/* =====================================================
   HR
===================================================== */

hr{

    border:none;

    border-top:1px solid var(--spi-border);

}

/* =====================================================
   IFRAME
===================================================== */

iframe{

    border:none;

}

/* =====================================================
   FIELDSET
===================================================== */

fieldset{

    border:none;

}

/* =====================================================
   FOCUS
===================================================== */

:focus{

    outline:none;

}

/* =====================================================
   SELECTION
===================================================== */

::selection{

    background:var(--spi-primary);

    color:#fff;

}

/* =====================================================
   SCROLLBAR
===================================================== */

::-webkit-scrollbar{

    width:10px;

    height:10px;

}

::-webkit-scrollbar-track{

    background:#EEF2F7;

}

::-webkit-scrollbar-thumb{

    background:#CBD5E1;

    border-radius:100px;

}

::-webkit-scrollbar-thumb:hover{

    background:#94A3B8;

}

/* =====================================================
   DISABLED
===================================================== */

:disabled{

    cursor:not-allowed;

}

/* =====================================================
   CODE
===================================================== */

code{

    font-family:Consolas, monospace;

    font-size:13px;

}

/* =====================================================
   SVG
===================================================== */

svg{

    display:block;

}

/* =====================================================
   TRANSITION DEFAULT
===================================================== */

button,
a,
input,
textarea,
select{

    transition:var(--spi-transition);

}