/* 찾기(투어·강사 찾기 public/find.blade.php, 샵 찾기 public/find-shops.blade.php). 탭 줄은 공개 주제 탭(.public-tabs__list)의 링크 모양을 그대로 쓴다. */

/* 조건: 휴대폰은 한 줄에 하나, 태블릿부터 펼친 조건이 한 줄. 나머지 조건은 "조건 더 보기"(details)로 접고, 보는 순서·찾기는 맨 아래 한 줄. */
.find-filters { display: grid; gap: var(--space-4); margin-top: var(--space-6); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--shadow-ambient); padding: var(--space-5); }
.find-filters__main { display: grid; gap: var(--space-4); }
@media (min-width: 40rem) {
    .find-filters__main { grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); align-items: start; }
}

.find-filters__more { border-top: var(--border-width) solid var(--color-border); padding-top: var(--space-3); }
.find-filters__more > summary { display: flex; min-height: 2.75rem; align-items: center; gap: var(--space-2); color: var(--color-text); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); cursor: pointer; list-style: none; }
.find-filters__more > summary::-webkit-details-marker { display: none; }
.find-filters__count { display: inline-grid; min-width: 1.375rem; height: 1.375rem; place-items: center; border-radius: var(--radius-pill); background: var(--color-brand); padding: 0 .375rem; color: var(--color-surface); font-family: var(--font-gauge); font-size: var(--font-size-sm); }
.find-filters__chevron { margin-left: auto; transition: transform .2s ease; }
.find-filters__more[open] .find-filters__chevron { transform: rotate(180deg); }
.find-filters__panel { display: grid; gap: var(--space-5); padding-top: var(--space-3); }
.find-filters__group { display: grid; min-width: 0; gap: var(--space-2); margin: 0; border: 0; padding: 0; }
.find-filters__group > legend { margin-bottom: var(--space-1); padding: 0; color: var(--color-text); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); }
.find-filters__hint { color: var(--color-text-muted); font-size: var(--font-size-xs); line-height: var(--line-height-body); word-break: keep-all; }
@media (min-width: 40rem) {
    .find-filters__group:has(> .form-group) { max-width: 20rem; }
}

/* 조건 칩: 누르면 켜지고(체크박스) 켜진 칩은 브랜드 색. 입력은 칩 안에 숨기되 키보드 초점은 칩 테두리로 보인다. */
.find-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.find-chip { position: relative; display: inline-flex; }
.find-chip > input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.find-chip > span { display: inline-flex; min-height: 2.5rem; align-items: center; gap: var(--space-1); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-surface); padding: 0 var(--space-3); color: var(--color-text-secondary); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); word-break: keep-all; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.find-chip > input:checked + span { border-color: var(--color-brand); background: var(--color-brand); color: var(--color-surface); }
.find-chip > input:focus-visible + span { outline: var(--border-width-accent) solid var(--color-focus); outline-offset: 2px; }
@media (hover: hover) {
    .find-chip:hover > input:not(:checked) + span { border-color: var(--color-brand); color: var(--color-brand); }
}

.find-filters__actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); }
.find-filters__actions > .btn { min-height: var(--form-field-height); }
.find-filters__reset { grid-column: 1 / -1; justify-self: start; font-size: var(--font-size-sm); }
@media (min-width: 40rem) {
    .find-filters__actions { grid-template-columns: minmax(10rem, 16rem) auto auto; justify-content: start; }
    .find-filters__reset { grid-column: auto; }
}

.find-summary { margin-top: var(--space-6); color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-body); word-break: keep-all; }
.find-summary > strong { color: var(--color-text); font-family: var(--font-gauge); font-size: var(--font-size-lg); }

.find-results { display: grid; gap: var(--space-4); margin-top: var(--space-4); }
@media (min-width: 64rem) {
    .find-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .find-results > .empty-state { grid-column: 1 / -1; }
}

/* 결과 카드: 투어는 상태 배지 → 기간 → 제목 → 지역·종목 → 강사(확인된 자격·인증), 강사는 첫 글자 동그라미 + 이름·확인된 정보·활동·소개. */
.find-card { position: relative; display: grid; min-width: 0; align-content: start; gap: var(--space-2); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--shadow-ambient); padding: var(--space-5); }
.find-card--person { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-4); }
.find-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.find-card__count { color: var(--color-text-secondary); font-size: var(--font-size-sm); }
.find-card__count strong { color: var(--color-brand); font-family: var(--font-gauge); font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); }
.find-card__when { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-2); color: var(--color-text); font-family: var(--font-gauge); font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); }
.find-card__when > .icon { align-self: center; color: var(--color-text-muted); }
.find-card__when > small { color: var(--color-text-secondary); font-family: var(--font-sans); font-size: var(--font-size-sm); font-weight: var(--font-weight-regular); }
.find-card__title { color: var(--color-text); font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); line-height: var(--line-height-tight); word-break: keep-all; }
.find-card__title > a { color: inherit; text-decoration: none; }
/* 카드 전체를 누를 수 있게 제목 링크를 카드 크기로 넓힌다. 카드 안의 다른 링크(강사 프로필)는 그 위로 올린다. */
.find-card__title > a::after { position: absolute; inset: 0; border-radius: inherit; content: ""; }
.find-card__title > a:focus-visible { outline: none; }
.find-card:has(.find-card__title > a:focus-visible) { outline: var(--border-width-accent) solid var(--color-focus); outline-offset: 2px; }
.find-card__meta { display: flex; align-items: baseline; gap: var(--space-1); color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-body); }
.find-card__instructor { display: grid; gap: var(--space-2); margin-top: var(--space-2); border-top: var(--border-width) solid var(--color-border); padding-top: var(--space-3); }
.find-card__by { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-text-muted); font-size: var(--font-size-sm); }
.find-card__profile { position: relative; z-index: 1; color: var(--color-brand); font-weight: var(--font-weight-semibold); text-decoration: underline; text-underline-offset: .2em; }
.find-card__body { display: grid; min-width: 0; gap: var(--space-2); }
.find-card__avatar { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 50%; background: var(--color-brand-soft); color: var(--color-brand); font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); }
.find-card__bio { color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-loose); word-break: keep-all; }
.find-card__status { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); color: var(--color-text-secondary); font-size: var(--font-size-xs); }
.find-card__status > span { display: inline-flex; align-items: center; gap: var(--space-1); }
@media (hover: hover) {
    .find-card:has(.find-card__title > a):hover .find-card__title { color: var(--color-brand); }
}

/* 샵 카드: 나라·지역 → 상호 → 위치 문장 → 확인된 종목·서비스 → 교육 단체 공식 목록 → 홈페이지·출처. 카드 전체 링크 없이 링크마다 누른다(모두 바깥 사이트). */
.find-card--shop { display: flex; flex-direction: column; }
.find-card__place { color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-body); overflow-wrap: anywhere; }
.find-card__tags { display: flex; flex-wrap: wrap; gap: var(--space-1); margin: 0; padding: 0; list-style: none; }
.find-card__tags > li { border-radius: var(--radius-pill); background: var(--color-brand-soft); padding: .125rem var(--space-2); color: var(--color-brand); font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); }
.find-card__agencies { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-1); color: var(--color-text-secondary); font-size: var(--font-size-sm); }
.find-card__agencies > a { color: var(--color-brand); font-weight: var(--font-weight-semibold); text-decoration: underline; text-underline-offset: .2em; }
.find-card__foot { display: grid; gap: var(--space-1); margin-top: auto; border-top: var(--border-width) solid var(--color-border); padding-top: var(--space-3); }
.find-card__foot > .text-link { justify-self: start; font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); }
.find-card__foot > .public-source-note { overflow-wrap: anywhere; }
.find-summary > .text-link { margin-left: var(--space-1); white-space: nowrap; }

.find-note { display: grid; gap: var(--space-2); }