@font-face {
    font-family: 'Inter';
    src: url('./font/Inter.ttf') format('truetype');
}


:root{
    --font: 'Inter', -apple-system, Arial, Helvetica, sans-serif;

    /* colors  */
    --accent: #0e315b;
    --danger: #dc143c;
    --muted: #d0d7deb3;
    --dark: #09090b;
    --gray: #71717a;
    --white: #ffffff;
    --white-subtle: #ebebf7;

    /* outline */
    --outline-cards: 1px solid #e5e7eb;
    --outline-danger: 1px solid var(--danger);

    /* card shadow  */
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);
    --card-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);

    /* input shadow  */
    --input-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
    --input-shadow-focus: #FFFFFF 0px 0px 0px 0px, #A1A1AA 0px 0px 0px 1px, #0000000D 0px 1px 2px 0px;        

    /* box shadow  */
    --b-shadow: 0px 3px 6px rgba(0, 0, 0, 0.08), 0px 1px 3px rgba(0, 0, 0, 0.05);
    --b-shadw-around: 0 5px 10px rgba(154,160,185,.05), 0 15px 40px rgba(166,173,201,.2);
    --b-shadw-dark:0 5px 10px rgba(103, 121, 190, 0.05), 0 15px 40px rgba(73, 100, 200, 0.104);
    --b-shadw-darker: 0 10px 25px rgba(0, 0, 0, 0.2);
    --b-shadw-inset: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset;

    --btn-padding: 8px 16px;
    --primary-radius: 6px;
    --primary-gap: .5rem;
}

html {
    /* font-size: 16px; */
    overflow-y: scroll;
}

body{
    background: #ffffff;
}