/* 캔버스 & 기본 */
.eh-paper { width: 700px; margin: 0 auto; background:#fff; border-radius:16px; box-shadow:0 4px 20px rgba(0,0,0,.08); padding:36px; }
.eh-section { margin-top:22px; }
.eh-service-head { display:flex; align-items:baseline; gap:10px; padding-bottom: 3px; }
.eh-service-head h3 { color:#166166; margin:0; font-size:20px; }
.eh-service-date { color:#7d8790; }

/* 표 공통 */
.eh-table { width:100%; border-collapse:collapse; font-size:14px; }
.eh-table td, .eh-table th { padding:10px 12px; border:1px solid #e7e9ec; vertical-align:top; }
.eh-table.eh-info td:first-child { background:#f8fafb; width:20%; }
.eh-col-cat { width:25%; color:#000000; font-weight:600; }
.eh-col-name { width:45%; }
.eh-col-price { width:30%; text-align:right; white-space:nowrap; }
.eh-qty { margin-left:6px; color:#6b7280; font-size:12px; }
.eh-subnote { color:#9aa3ad; font-size:12px; margin-top:4px; }
.eh-muted { color:#8c97a3; }
.eh-arrow { margin:0 6px; color:#94a3b8; }
.eh-summary td:first-child { background:#f8fafb; }
.eh-right { text-align:right; }
.eh-subtitle th { background:#f3f4f6; text-align:left; }
.eh-total td { font-weight:700; background:#eef6f6; }

/* 정보표 가운데 정렬 */
.eh-info td { text-align: center; vertical-align: middle; }
.eh-col-price td { vertical-align: middle; }

/* 헤더: 제목 중앙 + 금액 박스 아래 배치 */
.eh-header {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}

/* 제목 중앙 정렬 (중복 규칙 정리) */
.eh-header h1 {
  text-align:center;
  color:#166166;
  font-size:26px;
  line-height:1.2;
  margin:0 0 4px; /* 제목과 금액박스 간격은 header gap으로 조절하므로 하단 여백 축소 */
}

/* (옵션) 헤더 배지 - 필요시 사용 */
.eh-badge {
  display:inline-block;
  margin-top:8px;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  border:1px solid #e7e9ec;
  background:#f8fafb;
  color:#475569;
}
.eh-badge-paid {
  border-color:#cce5e5;
  background:#eef6f6;
  color:#166166;
  font-weight:600;
}

/* 헤더 금액 박스: 제목 아래 중앙 */
.eh-amount-box {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid #e7e9ec;
  background: #f8fafb;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);

  /* 폭 조정 */
  min-width: 180px;   /* 너무 좁아지지 않게 최소 폭 */
  max-width: 220px;   /* 너무 넓어지지 않게 제한 */

  margin-left: auto; /* 본문 안에서 오른쪽 정렬 */
}

.eh-amount-line { display:flex; justify-content:space-between; align-items:baseline; }
.eh-amount-label { font-size:13px; color:#556070; }
.eh-amount-value { font-size:16px; font-weight:700; }

/* 강조 톤 */
.eh-amount-total .eh-amount-label { color:#166166; }
.eh-amount-total .eh-amount-value { color:#166166; }
.eh-amount-deposit .eh-amount-label { color:#6b7280; }
.eh-amount-deposit .eh-amount-value { color:#334155; }

/* 반응형 */
@media (max-width: 560px) {
  .eh-amount-box { width:100%; }
}

/* ========== 섹션 제목(서비스명)과 구분선 간격 보정 ========== */
.eh-section h3 { font-weight:700; letter-spacing:.2px; }

/* ========== 하단 푸터(결제/연락처) ========== */
.eh-footer { margin-top:28px; }
.eh-footer-grid {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  border-top: 2px solid #e3f2f4;   /* 상단 얇은 구분선 */
  padding-top:14px;
}
.eh-footer-left .eh-tagline{
  font-size:14px; color:#334155;
}
.eh-footer-left .eh-phone{
  margin-top:6px; font-size:16px; color:#166166; font-weight:800;
}
.eh-footer-right{
  justify-self:end; text-align:right;
  background:#f6fbfb; border:1px solid #e7f1f3; border-radius:12px;
  padding:10px 12px; min-width:260px;
  box-shadow:0 2px 8px rgba(2,12,27,.04);
}
.eh-footer-right .eh-bank-title{
  font-size:12px; text-transform:uppercase; letter-spacing:.8px;
  color:#6b7280; font-weight:800; margin-bottom:4px;
}
.eh-footer-right .eh-bank-account{
  font-size:16px; color:#0f172a; font-weight:800;
}
.eh-footer-right .eh-bank-account span{
  color:#6b7280; font-weight:600; margin-left:6px;
}
.eh-footer-right .eh-bank-owner{
  margin-top:2px; color:#334155; font-size:17px; font-weight:600;
}

/* 반응형 */
@media (max-width: 560px) {
  .eh-footer-grid { grid-template-columns: 1fr; }
  .eh-footer-right { justify-self:stretch; text-align:left; }
}


/* 섹션 하이라이트 */
.eh-section { position: relative; }
.eh-section:not(.eh-footer).is-hovered {
  outline: 2px solid #d9ff00;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(22, 97, 102, 0.15);
}

/* “수정” 버튼 - 기본 숨김 (좌측 바깥 배치) */
.eh-edit-btn {
  display: none;
  position: absolute;
  top: 8px;
  left: -6px;               /* 우측 대신 좌측으로 */
  transform: translateX(-100%); /* 왼쪽 바깥으로 빼기 */
  z-index: 5;
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 999px;
  border: 1px solid #166166;
  background: #fff;
  cursor: pointer;
  white-space: nowrap;
}
.eh-section:not(.eh-footer).is-hovered > .eh-edit-btn {
  display: inline-flex;
}

/* 좁은 화면에서는 좌측 바깥이 안 보일 수 있으니 안쪽에 표시 */
@media (max-width: 768px) {
  .eh-edit-btn {
    left: 8px;
    transform: none;
  }
}