/* ═══════════════════════════════════════════════   환불구조대 — style.css (Toss-style design system)
   ═══════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* Toss 톤 — 메인 */
  --navy:        #0C2746;
  --navy2:       #1a3a5c;
  --red:         #c0392b;
  --red2:        #a83227;
  --paper:       #fff;
  --cream:       #FAFBFC;
  --bg:          #F5F4F1;
  --line:        #F2F3F5;
  --line2:       #E8E6E1;
  --text:        #191F28;
  --text2:       #4E5968;
  --muted:       #8B95A1;
  --green:       #16A34A;
  --amber:       #D97706;
  --amber2:      #F59E0B;
  --white:       #fff;
  --border:      #F2F3F5;
  --border2:     #E8E6E1;
  --bg2:         #F5F6F7;

  --radius:      12px;
  --r-sm:        10px;
  --r-md:        14px;
  --r-lg:        20px;
  --shadow-sm:   0 1px 3px rgba(0,0,0,.025);
  --shadow:      0 4px 16px rgba(0,0,0,.06);
  --shadow-lg:   0 12px 48px rgba(0,0,0,.10);
}

body {
  font-family: "Pretendard Variable", -apple-system, BlinkMacSystemFont, sans-serif;
  background: #F5F4F1;
  color: #191F28;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "ss01", "ss02";
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }

/* ══ 애니메이션 ══════════════════════════════ */
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideR { from{opacity:0;transform:translateX(28px)} to{opacity:1;transform:translateX(0)} }
@keyframes popIn  { from{opacity:0;transform:scale(.6)}        to{opacity:1;transform:scale(1)} }
@keyframes pulse  { 0%,100%{transform:scale(1)} 50%{transform:scale(1.04)} }
.afu { animation: fadeUp .5s ease both; }
.asl { animation: slideR .4s ease both; }
.apo { animation: popIn  .5s cubic-bezier(.34,1.56,.64,1) both; }

/* ══ 버튼 ════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: none; cursor: pointer;
  font-family: inherit; font-weight: 700;
  letter-spacing: -.01em; text-decoration: none;
  white-space: nowrap;
  transition: background .15s, border-color .15s, color .15s, transform .1s;
  border-radius: 12px;
  padding: 13px 22px; font-size: 1rem;
}
.btn:active { transform: scale(.99); }
.btn-navy   { background: #0C2746; color: #fff; }
.btn-navy:hover   { background: #1a3a5c; }
.btn-ghost  { background: transparent; color: #4E5968; border: 1.5px solid #F2F3F5; }
.btn-ghost:hover  { border-color: #D1D6DB; color: #191F28; }
.btn-outline{ background: transparent; border: 1.5px solid #F2F3F5; color: #4E5968; }
.btn-outline:hover{ border-color: #0C2746; color: #0C2746; }
.btn-red    { background: #c0392b; color: #fff; }
.btn-red:hover    { background: #a83227; }
.btn-amber, .btn-gold { background: #D97706; color: #fff; }
.btn-amber:hover, .btn-gold:hover { background: #B45309; }
.btn-green  { background: #16A34A; color: #fff; }
.btn-yellow { background: #F59E0B; color: #fff; }
.btn-sm     { padding: 8px 14px !important; font-size: .88rem !important; border-radius: 10px; }
.btn-full   { width: 100%; }
.btn[disabled] { opacity: .4; cursor: not-allowed; }

/* ══ 카드 ════════════════════════════════════ */
.card {
  background: #fff;
  border: 1px solid #F2F3F5;
  border-radius: 20px;
  box-shadow: 0 1px 3px rgba(0,0,0,.025);
}
.card-body { padding: 28px; }

/* ══ 폼 ══════════════════════════════════════ */
.field { margin-bottom: 16px; }
.lbl   {
  display: block; font-size: .84rem; font-weight: 700;
  color: #4E5968; margin-bottom: 8px; letter-spacing: -.005em;
}
.inp {
  width: 100%; padding: 14px 16px;
  font-size: 1rem; font-family: inherit;
  color: #191F28; background: #FAFBFC;
  border: 1.5px solid #F2F3F5; border-radius: 12px;
  outline: none; transition: border-color .15s, background .15s;
  -webkit-appearance: none; appearance: none;
}
.inp:focus { border-color: #0C2746; background: #fff; }
.inp::placeholder { color: #B0BAC4; }
select.inp { cursor: pointer; }
textarea.inp { resize: vertical; min-height: 110px; line-height: 1.7; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.error  { color: #c0392b; font-size: .82rem; margin-top: 5px; }
.hint   { color: #8B95A1; font-size: .82rem; margin-top: 5px; line-height: 1.55; }

/* ══ 탭 ══════════════════════════════════════ */
.tabs { display: flex; border-bottom: 1px solid #F2F3F5; margin-bottom: 20px; }
.tab-btn {
  padding: 12px 18px; font-size: .92rem; font-weight: 700;
  cursor: pointer; border: none; background: transparent;
  color: #8B95A1; border-bottom: 2px solid transparent;
  margin-bottom: -1px; transition: all .15s;
  font-family: inherit; letter-spacing: -.01em;
}
.tab-btn.active { color: #0C2746; border-bottom-color: #0C2746; }

/* ══ 테이블 ══════════════════════════════════ */
.tbl-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th {
  background: #FAFBFC; padding: 12px 14px; text-align: left;
  font-size: .76rem; font-weight: 800; color: #8B95A1;
  border-bottom: 1px solid #F2F3F5; letter-spacing: -.005em;
}
td { padding: 14px; border-bottom: 1px solid #F5F6F7; color: #191F28; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: #FAFBFC; }

/* ══ 배지 ════════════════════════════════════ */
.bdg { display: inline-block; padding: 4px 11px; font-size: .74rem; font-weight: 700; letter-spacing: -.005em; border-radius: 99px; }
.bg-gray { background: #F1F5F9; color: #475569; }
.bg-blu  { background: #EFF6FF; color: #2563EB; }
.bg-yel  { background: #FEF9C3; color: #854D0E; }
.bg-grn  { background: #F0FDF4; color: #16A34A; }
.bg-red  { background: #FEF2F2; color: #DC2626; }

/* ══ 플래시 ══════════════════════════════════ */
.flash         { padding: 13px 24px; font-size: .92rem; text-align: center; font-weight: 600; }
.flash-error   { background: #FEF2F2; color: #DC2626; border-bottom: 2px solid #FECACA; }
.flash-success { background: #F0FDF4; color: #16A34A; border-bottom: 2px solid #BBF7D0; }
.flash-info    { background: #EFF6FF; color: #2563EB; border-bottom: 2px solid #BFDBFE; }

/* ══ 대시보드 (admin) ════════════════════════ */
.dash-wrap   { max-width: 1100px; margin: 0 auto; padding: 32px 20px; }
.dash-header {
  display: flex; justify-content: space-between;
  align-items: flex-start; flex-wrap: wrap; gap: 16px; margin-bottom: 24px;
}
.dash-title  { font-size: 1.5rem; font-weight: 800; color: #191F28; letter-spacing: -.028em; }
.dash-sub    { font-size: .92rem; color: #8B95A1; margin-top: 4px; }
.stat-row    { display: flex; gap: 12px; flex-wrap: wrap; }
.stat-card   {
  text-align: center; padding: 16px 24px;
  background: #fff; border: 1px solid #F2F3F5;
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.025);
}
.stat-num    { font-size: 1.5rem; font-weight: 800; color: #0C2746; letter-spacing: -.028em; }
.stat-lbl    { font-size: .78rem; color: #8B95A1; margin-top: 4px; }

/* ══ 인증서 출력 (certificate.php) ═══════════ */
.cert-outer { max-width: 720px; margin: 0 auto; padding: 30px 20px; }
.cert-print { border: 2px solid #fff; padding: 44px; font-family:'Noto Serif KR',serif; line-height: 2.1; background: #fff; color: #000; }
.cert-print h2 { text-align: center; font-size: 22px; letter-spacing: 8px; margin-bottom: 8px; }
.cert-print .cert-date { text-align: center; font-size: 13px; margin-bottom: 28px; }
.cert-info-table { width: 100%; margin-bottom: 28px; font-size: 13px; border-collapse: collapse; }
.cert-info-table td { padding: 4px 0; }
.cert-info-table .cl { font-weight: 700; width: 110px; }

/* ══ 유틸 ════════════════════════════════════ */
.content { flex: 1; }
.center  { text-align: center; }
.mt-4    { margin-top: 16px; }
.mt-8    { margin-top: 32px; }
.mb-4    { margin-bottom: 16px; }
.info-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #F5F6F7; font-size: .92rem; }
.info-row:last-child { border-bottom: none; }
.info-lbl { color: #8B95A1; }
.info-val { font-weight: 700; color: #191F28; }
.empty-state { text-align: center; padding: 56px 24px; }

/* 출력 */
@media print {
  .main-nav, .pl-bizinfo, .pl-account, .foot, .no-print { display: none; }
  .cert-print { border: 2px solid #000; }
}

/* ═══════════════════════════════════════════════
   공유 헤더 (.main-nav)
═══════════════════════════════════════════════ */
.main-nav {
  position: sticky; top: 0; z-index: 100;
  background: rgba(245,244,241,.92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(12,39,70,.07);
}
.main-nav-inner {
  max-width: 1024px;
  margin: 0 auto;
  display: flex; justify-content: space-between; align-items: center;
  gap: clamp(14px,3vw,24px);
  padding: 0 clamp(16px,4vw,28px); height: 68px;
}
.nav-brand {
  display: flex; align-items: center; gap: 10px;
}
.nav-brand-home {
  display: flex; align-items: center; gap: 6px; text-decoration: none;
}
.refund-mark {
  display: inline-flex; align-items: center; justify-content: center;
  background: url('refund.png') no-repeat center / contain;
  color: #fff; font-weight: 700; font-style: normal;
  letter-spacing: -.06em; line-height: 1; white-space: nowrap; text-align: center;
  padding-top: .68em;
  width: 46px; height: 48px; font-size: 18px;
  margin-top: -14px; margin-right: -6px;
}
.nav-brand-main {
  font-size: 1.32rem; font-weight: 800;
  color: #0C2746; letter-spacing: -.02em; line-height: 1;
  padding-bottom: 2px;
}
.nav-brand-partner {
  font-size: 1.04rem; font-weight: 700; color: #6C7077;
  line-height: 1; text-decoration: none;
  white-space: nowrap; transition: color .2s;
  padding-bottom: 2px; margin-left: -5px; margin-top: 2px;
}
.nav-brand-partner:hover { color: #0C2746; }
.nav-right { display: flex; align-items: center; gap: 8px; }
.nav-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: inherit; font-size: .86rem; font-weight: 700;
  padding: 9px 16px; border-radius: 8px; border: none;
  cursor: pointer; text-decoration: none; transition: all .2s;
  white-space: nowrap; line-height: 1;
}
.nav-btn-outline {
  background: transparent; color: #6C7077;
  border: 1.5px solid #E8E6E1;
}
.nav-btn-outline:hover { border-color: #0C2746; color: #0C2746; }
.nav-btn-navy { background: #0C2746; color: #fff; border: 1.5px solid #0C2746; }
.nav-btn-navy:hover { background: #1a3a5c; }

.flash-new {
  padding: 14px clamp(16px,4vw,28px); font-size: .96rem; font-weight: 600;
  text-align: center;
}
.flash-new.error   { background: #FEF2F2; color: #DC2626; border-bottom: 1px solid #FECACA; }
.flash-new.success { background: #F0FDF4; color: #16A34A; border-bottom: 1px solid #BBF7D0; }
.flash-new.info    { background: #EFF6FF; color: #2563EB; border-bottom: 1px solid #BFDBFE; }
.content { padding: 32px clamp(16px,4vw,28px); }

/* ═══════════════════════════════════════════════
   공유 푸터 (계정 바 + bizinfo)
═══════════════════════════════════════════════ */
.pl-account { border-top: 1px solid #E8E6E1; background: #F5F4F1; padding: 16px clamp(16px,4vw,28px); }
.pl-account-in { max-width: 1024px; margin: 0 auto; display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.pl-account-btn {
  display: inline-flex; align-items: center;
  font-size: .78rem; font-weight: 700;
  padding: 8px 16px; border-radius: 7px;
  background: transparent; color: #6C7077;
  border: 1.5px solid #E8E6E1;
  text-decoration: none; transition: all .2s;
}
.pl-account-btn:hover { border-color: #0C2746; color: #0C2746; }

.pl-bizinfo {
  border-top: 1px solid #E8E6E1; background: #F5F4F1; color: #6C7077;
  font-size: .76rem; line-height: 2.05;
  padding: 32px clamp(16px,4vw,28px) 40px;
}
.pl-bizinfo-in {
  max-width: 1024px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 16px;
}
.pl-bizinfo-nav { display: flex; gap: 10px 18px; flex-wrap: wrap; font-weight: 600; }
.pl-bizinfo-nav a { color: #0C2746; text-decoration: none; }
.pl-bizinfo-nav a.privacy { font-weight: 800; }
.pl-bizinfo-nav .sep { opacity: .4; }
.pl-bizinfo-note { opacity: .8; padding-top: 6px; border-top: 1px dashed #E8E6E1; }