@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --font-family: "Inter", sans-serif; /* new font */
    --transition-speed: ease 0.3s all;
    /*Left side*/
    --primary-color: #7FBC03; /* the first company color*/
    --secondary-color: #218DCD; /* the second company color*/
    --button-text-color: white; /*Button text*/
    --neutral-100: #e6e6e6; /*Text fields/input border color also border color of dropdowns */
    --neutral-400: #999; /*Switch buttons*/
    --neutral-500: #808080; /*In branding - text color*/
    --neutral-black: #000; /*In branding - title color*/
    --error-color: #d00000; /*Error Message*/
    --left-panel-background: #fafafa; /*Main background*/
    --content-background: #fff; /*Background of fields*/
    --left-panel-link-color: #218DCD; /*forgot password link in sign in*, links in register page */
    --left-panel-link-color-hover: #7FBC03;
    --left-panel-button-color: #7FBC03; /*Form button "Sign in"*/
    --left-panel-button-color-hover: #218DCD; /*Hover button "Sign in"*/
    --page-link-color: #808080; /*Links to T&C, Privacy Policy etc.*/
    --page-link-color-hover: #7FBC03; /*Hover effects for smaller links*/
    /*Loader gradient - populated at render-time from branding primary/secondary*/
    --ip-loader-primary: #7ac143;
    --ip-loader-secondary: #0093d0;
    /*-----------------*/
    /*Container Lookup*/
    --cl-background-search-rgb: 0, 109, 155; /*Container Lookup background*/
    --cl-primary-color: #7FBC03;
    --cl-secondary-color-rgb: 33, 141, 205; /*This is secondary color in rgb below is hex*/
    --cl-secondary-color: #218DCD;
    --cl-button-color: #114767; /*It is a 5 times darker color then secondary color - Lookup Button*/
    --cl-result-background: #ffffff; /*Container Lookup Result background*/
    --cl-neutral-30: #f7f7f7; /*Grid row hover (settings-style neutral)*/
    --cl-neutral-60: #f0f0f0; /*Grid header background (settings-style neutral)*/
    --cl-neutral-100: #e6e6e6; /*Separator (line) color, borders*/
    --cl-neutral-200: #ccc; /*Scrollbar hover*/
    --cl-neutral-400: #999; /*Information text*/
    --cl-neutral-500: #808080; /*Text*/
    --cl-neutral-700: #2d2d2d; /*Grid header text (dark neutral, settings-style)*/
    --cl-neutral-black: #000; /*Main text*/
    --cl-button-text-color: white; /*Button text*/
    --cl-skeleton-base: #e8e8e8; /*Loading skeleton shimmer — base shade*/
    --cl-skeleton-highlight: #f5f5f5; /*Loading skeleton shimmer — moving highlight*/
    --cl-search-text: #ffffff; /*Search-box text: title/description/hint on the search background*/
    --cl-success: #28a745; /*Found / success state */
    --cl-error: #d20000; /*Not-found / error state */
    --cl-warning: #b45309; /*Warning text/icon */
    --cl-warning-accent: #f59e0b; /*Warning fill/border */
}

.app__wrapper {
    background-color: #FAFAFA;
    width: 100%;
    height: 100vh; /* or 100% */
    display: flex;
    align-items: center;
}

.bodyLeftPart__wrapper {
    height: 100%;
    width: 35%;
    display: flex;
    flex-direction: column;
    font-family: var(--font-family) !important;
    overflow-y: auto;
}

.bodyLeftPart__wrapper::-webkit-scrollbar,
.cookieConsentBanner__categoryList::-webkit-scrollbar {
    width: 8px !important;
    height: 4px !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .bodyLeftPart__wrapper::-webkit-scrollbar,
    .cookieConsentBanner__categoryList::-webkit-scrollbar {
        width: 8px !important;
        background-color: transparent !important;
    }
}

.bodyLeftPart__wrapper::-webkit-scrollbar-track,
.cookieConsentBanner__categoryList::-webkit-scrollbar-track {
    background-color: #f0f0f0 !important; /* field below scrollbar */
    -webkit-box-shadow: none !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .bodyLeftPart__wrapper::-webkit-scrollbar-track,
    .cookieConsentBanner__categoryList::-webkit-scrollbar-track {
        -webkit-box-shadow: none !important;
        background-color: #f0f0f0 !important; /* Field below scrollbar */
    }
}

.bodyLeftPart__wrapper::-webkit-scrollbar-thumb,
.cookieConsentBanner__categoryList::-webkit-scrollbar-thumb {
    background-color: #CCCCCC !important; /* scrollbar color */
    border-radius: 1rem;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .bodyLeftPart__wrapper::-webkit-scrollbar-thumb,
    .cookieConsentBanner__categoryList::-webkit-scrollbar-thumb {
        background-color: #CCCCCC !important; /* scrollbar color - this show up more often as a setting in browser */
        border-radius: 1rem;
        border: unset;
    }
}

.bodyLeftPart__wrapper::-webkit-scrollbar-thumb:hover,
.cookieConsentBanner__categoryList::-webkit-scrollbar-thumb:hover {
    cursor: pointer;
}

.logo__wrapper {
    margin: 3rem auto 4rem;
}

.logo_image {
    height: 4rem;
    width: fit-content;
    object-fit: cover;
}

.extraInformationBox__wrapper {
    background-color: #FFFFFF;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
    width: 80%;
    padding: 32px;
    margin: 0 auto 2rem;
    border-radius: 0.5rem;
    text-align: center;
}

.extraInformationBox__title {
    color: #000000;
    font-size: 16px;
    font-weight: 500;
    padding: 0;
    margin: 0 0 1rem;
}

.extraInformationBox__text {
    color: #808080;
    font-size: 14px;
    font-weight: 300;
    padding: 0;
    margin: 0;
    line-height: 16.8px;
}

.extraInformationBox__text > a {
    text-decoration: underline;
    transition: var(--transition-speed);
}

.extraInformationBox__text > a:hover {
    font-weight: 500;
    color: #7ac143;
}

.imagePoweredBy__wrapper {
    margin: auto auto 0;
    display: flex;
    flex-direction: column;
    background-color: transparent !important;
}

.imagePoweredBy__container {
    width: 100%;
    margin: auto;
}

.imagePoweredBy {
    height: 3rem;
    width: fit-content;
    object-fit: cover;
}

.bodyRightPart__wrapper {
    width: 75%;
    height: 100%;
    font-family: var(--font-family) !important;
    /*Here is image that will be different for every tenat 
        - this is a image that we see as background on right side*/
    background-image: url('https://static.intermodalportal.com/images/testing-background.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

/*Styles for better responsivness*/
@media(max-width: 1500px) {
    .bodyRightPart__wrapper {
        width: 60%;
    }

    .bodyLeftPart__wrapper {
        width: 40%;
    }
}

/*-- Styles form tablet screen --*/
@media (max-width: 1200px) {
    div#divPartialLookup {
        background: none !important;
    }

    .app__wrapper {
        /*Here is image that will be different for every tenat 
        - this is a image that we see as background on right side*/
        background-image: url('https://static.intermodalportal.com/images/testing-background.jpg');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        height: 100vh;
        flex-direction: column-reverse;
        position: relative;
    }

    .bodyLeftPart__wrapper {
        height: 60%;
        width: 95%;
        margin: 0 auto;
        border-top-left-radius: 2rem;
        border-top-right-radius: 2rem;
        overflow-y: auto;
        background-color: #FAFAFA;
        transition: transform 0.5s ease, height 0.5s ease;
        position: relative;
        z-index: 11;
    }

    .bodyLeftPart__wrapper.fullscreen {
        height: 100vh;
        border-radius: 2rem 2rem 0 0;
    }

    .logo__wrapper {
        margin: 3rem auto;
    }

    .logo_image {
        height: 3.5rem;
    }

    .imagePoweredBy {
        height: 2.5rem;
    }

    .bodyRightPart__wrapper {
        width: 100%;
        height: 40%;
        top: 0;
        transition: height 0.3s ease-in-out;
        background: transparent;
    }

    .app__wrapper.fullscreen .bodyRightPart__wrapper {
        pointer-events: none;
        height: 0;
    }

    .app__wrapper.fullscreen .bodyRightPart__wrapper > .public__container__lookup,
    .app__wrapper.fullscreen .bodyRightPart__wrapper > #ip-pcl-form {
        display: none;
    }

    .grecaptcha-badge {
        z-index: 12;
    }
}

@media (max-width: 700px) {
    .bodyLeftPart__wrapper {
        width: 100%;
    }

    .bodyLeftPart__wrapper.fullscreen {
        border-radius: 0;
    }

    .logo__wrapper {
        margin: 2.5rem auto;
    }

    .logo_image {
        height: 3.5rem;
    }

    .imagePoweredBy {
        height: 2.5rem;
    }

    .extraInformationBox__wrapper {
        padding: 20px;
        width: 90%;
    }

    .extraInformationBox__text {
        font-size: 12px;
    }

    .bodyLeftPart__wrapper::-webkit-scrollbar {
        width: 6px !important;
    }
}

@media (max-width: 380px) {
    .bodyRightPart__wrapper {
        height: 60%;
    }

    .extraInformationBox__wrapper {
        width: unset;
        padding: 16px;
        margin: 0 10px 16px;
    }
}

.signOut__wrapper {
    font-family: var(--font-family);
    background-color: #FAFAFA;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.signOut__container {
    background-color: #FFFFFF;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
    padding: 40px;
    margin: auto;
    border-radius: 0.5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: var(--font-family);
    min-width: 300px;
    max-width: 600px;
    width: 100%;
}

.signOut__title {
    margin: 0 0 1rem;
    padding: 0;
    color: #0093d0;
    font-weight: 600;
    text-align: center;
    font-size: 24px;
}

.signOut__text {
    max-width: 450px;
    font-weight: 400;
    font-size: 14px;
    color: #808080;
    line-height: 19.6px;
    padding: 0;
    margin: 0 0 3rem;
}

.signOut__button {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #7ac143;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    transition: var(--transition-speed);
}

.signOut__button:hover,
.signOut__button:focus {
    box-shadow: inset 0 40px 0 0 #0093d0;
}

.signOutImage__container {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
}

@media (max-width: 700px) {
    .signOut__container {
        padding: 20px 32px;
        margin: auto 24px;
        width: fit-content;
    }
}

@media (max-width: 400px) {
    .signOut__container {
        width: unset;
        padding: 16px 24px;
        margin: auto 10px;
    }

    .signOut__button {
        min-width: 200px;
        font-size: 14px;
        height: 32px;
    }

    .signOut__text {
        font-size: 10px;
        line-height: 16px;
        margin: 0 0 1.5rem;
    }
}

.navBrandImage__container {
    background-color: #FAFAFA;
}

.sessionExpired__wrapper {
    font-family: var(--font-family);
    background-color: #FAFAFA;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.sessionExpired__container {
    background-color: #FFFFFF;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
    padding: 40px;
    margin: auto;
    border-radius: 0.5rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: var(--font-family);
    min-width: 300px;
    max-width: 600px;
    width: 100%;
}

.sessionExpired__title {
    margin: 0 0 1rem;
    padding: 0;
    color: #D00000;
    font-weight: 600;
    text-align: center;
    font-size: 24px;
}

.sessionExpired__text {
    max-width: 450px;
    font-weight: 400;
    font-size: 14px;
    color: #808080;
    line-height: 19.6px;
    padding: 0;
    margin: 0 0 3rem;
}

.sessionExpired__button {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #7ac143;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    transition: var(--transition-speed);
}

.sessionExpired__button:hover,
.sessionExpired__button:focus {
    box-shadow: inset 0 40px 0 0 #0093d0;
}

.sessionExpiredImage__container {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
}

@media (max-width: 700px) {
    .sessionExpired__container {
        padding: 20px 32px;
        margin: auto 24px;
        width: fit-content;
    }
}

@media (max-width: 400px) {
    .sessionExpired__container {
        width: unset;
        padding: 16px 24px;
        margin: auto 10px;
    }

    .sessionExpired__button {
        min-width: 200px;
        font-size: 14px;
        height: 32px;
    }

    .sessionExpired__text {
        font-size: 10px;
        line-height: 16px;
        margin: 0 0 1.5rem;
    }
}

.form__wrapper {
    font-family: var(--font-family);
    background-color: #FFFFFF;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
    width: 80%;
    padding: 40px;
    margin: auto;
    border-radius: 0.5rem;
}

/* Top switch button */
.formSwitch__wrapper {
    display: flex;
    align-items: center;
    margin: 0 auto 2rem;
    width: 100%;
}

.formSwitch__btn,
.formSwitch__btn-active {
    font-size: 20px;
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 2px solid;
    width: 50%;
}

/* When active button */
.formSwitch__btn-active {
    border-color: #7ac143;
    color: #7ac143;
    font-weight: 600;
}

.formSwitch__btn {
    border-color: #E6E6E6;
}

.formSwitch__btn > span {
    color: #999999;
    font-weight: 400;
}

.formSwitch__btn > span:hover {
    color: #0093d0;
    font-weight: 500;
    cursor: pointer;
}

.formSwitch__btn:has(span:hover) {
    border-color: #0093d0;
}
/*---END of btn---*/

.welcomeMsg__wrapper {
    margin: 0 auto 2rem;
    text-align: center;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
}

.formInput__wrapper {
    margin-bottom: 1rem;
    padding: 0;
}

/*Input field type text*/
.formInput__title {
    color: #808080;
    font-size: 14px;
    margin-bottom: 0.5rem;
    display: block;
}

.formInput__title.hover {
    color: #7ac143;
}

.formInput__title.focus {
    color: #0093d0 !important;
}

.formInput__title.invalid {
    color: #D00000;
}

.formInput__field {
    box-shadow: none !important;
    border: 1px solid;
    border-color: #E6E6E6;
    border-radius: 0.5rem;
    width: 100%;
    min-width: 300px;
    font-size: 14px;
    font-weight: 500;
    padding: 0 0.5rem;
    background-color: transparent !important;
    height: 40px;
    color: #000000;
    caret-color: #7ac143;
}

.formInput__field::placeholder {
    color: #808080;
    opacity: 1;
    font-weight: 400;
}

.formInput__field:hover {
    border-color: #7ac143;
}

.formInput__field:hover::placeholder {
    color: #7ac143;
}

.formInput__field:focus {
    border-color: #0093d0 !important;
}

.formInput__field:focus::placeholder {
    color: #0093d0;
}

.formInput__field.invalid {
    border-color: #D00000;
    color: #D00000;
}

.formInput__field.invalid::placeholder {
    color: #D00000;
}
/*---End---*/

.form__error {
    display: none;
    font-size: 12px;
    font-weight: 400;
    color: #D00000;
    margin: 0.5rem 0 0.5rem;
}

@media (max-width: 700px) {
    .form__wrapper {
        padding: 20px;
        width: 90%;
    }

    .formInput__field {
        min-width: 200px;
    }
}

@media (max-width: 380px) {
    .form__wrapper {
        padding: 16px;
        margin: auto 10px;
        width: unset;
    }

    .formInput__field {
        font-size: 12px;
        height: 32px;
    }
}


.errorMsg__wrapper {
    margin: 0 auto 2rem;
    text-align: center;
    color: #D00000;
    font-size: 14px;
    font-weight: 500;
}

.forgetPassword__wrapper {
    margin: 0 0 1.5rem;
}

.forgetPassword__link {
    display: inline-block;
    text-align: right;
    font-size: 12px;
    font-weight: 400;
    width: 100%;
}

span.forgetPassword__link > a {
    color: #0093d0 !important;
}

span.forgetPassword__link > a:hover {
    color: #7ac143 !important;
}

.formButton__signIn {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #7ac143;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    margin-bottom: 3rem;
    transition: var(--transition-speed);
}

.formButton__signIn:hover,
.formButton__signIn:focus {
    box-shadow: inset 0 -40px 0 0 #0093d0;
}

div.agree__wrapper {
    display: flex;
    flex-direction: column;
    font-size: 10px;
    font-weight: 400;
    color: #808080;
}

span.agree__container {
    width: 100%;
    display: inline-block;
    text-align: center;
}

a.agree__link {
    text-decoration: underline !important;
    color: #808080;
}

a.agree__link:hover, a.agree__link:active {
    color: #7ac143 !important;
    font-weight: 500;
}

/*Styles for OTP section*/
.otp__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.otp__wrapper > span {
    margin: 0 auto;
}

p.otpWelcomeMsg__wrapper {
    font-size: 16px;
    font-weight: 400;
    color: #000000;
    margin: 0;
    text-align: center;
    padding: 0;
}

p.otp__message {
    font-size: 14px;
    font-weight: 500;
    color: #D00000;
    margin: 0.25rem 0 0.5rem;
    text-align: center;
    padding: 0;
}

.otp__wrapper > .formInput__wrapper {
    width: 100%;
}

.formButton__verify {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #7ac143;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    margin-top: 1.5rem;
    transition: var(--transition-speed);
}

.formButton__verify:hover,
.formButton__verify:focus {
    box-shadow: inset 0 40px 0 0 #0093d0;
}
/*---*/

@media (max-width: 700px) {
    .formButton__signIn {
        margin-bottom: 2.5rem;
        min-width: 200px;
    }

    .formButton__verify {
        min-width: 200px;
    }
}

@media (max-width: 380px) {
    .formButton__signIn {
        font-size: 14px;
        height: 32px;
    }

    .formButton__verify {
        font-size: 14px;
        height: 32px;
    }

    p.otpWelcomeMsg__wrapper {
        font-size: 14px;
    }

    p.otp__message {
        font-size: 12px;
    }
}


.register__wrapper {
    display: flex;
    flex-direction: column;
    font-family: var(--font-family);
}

.dropdown__wrapper {
    position: relative;
    width: 100%;
    min-width: 300px;
    margin-bottom: 1rem;
    padding: 0;
}

.dropdown__btn {
    box-shadow: none !important;
    border: 1px solid;
    border-color: #E6E6E6;
    border-radius: 0.5rem;
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    padding: 0 0.5rem;
    background-color: transparent !important;
    height: 40px;
    color: #808080;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dropdown__btn.has-selection {
    color: #000000;
}

.dropdown__btn:hover {
    border-color: #7ac143;
    color: #7ac143;
    cursor: pointer;
}

.dropdown__btn:hover svg path {
    stroke: #7ac143;
}

.dropdown__btn--active {
    border-color: #0093d0;
    color: #0093d0;
    box-shadow: none;
}

.dropdown__btn > span {
    color: inherit;
}

.dropdown__btn svg {
    width: 16px;
    height: 16px;
    transition: transform 0.2s;
}

.dropdown__btn svg path {
    stroke: #808080;
}

.dropdown__wrapper.open svg {
    transform: rotate(180deg);
}

.dropdown__wrapper ul {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #FFFFFF;
    border-radius: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
    display: none;
    max-height: 200px;
    overflow-y: auto;
    width: 100%;
    z-index: 10;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
}

.dropdown__wrapper ul::-webkit-scrollbar {
    width: 4px !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .dropdown__wrapper ul::-webkit-scrollbar {
        width: 4px !important;
        background-color: transparent !important;
    }
}

.dropdown__wrapper ul::-webkit-scrollbar-track {
    background-color: #f0f0f0 !important; /* field below scrollbar */
    -webkit-box-shadow: none !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .dropdown__wrapper ul::-webkit-scrollbar-track {
        -webkit-box-shadow: none !important;
        background-color: #f0f0f0 !important; /* Field below scrollbar */
    }
}

.dropdown__wrapper ul::-webkit-scrollbar-thumb {
    background-color: #CCCCCC !important; /* scrollbar color */
    border-radius: 1rem;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .dropdown__wrapper ul::-webkit-scrollbar-thumb {
        background-color: #CCCCCC !important; /* scrollbar color - this show up more often as a setting in browser */
        border-radius: 1rem;
        border: unset;
    }
}

.dropdown__wrapper.open ul {
    display: block;
}

.dropdown__wrapper li {
    padding: 0.5rem 0.8rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dropdown__wrapper input[type="checkbox"],
.dropdown__wrapper input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 1rem;
    height: 1rem;
    border: 1px solid;
    border-color: #E6E6E6;
    border-radius: 0.25rem;
    display: inline-block;
    position: relative;
    transition: border-color 0.2s, background 0.2s;
}

.dropdown__wrapper input[type="radio"] {
    border-radius: 50%;
}

.dropdown__wrapper ul li:hover input {
    border-color: #7ac143;
}

.dropdown__wrapper ul li:hover input + span {
    color: #7ac143;
}

.dropdown__wrapper ul li input[type="checkbox"]:checked {
    background: #0093d0;
    border-color: #0093d0;
}

.dropdown__wrapper ul li input[type="checkbox"]:checked + span {
    color: #0093d0;
}

.dropdown__wrapper input[type="checkbox"]:checked::after {
    content: "\2714";
    position: absolute;
    bottom: 9px;
    left: 2.5px;
    width: 4px;
    height: 8px;
    color: #FFFFFF;
}

.dropdown__wrapper ul li input[type="radio"]:checked {
    background: #0093d0;
    border-color: #0093d0;
}

.dropdown__wrapper ul li input[type="radio"]:checked + span {
    color: #0093d0;
}

.dropdown__wrapper input[type="radio"]:checked::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: #0093d0;
}

.dropdown__wrapper input:focus-visible {
    outline: 2px solid #7ac143;
    outline-offset: 2px;
}

.dropdown--error .dropdown__btn {
    border-color: #D00000;
}

.dropdown--error .dropdown__btn span {
    color: #D00000;
}

.dropdown__wrapper ul li label {
    margin: 0 !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100% !important;
}

.dropdown__wrapper ul li label span {
    width: 100%;
    font-size: 14px;
}

.acceptRules__wrapper {
    margin: 1rem 0 1.5rem;
    padding: 0;
    display: flex;
}

.acceptRules__checkbox {
    appearance: none;
    -webkit-appearance: none;
    width: 1rem;
    height: 1rem;
    border: 2px solid;
    border-color: #E6E6E6;
    border-radius: 0.25rem;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: border-color 0.2s, background 0.2s;
    margin: 6px 2px 0 0;
}

input[type="checkbox"].acceptRules__checkbox:hover {
    border-color: #7ac143;
    cursor: pointer;
}

input[type="checkbox"].acceptRules__checkbox:checked {
    background: #0093d0;
    border-color: #0093d0;
}

input[type="checkbox"].acceptRules__checkbox:checked::after {
    content: "\2714";
    position: absolute;
    bottom: 9px;
    left: 2px;
    width: 4px;
    height: 8px;
    color: #FFFFFF;
}

.acceptRules__checkbox.acceptRules--error {
    border-color: #D00000;
}

.acceptRules__required {
    color: #808080;
    font-size: 16px;
    font-weight: 300;
    padding: 0;
    margin: 0 0.3rem 0 0;
}

.acceptRules__container {
    color: #808080;
    font-size: 12px;
    font-weight: 300;
    width: fit-content;
    display: flex;
    align-items: baseline;
}

a.acceptRules__link {
    text-decoration: underline !important;
    color: #0093d0 !important;
}

a.acceptRules__link:hover {
    cursor: pointer;
    color: #7ac143 !important;
}

a.acceptRules__link:focus,
a.acceptRules__link:focus-visible,
a.acceptRules__link:active {
    color: #0093d0 !important;
}

.information__text {
    color: #808080;
    text-align: center;
    margin: 0 0 1.5rem;
    padding: 0;
    font-weight: 400;
    font-size: 12px;
}

.formbutton__signUp {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #0093d0;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    transition: var(--transition-speed);
}

.formbutton__signUp:hover,
.formbutton__signUp:focus {
    box-shadow: inset 0 -40px 0 0 #7ac143;
}

@media (max-width: 1200px) {
    .information__text {
        text-align: left;
    }

    .dropdown__wrapper {
        min-width: 200px;
    }

    .formbutton__signUp {
        min-width: 200px;
    }
}

@media (max-width: 380px) {
    .formbutton__signUp {
        font-size: 14px;
        height: 32px;
    }

    .dropdown__btn {
        font-size: 10px;
        height: 32px;
    }

    .dropdown__btn svg {
        width: 12px;
        height: 12px;
    }

    .dropdown__wrapper ul li label span {
        font-size: 10px;
    }
}


#ip-pcl-form, .public__container__lookup {
    width: 100%;
    height: 100vh !important;
    padding: 0;
    margin: 0 !important;
    display: flex;
    overflow: hidden;
}

.containerLookup__wrapper {
    background-color: rgba(0, 96, 135, 0.85);
    width: 600px;
    border-radius: 0.5rem;
    min-height: 320px;
    margin: auto;
    display: flex;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.containerLookup__title {
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cl-search-text);
    margin: 0 auto 1rem;
    padding: 0;
}

.containerLookup__description {
    margin: 0 auto 2rem;
}

.containerLookup__description > p {
    text-align: center;
    margin: 0;
    padding: 0;
    color: var(--cl-search-text);
    font-size: 1rem;
    font-weight: 400;
}

#PCL_inside, .containerLookupInput__wrapper {
    width: 100%;
}

.containerLookupInput__wrapper {
    margin: 0 auto 2rem;
}

.containerLookup__hint {
    display: none;
    margin: 0.5rem 0 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.45;
    color: var(--cl-search-text);
    opacity: 0.9;
    text-align: left;
}

.containerLookupInput__wrapper:focus-within .containerLookup__hint {
    display: block;
}

.containerLookup__hint > .fa-info-circle {
    margin-right: 4px;
}

.containerLookup__input {
    width: 100%;
    box-shadow: none !important;
    border: 1px solid;
    border-color: #E6E6E6;
    border-radius: 0.5rem;
    min-width: 300px;
    font-size: 14px;
    font-weight: 500;
    background-color: #FFFFFF !important;
    height: 40px;
    color: #000000;
    caret-color: #7ac143;
    padding: 0 0.5rem;
}

.containerLookup__input::placeholder {
    color: #808080;
    opacity: 1;
    font-weight: 400;
}

.containerLookup__input:hover {
    border-color: #7ac143;
}

.containerLookup__input:hover::placeholder {
    color: #7ac143;
}

.containerLookup__input:focus {
    border-color: #0093d0 !important;
}

.containerLookup__input:focus::placeholder {
    color: #0093d0;
}

.containerLookup__button {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: 1px solid;
    background-color: #003349;
    border-color: #003349;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    transition: var(--transition-speed);
    -webkit-appearance: none;
    appearance: none;
}

.containerLookup__button:hover,
.containerLookup__button:focus {
    box-shadow: inset 0 -40px 0 0 #0093d0;
    border-color: #0093d0;
}

/* Busy state while a lookup request is in flight (skeleton showing) */
.containerLookup__button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    box-shadow: none;
}

/*-- Styles form tablet screen --*/
@media (max-width: 1200px) {
    #ip-pcl-form, .public__container__lookup {
        height: 100% !important;
        padding: 0;
        margin: auto !important;
    }

    .containerLookupInput__wrapper {
        margin: 0 auto 1rem;
    }
}

@media (max-width: 700px) {
    .containerLookup__wrapper {
        min-width: 200px;
        margin: auto 24px;
        padding: 20px;
    }

    .containerLookup__description {
        margin: 0 auto 1.5rem;
    }

    .containerLookup__input, .containerLookup__button {
        min-width: 200px;
    }
}

@media (max-width: 400px) {
    .containerLookup__wrapper {
        margin: auto 10px;
        padding: 16px;
        min-height: unset;
    }

    .containerLookup__description {
        margin: 0 auto 0.5rem;
    }

    .containerLookup__title {
        font-size: 20px;
        margin: 0 auto 0.6rem;
    }

    .containerLookup__description > p {
        font-size: 0.8rem;
    }

    .containerLookup__button {
        font-size: 14px;
        height: 32px;
    }

    .containerLookup__input {
        font-size: 12px;
        height: 32px;
    }
}

.warningMsg__wrapper {
    margin: 8px auto 16px; /* bottom gap separates the over-limit warning from the results grid below */
    padding: 6px 10px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: var(--cl-warning);
    background-color: color-mix(in srgb, var(--cl-warning-accent) 16%, #FFFFFF);
    border: 1px solid color-mix(in srgb, var(--cl-warning-accent) 50%, #FFFFFF);
    border-radius: 0.5rem;
}

.warningMsg__wrapper > .fa-exclamation-triangle {
    margin-right: 4px;
}

.pclChallenge__wrapper {
    margin-top: 12px;
}

.pclChallenge__prompt {
    margin-bottom: 6px;
}

.containerLookup__chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    width: 100%;
    box-sizing: border-box;
    min-width: 300px;
    min-height: 40px;
    padding: 4px 8px;
    border: 1px solid #E6E6E6;
    border-radius: 0.5rem;
    background-color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    color: #000000;
    cursor: text;
    transition: border-color 0.15s ease;
}

.containerLookup__chips:hover {
    border-color: #7ac143;
}

.containerLookup__chips:focus-within {
    border-color: #0093d0;
}

.containerLookup__chips.invalid {
    border-color: var(--cl-error);
}

.containerLookup__chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background-color: #E6E6E6;
    border: 1px solid transparent;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    color: #000000;
}

.containerLookup__chipLabel {
    white-space: nowrap;
}

.containerLookup__chipRemove {
    flex: 0 0 auto;
    width: 12px;
    height: 12px;
    margin: 0;
    padding: 0;
    border: none;
    background-color: currentColor;
    color: #808080;
    opacity: 0.7;
    -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2014%2014'%3E%3Cpath%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20d='M1%201l12%2012M13%201L1%2013'/%3E%3C/svg%3E") center / 8px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2014%2014'%3E%3Cpath%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20d='M1%201l12%2012M13%201L1%2013'/%3E%3C/svg%3E") center / 8px no-repeat;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.containerLookup__chipRemove:hover {
    color: #0093d0;
    opacity: 1;
}

.containerLookup__chip--found .containerLookup__chipRemove {
    color: var(--cl-success);
}

.containerLookup__chip--found .containerLookup__chipRemove:hover {
    color: color-mix(in srgb, var(--cl-success) 70%, #000000);
}

.containerLookup__chip--notFound .containerLookup__chipRemove {
    color: var(--cl-error);
}

.containerLookup__chip--notFound .containerLookup__chipRemove:hover {
    color: color-mix(in srgb, var(--cl-error) 70%, #000000);
}

.containerLookup__chip--found {
    background-color: color-mix(in srgb, var(--cl-success) 20%, #FFFFFF);
    border-color: var(--cl-success);
    color: color-mix(in srgb, var(--cl-success) 72%, #000000);
    cursor: pointer;
}

.containerLookup__chip--found:hover {
    background-color: color-mix(in srgb, var(--cl-success) 30%, #FFFFFF);
}

.containerLookup__chip--found .containerLookup__chipLabel::before {
    content: "\f00c";
    font-family: "Font Awesome 5";
    font-weight: 900;
    margin-right: 4px;
    color: var(--cl-success);
}

.containerLookup__chip--notFound {
    background-color: color-mix(in srgb, var(--cl-error) 12%, #FFFFFF);
    border-color: var(--cl-error);
    color: color-mix(in srgb, var(--cl-error) 72%, #000000);
    cursor: help;
}

.containerLookup__chip--notFound:hover {
    background-color: color-mix(in srgb, var(--cl-error) 20%, #FFFFFF);
}

.containerLookup__chip--notFound .containerLookup__chipLabel::before {
    content: "\f00d";
    font-family: "Font Awesome 5"; 
    font-weight: 900;
    margin-right: 4px;
    color: var(--cl-error);
}

.containerLookup__chipInput {
    flex: 1 1 60px;
    min-width: 60px;
    height: 28px;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    font-family: inherit;
    color: #000000;
    caret-color: #7ac143;
}

.containerLookup__chipInput::placeholder {
    color: #808080;
    opacity: 1;
    font-weight: 400;
}

/* NOTE: the typing field keeps the compact `flex: 1 1 60px` basis on all sizes. A larger desktop
   basis (140px) was tried so a word being typed would jump to a new line when it didn't fit, but
   flex line-breaking uses the flex-basis as the field's reserved size — so an EMPTY field would
   also wrap to a second line whenever less than 140px remained after the chips (e.g. when the
   panel collapses for the detail view), leaving what looked like free space. The 60px basis lets
   the field fill whatever space is left after the chips and wrap only when there's truly no room. */

/* Responsive — mirror .containerLookup__input breakpoint adjustments */
@media (max-width: 700px) {
    .containerLookup__chips {
        min-width: 200px;
    }
}

@media (max-width: 400px) {
    .containerLookup__chips,
    .containerLookup__chip,
    .containerLookup__chipInput {
        font-size: 12px;
    }
}


#PCL_inside > div.errorMsg__wrapper{
    margin-top: 8px;
}

.clSearchResult__wrapper {
    background-color: #FFFFFF;
    padding: 40px;
    margin: 40px auto;
    height: calc(100% - 80px) !important;
    border-radius: 0.5rem;
    overflow-y: auto;
    min-width: 600px;
    max-width: 600px;
    width: 100%;
    position: relative;
}

/* Desktop-only: the panel widens when it shows the multi-result grid, so more admin-configured
   columns fit without horizontal scrolling. The widening rule is scoped to min-width:1201px, so
   tablet/mobile (≤1200px, where the panel is a fixed/full-screen overlay) stay untouched. The
   `--wide` class is toggled from logon-pcl.js at the grid↔detail switch points. */
@media (min-width: 1201px) {
    .clSearchResult__wrapper {
        transition: max-width 300ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* Compound selector: the modifier only has effect together with the base class, so a stray
       `--wide` left on #PCL after resetComponent (which removes clSearchResult__wrapper) is inert. */
    .clSearchResult__wrapper.clSearchResult__wrapper--wide {
        max-width: min(1600px, calc(100% - 80px));
    }

    /* When the panel is wide, the results grid (#searchResults) AND the chip input above it
       (.containerLookupInput__wrapper) use the full width — so many entered container IDs expand
       across the panel and wrap to a new line only when they run out of room. The Lookup button
       and the message wrappers (warning/challenge/error) stay bounded & centered — a full-screen-
       wide button reads poorly and loses the "button" affordance. */
    .clSearchResult__wrapper--wide #PCL_inside > *:not(#searchResults):not(.containerLookupInput__wrapper) {
        display: block;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    /* The chip input above the grid grows WITH its content (fit-content): it starts at 600px and
       widens only as more container IDs are entered — using the free width on either side — and
       wraps to a new line only once it reaches the available width. I.e. expand when it runs out
       of room, not immediately. */
    .clSearchResult__wrapper--wide .containerLookupInput__wrapper {
        width: fit-content;
        min-width: 600px;
        max-width: min(1600px, calc(100% - 80px));
    }
}

@media (prefers-reduced-motion: reduce) {
    .clSearchResult__wrapper {
        transition: none;
    }
}

.clSearchResult__wrapper::-webkit-scrollbar,
.clMultiResult__gridWrapper::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .clSearchResult__wrapper::-webkit-scrollbar {
        width: 6px !important;
        background-color: transparent !important;
    }
}

.clSearchResult__wrapper::-webkit-scrollbar-track,
.clMultiResult__gridWrapper::-webkit-scrollbar-track {
    background-color: var(--cl-neutral-60) !important;
    -webkit-box-shadow: none !important;
    border-radius: 1rem;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .bodyLeftPart__wrapper::-webkit-scrollbar-track {
        -webkit-box-shadow: none !important;
        background-color: var(--cl-neutral-60) !important; /* Field below scrollbar */
    }
}

.clSearchResult__wrapper::-webkit-scrollbar-thumb,
.clMultiResult__gridWrapper::-webkit-scrollbar-thumb {
    background-color: #CCCCCC !important;
    border-radius: 1rem;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .bodyLeftPart__wrapper::-webkit-scrollbar-thumb {
        background-color: #CCCCCC !important; /* scrollbar color - this show up more often as a setting in browser */
        border-radius: 1rem;
        border: unset;
    }
}

.clSearchResult__wrapper::-webkit-scrollbar-thumb:hover,
.clMultiResult__gridWrapper::-webkit-scrollbar-thumb:hover {
    cursor: pointer;
}

.clSearchResult__wrapper > .containerLookup__title {
    color: #0093d0;
}

.clSearchResult__wrapper > .containerLookup__description > p {
    color: #000000;
}

.clSearchResult__wrapper .containerLookup__hint {
    color: #808080;
}

.clResultFor__text {
    color: #000000;
    font-size: 16px;
    font-weight: 500;
    margin-right: 0.25rem;
}

.clResultForContainer__text {
    color: #0093d0;
    font-size: 16px;
    font-weight: 600;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResult__line {
    width: 100%;
    border-bottom: 1px solid;
    border-color: #E6E6E6;
    margin: 0.5rem auto 1rem;
}

.clResultNotFound__wrapper {
    width: 100%;
    margin: 2rem auto 0;
    display: block;
}

.clResultNotFound__text {
    color: var(--cl-error);
    font-size: 20px;
    font-weight: 600;
    margin: 0;
    padding: 0;
}

.clResultFound__wrapper {
    display: block;
}

.clResult__container {
    width: 100%;
    margin: 2rem auto 0;
}

.clResultSection__title {
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    margin: 0 0 0.5rem;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultSection__subtitle {
    font-size: 12px;
    font-weight: 400;
    color: #999999;
    margin: 0.5rem 0 1rem;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultSection__container {
    margin: 0 0 1rem;
    width: 100%;
}

.clResultSection__caption {
    font-size: 14px;
    font-weight: 400;
    color: #808080;
    margin: 0;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultSectionField__value {
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    margin: 0.25rem 0 0;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

div.clResultAttachmentDescription__container.list-body:after {
    border-bottom: none !important;
}

.clResultAttachmentType__text {
    font-size: 16px;
    font-weight: 500;
    color: #808080;
    margin: 0 0 0.5rem;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultAttachmentDescription__container {
    margin: 0 0.5rem;
}

.clResultAttachmentFile__name {
    font-size: 16px;
    font-weight: 500;
    color: #000000;
    margin: 0.25rem 0 0;
    padding: 0;
    cursor: pointer;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultAttachmentFile__name:hover {
    text-decoration: underline;
    color: #0093d0;
}

.clResultAttachmentFile__name:focus {
    color: #000000;
}

.clResultAttachmentFile__date {
    font-size: 12px;
    font-weight: 300;
    color: #808080;
    margin: 0;
    padding: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
    line-height: 1.2;
}

.clResultAttachment__description {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin: 0.25rem 0.25rem 0;
    overflow-wrap: break-word;
    word-break: break-word;
    white-space: normal;
}

.clResultAttachment__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 0.5rem;
}

.clResultAttachment__wrapper {
    margin: 0 0 1rem;
}

/* Attachment file-type icon */
.clResultAttachment__fileIcon path {
    stroke: #000000;
}

.clAttachment__btn {
    width: 40px;
    height: 40px;
    border-radius: 0.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 0;
    border: 1px solid;
    border-color: #E6E6E6;
}

.clAttachment__btn > .clAttachmentButton__icon > path,
.clAttachment__btn > .clAttachmentButton__icon > line {
    stroke: #7ac143;
}

.clAttachmentButton__icon {
    margin: auto;
}

.clAttachment__btn:hover {
    background-color: rgba(0, 147, 208,0.05);
    cursor: pointer;
    border-color: #0093d0;
}

.clAttachment__btn:hover > .clAttachmentButton__icon > path,
.clAttachment__btn:hover > .clAttachmentButton__icon > line {
    stroke: #0093d0;
}

.clSearchResult__closeButton {
    display: none;
    position: absolute;
    right: 2.5rem;
    cursor: pointer;
}

.clSearchResult__closeButton path {
    stroke: #808080;
}

.clSearchResult__closeButton:hover path {
    stroke: #000000;
}

@media(max-width:1200px) {
    .clSearchResult__wrapper {
        position: fixed;
        top: 50%; /* center the tall panel (height: calc(100% - 80px)) → even 40px top/bottom margins; 30% pushed its top off-screen */
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0; /* override the base `40px auto` — its margin-top broke the centring (top gap, bottom touching the edge) */
        z-index: 14;
    }

    .clSearchResult__backdrop {
        position: fixed;
        inset: 0;
        backdrop-filter: blur(6px);
        background: rgba(0,0,0,0.3);
        z-index: 12;
        opacity: 0;
        pointer-events: none;
    }

    .clSearchResult__backdrop.active {
        opacity: 1;
        pointer-events: all;
    }
}

@media (max-width: 700px) {
    .clSearchResult__wrapper {
        top: 0;
        left: 0;
        transform: none;
        padding: 20px;
        margin: auto;
        width: 100%;
        min-width: 200px;
        max-width: none; /* drop the base 600px cap → truly full-width on mobile */
        border-radius: 0;
        height: 100vh !important; /* beat the base `calc(100% - 80px) !important` → full-height (was leaving an ~80px bottom gap) */
    }

    .clSearchResult__closeButton {
        right: 1.5rem;
    }

    .clSearchResult__wrapper::-webkit-scrollbar {
        width: 4px !important;
    }
}

@media (max-width: 380px) {
    .clSearchResult__wrapper {
        padding: 16px;
    }

    .clResultAttachmentFile__name {
        font-size: 14px;
        white-space: normal;
        word-break: break-word;
    }

    .clResultAttachment__description {
        margin: 0.25rem 0 0;
    }

    .clResultAttachmentType__text {
        font-size: 14px;
    }

    .clSearchResult__closeButton {
        right: 0.5rem;
    }
}


/* Multi-container lookup RESULT GRID  */

:root {
    --cl-row-hover-bg: var(--cl-neutral-30); /* neutral grey hover — matches the settings grid */
}

/* Wrapper */
.clMultiResult__wrapper {
    padding: 8px 0;
}

.clMultiResult__gridWrapper {
    max-height: 50vh;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    margin-top: 12px;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    background-color: #FFFFFF;
}

/* Export toolbar (sits above the grid) */
.clMultiResultToolbar {
    display: flex;
    justify-content: flex-end;
    margin-top: 24px;
}

.clMultiResultExport__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px; /* a bit roomier — closer to the settings buttons in CL/PCL */
    font-family: inherit; /* Inter, inherited from the page */
    font-size: 14px;
    font-weight: 600;
    line-height: 1; /* tight line box so the icon, label and caret center on one line */
    color: #7ac143;
    background-color: transparent;
    border: 1px solid #7ac143;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
    -webkit-appearance: none;
    appearance: none;
}

/* Hover — secondary fill, white text/icons (text/icons inherit `color`). */
.clMultiResultExport__button:hover {
    color: #FFFFFF;
    background-color: #0093d0;
    border-color: #0093d0;
}

/* Open dropdown (aria-expanded) OR keyboard focus — primary fill, white text/icons. The open
   state is what makes the primary look visible while the menu is open (a mouse click doesn't
   trigger :focus-visible, so that alone wouldn't show it). :focus-visible still covers keyboard
   focus without leaving the button "stuck" filled after a mouse click + cursor move-away.
   Placed after :hover so an open button stays primary even while hovered. */
.clMultiResultExport__button:focus-visible,
.clMultiResultExport__button[aria-expanded="true"] {
    color: #FFFFFF;
    background-color: #7ac143;
    border-color: #7ac143;
}

/* Export dropdown */
.clMultiResultExport {
    position: relative;
    display: inline-block;
}

.clMultiResultExport__caret {
    /* Slightly smaller than the 14px label/icon (14px read as too big) but close enough that
       align-items:center still keeps it on the row — 10px looked visibly off. */
    font-size: 12px;
    transition: transform 150ms ease;
}

.clMultiResultExport__button[aria-expanded="true"] .clMultiResultExport__caret {
    transform: rotate(180deg);
}

.clMultiResultExport__menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    /* Above every sticky grid cell (lead header z-index:3, row-lead z-index:2) — the grid wrapper
       has no stacking context of its own and paints after this toolbar in DOM order, so the menu
       needs a higher z-index than the grid's sticky elements to sit in front of the grid. */
    z-index: 10;
    min-width: 180px;
    margin: 0;
    padding: 4px;
    list-style: none;
    background-color: #FFFFFF;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    /* Subtle open animation — plays each time the menu is shown (display flips from none via
       removing .hide). Mirrors the 150ms timing used across the grid's hover/caret transitions. */
    animation: pclExportMenuIn 150ms ease;
}

@keyframes pclExportMenuIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .clMultiResultExport__menu {
        animation: none;
    }

    .clMultiResultExport__caret {
        transition: none;
    }
}

.clMultiResultExport__item {
    margin: 0;
}

.clMultiResultExport__option {
    display: flex;
    align-items: center;
    gap: 10px; /* icon-to-label spacing — matches the new-settings formDropdown__option */
    width: 100%;
    padding: 12px; /* roomier rows, on par with the new-settings dropdown options */
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1; /* align the file icon and label on one line */
    text-align: left;
    color: var(--cl-neutral-700);
    background-color: transparent;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.clMultiResultExport__option:hover,
.clMultiResultExport__option:focus-visible {
    color: #0093d0;
    background-color: var(--cl-neutral-30);
}

/* Table */
.clMultiResult__grid {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12px;
}

/* Header */
.clMultiResult__grid thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    text-align: left;
    padding: 12px 16px;
    font-size: 12px;
    font-weight: 500;
    color: var(--cl-neutral-700);
    background-color: var(--cl-neutral-60);
    border-bottom: 1px solid #E6E6E6;
    white-space: nowrap;
}

/* Body cells */
.clMultiResult__grid tbody td {
    padding: 12px 16px;
    border-bottom: 1px solid #E6E6E6;
    vertical-align: middle;
    color: #000000;
    white-space: nowrap;
}

.clMultiResult__grid tbody tr:last-child td {
    border-bottom: none;
}

/* Row interactions */
.clMultiResultRow {
    cursor: pointer;
}

.clMultiResultRow td {
    transition: background-color 150ms ease;
}

.clMultiResultRow:hover td {
    background-color: var(--cl-row-hover-bg);
}

/* Pinned identity column (sticky-left) */
.clMultiResult__grid thead th.clMultiResult__leadHeader {
    position: sticky;
    left: 0;
    z-index: 3;
    border-right: 1px solid #E6E6E6;
    padding-left: 48px;
}

.clMultiResult__grid thead th {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}

.clMultiResultSort {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.clMultiResultSort__icons {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: 10px;
    line-height: 1;
    color: #999999;
}

.clMultiResult__grid thead th[aria-sort="ascending"] .clMultiResultSort__icons .fa-long-arrow-alt-up {
    color: #7ac143;
}

.clMultiResult__grid thead th[aria-sort="descending"] .clMultiResultSort__icons .fa-long-arrow-alt-down {
    color: #0093d0;
}

.clMultiResultRow__lead {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: #FFFFFF;
    border-right: 1px solid #E6E6E6;
}

.clMultiResultRow__leadInner {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.clMultiResultRow__id {
    font-weight: 600;
    color: #000000;
    letter-spacing: 0.02em;
}

/* Chevron drill button */
.clMultiResultRow__actionBtn {
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    background: transparent;
    border: 0;
    border-radius: 6px;
    padding: 0;
    font-size: 14px;
    color: #7ac143;
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.clMultiResultRow:hover .clMultiResultRow__actionBtn,
.clMultiResultRow__actionBtn:hover {
    background-color: color-mix(in srgb, #0093d0 12%, transparent);
    color: #0093d0;
}

/* Detail panel */
.clMultiResult__detail {
    padding-top: 8px;
}

.clMultiResult__detail .clResult__container {
    margin-top: 8px;
}

/* Back-to-grid link */
.clMultiResultBackToGrid__link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #7ac143;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    margin-bottom: 12px;
}

.clMultiResultBackToGrid__link:hover,
.clMultiResultBackToGrid__link:focus {
    color: #0093d0;
}

/* Underline only the text label on hover/focus — never the icon */
.clMultiResultBackToGrid__link:hover .clMultiResultBackToGrid__text,
.clMultiResultBackToGrid__link:focus .clMultiResultBackToGrid__text {
    text-decoration: underline;
}

.clMultiResult__emptyState {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 40px 24px;
    margin-top: 8px;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    background-color: #FFFFFF;
}

.clMultiResult__emptyIcon {
    font-size: 36px;
    color: #999999;
    margin-bottom: 4px;
}

.clMultiResult__emptyHeadline {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
    margin: 0;
}

.clMultiResult__emptySubText {
    font-size: 14px;
    color: #808080;
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Responsive — small screens */
@media (max-width: 700px) {
    .clMultiResult__grid thead th,
    .clMultiResult__grid tbody td {
        padding: 8px 12px;
    }

    /* Larger tap target on touch screens (min ~44px height); the dropdown stays right-anchored
       and its 180px min-width still fits the full-width mobile panel. The option padding (12px)
       is already the base value, so it needs no mobile override. */
    .clMultiResultExport__button {
        padding: 12px 20px;
    }
}


/* PCL public lookup — SKELETON loading placeholder  */

@keyframes pclSkeletonShimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}

.pclSkeleton {
    width: 100%;
    padding: 8px 0;
}

.pclSkeleton--detail {
    padding-top: 2rem;
}

/* Shimmer base */
.pclSkeleton__title,
.pclSkeleton__sectionTitle,
.pclSkeleton__label,
.pclSkeleton__value,
.pclSkeleton__cell,
.pclSkeleton__divider {
    background: linear-gradient(
        90deg,
        var(--cl-skeleton-base) 25%,
        var(--cl-skeleton-highlight) 50%,
        var(--cl-skeleton-base) 75%
    );
    background-size: 800px 100%;
    animation: pclSkeletonShimmer 1.4s infinite linear;
    border-radius: 4px;
}

/* Title bar (detail skeleton) */
.pclSkeleton__titleBar {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.pclSkeleton__title {
    height: 18px;
    width: 55%;
}

.pclSkeleton__divider {
    height: 1px;
    border-radius: 0;
    margin: 4px 0 16px;
}

/* Sections (detail skeleton) */
.pclSkeleton__section {
    margin-bottom: 20px;
}

.pclSkeleton__sectionTitle {
    height: 14px;
    width: 40%;
    margin-bottom: 12px;
}

.pclSkeleton__pairs {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.pclSkeleton__pair {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pclSkeleton__label {
    height: 12px;
    width: 65%;
}

.pclSkeleton__value {
    height: 16px;
    width: 90%;
}

/* Grid skeleton (multi-result) */
.pclSkeleton__grid {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.pclSkeleton__row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #E6E6E6;
}

.pclSkeleton__row--header {
    padding: 8px 0;
}

.pclSkeleton__cell {
    height: 14px;
}

.pclSkeleton__cell--actions {
    flex: 0 0 20px;
    width: 20px;
}

.pclSkeleton__cell--col {
    flex: 1 1 0;
    min-width: 40px;
}

/* Responsive */
@media (max-width: 700px) {
    .pclSkeleton__title {
        width: 75%;
    }
}

@media (max-width: 400px) {
    .pclSkeleton__cell--col {
        min-width: 24px;
    }
}

/* Respect reduced-motion preference — disable animation */
@media (prefers-reduced-motion: reduce) {
    .pclSkeleton__title,
    .pclSkeleton__sectionTitle,
    .pclSkeleton__label,
    .pclSkeleton__value,
    .pclSkeleton__cell,
    .pclSkeleton__divider {
        animation: none;
        background: var(--cl-skeleton-base);
    }
}


/*Title color-profile section from _LayoutLogin*/
.formSwitch__title {
    font-size: 20px;
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 2px solid;
    width: 100%;
    border-color: #7ac143;
    color: #7ac143;
    font-weight: 600;
}

/*Forgot Password form*/
.formButton__reset {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    border: none;
    background-color: #7ac143;
    font-size: 18px;
    color: #FFFFFF;
    height: 40px;
    font-weight: 500;
    margin-top: 1.5rem;
    transition: var(--transition-speed);
}

.formButton__reset:hover,
.formButton__reset:focus {
    box-shadow: inset 0 40px 0 0 #0093d0;
}

.backToSignIn__wrapper {
    text-align: center;
    font-weight: 400;
    font-size: 12px;
    margin: 1rem 0 2rem;
    color: #808080;
}

.backToSignIn__wrapper span a {
    text-decoration: underline;
    color: #0093d0 !important;
}

.backToSignIn__wrapper span:hover a {
    text-decoration: underline;
    color: #7ac143 !important;
    font-weight: 500;
}
/* --- */

@media (max-width: 700px) {
    .formButton__reset {
        min-width: 200px;
    }
}

@media (max-width: 380px) {
    .formButton__reset {
        font-size: 14px;
        height: 32px;
    }
}


.successfulRegister__wrapper {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-family: var(--font-family);
}

.successfulRegister__title {
    font-size: 24px;
    color: #7ac143;
    margin: 0 0 1rem;
    font-weight: 500;
}

.successfulRegister__message {
    margin: 0;
    text-align: center;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
}

.successfulRegister__button {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    background-color: transparent;
    font-size: 18px;
    color: #0093d0;
    border: 1px solid #0093d0;
    height: 40px;
    font-weight: 400;
    transition: var(--transition-speed);
    margin: 2rem 0 0;
}

.successfulRegister__button:hover,
.successfulRegister__button:focus {
    box-shadow: inset 0 -40px 0 0 #7ac143;
    color: #FFFFFF;
    border-color: #7ac143;
}

@media (max-width: 700px) {
    .successfulRegister__button {
        min-width: 200px;
    }
}

@media (max-width: 380px) {
    .successfulRegister__button {
        font-size: 14px;
        height: 32px;
    }

    .successfulRegister__message {
        font-size: 12px;
    }
}

.fpEmailMessage__wrapper {
    display: flex;
    flex-direction: column;
    text-align: center;
    font-family: var(--font-family);
}

.fpEmailMessage__title {
    font-size: 24px;
    color: #7ac143;
    margin: 0 0 1rem;
    font-weight: 500;
}

.fpEmailMessage__message {
    margin: 0;
    text-align: center;
    color: #808080;
    font-size: 12px;
    font-weight: 400;
}

.fpEmailMessage__information {
    text-align: center;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 0.5rem;
}

.fpEmailMessage__actionText {
    margin: 0;
    text-align: center;
    color: #0093d0;
    font-size: 14px;
    font-weight: 500;
}

.fpEmailMessage__button {
    width: 100%;
    min-width: 300px;
    border-radius: 0.5rem;
    background-color: transparent;
    font-size: 18px;
    color: #0093d0;
    border: 1px solid #0093d0;
    height: 40px;
    font-weight: 400;
    transition: var(--transition-speed);
    margin: 1rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fpEmailMessage__button:hover,
.fpEmailMessage__button:focus {
    box-shadow: inset 0 -40px 0 0 #7ac143;
    color: #FFFFFF;
    border-color: #7ac143;
}

@media (max-width: 700px) {
    .fpEmailMessage__button {
        min-width: 200px;
    }
}

@media (max-width: 400px) {
    .fpEmailMessage__message {
        font-size: 8px;
    }

    .fpEmailMessage__information {
        font-size: 12px;
    }

    .fpEmailMessage__title {
        font-size: 1rem;
        margin: 0 auto 0.6rem;
    }

    .fpEmailMessage__button {
        font-size: 14px;
        height: 32px;
    }
}

.mainPolicy__backdrop,
.mainPolicy__wrapper {
    --content-background: var(--background-color, #fff);
    --button-text-color: var(--neutral-0, #fff);
    --neutral-black: var(--neutral-1000, #000);
    --cl-neutral-500: var(--neutral-500, #808080);
    --cl-neutral-black: var(--neutral-1000, #000);
    --grey-100: var(--neutral-100, #e6e6e6);
}

/*-- Backdrop overlay --*/
.mainPolicy__backdrop {
    position: fixed;
    inset: 0;
    backdrop-filter: blur(8px) brightness(0.9);
    -webkit-backdrop-filter: blur(8px) brightness(0.9);
    z-index: 10000;
}

.mainPolicy__backdrop--hidden {
    display: none;
}

.mainPolicy__wrapper {
    font-family: var(--font-family);
    position: fixed;
    inset: 0;
    z-index: 10001;
    margin: auto;
    width: 80%;
    height: 90vh;
    display: flex;
    flex-direction: column;
    background-color: #FFFFFF;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: -4px -4px 8px 0px #FFFFFF, -1px -1px 4px 0px #FFFFFF, 1.5px 1.5px 4px 0px rgba(230, 230, 230, 40%), 4px 4px 8px 0px rgba(230, 230, 230, 60%);
}

.policyButtons__wrapper {
    display: flex;
    align-content: center;
    justify-content: center;
    gap: 24px;
    margin: 0 auto 32px;
    flex-shrink: 0;
    padding: 40px 40px 0;
}

/*-- Modal visibility toggle --*/
.mainPolicy__wrapper--hidden {
    display: none;
}

.mainPolicy__closeButton {
    position: absolute;
    right: 2rem;
    top: 2rem;
    cursor: pointer;
    flex-shrink: 0;
    background: transparent;
    border: none;
    padding: 0;
    line-height: 0;
}

.mainPolicy__closeButton path {
    stroke: #808080;
}

.mainPolicy__closeButton:hover path,
.mainPolicy__closeButton:focus-visible path {
    stroke: #000000;
}

.policyButton__tab {
    min-width: 200px;
    border: 1px solid;
    border-color: #7ac143;
    color: #000000;
    padding: 8px 16px;
    font-size: 16px;
    font-weight: 500;
    background-color: transparent;
    border-radius: 0.5rem;
    cursor: pointer;
}

.policyButton__tab-active {
    border-color: #7ac143;
    color: #FFFFFF;
    background-color: #7ac143;
}

.policyButton__tab:hover {
    border-color: #0093d0;
    color: #FFFFFF;
    background-color: #0093d0;
}

.policyTitle__wrapper {
    text-align: center;
    margin: 0 0 32px 0;
    padding: 0 40px 0;
    flex-shrink: 0;
}

.policyTitle__text {
    color: #000000;
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 8px 0;
    padding: 0;
}

.policyTitle__date {
    color: #808080;
    font-size: 12px;
    font-weight: 400;
    margin: 0;
    padding: 0;
}

.policyBody__wrapper {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 0 40px 40px;
}

/*
 * Body content area is a fixed "white paper" card independent of external branding.
 * Reason: policy bodies come from a rich-text DB field whose inline styles (white
 * paragraph backgrounds, dark text) were authored against a white page. When a tenant
 * picks a dark external-branding palette, the modal frame goes dark but the DB content
 * still paints white-on-white spans, producing visible "stripes" between paragraphs.
 * Fixing the card to white guarantees readability for every branding choice.
 */
.policyBodySections__container {
    flex: 1 1 0;
    min-width: 0;
    height: 100%;
    overflow-y: auto;
    scroll-padding-top: 8px;
    padding: 16px;
    background-color: #fff;
    color: #1a1a1a;
    border-radius: 0.5rem;
}

.policyBodySections__container .policyBodySection__title {
    color: #1a1a1a;
}

.policyBodySections__container .policyBodySection__text {
    color: #4a4a4a;
}

.policyBodySections__container::-webkit-scrollbar {
    width: 8px !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .policyBodySections__container::-webkit-scrollbar {
        width: 8px !important;
        background-color: #E6E6E6 !important;
    }
}

.policyBodySections__container::-webkit-scrollbar-track {
    background-color: #f5f5f5 !important;
    -webkit-box-shadow: none !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .policyBodySections__container::-webkit-scrollbar {
        width: 8px !important;
        background-color: #F5F5F5 !important;
    }
}

.policyBodySections__container::-webkit-scrollbar-thumb {
    background-color: #E6E6E6 !important;
    border-radius: 1rem;
}

.policyBodySections__container::-webkit-scrollbar-thumb:hover {
    cursor: pointer;
}

.policyBody__section {
    margin: 0 0 32px 0;
    width: 100%;
}

.policyBody__section:last-child {
    margin-bottom: 0;
}

.policyBodySection__title {
    color: #000000;
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 16px 0;
    padding: 0;
}

.policyBodySection__text {
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    margin: 0;
    padding: 0;
}

.policyTab__panel {
    display: none;
}

.policyTab__panel-active {
    display: contents;
}

/*-- Styles for tablet screen --*/
@media (max-width: 1200px) {
    .mainPolicy__wrapper {
        width: 90%;
        height: 90vh;
    }

    .policyButtons__wrapper {
        gap: 16px;
    }

    .policyBody__wrapper {
        gap: 16px;
    }

    .policyBodySections__container::-webkit-scrollbar {
        width: 6px !important;
    }

    @media screen and (-webkit-min-device-pixel-ratio: 0) {
        .policyBodySections__container::-webkit-scrollbar {
            width: 6px !important;
            background-color: transparent !important;
        }
    }

    @media screen and (-webkit-min-device-pixel-ratio: 0) {
        .policyBodySections__container::-webkit-scrollbar {
            width: 6px !important;
            background-color: #F5F5F5 !important;
        }
    }

}

/*-- Styles for mobile screen --*/
@media (max-width: 700px) {
    .policyButtons__wrapper {
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
        scrollbar-color: var(--grey-100) #f5f5f5;
        padding: 40px 0 16px;
        margin: 0 24px 32px;
        width: auto;
        flex-shrink: 1;
        min-width: 0;
    }

    .policyButton__tab {
        flex-shrink: 0;
        scroll-snap-align: start;
        white-space: nowrap;
        min-width: 160px;
        padding: 6px 8px;
    }

    .policyButtons__wrapper::-webkit-scrollbar {
        height: 6px;
    }

    .policyButtons__wrapper::-webkit-scrollbar-track {
        background-color: #f5f5f5;
        border-radius: 1rem;
    }

    .policyButtons__wrapper::-webkit-scrollbar-thumb {
        background-color: var(--grey-100);
        border-radius: 1rem;
    }

    .policyButtons__wrapper::-webkit-scrollbar-thumb:hover {
        background-color: #808080;
    }

    .policyBody__wrapper {
        padding: 0 24px 24px;
    }

    .policyBodySections__container {
        height: auto;
        flex: 1 1 auto;
        min-height: 0;
    }
}

/*-- Styles for extra-small screen --*/
@media (max-width: 500px) {
    /*-- Close button --*/
    .mainPolicy__closeButton {
        right: 1rem;
        top: 1rem;
    }

    .policyButton__tab {
        min-width: 140px;
        padding: 4px 8px;
        font-size: 14px;
    }
}



body {
    background: #100e0e;
}