@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&display=swap');

.heroOneLoginWrap {
    --ho-primary-a: #ec3444;
    --ho-light-01: #a7a7a7;
    --ho-primary-hover: #ec3542;
    --ho-font-inter: "Inter", sans-serif;
}
.heroOneLoginWrap {
    min-height: 100vh;
    background: #040404 url(../../images/Subdomains/Heroone/heroone-bg.png) no-repeat 0 bottom / 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--ho-font-inter);
}
.cardWrap{
    max-width: 410px;
}
.heroOneLoginWrap .card {
    border: 1px solid #454545;
}
.heroOneLoginWrap .card .card-body,
.heroOneLoginWrap .card .card-footer {
    padding-left: 38px;
    padding-right: 38px;
}
.heroOneLoginWrap .card .card-body {
    padding-top: 32px;
}

.heroOneLoginWrap .card .card-footer {
    padding-bottom: 38px;
}
.form-control.customInput {
    border-color: #fff;
}
.form-control.customInput:focus-within {
    box-shadow: none;
    border-bottom: 1px solid #fff;
}
.heroOneBtn {
    border: 2px solid #fff;
    font-family: var(--ho-font-inter);
    font-weight: 400;
    font-size: 0.938rem;
    text-transform: uppercase;
}
.btn.heroOneBtn:hover {
    opacity: 0.65;
/*    background-color: var(--ho-primary-hover);
    border-color: #9b0913;*/
}
.input-container:not(:last-child) {
    margin-bottom: 30px;
}
.input-container label {
    font-weight: 400;
    font-size: 0.875rem;
    font-family: var(--ho-font-inter);
}
.form-control.customInput,
.form-control.customInput:focus,
.input-container label {
    color: var(--ho-light-01);
}
.btn.heroOneBtn:focus,
a:focus, a:focus-visible{
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(155 9 19 / 35%);
}
.form-control.customInput:focus {
    box-shadow: 0 3px 2px 0rem rgb(155 9 19 / 55%);
}
.cantLogin, .txtLink {
    font-size: 0.813rem;
    color: var(--ho-primary-a);
}
.cantLogin:hover, .txtLink:hover {
    color: var(--ho-primary-hover);
}
.input-container .error {
    margin-bottom: 0;
}

.customHeroOne{
    padding-bottom: 0px !important;
}

#txtMFAFactorID {
    background-color: transparent;
    color: white;
}

#txtMFAFactorID option {
    background-color: #040404;
    color: white;
}
.backToLogin {
    border-top: 1px solid #454545;
    padding-top: 12px;
}
.alertMsg {
    font-size: 12px;
    border-top: 1px solid #454545;
    margin-top: 16px;
    padding-top: 16px;
}
.errorMsg {
    color: #ff0018;
}
.display-none{
    display: none;
}
.copyright{
    margin-top: 10px;
}

.customHeroOneLabel{
    margin-bottom: 0px;
}

.alertNotification {
    position: fixed;
    top: 16px;
    right: -560px;
    width: 100%;
    max-width: 560px;
    display: flex;
    background-color: #fff;
    border-radius: 6px;
    padding: 16px;
    transition: all .4s;
    font-family: var(--ho-font-inter);
}
    .alertNotification.show {
        right: 16px;
    }
.alert-icon {
    width: 24px;
    height: 24px;
    margin-right: 12px;
    margin-top: 8px;
    font-size: 0px;
    min-width: 24px;
}
.alert-icon svg{
    display: flex;
}

.alert-content strong {
    display: block;
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 4px;
    color: #000;
}

.alert-content p {
    margin: 0;
    font-weight: 400;
    font-size: 16px;
    color: #000;
}
.alertError {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M12%200C14.373%200%2016.693%200.7038%2018.667%202.0224C20.64%203.3409%2022.178%205.2151%2023.087%207.4078C23.995%209.6005%2024.232%2012.0133%2023.769%2014.3411C23.306%2016.6689%2022.164%2018.807%2020.485%2020.4853C18.807%2022.1635%2016.669%2023.3064%2014.341%2023.7694C12.013%2024.2324%209.60102%2023.9948%207.40802%2023.0865C5.21502%2022.1783%203.34097%2020.6402%202.02197%2018.6668C0.703973%2016.6934%200%2014.3734%200%2012C0%208.8174%201.26401%205.7652%203.51501%203.5147C5.76501%201.2643%208.817%200%2012%200Z%22%20fill%3D%22%23E50000%22/%3E%3Cpath%20d%3D%22M12.24%2019.3274C12.5%2019.3333%2012.752%2019.24%2012.945%2019.0664C13.036%2018.9899%2013.1099%2018.8942%2013.1599%2018.7861C13.2109%2018.678%2013.236%2018.5601%2013.236%2018.4409C13.236%2018.3213%2013.2089%2018.2031%2013.1569%2018.0953C13.1049%2017.9875%2013.0299%2017.8929%2012.9359%2017.8184C12.7389%2017.6479%2012.487%2017.5566%2012.227%2017.5619C11.967%2017.556%2011.7149%2017.6493%2011.5219%2017.8229C11.4299%2017.8994%2011.357%2017.9951%2011.306%2018.1032C11.256%2018.2113%2011.23%2018.3292%2011.231%2018.4484C11.23%2018.5681%2011.257%2018.6861%2011.309%2018.7939C11.361%2018.9017%2011.437%2018.9964%2011.531%2019.0709C11.727%2019.2413%2011.98%2019.3328%2012.24%2019.3274ZM12.24%2015.5294C12.42%2015.5343%2012.595%2015.4699%2012.729%2015.3494C12.792%2015.296%2012.842%2015.2296%2012.877%2015.1547C12.911%2015.0798%2012.9289%2014.9983%2012.9279%2014.9159V5.28589C12.9289%205.20269%2012.91%205.12069%2012.874%205.04559C12.838%204.97059%2012.786%204.90459%2012.721%204.85239C12.584%204.73259%2012.4069%204.66839%2012.2249%204.67239C12.0449%204.66739%2011.87%204.73189%2011.736%204.85239C11.673%204.90569%2011.623%204.97209%2011.588%205.04699C11.554%205.12189%2011.536%205.20339%2011.537%205.28589V14.9159C11.536%2014.999%2011.555%2015.0811%2011.591%2015.1561C11.627%2015.2311%2011.679%2015.2972%2011.744%2015.3494C11.882%2015.4699%2012.0599%2015.5342%2012.2429%2015.5294H12.24Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-width%3D%220.5%22/%3E%3C/svg%3E "); background-repeat: no-repeat;
    background-size: cover;
}
.alertSuccess {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M12%2024C18.627%2024%2024%2018.6274%2024%2012C24%205.3726%2018.627%200%2012%200C5.373%200%200%205.3726%200%2012C0%2018.6274%205.373%2024%2012%2024Z%22%20fill%3D%22%2321A44F%22/%3E%3Cpath%20d%3D%22M9.65698%2017.2695C9.56898%2017.2718%209.48302%2017.2483%209.40802%2017.202C9.33302%2017.1529%209.26497%2017.0933%209.20697%2017.025L5.36499%2012.654C5.30499%2012.5925%205.271%2012.5095%205.271%2012.423C5.271%2012.3365%205.30499%2012.2535%205.36499%2012.192C5.38999%2012.1662%205.41903%2012.1456%205.45203%2012.1315C5.48503%2012.1175%205.51999%2012.1102%205.55499%2012.1102C5.59099%2012.1102%205.626%2012.1175%205.659%2012.1315C5.691%2012.1456%205.721%2012.1662%205.745%2012.192L9.65698%2016.6995L18.264%206.81446C18.288%206.78866%2018.318%206.76807%2018.35%206.75397C18.383%206.73997%2018.418%206.73267%2018.454%206.73267C18.489%206.73267%2018.524%206.73997%2018.557%206.75397C18.59%206.76807%2018.619%206.78866%2018.643%206.81446C18.673%206.84246%2018.696%206.87627%2018.712%206.91367C18.729%206.95097%2018.737%206.99127%2018.737%207.03197C18.737%207.07267%2018.729%207.11296%2018.712%207.15026C18.696%207.18766%2018.673%207.22147%2018.643%207.24947L10.108%2017.025C10.048%2017.0955%209.97602%2017.1553%209.89502%2017.202C9.82302%2017.2453%209.74098%2017.2686%209.65698%2017.2695Z%22%20fill%3D%22white%22%20stroke%3D%22white%22%20stroke-width%3D%220.75%22/%3E%3C/svg%3E "); background-size: cover;
}



.loaderOverlay {
    background: rgb(6 6 6 / 65%);
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
}
.spinner {
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bar {
    transform-origin: 40px 40px;
    animation: fade 1.2s linear infinite;
    opacity: 0.1;
}

    /* 14 bars, 360° / 14 ≈ 25.714° spacing */
    .bar:nth-child(1) {
        transform: rotate(0deg);
        animation-delay: -1.2s;
        opacity: 1;
    }

    .bar:nth-child(2) {
        transform: rotate(25.7deg);
        animation-delay: -1.1s;
    }

    .bar:nth-child(3) {
        transform: rotate(51.4deg);
        animation-delay: -1s;
    }

    .bar:nth-child(4) {
        transform: rotate(77.1deg);
        animation-delay: -0.9s;
    }

    .bar:nth-child(5) {
        transform: rotate(102.8deg);
        animation-delay: -0.8s;
    }

    .bar:nth-child(6) {
        transform: rotate(128.5deg);
        animation-delay: -0.7s;
    }

    .bar:nth-child(7) {
        transform: rotate(154.2deg);
        animation-delay: -0.6s;
    }

    .bar:nth-child(8) {
        transform: rotate(179.9deg);
        animation-delay: -0.5s;
    }

    .bar:nth-child(9) {
        transform: rotate(205.6deg);
        animation-delay: -0.4s;
    }

    .bar:nth-child(10) {
        transform: rotate(231.3deg);
        animation-delay: -0.3s;
    }

    .bar:nth-child(11) {
        transform: rotate(257deg);
        animation-delay: -0.2s;
    }

    .bar:nth-child(12) {
        transform: rotate(282.7deg);
        animation-delay: -0.1s;
    }

    .bar:nth-child(13) {
        transform: rotate(308.4deg);
        animation-delay: 0s;
    }

    .bar:nth-child(14) {
        transform: rotate(334.1deg);
        animation-delay: 0.1s;
    }

@keyframes fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.1;
    }
}