[data-hh-partial-region] {
    position: relative;
}

[data-hh-partial-region][aria-busy="true"] {
    min-height: 18rem;
}

.hh-partial-loader {
    align-items: center;
    animation: hhPartialFadeIn 160ms ease-out both;
    background: rgba(245, 249, 255, .88);
    backdrop-filter: blur(7px);
    border-radius: 18px;
    display: flex;
    inset: 0;
    justify-content: center;
    min-height: 18rem;
    position: absolute;
    z-index: 120;
}

.hh-partial-loader-card {
    align-items: center;
    color: #15365d;
    display: flex;
    flex-direction: column;
    font-size: .82rem;
    font-weight: 700;
    gap: 1rem;
    letter-spacing: .01em;
    text-align: center;
}

.hh-partial-loader-mark {
    align-items: center;
    background: linear-gradient(145deg, #0a2e5c, #0c55a7);
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 22px;
    box-shadow: 0 18px 45px rgba(8, 43, 83, .22);
    display: flex;
    height: 82px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 82px;
}

.hh-partial-loader-mark::before {
    animation: hhPartialOrbit 1.2s linear infinite;
    border: 2px solid rgba(255, 255, 255, .22);
    border-right-color: #57b8ff;
    border-top-color: #fff;
    border-radius: 50%;
    content: "";
    inset: 7px;
    position: absolute;
}

.hh-partial-loader-mark img {
    animation: hhPartialPulse 1.25s ease-in-out infinite;
    height: auto;
    max-width: 56px;
    position: relative;
    width: 68%;
}

.hh-partial-progress {
    background: rgba(27, 95, 165, .13);
    border-radius: 999px;
    height: 4px;
    overflow: hidden;
    width: 132px;
}

.hh-partial-progress::after {
    animation: hhPartialProgress 1.05s ease-in-out infinite;
    background: linear-gradient(90deg, #1377dd, #51b8ff);
    border-radius: inherit;
    content: "";
    display: block;
    height: 100%;
    width: 42%;
}

.hh-partial-error {
    align-items: center;
    background: #fff5f4;
    border: 1px solid #ffd3cf;
    border-radius: 14px;
    color: #76261f;
    display: flex;
    gap: .85rem;
    margin: 0 0 1rem;
    padding: .9rem 1rem;
}

.hh-partial-error i {
    color: #d7463b;
}

.hh-partial-error span {
    flex: 1 1 auto;
}

.hh-partial-error button,
.hh-partial-error a {
    background: #fff;
    border: 1px solid #e4aaa5;
    border-radius: 9px;
    color: #76261f;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    padding: .45rem .75rem;
    text-decoration: none;
}

html[data-hh-theme="dark"] .hh-partial-loader {
    background: rgba(8, 25, 46, .9);
}

html[data-hh-theme="dark"] .hh-partial-loader-card {
    color: #e7f2ff;
}

html[data-hh-theme="dark"] .hh-partial-progress {
    background: rgba(125, 187, 247, .2);
}

html[data-hh-theme="dark"] .hh-partial-error {
    background: #321c22;
    border-color: #6f3540;
    color: #ffd9d6;
}

html[data-hh-theme="dark"] .hh-partial-error button,
html[data-hh-theme="dark"] .hh-partial-error a {
    background: #142942;
    border-color: #82515a;
    color: #fff;
}

@keyframes hhPartialFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes hhPartialOrbit {
    to { transform: rotate(360deg); }
}

@keyframes hhPartialPulse {
    0%, 100% { opacity: .86; transform: scale(.94); }
    50% { opacity: 1; transform: scale(1); }
}

@keyframes hhPartialProgress {
    from { transform: translateX(-115%); }
    to { transform: translateX(340%); }
}

@media (prefers-reduced-motion: reduce) {
    .hh-partial-loader,
    .hh-partial-loader-mark::before,
    .hh-partial-loader-mark img,
    .hh-partial-progress::after {
        animation: none;
    }
}
