:root {
    --primary-font: 'Lato', Arial, sans-serif;
    --secondary-font: 'Raleway', Helvetica, Arial, sans-serif;
    --nct-green: #3AA43B;
    --nct-dark-green: #00876A;
    --nct-blue: #25A1AC;
    --nct-purple: #85477E;
    --nct-orange: #F49F29;

    /* Styling hooks: Input field */
    --sds-c-input-radius-border: 1.5rem;
    --sds-c-input-color-background: #FAFAFA;
    --sds-c-input-color-border: #C4C4C4;
    --sds-c-input-text-color: #2d2d2d;
    --sds-c-input-spacing-horizontal-start: 1rem;
    --sds-c-input-spacing-horizontal-end: 1rem;
    --sds-c-input-shadow-focus: 0 0 3px #C4C4C4;
    --sds-c-input-color-border-focus: #C4C4C4;

    /* Styling hooks: Select dropdown */
    --sds-c-select-radius-border: 1.5rem;
    --sds-c-select-color-background: #FAFAFA;
    --sds-c-select-color-border: #C4C4C4;
    --sds-c-select-text-color: #2d2d2d;
    --sds-c-select-shadow-focus: 0 0 3px #C4C4C4;
    --sds-c-select-color-border-focus: #C4C4C4;
    --sds-c-select-color-background-focus: #FAFAFA;
    
    /* Styling hooks: Text area (NOT WORKING) */
    --sds-c-textarea-radius-border: 1rem;
    --sds-c-textarea-color-background: #FAFAFA;
    --sds-c-textarea-color-border: #C4C4C4;
    --sds-c-textarea-text-color: #2d2d2d;

    /* Styling hooks: Checkbox */
    --sds-c-checkbox-color-border: #6C6C6C;
    --sds-c-checkbox-radius-border: 1rem;
    --sds-c-checkbox-color-background: #FAFAFA;
    --sds-c-checkbox-color-border-checked: var(--nct-green);
    --sds-c-checkbox-color-background-checked: var(--nct-green);
    --sds-c-checkbox-mark-color-foreground: #FFFFFF;
    --sds-c-checkbox-color-border-focus: #C4C4C4;
    --sds-c-checkbox-shadow-focus: 0 0 3px #C4C4C4;

    /* Styling hooks: Toggle  */
    --sds-c-checkbox-toggle-shadow-focus: 0 0 3px #C4C4C4;
    --sds-c-checkbox-toggle-color-border: #C4C4C4;
    --sds-c-checkbox-toggle-color-background-focus: #C4C4C4;
    --sds-c-checkbox-toggle-color-border-focus: #C4C4C4;
    --sds-c-checkbox-toggle-color-border-checked: #C4C4C4;
    --sds-c-checkbox-toggle-color-background-checked: var(--nct-green);
    --sds-c-checkbox-toggle-color-background-checked-hover: var(--nct-green);
    --sds-c-checkbox-toggle-color-background-checked-focus: var(--nct-green);


    /* Styling hooks: Button  */
    --sds-c-button-brand-color-background: var(--nct-green);
    --sds-c-button-brand-color-border-hover: var(--nct-dark-green);
    --sds-c-button-brand-color-border: var(--nct-green);
    --sds-c-button-brand-color-background-hover: var(--nct-dark-green);
    --sds-c-button-brand-color-background-active: var(--nct-green);
    --sds-c-button-brand-color-border-active: var(--nct-green);
    --sds-c-button-brand-spacing-inline-start: 3.5rem;
    --sds-c-button-brand-spacing-inline-end: 3.5rem;
    --sds-c-button-line-height: 2.5;
    --sds-c-button-brand-text-color: #FFFFFF;
    --sds-c-button-brand-text-color-hover: #FFFFFF;
    --sds-c-button-shadow-focus: 0 0 3px #C4C4C4;
    --sds-c-button-radius-border: 1.5rem;

    --sds-c-button-neutral-color-border-hover: var(--nct-dark-green);
    --sds-c-button-neutral-color-border: var(--nct-green);
    --sds-c-button-neutral-text-color: var(--nct-green);
    --sds-c-button-neutral-text-color-hover: #FFFFFF;
    --sds-c-button-neutral-color-background-hover: var(--nct-dark-green);
    --sds-c-button-text-color: var(--nct-green);
    --sds-c-button-text-color-hover: #FFFFFF;

    /* Styling hooks: Radio buttons  */
    --sds-c-radio-shadow-focus: 0 0 3px #C4C4C4;
    --sds-c-radio-color-border: #6C6C6C;
    --sds-c-radio-color-background: #FAFAFA;
    --sds-c-radio-color-border-checked: var(--nct-green);
    --sds-c-radio-color-background-checked: #FAFAFA;
    --sds-c-radio-mark-color-foreground: var(--nct-green);
    --sds-c-radio-color-border-focus: #C4C4C4;

}

/****** Form Labels ******/
.slds-form-element .slds-form-element__label, .slds-form-element__label {
    font-size: 1rem !important;
    font-family: var(--secondary-font);
    font-weight: 400;
    color: #181818 !important;
    margin-bottom: 0.5rem !important;
    display: inline !important;
}

.slds-form-element .slds-required, .slds-form-element__label .slds-required {
    color: var(--nct-orange);
    font-size: 1rem;
    font-weight: 600;
}
.slds-form-element__label .slds-required {
    font-size: 1.4rem;
    line-height: 0;
}

.slds-form-element__legend {
    float: none !important;
    margin-bottom: 1rem !important;
    font-weight: 500 !important;
}

.slds-form-element {
    grid-gap: 0.5rem; /* Opt in checkbox & label gap */
}

lightning-picklist[data-field="salutation"], lightning-input[data-field="firstName"], lightning-input[data-field="lastName"] {
    width:100%;
}

/****** Input field ******/
.slds-input {
    font-size: 1rem;
    font-family: var(--secondary-font);
    padding-top: 0.3rem !important;
    padding-bottom: 0.3rem !important;
    margin-top: 0.5rem; /* W22 fix */
}

.slds-form-element__group .slds-form-element__row {
    margin-bottom: 1rem;
}

/*** Right-aligned icon within text input ***/
.slds-input-has-icon_right .slds-input__icon {
    width: 1rem;
    height: 1rem;
}

.slds-input-has-icon_right .slds-input__icon .slds-button_icon {
    line-height: 0.5;
    color: var(--nct-green);
}

/*** Error text ***/
.slds-form-element__help, .slds-text-body_small {
    font-size: 0.85rem !important;
    font-family: var(--secondary-font);
}

/****** Textarea ******/
.uiInput--textarea .textarea, .uiInput--textarea.textarea, .slds-textarea {
    font-size: 1rem;
    font-family: var(--secondary-font);
    border-radius: 1rem !important;
    background-color: #FAFAFA !important;
    border-color: #C4C4C4 !important;
    color: #2d2d2d !important;
    margin-top: 0.5rem;
}

.uiInput--textarea .textarea:focus, .uiInput--textarea.textarea:focus, .uiInput--textarea .textarea:active, .uiInput--textarea.textarea:active, .slds-textarea:focus, .slds-textarea:active {
    border-color: #C4C4C4 !important;
    box-shadow: 0 0 3px #C4C4C4 !important;
}


/****** Select / dropdown field ******/
.slds-select_container .slds-select {
    font-size: 1rem;
    font-family: var(--secondary-font);
    padding-top: 0.5rem !important;
    padding-bottom: 0.4rem !important;
    height: auto !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    margin-top: 0.5rem !important;
}

.slds-select_container:before, .slds-select_container:after {
    margin-top: 12px !important;
    margin-bottom: 5px !important;
}

.slds-combobox_container .slds-select, .slds-input_faux {
    font-size: 1rem;
    font-family: var(--secondary-font);
    padding-top: 0.5rem !important;
    padding-bottom: 0.4rem !important;
    height: auto !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    margin-top: 0.5rem !important;
}

.slds-input-has-icon .slds-input__icon {
    margin-top: -0.2375rem !important;    
}

/****** Checkbox ******/
.slds-checkbox .slds-checkbox_faux {    /* Checkbox size overrides */
    width: 1.5rem !important;
    height: 1.5rem !important;
}

.slds-checkbox .slds-checkbox_faux::after {  /* Checkbox tick mark size overrides */
    height: .4rem !important;
    width: 0.8rem !important;
    border-bottom: 3px solid #FFFFFF !important;
    border-left: 3px solid #FFFFFF !important;
}

/****** Radio Button ******/
.slds-radio {
    margin-bottom: 0.5rem !important;
}

.slds-radio .slds-radio_faux {
    width: 1.5rem !important;
    height: 1.5rem !important;
}

.slds-radio [type=radio]:checked+.slds-radio_faux:after, .slds-radio [type=radio]:checked+.slds-radio--faux:after, .slds-radio [type=radio]:checked~.slds-radio_faux:after, .slds-radio [type=radio]:checked~.slds-radio--faux:after, .slds-radio [type=radio]:checked+.slds-radio__label .slds-radio_faux:after, .slds-radio [type=radio]:checked+.slds-radio__label .slds-radio--faux:after {
    width: 1rem !important;
    height: 1rem !important;
}

.slds-radio__label {
    display: flex;
    align-items: flex-start;
    margin-left: 1.5rem;
}

.slds-radio__label .slds-radio_faux {
    margin-top: 0.2rem;
}

/****** Button ******/
.slds-button {
    font-size: 1rem;
    font-family: var(--secondary-font);
}

.nct-base-button button[kx-scope=button][kx-type=underline]:after {
    display: none;
}
 
.nct-base-button button:hover {
    color: var(--nct-dark-green);
    text-decoration: underline;
}

/****** Toggle ******/
.slds-checkbox_toggle {
    justify-content: space-between;
}

/****** Spinner ******/
.slds-spinner_container {
    position: fixed !important;
}

.slds-spinner_brand.slds-spinner:before,
.slds-spinner_brand.slds-spinner:after, 
.slds-spinner_brand .slds-spinner__dot-a:before, 
.slds-spinner_brand .slds-spinner__dot-b:before, 
.slds-spinner_brand .slds-spinner__dot-a:after, 
.slds-spinner_brand .slds-spinner__dot-b:after, 
.slds-spinner--brand.slds-spinner:before, 
.slds-spinner--brand.slds-spinner:after, 
.slds-spinner--brand .slds-spinner__dot-a:before, 
.slds-spinner--brand .slds-spinner__dot-b:before, 
.slds-spinner--brand .slds-spinner__dot-a:after, 
.slds-spinner--brand .slds-spinner__dot-b:after {
    background-color: var(--nct-green) !important;
}

/****** Tabs ******/

.slds-tabs_default__nav {
    gap: 1rem;
    justify-content: center;
}

.slds-tabs_default__item {
    font-weight: 500 !important;
    font-family: var(--secondary-font);
    padding-bottom: 0.5rem;
    margin-bottom: 0px !important;
}

.slds-tabs_default__link {
    color: #222222 !important;
    text-decoration: none !important;
}

.slds-tabs_default__item.slds-is-active a {
    color: var(--nct-dark-green) !important;
    font-weight: 600 !important;
}

.slds-tabs_default__overflow-button {
    width: 0px;
}

/****** Typography ******/
p {
    font-size: 1rem;
    font-family: var(--primary-font);
    font-weight: 300;
    margin-bottom: 1rem !important;
}

a {
    color: var(--nct-green) !important;
    font-weight: 400 !important;
    text-decoration: underline !important;
}

a:hover {
    color: var(--nct-dark-green) !important;
}

.text-dark-green {
    color: var(--nct-dark-green) !important;
}

.text-purple {
    color: var(--nct-purple) !important;
}


h2 {
    font-style: normal !important;
    font-weight: 200 !important;
    font-size: 1.6rem !important;
    font-family: var(--secondary-font) !important;
    margin-bottom: 0.25rem !important;
}

h3 {
    font-style: normal !important;
    font-weight: 300 !important;
    font-size: 1.34rem !important;
    font-family: var(--secondary-font) !important;
    color: var(--nct-dark-green) !important;
    margin: 0.25rem 0 0.25rem 0 !important
}

h4 {
    font-family: var(--secondary-font) !important;
    color: var(--nct-dark-green) !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
    margin-bottom: 0.2rem !important;
}

ul li {
    font-size: 1rem;
    font-family: var(--primary-font);
    font-weight: 300;
    margin-bottom: 1rem !important;
}

small {
    font-size: 0.85rem !important;
}

.margin-top-0 {
    margin-top: 0 !important;
}
.margin-top-1 {
    margin-top: 1rem !important;
}
.margin-top-3 {
    margin-top: 3rem !important;
}
.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.margin-left-2 {
    margin-left: 2rem;
}

/***** Community style overrides ******/
.forceCommunitySection .cb-section_column {
    padding: 0 !important;
}

.cCenterPanel {
    margin-top: 0 !important;
}

@media (min-width:769px) and (max-width:1024px){
    .forceCommunityFlowCommunity .content {  /* Add padding for 1024px */
        padding: 0 3rem;
    }
}

.slds-card__footer.navigationBar {
    border-top: none !important; /* Remove border above screen navigation */
}
