/* Creator cards use shared card-base.css and archive-base.css. */
/* Spans depend on configured media, independently of live consent. */
.bv-archive--creators .bv-archive-main {
    container-type: inline-size;
    container-name: creator-archive;
}

.bv-archive--creators .bv-archive-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
}

.bv-archive--creators .bv-archive-grid > .bv-creator-card {
    grid-column: span 1;
}

.bv-archive--creators .bv-archive-grid > .bv-creator-card--has-video {
    max-width: none;
}

/* Match the shared archive breakpoint and two 300px tracks plus its 2rem gap. */
@media (min-width: 791px) {
    @container creator-archive (min-width: 1024px) {
        .bv-archive--creators .bv-archive-grid {
            grid-template-columns: repeat(4, minmax(0, 1fr));
        }
    }

    @container creator-archive (min-width: calc(600px + 2rem)) {
        .bv-archive--creators .bv-archive-grid > .bv-creator-card--has-video {
            grid-column: span 2;
        }
    }
}

@media (max-width: 790px) {
    .bv-archive--creators .bv-archive-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ---------------------------------------
   CREATOR FILTER
--------------------------------------- */

.bv-archive-filter-reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 14px;
    font-family: var(--bv-font-family);
    font-size: var(--bv-font-size-sm);
    font-weight: var(--bv-font-weight-medium);
    color: var(--bv-btn-text);
    background: var(--bv-btn-bg);
    border: 1px solid var(--bv-btn-border);
    border-radius: var(--bv-btn-radius);
    text-decoration: none;
    cursor: pointer;
    transition:
        border-color 0.2s ease,
        color 0.2s ease,
        background-color 0.2s ease,
        transform 0.2s ease;
}

.bv-archive-filter-reset:hover,
.bv-archive-filter-reset:focus {
    border-color: var(--bv-btn-border-hover);
    color: var(--bv-white) !important;
    background: var(--bv-surface-soft);
    text-decoration: none;
    transform: translateY(-1px);
}

.bv-archive-filter-reset:active {
    transform: translateY(0);
}

button.bv-archive-filter-reset {
    appearance: none;
    -webkit-appearance: none;
}