/**
 * pages/cameraman_list.css
 * 検索・一覧ページ専用スタイル。
 * 接頭辞: .p-list
 */

.p-list__header {
    padding-block: var(--space-5);
}

.p-list__title {
    font-size: var(--fs-h1);
    margin-bottom: var(--space-2);
}

.p-list__count {
    font-size: var(--fs-small);
    color: var(--color-text-sub);
}

.p-list__body {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding-bottom: var(--space-8);
}

@media (min-width: 1024px) {
    .p-list__body {
        flex-direction: row;
        align-items: flex-start;
    }
}

/* -----------------------------------------------------------------
 * ファセット検索（絞り込みUI）
 * ----------------------------------------------------------------- */
.p-list__facets {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
}

@media (min-width: 1024px) {
    .p-list__facets {
        width: 280px;
        flex-shrink: 0;
        position: sticky;
        top: calc(72px + var(--space-4));
    }
}

.p-list__facet-group {
    margin-bottom: var(--space-5);
}

.p-list__facet-legend {
    font-size: var(--fs-small);
    font-weight: var(--fw-bold);
    margin-bottom: var(--space-2);
}

.p-list__facet-options {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.p-list__facet-checkbox {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.p-list__facet-label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 36px;
    font-size: var(--fs-small);
    cursor: pointer;
}

.p-list__facet-label::before {
    content: "";
    width: 18px;
    height: 18px;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-sm);
    flex-shrink: 0;
}

.p-list__facet-checkbox:checked + .p-list__facet-label {
    color: var(--color-primary);
    font-weight: var(--fw-medium);
}

.p-list__facet-checkbox:checked + .p-list__facet-label::before {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.p-list__facet-checkbox:focus-visible + .p-list__facet-label::before {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

/* -----------------------------------------------------------------
 * 結果エリア
 * ----------------------------------------------------------------- */
.p-list__results {
    flex: 1;
    min-width: 0;
}

.p-list__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-4);
}

.p-list__sort-select {
    height: 40px;
    padding-inline: var(--space-3);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border-strong);
    font-size: var(--fs-small);
}

.p-list__pr-note {
    font-size: var(--fs-caption);
    color: var(--color-text-sub);
    margin-bottom: var(--space-3);
}

.p-list__pr-grid {
    margin-bottom: var(--space-6);
}

.p-list__pagination-wrap {
    margin-top: var(--space-8);
}

/* -----------------------------------------------------------------
 * 0件時
 * ----------------------------------------------------------------- */
.p-list__empty {
    text-align: center;
    padding-block: var(--space-10);
}

.p-list__empty-title {
    font-size: var(--fs-h2);
    margin-bottom: var(--space-4);
}

.p-list__empty-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-3);
    margin-top: var(--space-5);
}