* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background: linear-gradient(180deg, #0F172A 44.6%, #13151A 100%);
  min-height: 100vh;
}

:root {

    --brb-white: #FFFFFF;
    --brb-blue: #2353AC;
    --brb-blue-light: #6D7DCD;
    --brb-blue-dark: #334155;
    --brb-dark: #33424B;
    --brb-darker: #1E1E1E;
    --brb-gray: #ABAFB1;
    --brb-gray-light: rgba(239, 241, 249, 0.6);
    --brb-gray-dark: #5E6366;
    --brb-red: #EE1F1F;

    --font-medium-28: 500 28px / 110% "Montserrat Medium";

    --font-semi-bold-49: 600 49px / 130% "Montserrat SemiBold";

    --font-inter-10: 400 10px / 100% "Inter";
    --font-inter-12: 400 12px / 100% "Inter";
    --font-inter-14: 400 14px / 100% "Inter";
    --font-inter-16: 400 16px / 100% "Inter";
    --font-inter-20: 400 20px / 100% "Inter";

    /* Toasts */
    --dxp-s-body-font-size: 16px;
    --dxp-s-body-font-family:  "Inter";
    --dxp-g-heading-font-family:  "Inter";
    --dxp-s-body-line-height: 100%;

    --lwc-inputStaticTextTransform: uppercase;

}

/* ==========================================================================
   FONT
   ========================================================================== */

@font-face {
    font-family: "Inter";
    src: url("..font/Inter/Inter_18pt-Regular.ttf") format("truetype"),
        url("../font/Inter/Inter_18pt-Regular.ttf") format("truetype");
}

@font-face {
    font-family: "Montserrat Medium";
    src: url("../font/Montserrat/Montserrat-Medium.ttf") format("truetype"),
        url("../font/Montserrat/Montserrat-Medium.ttf") format("truetype");
}

@font-face {
    font-family: "Montserrat SemiBold";
    src: url("../font/Montserrat/Montserrat-SemiBold.ttf") format("truetype"),
        url("../font/Montserrat/Montserrat-SemiBold.ttf") format("truetype");
}

h1 {
  font: var(--font-medium-28);
  color: var(--brb-blue);
}

h2 {
  font: var(--font-semi-bold-49);
  color: var(--brb-blue);
}

p {
  margin-top: 8px;
  font: var(--font-inter-14);
  line-height: 130%;
  color: var(--brb-blue-dark);
}

p.font-16 { font: var(--font-inter-16); line-height: 150%; }

.uppercase { text-transform: uppercase; }

/* ==========================================================================
   BUTTON
   ========================================================================== */

.bar {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 11px;
}

button {
  width: 100%;
  max-width: 353px;
  height: 58px;
  border-radius: 12px;
  padding: 17px 16px;
  font: var(--font-inter-20);
  color: var(--brb-white);
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-transform: capitalize;
  white-space: nowrap;
  user-select: none;
  cursor: pointer;
}

button.blue { background-color: var(--brb-blue); }
button.dark { background-color: var(--brb-dark); }


/* ==========================================================================
   Input
   ========================================================================== */

input.bourbon { 
    height: 19px;
    max-height: 19px;
    min-height: 19px;
    font: var(--font-inter-16);
    color: var(--brb-dark);
    background: transparent !important;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

input.bourbon::placeholder {
    font: var(--font-inter-20);
    color: var(--brb-gray);
    text-decoration: none;
    text-transform: none;
}

input.bourbon:hover,
input.bourbon:focus {
    outline: none;
    border: none;
}

input.bourbon:disabled {
    background-color: var(--brb-gray-light);
    cursor: not-allowed;
    opacity: 0.7;
}

input.bourbon.input-error,
input.bourbon.input-error:hover,
input.bourbon.input-error:focus {
    border: none;
}

input.bourbon:focus,
input.bourbon:focus-visible {
    outline: none !important;
    outline-width: 0 !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

input.bourbon:focus {
    outline: 2px solid #007bff;
    outline-offset: 2px;
}

input.bourbon:disabled {
    background-color: var(--brb-gray-light);
    cursor: not-allowed;
    opacity: 0.7;
}


/* ==========================================================================
   CHECKBOX
   ========================================================================== */

.checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
}

.checkbox input[type="checkbox"] {
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid var(--brb-blue-light);
    border-radius: 4px;
    margin: 0;
    flex-shrink: 0;
    background: var(--brb-white);
    cursor: pointer;
    position: relative;
    transition: all 0.15s ease;
}

.checkbox.darker input[type="checkbox"] {
    border: 1px solid var(--brb-blue-darker);
}

.checkbox.small input[type="checkbox"] {
    width: 13px;
    height: 13px;
}

.checkbox input[type="checkbox"]:checked {
    background: var(--brb-blue) url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik05IDFMMy41IDYuNUwxIDQiIHN0cm9rZT0iI0IwQ0FEOSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==") no-repeat center;
    background-size: 12px;
    border-color: var(--brb-blue);
}

.checkbox.small input[type="checkbox"]:checked {
    background-size: 8px;
}


/* ==========================================================================
   RADIO
   ========================================================================== */

.radio-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
}

.radio-wrapper {
    display: flex;
}

.radio {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.radio input[type="radio"] {
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid var(--brb-blue-light);
    border-radius: 4px;
    margin: 0;
    flex-shrink: 0;
    background: var(--brb-white);
    cursor: pointer;
    transition: all 0.15s ease;
}

.radio input[type="radio"]:checked {
    background: var(--brb-blue) url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik05IDFMMy41IDYuNUwxIDQiIHN0cm9rZT0iI0IwQ0FEOSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==") no-repeat center;
    background-size: 12px;
    border-color: var(--brb-blue);
}

.radio label {
    cursor: pointer;
    font: var(--font-inter-16);
    color: var(--brb-blue-dark);
}


/* ==========================================================================
   Misc
   ========================================================================== */

.padding-top-10 { padding-top: 10px; }
.margin-bottom-24 { padding-bottom: 24px; }
.margin-bottom-8 { padding-bottom: 8px; }


/* ==========================================================================
   Errors
   ========================================================================== */

.error {
    padding-top: 2px;
    color: var(--brb-red);
    font: var(--font-inter-12);
}


/* ==========================================================================
   TOASTS
   ========================================================================== */

   .slds-notify--toast, .slds-notify_toast { justify-content: center; }
   .slds-icon-utility-error { display: none; }
   .slds-notify__close { display: none; }

