/* V1.28 사용자 화면 전용 디자인.
   기존 배치·반응형 구조·컨트롤 높이·동작은 style.css 및 각 화면에서 유지합니다.
   관리자에서는 이 파일을 불러오지 않습니다. */
.public-body{
 --ink:#252b33;--muted:#66717e;--line:#e1e5e9;--bg:#f7f8fa;
 --green:#253e70;--green2:#244c87;--lime:#eef2f7;--blue:#315f98;
 --danger:#a3373e;--radius:8px;--shadow:none;
 color:var(--ink);background:#fff;font-weight:400;
}
.public-body :is(h1,h2,h3){color:#222c3b;letter-spacing:-.035em}
.public-body :is(b,strong){font-weight:600}
.public-body :is(input,select,textarea,.check,.summary-line,.facts,.terms-body){font-weight:400}
.public-body :is(.muted,.field-help,.inline-note,.breadcrumb){color:var(--muted);font-weight:400}
.public-body :is(.eyebrow,.hero .eyebrow){color:#687583;font-weight:500;letter-spacing:.1em}

/* 헤더·푸터: 기존 고정 헤더 높이와 중앙 정렬 유지 */
.public-body .public-header{border-color:var(--line);box-shadow:none}
.public-body .header-logo{width:240px;height:auto;max-width:100%;max-height:56px;object-fit:contain;object-position:left center}
.public-body :is(.utility,#utility){color:#646e7a;font-weight:400}
.public-body .nav-wrap nav{font-weight:600;color:#2a3443}
.public-body .nav-wrap nav a:hover{color:var(--green2)}
.public-body .public-footer{background:#f8f9fa;border-color:var(--line);color:#737b85}
.public-body .public-footer :is(.footer-info,.footer-links,.footer-bottom){font-weight:400}
.public-body .public-footer .footer-info span{color:#4c5663;font-weight:500}
.public-body .public-footer a:hover{color:var(--green);text-decoration:underline;text-underline-offset:4px}
.public-body .test-strip{background:#faf6e9;border-color:#ebe3cb;color:#786138}

/* 메인: 동일한 2열 구성과 축구장 도형을 유지하고 입체 장식을 정돈 */
.public-body .hero{background:#f7f8fa;border-bottom:1px solid var(--line)}
.public-body .hero h1{color:#24334a;letter-spacing:-.045em}
.public-body .hero p{color:#64707e}
.public-body .pitch{
 background:#496777;border-color:#e1e8ec;border-radius:5px;
 transform:none;box-shadow:none;
}
.public-body .cover .pitch{box-shadow:none}
.public-body .art-label{border:1px solid var(--line);border-radius:6px;box-shadow:none;color:#596675}
.public-body .art-label strong{color:#2c3d52;font-weight:600}
.public-body :is(.facility-card,.detail-cover){border-radius:8px}
.public-body :is(.facility-card .cover,.detail-cover){background:#edf1f3}
.public-body .facility-card{border-color:var(--line);box-shadow:none;transition:border-color .18s ease}
.public-body .facility-card:hover{border-color:#b9c5d2;box-shadow:none}
.public-body .facility-card .cover{height:auto;min-height:260px;align-self:stretch}
.public-body .facility-card .cover>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:800px){.public-body .facility-card .cover{height:220px;min-height:220px}}
.public-body .card-bottom{border-color:var(--line)}
.public-body .cover-caption{background:#ffffffeb;color:#596675;font-weight:400}

/* 공통 패널·버튼·입력창 */
.public-body .panel{border-color:var(--line);border-radius:8px;box-shadow:none}
.public-body :is(.btn,input,select,textarea){border-radius:5px}
.public-body .btn{border-color:#ccd2da;color:#344151;background:#fff;font-weight:500;box-shadow:none}
.public-body .btn:hover{border-color:#a8b5c5;background:#f7f9fb}
.public-body :is(.btn.primary,.btn.dark){background:var(--green);border-color:var(--green);color:#fff}
.public-body :is(.btn.primary,.btn.dark):hover{background:#1c315b;border-color:#1c315b}
.public-body .btn.lime{background:#eef2f7;border-color:#d7dfe9;color:var(--green)}
.public-body .btn.danger{background:#fff;border-color:#e1bdc1;color:var(--danger)}
.public-body .btn.danger:hover{background:#fcf2f3;border-color:#c98f97}
.public-body .btn.link{background:none;border:0;color:var(--green);text-underline-offset:3px}
.public-body .btn.naver{background:#03c75a;border-color:#03c75a;color:#fff}
.public-body .btn.kakao{background:#fee500;border-color:#fee500;color:#302900}
.public-body .btn.naver:hover{background:#03b852;border-color:#03b852}
.public-body .btn.kakao:hover{background:#f2d900;border-color:#f2d900}
.public-body .btn:disabled{opacity:.45}
.public-body :is(input,select,textarea){border-color:#cdd3db;color:#303a48}
.public-body :is(input[readonly],input:disabled,select:disabled,textarea:disabled){background:#f5f6f8;color:#707a87}
.public-body :is(a,button,input,select,textarea):focus-visible{outline:2px solid #7396c9;outline-offset:3px}
.public-body :is(input[type=checkbox],input[type=radio]){accent-color:var(--green)}
.public-body .searchbar{border-color:#ccd3dc;border-radius:5px;box-shadow:none;background:#fff}
.public-body .steps span{border-top-width:2px;color:#738091}
.public-body .steps span.active{border-color:var(--green);color:var(--green)}
.public-body .tabs :is(button,a){font-weight:500;border-bottom-width:2px}
.public-body .tabs .active{color:var(--green);border-color:var(--green);font-weight:600}
.public-body .terms-block{border-color:var(--line);border-radius:5px}
.public-body .terms-block summary{font-weight:500}
.public-body .terms-body{background:#f7f8fa;color:#606b78}
.public-body fieldset{border-color:var(--line);border-radius:6px}

/* 안내와 상태: 의미별 색상 구분은 유지하고 채도를 낮춤 */
.public-body .notice{background:#f4f6f9;border-color:#dfe5ed;color:#46576e;border-radius:5px;font-weight:400}
.public-body .notice.warning{background:#fcf8ee;border-color:#e9dec2;color:#7c602c}
.public-body .notice.danger{background:#fcf3f4;border-color:#ebd3d7;color:#9a3d47}
.public-body .notice.success{background:#f0f6f3;border-color:#d5e4dc;color:#3d6a52}
.public-body .form-error{background:#fcf1f2;color:#a3373e;border-radius:5px}
.public-body .badge{border-radius:4px;background:#f0f2f5;color:#626d7a;font-weight:500}
.public-body .badge.green{background:#eef3ef;color:#426b52}
.public-body :is(.badge.blue,.badge.confirmed){background:#eaf0f8;color:#365c90}
.public-body :is(.badge.yellow,.badge.new){background:#fbf3e4;color:#89652c}
.public-body :is(.badge.red,.badge.cancel_requested){background:#faecee;color:#a34953}
.public-body .badge.cancelled{background:#eff1f3;color:#747e89}
.public-body .empty{background:#fafbfc;border-style:solid;border-color:var(--line);border-radius:6px}

/* 예약 달력·회차: 크기와 배열 유지, 선택 시 테두리 두께 변화 제거 */
.public-body .calendar-layout{border-color:#dce2e9}
.public-body .calendar-week span{color:#77818e}
.public-body .cal-day{border-radius:5px;font-weight:500}
.public-body .cal-day.available{background:#f3f6fa;border-color:#dce4ef;color:#344e75}
.public-body .cal-day.available small{color:#5d7494}
.public-body .cal-day.available:hover:not(:disabled){background:#eaf0f8;border-color:#a4b8d2}
.public-body .cal-day.sun:not(.selected){color:#b15f61}
.public-body .cal-day.sat:not(.selected){color:#436b9b}
.public-body :is(.cal-day.closed,.cal-day.booked,.cal-day.unopened,.cal-day.past){background:#f5f6f7;color:#8b949f}
.public-body .cal-day.quota-limited{background:#fcf6e9;border-color:#e5d4ae;color:#8b6730}
.public-body .cal-day.selected,.public-body .cal-day.selected:hover:not(:disabled){background:var(--green);border-color:var(--green);color:#fff}
.public-body .cal-day.selected small{color:#fff}
.public-body .cal-day.quota-limited.selected,.public-body .cal-day.quota-limited.selected:hover:not(:disabled){background:#87662f;border-color:#87662f;color:#fff}
.public-body .slot-panel{background:#f7f8fa;border-radius:6px}
.public-body .slot{border:1px solid #dbe1e8;border-radius:5px;color:#344151;background:#fff;box-shadow:none}
.public-body .slot strong{font-weight:600}
.public-body .slot small{color:#687586}
.public-body .slot:hover:not(:disabled){background:#f1f5fa;border-color:#96adc9}
.public-body .slot.selected,.public-body .slot.selected:hover:not(:disabled){border:1px solid var(--green);background:#edf2f8;box-shadow:inset 0 0 0 1px var(--green)}
.public-body .slot:disabled{background:#f0f2f5;border-color:#e0e4e9;color:#7d8795;opacity:.7}
.public-body .slot.quota-view-only:disabled{background:#f4f6f9;border-color:#dce3ed;color:#52667e;opacity:1}
.public-body .dot.green{background:#8ea7c7}
.public-body .dot.dark{background:var(--green)}
.public-body #reservation-quota .quota-summary{background:#fafbfc;border-color:var(--line);border-radius:8px}
.public-body .quota-card{border-color:#dfe4ea;border-radius:5px;box-shadow:none}
.public-body .quota-card.other-type{background:#f7f8fa}
.public-body .quota-card.limit-reached{background:#fcf8ef;border-color:#e4d4b2}
.public-body .quota-card strong{color:#304d78}
.public-body .quota-card small{color:#6c7786}
.public-body .quota-card strong span{color:#748091;font-weight:400}
.public-body .quota-card b{color:#89642a}

/* 신청서·내 예약·회원정보·안내·팝업에 같은 표면 스타일 적용 */
.public-body .price-box{background:#f3f5f8;border-radius:6px}
.public-body .amount{color:var(--green);font-weight:600}
.public-body .reservation-card{border-color:var(--line);border-radius:7px;background:#fff;box-shadow:none}
.public-body .table-wrap{border-color:var(--line);border-radius:6px}
.public-body th{background:#f7f8fa;color:#66717e}
.public-body td{border-color:var(--line)}
.public-body tbody tr:hover{background:#fafbfd}
.public-body .pagination [aria-current=page]{box-shadow:none}
.public-body dialog{border:1px solid #d9dfe7;border-radius:9px;box-shadow:0 16px 48px #16243b26}
.public-body dialog::backdrop{background:#1c273b66;backdrop-filter:none}
.public-body .modal-head{border-color:var(--line)}
.public-body .close{border-radius:5px;background:#f2f4f7;color:#4c5a6c}
.public-body #toast{border-radius:6px;background:#2c3d56;box-shadow:0 6px 22px #172c4b1a;font-weight:400}
.public-body #toast.error{background:#91424c}
.public-body .gallery-viewport .gallery-arrow{border-color:#dbe1e8;box-shadow:none;color:var(--green)}
.public-body .gallery-count{border-radius:5px;background:#263345b8}
.public-body .facility-gallery .thumbnails button{border-radius:4px}
.public-body .facility-gallery .thumbnails button[aria-pressed=true]{border-color:var(--green);box-shadow:none}

@media(max-width:750px){
 .public-body .header-logo{width:190px;height:auto;max-height:44px}
}
@media(prefers-reduced-motion:reduce){
 .public-body :is(.btn,.facility-card){transition:none}
}

/* V1.42: 로고는 로그인 정보와 메뉴 두 줄의 전체 높이에 맞춰 중앙 정렬합니다. */
.public-body .public-header-inner{
 display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:32px;
 max-width:1800px;margin:0 auto;padding:0 28px;
}
.public-body .public-header-inner>.brand{grid-area:1/1/3/2;align-self:center}
.public-body .public-header-inner>.utility{
 grid-area:1/2/2/3;min-width:0;max-width:none;width:100%;margin:0;padding:5px 0;
}
.public-body .public-header-inner>.nav-wrap{
 grid-area:2/2/3/3;min-width:0;max-width:none;width:100%;margin:0;
 min-height:72px;padding:12px 0;justify-content:flex-end;align-items:center;
}
@media(max-width:750px){
 .public-body .public-header-inner{column-gap:20px;padding:0 20px}
 .public-body .public-header-inner>.utility{grid-area:1/1/2/3;padding:7px 0}
 .public-body .public-header-inner>.brand{grid-area:2/1/3/2}
 .public-body .public-header-inner>.nav-wrap{grid-area:2/2/3/3;min-height:64px;padding:10px 0}
 .public-body .public-header-inner>.nav-wrap nav{padding-top:0}
}
@media(max-width:480px){
 .public-body .public-header-inner>.brand{grid-area:2/1/3/3;margin-top:10px}
 .public-body .public-header-inner>.nav-wrap{grid-area:3/1/4/3;min-height:0;margin-top:10px;padding:0 0 10px}
}

/* V1.43: 시설 상세 사진의 세로 영역을 넓히고 사진 조작 버튼을 정리합니다. */
.public-body .detail-top .detail-cover{height:auto;aspect-ratio:3/2}
.public-body .detail-top .gallery-track{position:absolute;inset:0}
.public-body .gallery-viewport .gallery-arrow{opacity:0;pointer-events:none;transition:opacity .18s ease}
.public-body .gallery-viewport:hover .gallery-arrow,
.public-body .gallery-viewport:focus-visible .gallery-arrow,
.public-body .gallery-viewport:has(:focus-visible) .gallery-arrow{opacity:1;pointer-events:auto}
.public-body .gallery-playback{position:absolute;right:16px;bottom:14px;display:flex;align-items:center;gap:1px;z-index:2}
.public-body .gallery-playback .gallery-count{position:static;display:flex;align-items:center;height:34px;padding:5px 12px}
.public-body .gallery-playback .gallery-toggle{height:34px;min-height:34px;width:34px;padding:0;border:0;background:#142b39c9;color:#fff;font-size:14px;line-height:1}
.public-body .gallery-playback .gallery-toggle:hover{background:#142b39}
@media(max-width:600px){.public-body .gallery-playback{right:10px;bottom:10px}}
@media(hover:none){.public-body .gallery-viewport .gallery-arrow{display:none}}
@media(prefers-reduced-motion:reduce){.public-body .gallery-viewport .gallery-arrow{transition:none}}
