:root {
    --slds-c-radio-color-border: var(--slds-g-color-neutral-base-50, #747474);
    --slds-c-checkbox-color-border: var(--slds-g-color-neutral-base-50, #747474);

    /* Radio/checkbox button border colour when focussed (e.g. tabbed to, but not necessarily selected)*/
    --slds-c-radio-color-border-focus: var(--slds-g-color-neutral-base-50, #747474);
    --slds-c-checkbox-color-border-focus: var(--slds-g-color-neutral-base-50, #747474);

    /* Selected Radio/checkbox button border colour */
    --slds-c-radio-color-border-checked: var(--slds-g-color-neutral-base-50, #747474);
    --slds-c-checkbox-color-border-checked: var(--slds-g-color-neutral-base-50, #747474);

    /* Selected checkbox/radio "background" colour  - this is the colour of either the tick or check*/
    --slds-c-radio-mark-color-foreground: var(--SLDS-Foundation-Blue-50, #007AC2); /* TODO Couldn't find this colour in Salesforce default */
    --slds-c-checkbox-mark-color-foreground: var(--SLDS-Foundation-Blue-50, #007AC2);

    --lic-component-border-colour: var(--Brand-Primary-Light-Sky, #CBDBEF);

    --slds-c-listbox-option-color-background-hover: var(--Brand-Primary-Light-Sky, #CBDBEF); /*Currently used on the search category dropdown hover */

    --slds-c-input-color-border:  var(--slds-g-color-neutral-base-50, #747474);

    --slds-g-color-error-base-40: #BA0517;
    --lwc-colorTextError:  #BA0517;

    --lic-default-text-colour: #001E62;

    --gray-900: #1B1E28;
    --Web-Grey-500: #647092;

    /* Configure product tag pill colours: */
    --green-100: #C8E8C5; /*Background */
    --green-600: #48A23F; /* Cross */
    --green-800: #245120; /* Text */
}
@font-face {
    font-family: 'Urbanist';
    src: url('../LICUrbanistFontFamily/Urbanist-VariableFont_wght.ttf') format('truetype');
}

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

h1, h2, h3, h4, h5, h6 {
    color:  var(--lic-default-text-colour, #001E62);
    letter-spacing: 0px;
    text-box-trim: NONE;
    font-style: normal;
    font-weight: 400;
    font-family: Urbanist, 'sans-serif' !important;
}

h1 {
    font-size: 28px !important;
    font-family: Anton, 'sans-serif'!important;
}
h2 {
    font-size: 24px !important;
    line-height: 42px !important;
}
h3 {
    font-size: 22px !important;
}
h4 {
    font-size: 20px !important; 
    line-height: 34px !important;
}
h5 {
    font-size: 18px !important;
    line-height: 28px !important;
}
h6 {
    font-size: 16px !important;
}

/* Keep this style near the top of css. Sets all padding to 0px on mobile devices (when applied).
General use - apply this to the element to reset their padding to 0px, and then apply any mobile specific padding to the element.*/
.lic-remove-padding-mobile {
    padding: 0px !important;
}


/* Keep below the lic-remove-padding-mobile style */
.lic-padding-top-small-mobile {
    padding-top: 12px !important;
}
/* TURN OFF when go live?? - this hides the scroll bar */
/* body::-webkit-scrollbar {
  display: none; 
} */

/* Footer */
.lic-footer-copyright {
    padding-top: 16px;
}
.lic-footer-container-layout {
    padding: 24px 16px;
}

.lic-footer-links {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem !important;
}

.lic-footer-minda-container {
    padding-top: 12px;
}

.lic-footer-copyright {
    padding-top: 2rem;
}


/* Shop Home page */
.lic-shop-header-container {
    height: auto;
    padding: 24px 16px 16px;
}

.lic-shop-header-heading {
    padding-bottom: 12px;
    display: none;
}

.lic-info-bar-container-home {
    border-bottom: none;
}

.lic-info-bar-container-home, .lic-info-bar-container {
    top: 48px;
    padding-top: 0px;
    border-bottom: none;
}

.lic-info-bar-container {
    flex-direction: column;
}
.lic-info-bar-container > div,
.lic-info-bar-container-home > div {
    width: 100%;
}

.lic-info-bar-container-home > div,
.lic-info-bar-container > div {
    align-items: center;
}

.lic-account-change-component div {
    flex-wrap: nowrap;
    /* Needs a width so that truncate works. */
    width: calc(100vw - 150px);
}

/* Search bar component */
c-search-products .slds-combobox_container div.slds-combobox__form-element.lic-search-input-wrapper {
   max-width: calc(100vw - 220px);
   width: 500px;
   background-color: #FFF;
}
.lic-shop-search-input-text {
    /* Text style */
    /* Positioning + boxes */
    max-width: 100%;
    height: 48px !important;
    padding: 8px 28px 8px 16px !important;

}

.lic-shop-search-remove-icon {
    right: 12px !important;
}

.lic-shop-search-category-select {
    padding-right: 16px !important;
    padding-left: 16px !important;
    /* min-width: auto !important; */
}


/* Info bar */
.lic-info-bar-mobile-hidden {
    /* display: none; */
}
/* .lic-info-bar-container-right-hand-container {
    display: none;
} */
.lic-info-bar-container-right-hand-container-mobile {
    display: flex;
}
.lic-info-bar-search-wrapper-mobile {
    display: flex !important;
    padding: 1rem 0.75rem;
    width: 100%;
    justify-content: center !important;

}
.lic-info-bar-search-category-select, .lic-shop-search-category-select {
    /* On mobile we don't want the category dropdown to change size as it's not so nice on smaller devices.*/
    min-width: 146px !important;
}

.lic-info-bar-search-input-text {
    width: 100% !important;
}

.lic-shop-search-button {
    width: auto;
    padding-left: 8px;
    padding-right: 8px;
}
.lic-shopping-cart-button {
    height: 48px !important;
    width: auto !important;
}

.lic-shopping-cart-button-text {
    display: none;
}

.lic-shopping-cart-content-container {
    gap: 8px;
}

.lic-account-change-account-label {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.lic-change-account-modal-content-container > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.lic-change-account-modal-heading-container {
    padding-top: 12px;
    padding-bottom: 12px;
    /* Box shadow none as product image sits flush with the border */
    box-shadow: none;
    height: auto;
}

.lic-change-account-modal-content-container > div:nth-child(2) {
    padding-top: 32px;
    padding-bottom: 32px;
}

/* Category containers */
.lic-product-card-container,
.lic-category-card-container,
.lic-product-card-container-no-filter,
.lic-category-card-container-no-filter {
    column-gap: 1rem;
    row-gap: 0.75rem;
}

.lic-product-card-container-no-filter, .lic-category-card-container-no-filter {
    grid-template-columns: repeat(auto-fit, minmax(150px, 47%));
}

/* For the smaller phone screens 460px*/
/* @media only screen and (max-width: 28.75rem){ */
    /* This is probably the smallest we need to go - but this allows the margins to look ok at sizes above, whilst ensuring the quality for the smaller phones  */
    /* .lic-product-card-container, .lic-category-card-container {
        grid-template-columns: repeat(auto-fit, minmax(100px, 45%));
    }
} */

.lic-category-card-icon-container {
    width: 32px;
    height: 32px;
}
.lic-category-card-icon-container img {
    max-width: 80%;
}

.lic-browse-products-category-only {
    margin-top: -16px;
}
.lic-browse-products-category-only > div {
    padding-left: 0px;
    padding-bottom: 12px;
}
.lic-browse-products-category-only h1 {
    padding-bottom: 0px;
}
.lic-browse-products-category-only h4 {
    font-weight: 500;
}

.lic-product-category-card {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.lic-product-category-card-text {
    padding-left: 8px !important;
}

/* Product details */

.lic-product-detail-container {
    display: flex;
    flex-direction: column;
    align-items: center !important;
}

.lic-product-detail-container > div {
    width: 100% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.lic-product-detail-button {
    width: auto;
    --slds-c-button-radius-border: 8px !important;
    --slds-c-button-line-height: 1rem !important;
    /* Vertical padding */
    --slds-c-button-spacing-block-start: 1rem !important;
    --slds-c-button-spacing-block-end: 1rem !important;
    /* Horizontal padding */
    --slds-c-button-brand-spacing-inline-start: 1.5rem !important;
    --slds-c-button-brand-spacing-inline-end: 1.5rem !important;
    --slds-c-button-spacing-inline-start: 1.5rem !important; 
    --slds-c-button-spacing-inline-end: 1.5rem !important;
}

.lic-product-detail-image-container {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.lic-product-detail-name {
    padding-bottom: 0px !important;
    line-height: 42px;
}
.lic-product-detail-price {
    padding-bottom: 16px !important;
}

.lic-product-detail-container > div:nth-child(2) {
    padding-top: 8px;
}

.lic-product-information-container {
    padding-top: 16px !important;
}

/* Search Results */
.lic-search-results-heading {
    margin-top: -20px;
}

.lic-search-results-subheading {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.lic-product-card {
    padding: 16px !important;
    height: auto;
    min-height: 200px;
}

.lic-product-card img {
    width: 100%;
    height: auto;
    min-height: 120px;
    object-fit: contain;
}

/* Configure Product */

.slds-modal__container {
    margin: inherit 1rem;
}
c-configure-product .lic-change-account-modal-heading-container {
    padding-left: 16px;
    padding-right: 16px;
}

c-configure-product .lic-product-detail-price {
    padding-bottom: 0px !important;
    font-size: 16px !important;
    line-height: 24px !important;
}

c-configure-product .lic-product-detail-content-wrapper {
    padding-left: 16px;
}

.lic-configure-product-detail-wrapper {
    padding-top: 0px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    flex-direction: column;
    align-items: flex-start;
}

.lic-configure-product-image-wrapper {
    align-self: center;
    min-width: 150px;
    width: 80%
}

.lic-configure-product-attribute-set-wrapper {
    padding: 0px 16px 16px !important;
}

.lic-configure-product-category-wrapper {
    padding-top: 16px !important;
}

.lic-configure-product-category-container {
    padding: 24px 16px !important;
}

.lic-configure-attribute-item-wrapper {
    width: 100%;
}

.lic-tag-type-radio-descriptions {
    display: none;
}

.flex-col_mobile {
    flex-direction: column;
}

.lic-get-available-tags-icon > div {
    max-width: 100% !important;
}

.lic-product-detail-button-wrapper > div {
    padding-top: 0px !important;
}

c-configure-attribute-item .lic-configure-attribute-item-wrapper button,
c-configure-ear-tag-ids-portal .lic-configure-attribute-item-wrapper button,
c-configure-attribute-item .lic-configure-attribute-item-wrapper input,
c-configure-ear-tag-ids-portal .lic-configure-attribute-item-wrapper input {
    /* Bigger field and button sizes for mobile. */
    height: 42px;
}
.lic-configure-attribute-item-wrapper {
    padding-left: 0px !important;
    padding-top: 12px !important;
}

.lic-get-available-tags-icon lightning-button button {
    width: 100%;
    --slds-c-button-radius-border: 4px;
    --slds-c-button-color-background: transparent;

    --slds-c-button-spacing-blockstart: 1rem;
    --slds-c-button-spacing-blockend: 1rem;
    --slds-c-button-spacing-inline-start: 2rem;
    --slds-c-button-spacing-inline-end: 2rem;
    --lwc-lineHeightButton: 1rem;
}

.lic-tag-registry-selected-tags-container-quantity {
    padding-bottom: 0px;
}
.lic-ear-tags-clear-tag-numbers-container {
    padding-top: 8px;
}

.lic-ear-tag-registry-get-tags-description {
    padding-top: 12px;
    margin-bottom: 0px;
}

c-ear-tag-register-ids lightning-radio-group .slds-form-element__control .slds-radio {
    width: auto;
    padding-right: 16px;
}

/* The My reference category has its own specific width override. */
div[data-last-item=true].lic-configure-product-category-container .lic-configure-attribute-item-wrapper {
    width: 100%;
}

/* Order Summary */
c-order-summary .summary-items-p-top-small {
    padding-top: 0 !important; 
} 

c-order-summary .order-items-p-right-large {
    padding-right: 0 !important;
}

c-order-summary .lic-brand-whiteborder-btn-stretch {
    --slds-c-button-spacing-blockstart: 0.156rem !important;
    --slds-c-button-spacing-blockend: 0.156rem !important;
}

c-order-summary .lic-brand-darkskyblue-btn-stretch {
    --slds-c-button-spacing-blockstart: 0.156rem !important;
    --slds-c-button-spacing-blockend: 0.156rem !important;
}

c-order-summary .lic-brand-outline-btn {
    --slds-c-button-spacing-blockstart: 0.156rem !important;
    --slds-c-button-spacing-blockend: 0.156rem !important;
}

.lic-archived-order-product-card-header {
    flex-direction: column;
}

.lic-archived-order-product-card-header-button {
    align-self: flex-start;
}

/* Error pages */
.lic-error-subheading {
    font-weight: 400 !important;
    font-size: 1rem !important; /*16px*/
    line-height: 20px !important;
}

/* Visibility */
.lic-show-desktop {
    display: none !important;
}

.lic-show-mobile {
    display: block !important;
}

.lic-show-flex-mobile {
    display: flex !important;  
}

/** text **/
.lic-text-heading-regular {
    font-weight: 400 !important; 
}

.lic-text-heading-bold {
    font-weight: 700 !important;
}