@font-face {
    font-family: "JCBEuroRoman";
    src: url("/sfsites/c/resource/JCBUI/Fonts/JCBEuroRomanRegular.ttf")
        format("truetype");
    font-weight: normal;
    font-style: normal;
}

:root {
    /* COLORS */
    --lwr-color-primary: #fcb026; /* Primary button background */
    --lwr-color-primary-hover: #e19d22; /* Primary button hover background */
    --lwr-color-primary-text: #262626; /* Primary button text color */

    --lwr-color-secondary: #262626; /* Secondary button background */
    --lwr-color-secondary-text: #f2f2f2; /* Secondary button text */

    --lwr-color-text-primary: #262626; /* Primary text color */
    --lwr-color-text-secondary: #666666; /* Secondary text color */
    --lwr-color-text-tertiary: #bcbcbc; /* Tertiary text color */
    --lwr-color-white: #ffffff; /* White text color */
    --lwr-color-black: #000000; /* Black text color */

    --lwr-color-background-primary: #ffffff; /* primary background */
    --lwr-color-background-secondary: #f2f2f2; /* secondary background */
    --lwr-color-background-tertiary: #fdebcb; /* tertiary background */

    --lwr-color-button-disabled: #bcbcbc; /* Disabled button background */
    --lwr-color-button-disabled-text: #666666; /* Disabled button text */

    --lwr-color-error: #e2001a; /* Error */
    --lwr-color-success: #0ea753; /* Success */

    /* FONT */
    --lwr-font-family: "JCBEuroRoman", sans-serif;

    /* Font Sizes */
    --lwr-font-size-6: 6px;
    --lwr-font-size-8: 8px;
    --lwr-font-size-10: 10px;
    --lwr-font-size-12: 12px;
    --lwr-font-size-14: 14px;
    --lwr-font-size-16: 16px;
    --lwr-font-size-18: 18px;
    --lwr-font-size-20: 20px;
    --lwr-font-size-22: 22px;
    --lwr-font-size-24: 24px;
    --lwr-font-size-26: 26px;
    --lwr-font-size-28: 28px;
    --lwr-font-size-30: 30px;
    --lwr-font-size-32: 32px;
    --lwr-font-size-36: 36px;
    --lwr-font-size-40: 40px;
    --lwr-font-size-42: 42px;
    --lwr-font-size-48: 48px;
    --lwr-font-size-56: 56px;
    --lwr-font-size-64: 64px;
    --lwr-font-size-72: 72px;
    --lwr-font-size-25: 25px;
    --lwr-font-size-31: 31px;

    /* Font Weights */
    --lwr-font-weight-regular: 400;
    --lwr-font-weight-medium: 500;
    --lwr-font-weight-semibold: 600;
    --lwr-font-weight-bold: 700;
    --lwr-font-weight-extrabold: 800;

    /* SPACING */
    --lwr-spacing-0: 0px;
    --lwr-spacing-2: 2px;
    --lwr-spacing-4: 4px;
    --lwr-spacing-6: 6px;
    --lwr-spacing-8: 8px;
    --lwr-spacing-10: 10px;
    --lwr-spacing-12: 12px;
    --lwr-spacing-14: 14px;
    --lwr-spacing-16: 16px;
    --lwr-spacing-18: 18px;
    --lwr-spacing-20: 20px;
    --lwr-spacing-22: 22px;
    --lwr-spacing-24: 24px;
    --lwr-spacing-26: 26px;
    --lwr-spacing-28: 28px;
    --lwr-spacing-30: 30px;
    --lwr-spacing-32: 32px;
    --lwr-spacing-34: 34px;
    --lwr-spacing-36: 36px;
    --lwr-spacing-38: 38px;
    --lwr-spacing-40: 40px;
    --lwr-spacing-42: 42px;
    --lwr-spacing-44: 44px;
    --lwr-spacing-46: 46px;
    --lwr-spacing-48: 48px;
    --lwr-spacing-50: 50px;
    --lwr-spacing-52: 52px;

    /* BORDER & RADIUS */
    --lwr-border-radius-4: 4px;
    --lwr-border-radius-6: 6px;
    --lwr-border-radius-8: 8px;
    --lwr-border-radius-10: 10px;
    --lwr-border-radius-12: 12px;
    --lwr-border-width: 1px;
    --lwr-border-color: var(--lwr-color-text-tertiary);

    /* SHADOW */
    --lwr-box-shadow-sm: 0px 2px 4px rgba(0, 0, 0, 0.1);
    --lwr-box-shadow-md: 0px 4px 6px rgba(0, 0, 0, 0.15);
    --lwr-box-shadow-lg: 0px 6px 12px rgba(0, 0, 0, 0.2);

    .slds-icon {
        fill: var(--lwr-color-secondary);
    }
}

body {
    font-family: var(--lwr-font-family);
}