/*
  이력서 작성 위젯 — 독립형 CSS (photo-editor.css와 동일한 브랜드 톤을 로컬 변수로 내렸습니다)
*/

.rb-lightbox{
  --rb-ink-900: #201D19;
  --rb-ink-700: #4A453D;
  --rb-stone-500: #948A7A;
  --rb-paper: #F7F5F1;
  --rb-paper-2: #E4DFD5;
  --rb-line: rgba(32,29,25,0.16);
  --rb-line-strong: rgba(32,29,25,0.28);
  --rb-brass-700: #7C5F27;
  --rb-brass-600: #9C7A34;
  --rb-brass-500: #B6903F;
  --rb-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Pretendard, Roboto, sans-serif;
  --rb-font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  font-family: var(--rb-font);
  color: var(--rb-ink-900);

  position: fixed; inset: 0; z-index: 1000;
  background: rgba(10,11,13,0.92);
  display: flex; align-items: center; justify-content: center;
  padding: clamp(16px, 4vw, 48px);
}
.rb-lightbox[hidden]{ display: none; }
body.rb-open{ overflow: hidden; }

.rb-panel{
  width: min(860px, 100%); max-height: 100%;
  background: var(--rb-paper-2);
  display: flex; flex-direction: column; gap: 14px;
  padding: 20px;
  box-sizing: border-box;
  overflow: auto;
}

.rb-actions{ display: flex; flex-wrap: wrap; gap: 10px; }
.rb-actions .pe-btn{ flex: 0 0 auto; min-width: 110px; }

.rb-close{
  position: absolute; top: 18px; right: 18px; z-index: 1;
  width: 40px; height: 40px; border-radius: 50%; border: 0;
  background: rgba(252,252,253,0.12); color: var(--rb-paper);
  font-size: 1.3rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.15s ease;
}
.rb-close:hover{ background: rgba(252,252,253,0.22); }

/* ── 문서(출력) 영역 ──────────────────────────────────────── */
.rb-doc{
  background: #fff;
  box-shadow: 0 10px 40px rgba(0,0,0,0.25);
  padding: 32px clamp(20px, 4vw, 40px);
  box-sizing: border-box;
}

.rb-title{
  text-align: center; font-size: 1.5rem; font-weight: 800;
  letter-spacing: 0.5em; text-indent: 0.5em;
  color: var(--rb-ink-900);
  margin: 0 0 22px;
}

.rb-head{ display: flex; gap: 20px; align-items: stretch; margin-bottom: 24px; }
.rb-basic{ flex: 1 1 auto; border-collapse: collapse; width: 100%; }
.rb-basic th, .rb-basic td{ border: 1px solid var(--rb-line-strong); padding: 0; }
.rb-basic th{
  width: 92px; background: var(--rb-paper-2); font-size: 0.8rem; font-weight: 600;
  color: var(--rb-ink-700); text-align: center; vertical-align: middle;
}
.rb-basic td input{ width: 100%; }
.rb-field-input{
  width: 100%; box-sizing: border-box; border: 0; background: transparent;
  font-family: inherit; font-size: 0.86rem; color: var(--rb-ink-900);
  padding: 8px 10px; outline-offset: -2px;
}
.rb-field-input:focus{ outline: 1.5px solid var(--rb-brass-500); background: #fffdf8; }

.rb-photobox{
  flex: 0 0 auto; width: 110px; height: 140px;
  border: 1px solid var(--rb-line-strong);
  background: var(--rb-paper-2);
  display: flex; align-items: center; justify-content: center;
  text-align: center; cursor: pointer; position: relative; overflow: hidden;
}
.rb-photobox img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.rb-photobox-hint{ font-size: 0.72rem; color: var(--rb-stone-500); line-height: 1.5; padding: 8px; }
.rb-photobox:hover{ border-color: var(--rb-brass-500); }

.rb-section{ margin-bottom: 22px; }
.rb-section-title{
  display: flex; align-items: center; justify-content: space-between;
  font-size: 0.92rem; font-weight: 700; color: var(--rb-ink-900);
  border-bottom: 2px solid var(--rb-ink-900);
  padding-bottom: 6px; margin-bottom: 8px;
}
.rb-row-add{
  font-family: var(--rb-font-mono); font-size: 0.74rem; color: var(--rb-brass-700);
  background: none; border: 1px solid var(--rb-brass-500); border-radius: 999px;
  padding: 3px 12px; cursor: pointer;
}
.rb-row-add:hover{ background: var(--rb-brass-500); color: #201A0D; }

.rb-table{ width: 100%; border-collapse: collapse; }
.rb-table th, .rb-table td{ border: 1px solid var(--rb-line); padding: 0; }
.rb-table th{
  background: var(--rb-paper-2); font-size: 0.76rem; font-weight: 600;
  color: var(--rb-ink-700); padding: 7px 8px; text-align: center;
}
.rb-table td input{ width: 100%; }
.rb-table .rb-cell-del{ width: 34px; text-align: center; padding: 0; }
.rb-row-del{
  width: 100%; height: 100%; min-height: 32px; border: 0; background: none;
  color: var(--rb-stone-500); cursor: pointer; font-size: 0.95rem; line-height: 1;
}
.rb-row-del:hover{ color: #b13d2f; }

.rb-intro textarea{
  width: 100%; min-height: 140px; box-sizing: border-box; resize: vertical;
  border: 1px solid var(--rb-line-strong); border-radius: 2px;
  font-family: inherit; font-size: 0.86rem; line-height: 1.7; color: var(--rb-ink-900);
  padding: 10px 12px;
}
.rb-intro textarea:focus{ outline: 1.5px solid var(--rb-brass-500); }

.rb-sign{ display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 28px; font-size: 0.86rem; }
.rb-sign input{ text-align: center; }
.rb-sign-name{ width: 120px; font-weight: 700; border-bottom: 1px solid var(--rb-ink-900); }
.rb-sign-date{ width: 150px; }

.rb-note{ margin: 0; font-size: 0.76rem; color: var(--rb-stone-500); font-family: var(--rb-font-mono); }

@media (max-width: 720px){
  .rb-head{ flex-direction: column-reverse; }
  .rb-photobox{ width: 100%; height: 160px; }
}

/* ── 인쇄 (PDF로 저장) ────────────────────────────────────── */
@media print{
  body > *:not(.rb-lightbox){ display: none !important; }
  .rb-lightbox{
    position: static !important; inset: auto !important; z-index: auto !important;
    background: none !important; padding: 0 !important; display: block !important;
  }
  .rb-panel{ all: unset; display: block; }
  .rb-panel > *:not(.rb-doc){ display: none !important; }
  .rb-close{ display: none !important; }
  .rb-doc{ box-shadow: none !important; padding: 0 !important; width: auto !important; }
  .rb-photobox{ cursor: default; }
  .rb-row-add{ display: none !important; }
  .rb-cell-del{ display: none !important; }
  @page{ size: A4; margin: 15mm; }
}
