/* Közös ÁTMR-betöltésjelző. A hálózat geometriája: img/atmr-logo.svg. */
.app-spinner {
    display: inline-block;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    overflow: visible;
    color: var(--text-secondary);
    vertical-align: middle;
}

.app-spinner-edges { opacity: 0.32; }
.app-spinner-signal {
    fill: none;
    stroke: var(--spinner-accent, var(--accent-teal));
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 16 84;
    animation: app-spinner-signal 2.4s linear infinite;
}
.app-spinner-node {
    transform-box: fill-box;
    transform-origin: center;
    animation: app-spinner-node 2.4s ease-in-out infinite;
}
.app-spinner-node-1 { animation-delay: -1.8s; }
.app-spinner-node-2 { animation-delay: -1.2s; }
.app-spinner-node-3 { animation-delay: -0.6s; }
.app-spinner-node-4 { fill: var(--spinner-accent, var(--accent-teal)); }
.app-spinner-halo {
    fill: none;
    stroke: var(--spinner-accent, var(--accent-teal));
    stroke-width: 2;
    transform-box: fill-box;
    transform-origin: center;
    animation: app-spinner-halo 2.4s ease-out infinite;
}
@keyframes app-spinner-signal { to { stroke-dashoffset: -100; } }
@keyframes app-spinner-node {
    0%, 35%, 100% { opacity: 0.65; transform: scale(0.92); }
    15% { opacity: 1; transform: scale(1.13); }
}
@keyframes app-spinner-halo {
    0% { opacity: 0.5; transform: scale(0.85); }
    65%, 100% { opacity: 0; transform: scale(1.8); }
}

/* A meglévő üres .spinner / .btn-spinner elemeket a loading.js tölti fel. */
.spinner.app-spinner-host,
.btn-spinner.app-spinner-host {
    border: 0;
    border-radius: 0;
    background: none;
    animation: none;
    vertical-align: middle;
}
.spinner.app-spinner-host { width: 64px; height: 64px; }
.btn-spinner.app-spinner-host { width: 20px; height: 20px; --spinner-accent: currentColor; }
.app-spinner-host > .app-spinner { width: 100%; height: 100%; color: inherit; }
.job-status-badge .btn-spinner.app-spinner-host { width: 16px; height: 16px; }

.app-loading-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
}
.app-loading-state > .app-spinner { width: 36px; height: 36px; }
.stat-label.app-loading-state > .app-spinner { width: 24px; height: 24px; }

.loading-overlay {
    background: color-mix(in srgb, var(--bg-primary) 82%, transparent);
    flex-direction: column;
    gap: 1rem;
    color: var(--text-secondary);
}
.loading-overlay .spinner { color: var(--text-secondary); }
.loading-overlay-label { font-size: 0.9rem; }

/* A legelső festéskor is animál: nem vár az alkalmazás JavaScriptjére. */
.auth-splash-mark.app-spinner {
    display: var(--brand-mark-display, block);
    width: 64px;
    height: 64px;
}
.auth-splash-logo { animation: app-brand-breathe 2.4s ease-in-out infinite; }
@keyframes app-brand-breathe { 50% { opacity: 0.65; transform: scale(0.96); } }

.app-request-status {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    flex-shrink: 0;
    padding: 0.2rem 0.65rem;
    border: 1px solid color-mix(in srgb, var(--accent-teal) 25%, var(--border-color));
    border-radius: 999px;
    background: var(--bg-card);
    color: var(--text-secondary);
    font-size: 0.8rem;
    line-height: 1.3;
    animation: app-loading-appear 0.2s ease-out both;
}
.app-request-status[hidden] { display: none; }
.app-request-status > .app-spinner { width: 32px; height: 32px; }
.app-request-status > .btn-spinner.app-spinner-host {
    width: 32px;
    height: 32px;
    --spinner-accent: var(--accent-teal);
}
.app-panel-loading {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1rem 0;
    color: var(--text-secondary);
}
.app-panel-loading[hidden] { display: none; }
@keyframes app-loading-appear { from { opacity: 0; } to { opacity: 1; } }
/* Kis képernyőn sem szorítja ki az iparágválasztót a felső sorból. */
@media (max-width: 1100px) {
    .app-request-status {
        position: fixed;
        top: calc(var(--nav-height) + 0.6rem);
        right: 0.75rem;
        max-width: calc(100vw - 1.5rem);
        box-shadow: var(--shadow-card);
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-spinner-signal, .app-spinner-node, .app-spinner-halo,
    .auth-splash-logo, .auth-splash-inner, .app-request-status {
        animation: none;
    }
    .app-spinner-node { opacity: 1; transform: none; }
    .app-spinner-halo { opacity: 0; }
    .app-spinner-signal { stroke-dasharray: none; opacity: 0.6; }
}
