/*
 * fe-archive-bridge.css
 * Minimal override layer for CPT archive pages and unified /archiwum/.
 * Archive v2 shell (spacing/radius/shadow/padding/layout core) lives in fe-design-system.css.
 * Bridge should only apply endpoint accents and small, page-specific tweaks.
 */

/* ══ Hero accents only (v2 shell handles radius/shadow/padding) ═════════ */

body.post-type-archive .fe-archive .fe-archive__hero,
body.fe-archiwum-page  .fe-archive .fe-archive__hero {
    background: color-mix(in srgb, var(--fe-accent-bg) 34%, var(--fe-surface) 66%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 72%, transparent);
}

/* ══ Hero info block ═══════════════════════════════════════════════════ */

body.post-type-archive .fe-archive .fe-archive__hero-info,
body.fe-archiwum-page  .fe-archive .fe-archive__hero-info {
    background: color-mix(in srgb, var(--fe-accent-bg) 52%, var(--fe-surface) 48%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 65%, transparent);
}

/* ══ Metric tiles ══════════════════════════════════════════════════════ */

body.post-type-archive .fe-archive .fe-archive__metric,
body.fe-archiwum-page  .fe-archive .fe-archive__metric {
    background: color-mix(in srgb, var(--fe-accent-bg) 44%, var(--fe-surface) 56%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 58%, transparent);
}

/* ══ Filter section accents only (v2 shell handles radius/shadow/padding) ═ */

body.post-type-archive .fe-archive .fe-archive__filters,
body.fe-archiwum-page  .fe-archive .fe-archive__filters {
    background: color-mix(in srgb, var(--fe-accent-bg) 22%, var(--fe-surface) 78%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 68%, transparent);
}

.fe-archive__filters-head {
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--fe-line);
}

.fe-archive__filters-title {
    font-family: var(--fe-font);
    font-size: 15px;
    font-weight: 700;
    color: var(--fe-ink);
    margin: 0 0 5px;
    line-height: 1.3;
}

.fe-archive__filters-desc {
    font-size: 13px;
    color: var(--fe-muted);
    margin: 0;
    line-height: 1.55;
}

.fe-archive__filters--centered .fe-archive__filter-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr auto;
    gap: 14px;
    align-items: end;
}

@media (max-width: 900px) {
    .fe-archive__filters--centered .fe-archive__filter-form {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .fe-archive__filters--centered .fe-archive__filter-form {
        grid-template-columns: 1fr;
    }
}

/* Education box accent styling on clinical_test archive */
body.post-type-archive-clinical_test .fe-archive .fe-archive__education {
    background: color-mix(in srgb, var(--fe-accent-bg) 28%, var(--fe-surface) 72%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 72%, transparent);
}

.fe-archive__education-icon {
    flex-shrink: 0;
    margin-top: 2px;
    width: 26px;
    height: 26px;
    color: #f59e0b;
}

/* ══ Sidebar — ludzik widget accents only ══════════════════════════════ */

body.post-type-archive .fe-archive .fe-archive__sidebar .fe-body-widget,
body.fe-archiwum-page  .fe-archive .fe-archive__sidebar .fe-body-widget {
    background: color-mix(in srgb, var(--fe-accent-bg) 20%, var(--fe-surface) 80%);
    border-color: color-mix(in srgb, var(--fe-accent-border) 62%, transparent);
}

/* Toggle przód/tył — aktywny przycisk używa koloru akcentu */
body.post-type-archive .fe-archive .fe-archive__sidebar .fe-body-btn.is-active,
body.fe-archiwum-page  .fe-archive .fe-archive__sidebar .fe-body-btn.is-active {
    background: var(--fe-accent);
}

/* ══ Cards (hover accent only, shell controls base radius/padding/shadow) ═ */

body.post-type-archive .fe-archive .fe-archive__card:hover,
body.fe-archiwum-page  .fe-archive .fe-archive__card:hover {
    border-color: color-mix(in srgb, var(--fe-accent) 55%, var(--fe-border-ink, #cbd5e1));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--fe-accent) 16%, rgba(15, 23, 42, 0.1));
}

/* ══ Grid gap ══════════════════════════════════════════════════════════ */

body.post-type-archive .fe-archive .fe-archive__grid,
body.fe-archiwum-page  .fe-archive .fe-archive__grid {
    gap: 20px;
}

/* ══ Results count separator ══════════════════════════════════════════ */

body.post-type-archive .fe-archive .fe-archive__results-count,
body.fe-archiwum-page  .fe-archive .fe-archive__results-count {
    border-bottom-color: color-mix(in srgb, var(--fe-accent-border) 62%, transparent);
}


/* ══ Karta: odznaki nad obrazem (zamiast styli inline w rendererze) ═════ */

.fe-archive__card-badges {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    pointer-events: none;
}

.fe-archive__card-badges .fe-archive__card-region,
.fe-archive__card-badges .fe-badge-type {
    margin: 0;
    box-shadow: var(--fe-shadow);
}

/* ══ Karta: wiersze meta (dawny inline font-size/color/margin-top) ══════ */

.fe-archive__card-meta-list {
    margin: auto 0 0;
    padding: 0;
    font-size: 0.875rem;
    color: var(--fev3-secondary);
}

.fe-archive__card-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.fe-archive__card-meta-list dt {
    margin: 0;
    font-weight: 700;
}

.fe-archive__card-meta-list dd {
    margin: 0;
}

/* ══ Karta: puste kluczowe cechy oraz ikona CTA ═════════════════════════ */

.fev3-card-highlight-empty {
    margin: 0;
    font-size: 0.875rem;
    color: var(--fev3-on-surface-variant);
}

.fev3-card-link .fe-archive__card-cta-icon,
.fev3-card-link .fe-archive__card-cta-icon svg {
    width: 18px;
    height: 18px;
}

/* ══ Siatka wyników: stan ładowania bez styli inline ═══════════════════ */

.fe-archive__grid.is-loading,
.fe-archive__grid[aria-busy="true"] {
    opacity: 0.55;
    transition: opacity 160ms ease-in-out;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .fe-archive__grid.is-loading,
    .fe-archive__grid[aria-busy="true"] {
        transition: none;
    }
}


/* ══ Redesign archiwów atlasu (flaga fe_atlas_archive_redesign_enabled) ══
   Klasy używane przez fe_atlas_archive_render_* — wyłącznie tokeny
   z fe-design-system.css, zero styli inline w szablonach. */

/* Liczba kolumn pigułki filtrów zamiast inline --fe-select-filter-cols */
.fe-archive__select-filters--cols-3 { --fe-select-filter-cols: 3; }
.fe-archive__select-filters--cols-4 { --fe-select-filter-cols: 4; }
.fe-archive__select-filters--cols-5 { --fe-select-filter-cols: 5; }
.fe-archive__select-filters--cols-6 { --fe-select-filter-cols: 6; }

/* Wiersz akcji: widoczny submit + odnośnik czyszczący filtry */
.fe-archive__filter-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
}

.fe-archive__filter-submit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;
    border: 1px solid var(--fe-brand-primary, var(--fe-accent));
    border-radius: 999px;
    background: var(--fe-brand-primary, var(--fe-accent));
    color: #fff;
    font-family: var(--fe-font);
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
    cursor: pointer;
    transition: filter 0.15s ease, box-shadow 0.15s ease;
}

.fe-archive__filter-submit:hover {
    filter: brightness(1.06);
}

.fe-archive__filter-submit:focus-visible {
    outline: 2px solid var(--fe-ink);
    outline-offset: 2px;
}

.fe-archive__filter-submit-icon,
.fe-archive__filter-submit-icon svg {
    width: 16px;
    height: 16px;
}

/* Pasek licznika wyników + ukryty wizualnie region ogłoszeń */
.fe-archive__results-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px;
}

.fe-archive__results-bar .fe-archive__results-count {
    flex: 1 1 auto;
    min-width: 0;
}

.fe-archive__results-status.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 480px) {
    .fe-archive__filter-actions {
        gap: 8px;
    }

    .fe-archive__filter-submit {
        flex: 1 1 100%;
        justify-content: center;
    }
}


/* ══ Kolumna boczna archiwum: jedna kolumna na wąskich ekranach ══════════
   `fe-design-system.css` ustawia dla archiwów siatkę
   `minmax(0, 1fr) 292px` poza zapytaniem medialnym, więc na telefonach
   (320 px) panel regionów wypychał dokument w poziomie. Most ładuje się po
   systemie projektowym, dlatego to tutaj domykamy wymaganie 5.6. */
@media (max-width: 1200px) {
    body.post-type-archive .fe-archive .fe-archive__with-sidebar,
    body.fe-archiwum-page  .fe-archive .fe-archive__with-sidebar {
        grid-template-columns: minmax(0, 1fr);
    }

    body.post-type-archive .fe-archive .fe-archive__sidebar,
    body.fe-archiwum-page  .fe-archive .fe-archive__sidebar {
        position: static;
        width: 100%;
    }
}