/* 반응형 및 환경 설정: page.css 다음에 로드하며 아래 규칙의 순서를 유지합니다. */

/* 별도 예외: 1920px보다 큰 화면에서 헤더 최대 너비를 유지합니다. */
@media (min-width: 1921px) {
  .site-header {
    max-width: 1464px;
  }
}

/* 태블릿: 너비 1,200px 이하 */

@media (max-width: 1200px) {
  /* 공통 inner: 태블릿 769~1200px, 좌우 60px */
  .inner { width: calc(100% - 120px); }

  :root {
    --title: 32px;
    --label: 16px;
    --body: 14px;
    --large: 20px;
  }

  .button {
    min-height: 70px;
  }

  .product .button {
    min-height: 56px;
  }

  input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
  select {
    padding-right: 28px;
  }

  select {
    padding-right: 60px;
    background-position: right 28px center;
  }

  .contact-card .choices {
    grid-template-columns: 1fr 1fr;
  }
}

/* 모바일: 너비 768px 이하 */

@media (max-width: 768px) {
  /* 공통 inner: 모바일 360~768px, 좌우 20px */
  .inner { width: calc(100% - 40px); }

  :root {
    --gutter: 20px;
    --title: 24px;
    --label: 14px;
    --body: 12px;
    --large: 16px;
    --gap: 40px;
  }

  .header-contact {
    min-height: 38px;
    letter-spacing: -0.6px;
  }

  .button {
    min-height: 56px;
  }

  .products {
    grid-template-columns: 1fr;
  }

  .product .button {
    min-height: 53px;
  }

  input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
  select {
    padding-right: 16px;
  }

  select {
    padding-right: 44px;
    background-position: right 16px center;
    background-size: 12px 6px;
  }

  .unit > span {
    right: 16px;
  }

  .unit input {
    padding-right: 60px !important;
  }

  .total > span {
    white-space: nowrap;
  }

  .total strong {
    max-width: 58%;
  }

  .estimate-notes {
    line-height: 1.3;
  }

  .actions {
    grid-template-columns: 86px minmax(0, 1fr);
  }

  .actions .button {
    letter-spacing: -0.3px;
  }

  .choice {
    min-height: 60px;
  }

  .choice input {
    flex-basis: 20px;
  }

  .review-card h2 {
    line-height: 1.3;
  }

  .review-table {
    line-height: 1.6;
  }

  .change-vehicle {
    min-height: 64px;
  }

  .contact-card .choices {
    grid-template-columns: 1fr;
  }

  .complete .progress {
    margin-bottom: 40px;
  }

  .explore {
    grid-template-columns: 1fr;
  }

  .explore > h3 {
    line-height: 1.45;
  }

  .footer-business {
    margin-top: -8px;
    line-height: 17px;
  }

  .footer-business p {
    display: contents;
  }

  .footer-business span + span:before {
    display: none;
  }

  .footer-copyright {
    line-height: 12px;
  }
}

/* 움직임 줄이기 설정을 사용하는 환경의 전환 효과 제한 */

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

@media (max-width: 1200px) {
  .change-vehicle {
    min-height: 70px;
  }
}

@media (max-width: 768px) {
  .change-vehicle {
    min-height: 64px;
  }

  .choice input:checked {
    background: radial-gradient(circle, var(--blue) 0 5px, #fff 5px);
  }
}

@media (max-width: 1200px) {
  .complete .explore {
    row-gap: 32px;
  }

  .complete .explore a h3 {
    line-height: 1.5;
  }
}

@media (max-width: 768px) {
  .complete .explore {
    row-gap: 12px;
  }
}

@media (max-width: 768px) {
  .consent-row .consent {
    letter-spacing: -0.35px;
  }
}

/* ==========================================================
 * 관리자 DB 목록 (/page/admin/leads/dbList.php)
 * 상담 접수·상세 모달, 첨부 문서 및 견적 다운로드
 * ========================================================== */

@media (max-width: 768px) {
  .leadReceptionModal .leadReceptionDialog {
    width: 100%;
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px);
  }

  .leadReceptionBody {
    scrollbar-gutter: auto;
  }

  .leadReceptionField {
    grid-template-columns: 132px minmax(0, 1fr);
  }

  .leadReceptionField > span,
    .leadReceptionDocument > strong {
    word-break: break-word;
  }

  .leadReceptionField input,
    .leadReceptionField select {
    width: calc(100% - 20px);
  }

  .leadReceptionDocument {
    grid-template-columns: 132px minmax(0, 1fr);
  }

  .leadReceptionFooter {
    grid-template-columns: minmax(86px, 30%) minmax(0, 1fr);
  }

  .leadReceptionModal.isDetailMode .leadReceptionFooter {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* 별도 예외: 480px 이하에서는 접수 모달의 항목을 세로로 배치합니다. */
@media (max-width: 480px) {
  .leadReceptionField {
    display: block;
  }

  .leadReceptionField > span {
    min-height: 42px;
    border-right: 0;
    border-bottom: 1px solid #e8e8ec;
  }

  .leadReceptionField input,
    .leadReceptionField select {
    width: calc(100% - 20px);
  }

  .leadReceptionDocument {
    display: block;
  }

  .leadReceptionDocument > strong {
    min-height: 42px;
    border-right: 0;
    border-bottom: 1px solid #e8e8ec;
  }

  .leadReceptionUpload {
    align-items: stretch;
    flex-direction: column;
    border-top: 1px solid #ececef;
  }

  .leadReceptionUpload input[type="file"] {
    width: 100%;
  }

  .leadReceptionSummaryBody {
    grid-template-columns: 1fr;
  }
}

/* 관리자 대시보드: 사이드 메뉴·표·모달 반응형 예외 */
@media  only screen and (min-width:1201px) {
/* 관리자 PC 본문은 사이드 메뉴로 이미 좁아지므로 inner의 중첩 80% 대신 좌우 40px을 둡니다. */
:where(body.heybro-admin) .adminContent > .inner {width:calc(100% - 80px);}
:where(body.heybro-admin) .adminHeader {transition:width .25s ease,padding .25s ease;}
:where(body.heybro-admin) .adminContent {transition:width .25s ease;}
html.adminHeaderCollapsed .adminHeader {width:76px !important;padding:72px 12px 24px !important;}
html.adminHeaderCollapsed .adminHeaderPanel {display:none !important;}
html.adminHeaderCollapsed .adminHeaderCollapseButton {right:-17px;}
html.adminHeaderCollapsed .adminContent {width:calc(100% - 76px) !important;}
}
@media  (prefers-reduced-motion:reduce) {
:where(body.heybro-admin) .leadProgressDataRow.isCommentPulse td, :where(body.heybro-admin) .leadCommentItem.isNewComment {animation:none;}
}
@media  (max-width:767px) {
:where(body.heybro-admin) .leadCommentPanel {padding:16px;}
:where(body.heybro-admin) .leadCommentItem {max-width:85%;}
:where(body.heybro-admin) .leadCommentItem.isEditing {width:85%;}
:where(body.heybro-admin) .leadCommentComposer {flex-direction:column;}
:where(body.heybro-admin) .leadCommentSubmit {width:100%;}
}
@media  (max-width:767px) {
:where(body.heybro-admin) .leadColumnVisibility {align-items:flex-start;flex-direction:column;}
:where(body.heybro-admin) .leadColumnVisibilityButtons {justify-content:flex-start;width:100%;}
:where(body.heybro-admin) .leadColumnVisibilityButtons button {flex:1 1 auto;}
}
@media  (max-width:800px) {
:where(body.heybro-admin) .leadSettlementEditForm {border-radius:16px;}
:where(body.heybro-admin) .leadSettlementInputWrap {width:calc(100% - 20px);margin:8px 10px;}
}
@media  (max-width:767px) {
:where(body.heybro-admin) .leadCreditModal {padding:0;}
:where(body.heybro-admin) .leadCreditModalDialog {width:100vw;height:100vh;max-height:none;border-radius:0;}
:where(body.heybro-admin) .leadCreditModalHeader {padding:16px;}
:where(body.heybro-admin) .leadCreditModalDescription {font-size:12px;}
:where(body.heybro-admin) .leadCreditModalBody {padding:14px;}
:where(body.heybro-admin) .leadCreditStep {padding:16px;}
:where(body.heybro-admin) .leadCreditIdentityGrid {grid-template-columns:1fr;}
:where(body.heybro-admin) .leadCreditSignatureCanvas {height:130px;}
:where(body.heybro-admin) .leadCreditAgreementContent {max-height:180px;}
}
@media  (max-width: 720px) {
:where(body.heybro-admin) .estimateShell {padding: 20px 12px 48px;}
:where(body.heybro-admin) .estimateDocument {padding: 28px 20px;border-radius: 18px;}
:where(body.heybro-admin) .estimateHeader {flex-direction: column;align-items: flex-start;}
:where(body.heybro-admin) .estimateMeta {text-align: left;min-width: 0;}
:where(body.heybro-admin) .estimateSummary {grid-template-columns: 1fr;}
:where(body.heybro-admin) .estimateTable th, :where(body.heybro-admin) .estimateTable td {padding: 12px;font-size: 14px;}
:where(body.heybro-admin) .estimateTable th {width: 34%;}
}
@media  print {
body.heybro-estimate {background: #fff;}
:where(body.heybro-admin) .estimateShell {max-width: none;margin: 0;padding: 0;}
:where(body.heybro-admin) .estimateActions, :where(body.heybro-admin) .estimateHint {display: none !important;}
:where(body.heybro-admin) .estimateDocument {box-shadow: none;border-radius: 0;padding: 0;}
:where(body.heybro-admin) .estimateHeader, :where(body.heybro-admin) .estimateSection, :where(body.heybro-admin) .estimateSummary, :where(body.heybro-admin) .estimateSummaryCard, :where(body.heybro-admin) .estimateTable, :where(body.heybro-admin) .estimateTable tbody, :where(body.heybro-admin) .estimateTable tr, :where(body.heybro-admin) .estimateTable th, :where(body.heybro-admin) .estimateTable td {break-inside: avoid !important;page-break-inside: avoid !important;}
:where(body.heybro-admin) .estimateSectionTitle {break-after: avoid !important;page-break-after: avoid !important;}
@page  {

}
}
@media (max-width:768px){
:where(body.heybro-admin) .harmonyLeadFilters>* {width:100%;}
:where(body.heybro-admin) .harmonyLeadTypeFilter {width:100%;}
:where(body.heybro-admin) .harmonyLeadSearch {min-width:0;}
:where(body.heybro-admin) .harmonyLeadTable {min-width:980px;}
}
@media (max-width:768px){
:where(body.heybro-admin) .leadExternalDownloadHeader {align-items:flex-start;}
:where(body.heybro-admin) .leadExternalDownloadTable {min-width:940px;}
:where(body.heybro-admin) .leadExternalDetailPanel {margin:0 12px 16px;padding:18px;}
:where(body.heybro-admin) .leadExternalDetailHeading {display:block;}
:where(body.heybro-admin) .leadExternalDetailHeading>span {display:inline-flex;margin-top:12px;}
:where(body.heybro-admin) .leadExternalResourceItem {gap:12px;padding:13px;}
:where(body.heybro-admin) .leadExternalResourceInfo strong {max-width:220px;}
:where(body.heybro-admin) .leadExternalDownloadButton, :where(body.heybro-admin) .leadExternalFileDownload {padding:9px 11px;}
:where(body.heybro-admin) .leadExternalCount {font-size:12px;}
}
@media  (max-width:768px){
:where(body.heybro-admin) .accountPermissionGrid {grid-template-columns:1fr;}
}
@media   only screen and (max-width: 1200px) {
:where(body.heybro-admin) .adminHeader {left: 0;right: 0;width: 100%;height: auto;border-right: 0;border-bottom: 1px solid #D9DADE;z-index: 40;}
:where(body.heybro-admin) .adminHeaderCollapseButton {display:none;}
:where(body.heybro-admin) .adminHeaderSpacer {display: block;width: 100%;height: 112px;flex: none;}
:where(body.heybro-admin) .adminHeaderBar {display: flex;align-items: center;justify-content: space-between;gap: 16px;}
:where(body.heybro-admin) .adminHeaderUser {min-width: 0;flex: 1 1 auto;}
:where(body.heybro-admin) .adminHeaderOverlay {display: block;position: fixed;inset: 0;background: rgba(18, 22, 33, 0.28);opacity: 0;pointer-events: none;transition: opacity 0.3s ease;}
:where(body.heybro-admin) .adminHeaderPanel {position: fixed;top: 0;right: 0;width: min(420px, 100%);height: 100vh;background: #ffffff;box-sizing: border-box;transform: translateX(100%);transition: transform 0.35s ease;box-shadow:none;z-index: 41;}
:where(body.heybro-admin) .adminHeaderPanelHeader {display: flex;align-items: center;justify-content: end;}
:where(body.heybro-admin) .adminHeaderPanelBody {overflow-y: auto;}
:where(body.heybro-admin) .adminHeaderPanelLogout {margin-top: 24px;}
:where(body.heybro-admin) .adminHeader.is-drawer-open .adminHeaderOverlay {opacity: 1;pointer-events: auto;}
:where(body.heybro-admin) .adminHeader.is-drawer-open .adminHeaderPanel {transform:translateX(0);box-shadow:-24px 0 48px rgba(18,22,33,.12);}
:where(body.heybro-admin) .visitorChartBox canvas {height: 360px !important;}
:where(body.heybro-admin) .operatorCnts {display:grid;grid-template-columns:repeat(2,1fr);}
}
@media   only screen and (max-width: 768px) {
:where(body.heybro-admin) .operatorCnts {display:grid;grid-template-columns:repeat(1,1fr);}
}

/* 움직임 감소 설정에서는 단계 전환 효과를 생략합니다. */
@media (prefers-reduced-motion: reduce) {
  .lease-transition, .lease-transition.is-leaving {animation: none;transform: none;}
}


/* 중고리스·신차렌트 모바일 필터: 두 선택칸과 전체 너비 적용 버튼의 복합 그리드입니다. */
@media (max-width: 768px) {
  :where(body.heybro-admin) .leaseListFilterControls {grid-template-columns:repeat(2,minmax(0,1fr));}
  :where(body.heybro-admin) .leaseListFilterControls > label {min-width:0;}
  :where(body.heybro-admin) .leaseListFilterApply {grid-column:1 / -1;}
  :where(body.heybro-admin) .leaseListFilterBar .visitorFilterTabs {box-sizing:border-box;}
}
