@import url("../design-system/css/common.css");
/* ============================================================
   예우 이용내역 · 내 정보 — 이 묶음 화면에만 있는 배치 (yw-my__…)  (2026-10-29)
   쪽: history · history-detail · me
   부품은 공통에서 온다. 여기서 부품의 겉모양을 덮어쓰지 않는다.
   ============================================================ */
.yw-my { line-height: normal; }
.yw-my__bar-title { font-family: var(--font-serif); font-weight: var(--font-weight-serif); font-size: var(--font-size-heading); }

/* 이용내역 목록 */
.yw-my__rec { display: block; color: var(--text); }
.yw-my__rec-top { display: flex; justify-content: space-between; align-items: center; gap: var(--space-sm); }
.yw-my__rec-kind { font-size: var(--font-size-caption); font-weight: 500; color: var(--text-accent); }
.yw-my__rec-title { display: block; margin-top: var(--space-sm); font-size: var(--font-size-body); font-weight: 500; }
.yw-my__rec-meta { display: block; margin-top: 2px; font-size: var(--font-size-meta); color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.yw-my__rec:active { background: var(--state-hover); }

/* 상세 */
.yw-my__head { padding: var(--space-sm) var(--screen-margin) 0; }
.yw-my__head-title { margin-top: var(--space-sm); font-family: var(--font-serif); font-weight: var(--font-weight-serif); font-size: var(--font-size-display); line-height: var(--line-height-tight); }
.yw-my__head-no { margin-top: var(--space-xs); font-size: var(--font-size-caption); color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.yw-my__facts { margin: 0; }
.yw-my__fact { display: flex; gap: var(--space-lg); padding: var(--space-md) var(--space-card-x); font-size: var(--font-size-body-sm); }
.yw-my__fact + .yw-my__fact { border-top: 1px solid var(--border-hairline); }
.yw-my__fact dt { flex: none; width: 76px; color: var(--text-secondary); }
.yw-my__fact dd { margin: 0; flex: 1; }
.yw-my__actions { display: grid; gap: var(--space-sm); }
.yw-my__done-note { padding: var(--space-md) var(--space-lg); border-radius: var(--radius-sm); background: var(--status-warning-tint); color: var(--status-warning); font-size: var(--font-size-body-sm); }
.yw-my__done-note[hidden] { display: none; }

/* 내 정보 */
.yw-my__danger { color: var(--text-secondary); }
.yw-my__gap { margin-top: var(--space-lg); }

/* 장례식장 예약 — 상태 · 조건 확인 (2026-10-29) */
.yw-my__trial {
  margin: 0 var(--screen-margin) var(--space-sm); padding: var(--space-sm) var(--space-md); border-radius: var(--radius-sm);
  background: var(--status-warning-tint); color: var(--status-warning); font-size: var(--font-size-caption); font-weight: 500; text-align: center;
}
.yw-my__notice { padding: var(--space-md) var(--space-lg); border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-raised); font-size: var(--font-size-body-sm); line-height: 1.55; }
.yw-my__notice--warn { margin-top: var(--space-md); border-color: transparent; background: var(--status-warning-tint); color: var(--status-warning); }
.yw-my__notice--ok { border-color: transparent; background: var(--status-success-tint); color: var(--status-success); font-weight: 500; }
.yw-my__notice + .yw-card { margin-top: var(--space-md); }
.yw-my__sub-title { margin-bottom: var(--space-md); font-size: var(--font-size-body); font-weight: 700; }
.yw-my__money { font-size: var(--font-size-title); font-variant-numeric: tabular-nums; }
.yw-my__fact-note { display: block; margin-top: 2px; font-size: var(--font-size-caption); color: var(--text-secondary); }
.yw-my__ul { margin: 0; padding-left: var(--space-lg); line-height: 1.6; }
.yw-my__valid { margin-top: var(--space-md); font-size: var(--font-size-body-sm); color: var(--text-secondary); }
.yw-my__valid b { color: var(--text); }
.yw-my__hint { font-size: var(--font-size-caption); color: var(--text-secondary); text-align: center; }