/* PC 디자인 정리 (2026-09-29 GS 확정 — 상품권 나머지 페이지 2차) — 권역×상품권 /area-giftcard/<권역>-<상품권>
 * PC(768px 이상)에서만 읽힙니다: Base.astro 가 <link media="(min-width: 768px)"> 로 붙입니다. 모바일에는 영향 없음.
 * 시안을 CSS 덧씌우기로 만든 그대로 옮겨서 !important 가 많습니다(원래 스타일을 이기려고).
 * 방향: 순위/라벨 칩은 회색 글자 · 장식 상자·칩 줄·목록은 구분선으로 평평하게. 주요 카드·로고 카드 그리드·시세 숫자 색·H1 부제는 그대로.
 */
/* ===== /area-giftcard/<권역>-<상품권>/ PC 시안 — 권역×상품권 콤보 페이지 (예: 안양 갤러리아) (2026-09-29) =====
 * 남긴 주요 카드(원래 모양 그대로, 규칙 없음): 매입가 거래소 목록·구매가 거래소 목록(.rate-list/.rate-card — 1위 줄 강조·'권역 최고가' 배지 포함),
 *   얼마 받나 계산기(.gcalc-box)
 * 다른 상품권 로고 카드(.combo-grid)도 브랜드 카드 그리드라 카드 그대로 둡니다.
 */

/* 요약 회색 상자 → 평평한 도입 글 */
#main-content .hero-summary { background: transparent !important; border-radius: 0 !important; padding: 0 4px !important; }

/* 히어로 아래 알약 2개(얼마 받는지 계산 · 오늘 전국 최고) → 상자 없는 글자 링크 */
#main-content .hero-actions { gap: 4px 22px !important; }
#main-content .ha-chip { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 6px 0 !important; font-size: 14px !important; font-weight: 600 !important; color: var(--ink) !important; }
#main-content .ha-chip:hover { text-decoration: underline; text-underline-offset: 4px; }
#main-content .ha-go { color: var(--ink-faint) !important; }

/* 권종별 시세표·총액표 — 흰 상자·회색 머리글 배경 걷기 (매입 주황·구매 파랑 숫자 유지) */
#main-content .gc-denom-wrap { border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
#main-content .gc-denom-table { background: transparent !important; }
#main-content .gc-denom-table thead th { background: transparent !important; font-weight: 500 !important; }
#main-content .gc-denom-table th:first-child, #main-content .gc-denom-table td:first-child { padding-left: 4px !important; }
#main-content .gc-denom-table th:last-child, #main-content .gc-denom-table td:last-child { padding-right: 4px !important; }
#main-content .gc-denom-table tbody td { border-bottom: 1px solid var(--line-soft) !important; }
#main-content .gc-denom-table tbody tr:last-child td { border-bottom: 1px solid var(--line-soft) !important; }
#main-content .gc-denom-table tbody tr:hover td { background: var(--surface-2) !important; }
/* 거래소별 60일 기록 — 가장 꾸준했던 곳(첫 줄): 모바일 연주황 → PC 연회색 (2026-10-11) */
#main-content .agr-top td { background: var(--surface-2) !important; }
#main-content h3.agr-h { margin-left: 4px !important; }   /* 아래 .ag-bulk-h 8px 규칙보다 특이도 하나 높게 — 표 첫 칸(4px)과 맞춥니다 */
/* 총액표 제목 옆 '95.4%' 알약 → 상자 없는 주황 글자(시세 숫자 색 유지) */
#main-content .ag-bulk-h { margin-left: 4px !important; }
#main-content .ag-bulk-h em { background: none !important; padding: 0 !important; margin-left: 8px !important; }

/* 86일 기록 상자 → 평평하게 (작은 칸 4개는 가는 세로선) */
#main-content .ah-card { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; }
#main-content .ah-stats { gap: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line-soft) !important; margin-bottom: 12px !important; }
#main-content .ah-item { background: transparent !important; border-radius: 0 !important; padding: 12px 14px !important; }
#main-content .ah-item:first-child { padding-left: 4px !important; }
#main-content .ah-item + .ah-item { border-left: 1px solid var(--line-soft) !important; }

/* FAQ 상자 5개 → 구분선 (이 페이지는 클래스 없는 details 라 base.css 에 안 걸림) */
#main-content section > details:not([class]) { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 4px !important; }
#main-content section > .section-title + details { border-top: 1px solid var(--line) !important; }
/* 섹션 제목 — PC 정본 22/700 (다른 페이지 파일과 같은 값, 2026-10-11 보강: 이 페이지만 20/800 이었음) */
#main-content .section-title { font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; }
#main-content section > details:not([class]) > summary { padding-left: 6px !important; padding-right: 6px !important; }
#main-content section > details:not([class]) > summary:hover { background: var(--surface-2) !important; }
#main-content section > details:not([class]) > p { padding-left: 6px !important; padding-right: 6px !important; }

/* 다른 지역 칩 줄 → 상자 없는 글자 줄 */
#main-content .combo-chips { gap: 2px 20px !important; }
#main-content .combo-chip { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 6px 0 !important; font-size: 14px !important; font-weight: 500 !important; color: var(--ink) !important; }
#main-content .combo-chip:hover { background: none !important; color: var(--ink) !important; text-decoration: underline; text-underline-offset: 4px; }
#main-content .combo-chip-n { font-weight: 500 !important; color: var(--ink-faint) !important; }
/* 계산기 링크 주황 알약 2개 → 글자 링크 */
#main-content .combo-calc-links { gap: 4px 22px !important; }
#main-content .combo-calc-links a { background: none !important; border-radius: 0 !important; padding: 4px 0 !important; font-size: 14px !important; font-weight: 600 !important; color: var(--ink) !important; }
#main-content .combo-calc-links a::after { content: " →"; color: var(--ink-faint); font-weight: 500; }
#main-content .combo-calc-links a:hover { background: none !important; color: var(--ink) !important; text-decoration: underline; text-underline-offset: 4px; }

/* 글자 줄로 바뀐 칩들 — 본문 글(좌측 8px 들여쓰기)과 시작선 맞춤 */
#main-content .hero-actions, #main-content .combo-chips, #main-content .combo-calc-links { padding-left: 8px !important; padding-right: 8px !important; }
#main-content .ag-bulk-h { margin-left: 8px !important; }
#main-content .hero-actions { padding-left: 3px !important; }
