/**
 * SEO Tool Form – Audit Progress Modal Styles
 * Extracted from inline <style> for cacheability and deduplication.
 *
 * @package  mod_seotool_form
 * @since    1.2.0
 */

/* Progress bar container */
#audit-progress-modal #domain_progress_bar_con {
    position: relative;
    overflow: hidden;
}

/* Keep the bar vertically centered; actual height is controlled by the inline style on the .progress container */
#audit-progress-modal #domain_progress_bar_con .progress-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

/*
    Guarantee visible stripes + animation within this modal only.
    (Some site templates/plugins disable progress stripes globally by overriding background-image.)
*/
#audit-progress-modal #domain_progress_bar_con .progress-bar.progress-bar-striped {
    background-image: linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.18) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.18) 50%,
        rgba(255, 255, 255, 0.18) 75%,
        transparent 75%,
        transparent
    ) !important;
    background-size: 1rem 1rem;
}

@keyframes lp-audit-progress-stripes {
    from { background-position: 1rem 0; }
    to { background-position: 0 0; }
}

#audit-progress-modal #domain_progress_bar_con .progress-bar.progress-bar-animated {
    animation: lp-audit-progress-stripes 1s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
    #audit-progress-modal #domain_progress_bar_con .progress-bar.progress-bar-animated {
        animation: none;
    }
}

/* Visible percent label (do NOT use .visually-hidden here) */
#audit-progress-modal #domain_progress_bar_con .progress-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: #111827;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.65);
    pointer-events: none;
    user-select: none;
}

/* Optional secondary "friendly" status line */
#audit-progress-modal #domain_progress_friendly_text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* Fixed height so the modal doesn't bounce between messages (or during the blank gap). */
    line-height: 1.4em;
    height: 1.4em;
    opacity: 1;
    transform: translateY(0);
    transition: opacity 260ms ease, transform 260ms ease;
}

#audit-progress-modal #domain_progress_friendly_text.lp-fade-out {
    opacity: 0;
    transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
    #audit-progress-modal #domain_progress_friendly_text {
        transition: none;
    }
}

/* Brand colors — moved from inline styles to reduce inline CSS count */
#audit-progress-modal .modal-header {
    background-color: #7a2255;
    border-bottom: 0;
}

#audit-progress-modal .audit-spinner {
    color: #7a2255;
}

#audit-progress-modal #domain_progress_bar_con {
    display: none;
    height: 20px;
    background-color: #e9ecef;
}

#audit-progress-modal .progress-bar {
    width: 0%;
    background-color: #7a2255 !important;
}

#audit-progress-modal .modal-footer {
    border-top: 1px solid #e5e7eb;
}