/* Inter Display Font Face Declarations */

@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Thin.otf') format('truetype'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-ThinItalic.otf') format('truetype'); font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-ExtraLight.otf') format('truetype'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-ExtraLightItalic.otf') format('truetype'); font-weight: 200; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Light.otf') format('truetype'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-LightItalic.otf') format('truetype'); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Regular.otf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Italic.otf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Medium.otf') format('truetype'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-MediumItalic.otf') format('truetype'); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-SemiBold.otf') format('truetype'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-SemiBoldItalic.otf') format('truetype'); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Bold.otf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-BoldItalic.otf') format('truetype'); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-ExtraBold.otf') format('truetype'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-ExtraBoldItalic.otf') format('truetype'); font-weight: 800; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-Black.otf') format('truetype'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter Display'; src: url('../font/InterDisplayFont/InterDisplay-BlackItalic.otf') format('truetype'); font-weight: 900; font-style: italic; font-display: swap; }

:root {
    --font-family-base: 'Inter Display';
    --heading-md-size: 24px; --heading-md-weight: 600; --heading-md-line-height: 26px; --heading-md-letter-spacing: -0.5px;
    --heading-sm-size: 20px; --heading-sm-weight: 600; --heading-sm-line-height: 22px; --heading-sm-letter-spacing: -0.5px;
    --heading-xs-size: 16px; --heading-xs-weight: 600; --heading-xs-line-height: 18px; --heading-xs-letter-spacing: -0.5px;
    --body-lg-size: 18px; --body-lg-weight: 400; --body-lg-medium-weight: 500; --body-lg-line-height: 24px;
    --body-md-size: 16px; --body-md-weight: 400; --body-md-medium-weight: 500; --body-md-line-height: 22px;
    --body-sm-size: 14px; --body-sm-weight: 400; --body-sm-medium-weight: 500; --body-sm-line-height: 20px;
    --body-xs-size: 12px; --body-xs-weight: 400; --body-xs-line-height: 16px;
    --brand-50: #EEF2FF; --brand-100: #E0E7FF; --brand-200: #C7D2FE; --brand-300: #A5B4FC; --brand-400: #818CF8;
    --brand-500: #6366F1; --brand-600: #4F46E5; --brand-700: #4338CA; --brand-800: #3730A3; --brand-900: #312E81;
    --text-neutral-primary: #1E293B; --text-neutral-secondary: #475569; --text-neutral-tertiary: #94A3B8;
    --text-neutral-quaternary: #CBD5E1; --text-neutral-inverse: #FFFFFF; --text-brand-primary: var(--brand-600);
    --background-surface-primary: #FFFFFF; --background-surface-secondary: #F8FAFC; --background-surface-tertiary: #F1F5F9;
    --background-brand-primary: var(--brand-600); --background-brand-subtle: var(--brand-50);
    --border-neutral-primary: #E2E8F0; --border-neutral-secondary: #CBD5E1; --border-brand-primary: var(--brand-600);
    --color-success: #10B981; --color-success-light: #D1FAE5; --color-success-border: #6EE7B7; --color-success-text: #065F46;
    --color-warning: #F59E0B; --color-warning-light: #FEF3C7; --color-warning-border: #FCD34D; --color-warning-text: #92400E;
    --color-danger: #EF4444; --color-danger-light: #FEE2E2; --color-danger-border: #FCA5A5; --color-danger-text: #991B1B;
    --color-info: #3B82F6; --color-info-light: #DBEAFE; --color-info-border: #93C5FD; --color-info-text: #1E40AF;
    --radius-2xs: 10px; --radius-xs: 12px; --radius-sm: 14px; --radius-md: 16px; --radius-xl: 20px; --radius-pill: 1024px;
    --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
    --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
    --shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);
    --shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 8px 10px -6px rgba(15, 23, 42, 0.06);
    --shadow-brand: 0 4px 14px rgba(99, 102, 241, 0.25);
}

html, body {
    font-family: var(--font-family-base) !important;
    font-size: var(--body-md-size); font-weight: var(--body-md-weight);
    line-height: var(--body-md-line-height); color: var(--text-neutral-primary);
    font-feature-settings: 'ss01' on, 'cv05' on, 'cv06' on, 'cv08' on, 'cv11' on;
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

* { font-family: var(--font-family-base); font-feature-settings: 'ss01' on, 'cv05' on, 'cv06' on, 'cv08' on, 'cv11' on; }

.fs-10 { font-size: 10px !important; line-height: 14px !important; }
.fs-12 { font-size: 12px !important; line-height: 16px !important; }
.fs-14 { font-size: 14px !important; line-height: 20px !important; }
.fs-16 { font-size: 16px !important; line-height: 22px !important; }
.fs-18 { font-size: 18px !important; line-height: 24px !important; }
.fs-20 { font-size: 20px !important; line-height: 22px !important; letter-spacing: -0.5px !important; }
.fs-22 { font-size: 22px !important; line-height: 26px !important; letter-spacing: -0.5px !important; }
.fs-24 { font-size: 24px !important; line-height: 26px !important; letter-spacing: -0.5px !important; }
.fs-28 { font-size: 28px !important; line-height: 32px !important; letter-spacing: -0.5px !important; }
.fs-30 { font-size: 30px !important; line-height: 36px !important; letter-spacing: -0.5px !important; }

.fw-100 { font-weight: 100 !important; } .fw-200 { font-weight: 200 !important; } .fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; } .fw-500 { font-weight: 500 !important; } .fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; } .fw-800 { font-weight: 800 !important; } .fw-900 { font-weight: 900 !important; }

.text-black { color: var(--text-neutral-primary) !important; }
.text-primary { color: var(--text-brand-primary) !important; }
.text-secondary { color: var(--text-neutral-secondary) !important; }
.text-tertiary { color: var(--text-neutral-tertiary) !important; }
.text-quaternary { color: var(--text-neutral-quaternary) !important; }
.text-white { color: #FFFFFF !important; }
.text-bold { font-weight: 600 !important; }
.text-normal { font-weight: 400 !important; }
.text-danger { color: var(--color-danger) !important; }
.text-purple { color: var(--brand-600) !important; }
.text-blue { color: var(--color-info) !important; }
.text-yellow { color: var(--color-warning) !important; }
.text-green { color: var(--color-success) !important; }
.text-red { color: var(--color-danger) !important; }
.text-placeholder { color: var(--text-neutral-tertiary) !important; }
.error-text { color: var(--color-danger); }

.heading-md { font-family: var(--font-family-base); font-size: var(--heading-md-size); font-weight: var(--heading-md-weight); line-height: var(--heading-md-line-height); letter-spacing: var(--heading-md-letter-spacing); color: var(--text-neutral-primary); }
.heading-sm { font-family: var(--font-family-base); font-size: var(--heading-sm-size); font-weight: var(--heading-sm-weight); line-height: var(--heading-sm-line-height); letter-spacing: var(--heading-sm-letter-spacing); color: var(--text-neutral-primary); }
.heading-xs { font-family: var(--font-family-base); font-size: var(--heading-xs-size); font-weight: var(--heading-xs-weight); line-height: var(--heading-xs-line-height); letter-spacing: var(--heading-xs-letter-spacing); color: var(--text-neutral-primary); }

.body-lg { font-size: var(--body-lg-size); font-weight: var(--body-lg-weight); line-height: var(--body-lg-line-height); }
.body-md { font-size: var(--body-md-size); font-weight: var(--body-md-weight); line-height: var(--body-md-line-height); }
.body-sm { font-size: var(--body-sm-size); font-weight: var(--body-sm-weight); line-height: var(--body-sm-line-height); }
.body-xs { font-size: var(--body-xs-size); font-weight: var(--body-xs-weight); line-height: var(--body-xs-line-height); }

p, span, div, a, button, input, textarea, select, label { font-family: var(--font-family-base); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-family-base); letter-spacing: -0.5px; }