/**
 * Copyright (c) 2026 DNA Genics, S.L. All rights reserved.
 *
 * Heritage presentation for ancestry loading screens, shared and report-specific.
 * Opt-in is set by Views/Ancestry/_ViewStart.cshtml. Loader lifecycle stays in existing scripts.
 */

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader,
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader * {
    box-sizing: border-box;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader {
    --loading-primary: #213a2f;
    --loading-secondary: #213a2f;
    background: #faf8f4;
    color: #25241f;
    font-family: "Inter", system-ui, sans-serif;
    padding: calc(var(--nav-height, 72px) + 24px) 24px 40px;
    overflow: auto;
    transition: none;
    animation: none;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__background {
    display: none;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__content {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    column-gap: 36px;
    width: 100%;
    max-width: 820px;
    min-width: 0;
    margin: auto;
    padding: 52px 56px;
    border: 1px solid #e7e0d3;
    border-top: 3px solid #b08d4f;
    border-radius: 14px;
    background: #fffdf9;
    text-align: left;
    overflow-wrap: anywhere;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader :is(.dna-ladder, .heritage-ancestry-loader__indicator) {
    --dna-ladder-height: 80px;
    grid-column: 1;
    grid-row: 1 / 4;
    align-self: center;
    margin: 0;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .dna-ladder-strand {
    background: #b5bdb1;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__subtitle {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 14px;
    color: #213a2f;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: .14em;
    text-transform: uppercase;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__title {
    grid-column: 2;
    grid-row: 2;
    max-width: 17ch;
    margin: 0;
    color: #25241f;
    font-family: "Cormorant Garamond", "Playfair Display", Georgia, serif;
    font-size: clamp(34px, 4vw, 48px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -.025em;
    text-shadow: none;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__narrative {
    grid-column: 2;
    grid-row: 3;
    max-width: 44ch;
    min-height: 0;
    margin: 18px 0 0;
    color: #656158;
    font-size: 16px;
    line-height: 1.65;
    transition: none;
    font-style: normal;
    text-shadow: none;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__progress {
    grid-column: 2;
    grid-row: 4;
    width: 100%;
    height: 3px;
    margin: 30px 0 0;
    background: #e7e0d3;
    border-radius: 0;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__progress-fill {
    background: #213a2f;
    border-radius: 0;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__hint {
    grid-column: 2;
    grid-row: 5;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    gap: 8px;
    margin: 14px 0 0;
    color: #656158;
    font-size: 13px;
    line-height: 1.6;
}

#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__hint .dna-icon {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    margin-top: 3px;
    background-color: #83704d;
}

@media (max-width: 575px) {
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader {
        padding-inline: 16px;
        padding-bottom: 24px;
    }

    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__content {
        grid-template-columns: minmax(0, 1fr);
        padding: 30px 24px;
    }

    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader :is(.dna-ladder, .heritage-ancestry-loader__indicator) {
        --dna-ladder-height: 48px;
        grid-column: 1;
        grid-row: 1;
        margin-bottom: 24px;
    }

    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__subtitle { grid-column: 1; grid-row: 2; }
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__title { grid-column: 1; grid-row: 3; }
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__narrative { grid-column: 1; grid-row: 4; }
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__progress { grid-column: 1; grid-row: 5; }
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__hint { grid-column: 1; grid-row: 6; }
}

@media (prefers-reduced-motion: reduce) {
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader .heritage-ancestry-loader__progress-fill {
        animation: none;
        width: 100%;
        background: #b5bdb1;
    }
}

/* Preserve each legacy hide class: theme rules never set display/opacity/visibility on the overlay. */
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator {
    position: relative;
    width: 64px;
    height: 80px;
    padding: 0;
    color: #213a2f;
    background: transparent;
    border: 0;
    box-shadow: none;
    animation: none;
}
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator .dna-icon {
    width: 30px;
    height: 30px;
    color: #213a2f;
    background-color: #213a2f;
    animation: none;
}
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator::before,
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator::after { display: none; }
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator :is(.dna-spinner-ring, [class*="spinner-ring"], [class*="knot-ring"], [class*="helix-strand"], [class*="loading-ring"]) {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #e7e0d3;
    border-top-color: #b08d4f;
    border-radius: 50%;
    background: none;
    box-shadow: none;
    filter: none;
    transform: none;
}
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator [class*="ring-inner"] { inset: 20%; width: 60%; height: 60%; }
#page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator [class*="ring-middle"] { inset: 10%; width: 80%; height: 80%; }
@media (max-width: 575px) {
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader__indicator { width: 48px; height: 54px; }
}
@media (prefers-reduced-motion: reduce) {
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader *,
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader *::before,
    #page-top[data-ancestry-loading="heritage"] .heritage-ancestry-loader *::after { animation: none; transition: none; }
}
/* The existing haplogroup v2 accent remains recognisable within the common composition. */
#page-top[data-ancestry-loading="heritage"] :is(#mtvLoadingLoadingOverlay, #mtvLoadingOverlay, #mtvEmptyLoadingOverlay) { --loading-primary: #641339; }
#page-top[data-ancestry-loading="heritage"] :is(#mtvLoadingLoadingOverlay, #mtvLoadingOverlay, #mtvEmptyLoadingOverlay) .heritage-ancestry-loader__subtitle { color: #641339; }
#page-top[data-ancestry-loading="heritage"] :is(#mtvLoadingLoadingOverlay, #mtvLoadingOverlay, #mtvEmptyLoadingOverlay) .heritage-ancestry-loader__progress-fill { background: #641339; }