/* Phase 15C refinements */

.filter-shortcut-groups {
    display: grid;
    gap: 14px;
    margin: 22px 0 24px;
}

.shortcut-label {
    margin: 0 0 7px;
    font-weight: 850;
    color: var(--navy);
}

.filter-shortcut-groups .category-shortcuts {
    margin: 0;
}

.type-shortcuts .category-chip {
    border-style: dashed;
}

.phase15c-filters {
    display: grid;
    grid-template-columns:
        minmax(250px, 2fr)
        minmax(160px, 1fr)
        minmax(160px, 1fr)
        minmax(130px, .85fr)
        minmax(130px, .85fr)
        minmax(110px, .7fr)
        minmax(110px, .7fr)
        minmax(150px, .9fr)
        auto;
    gap: 12px;
    align-items: end;
    margin: 22px 0 26px;
    padding: 18px;
    background: rgba(255,255,255,.62);
    border: 1px solid #ddd3c3;
    border-radius: 10px;
}

.phase15c-filters label {
    display: grid;
    gap: 6px;
    min-width: 0;
    font-size: .82rem;
    font-weight: 800;
}

.phase15c-filters input,
.phase15c-filters select,
.phase15c-filters .button {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    margin: 0;
}

.phase15c-filters select {
    text-overflow: ellipsis;
}

.phase15c-filters .clear-filters {
    padding-left: 16px;
    padding-right: 16px;
    white-space: nowrap;
}

/* Smaller desktop gallery so image and thumbnails fit together */
@media (min-width: 851px) {
    .phase15-detail .book-detail-grid {
        grid-template-columns: minmax(300px, 470px) minmax(0,1fr);
        gap: clamp(30px,4vw,58px);
    }

    .phase15-detail .gallery-stage {
        min-height: 430px;
        max-height: 58vh;
    }

    .phase15-detail .gallery-image {
        height: min(53vh, 560px);
    }

    .phase15-detail .gallery-thumbnail img {
        height: 66px;
    }

    .phase15-detail .gallery-thumbnails {
        grid-template-columns: repeat(auto-fit,minmax(62px,1fr));
    }
}

@media (max-width: 1300px) {
    .phase15c-filters {
        grid-template-columns: repeat(4,minmax(150px,1fr));
    }

    .phase15c-filters .search-field {
        grid-column: span 2;
    }
}

@media (max-width: 760px) {
    .phase15c-filters {
        grid-template-columns: 1fr 1fr;
        padding: 14px;
    }

    .phase15c-filters .search-field {
        grid-column: 1 / -1;
    }
}

@media (max-width: 500px) {
    .phase15c-filters {
        grid-template-columns: 1fr;
    }

    .phase15c-filters .search-field {
        grid-column: auto;
    }
}
