/* ResumeForge — app chrome */
.auth-card { width: 100%; max-width: 420px; border: 0; border-radius: 14px; }
.auth-wrap { background: linear-gradient(160deg, #f8f9fa 60%, #e7f0ff 100%); }

.resume-card { transition: transform .12s ease, box-shadow .12s ease; border: 0; border-radius: 12px; }
.resume-card:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1.25rem rgba(13,110,253,.12) !important; }

.editor-shell { max-width: 1500px; }
.editor-title { max-width: 320px; }

.section-row .row-del { position: absolute; top: 8px; right: 8px; font-size: .65rem; opacity: .5; }
.section-row .row-del:hover { opacity: 1; }
.section-row { border-radius: 10px; }

.preview-frame-wrap { position: sticky; top: 72px; height: calc(100vh - 96px);
  border-radius: 12px; overflow: hidden; background: #e9ecef; }
.preview-frame-wrap iframe { width: 100%; height: 100%; border: 0; }

@media (max-width: 991.98px) {
  .preview-frame-wrap { position: static; height: 70vh; }
}

/* ---- CV thumbnails (scaled live iframes of the print view) ---- */
/* A4 @96dpi = 794 x 1123 px; iframes are rendered full-size then scaled down. */
.thumb { display: block; position: relative; overflow: hidden; background: #f1f3f5; }
.thumb iframe { width: 794px; height: 1123px; border: 0; transform-origin: top left;
  pointer-events: none; background: #fff; }
.thumb::after { content: ""; position: absolute; inset: 0; } /* swallow clicks/scroll */

/* dashboard card thumbnail */
.thumb-card { height: 200px; border-radius: 12px 12px 0 0; border-bottom: 1px solid #eceff2; }
.thumb-card iframe { transform: scale(0.252); } /* 794*0.252 ≈ 200px wide */
.resume-card .thumb-card { display: flex; justify-content: center; }
.resume-card { overflow: hidden; }

/* ---- theme tile selector ---- */
.theme-tile { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px;
  border: 2px solid #dee2e6; background: #fff; border-radius: 12px; padding: 8px; cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease; }
.theme-tile:hover { border-color: #9ec5fe; transform: translateY(-2px); }
.theme-tile.active { border-color: #0d6efd; box-shadow: 0 0 0 3px rgba(13,110,253,.15); }
.theme-tile .tile-label { font-size: .78rem; font-weight: 600; color: #343a40; }
.theme-tile .thumb-theme { width: 127px; height: 180px; border-radius: 6px; border: 1px solid #e9ecef; }
.theme-tile .thumb-theme iframe { transform: scale(0.16); } /* 794*0.16 ≈ 127px wide */
.theme-tile .tile-check { position: absolute; top: 4px; right: 7px; color: #0d6efd;
  font-size: 1rem; display: none; }
.theme-tile.active .tile-check { display: block; background: #fff; border-radius: 50%; line-height: 1; }

/* ---- photo upload ---- */
.photo-preview { width: 72px; height: 72px; border-radius: 50%; object-fit: cover;
  border: 2px solid #dee2e6; background: #f1f3f5; }
.photo-empty { border-style: dashed; }
.crop-stage { max-height: 60vh; }
.crop-stage img { display: block; max-width: 100%; }

/* ---- resume score ---- */
.score-ring { width: 56px; height: 56px; border-radius: 50%; flex: 0 0 56px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 1.05rem; border: 4px solid #dee2e6; color: #343a40; }
.ring-low  { border-color: #dc3545; color: #dc3545; }
.ring-mid  { border-color: #ffc107; color: #b88a00; }
.ring-good { border-color: #198754; color: #198754; }

/* ---- slug field ---- */
.slug-group { width: 220px; }
.slug-group .input-group-text { font-family: monospace; padding: 0 8px; }
.slug-group input { font-family: monospace; }

/* ============================ AI assistant ============================ */
.ai-card { border-left: 3px solid #0d6efd !important; }

.ai-status { font-size: .72rem; font-weight: 500; color: #6c757d; white-space: nowrap; }
.ai-status.ok   { color: #198754; }
.ai-status.warn { color: #b88a00; }
.ai-status code { font-size: .72rem; }

/* toast */
.ai-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px);
  background: #1c1f23; color: #fff; font-size: .85rem; padding: 10px 18px; border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25); opacity: 0; pointer-events: none; z-index: 1090;
  transition: opacity .2s ease, transform .2s ease; max-width: 90vw; text-align: center; }
.ai-toast.show { opacity: 1; transform: translate(-50%, 0); }
.ai-toast.ok   { background: #146c43; }
.ai-toast.err  { background: #b02a37; }
.ai-toast.warn { background: #997404; }

/* keyword chips */
.ai-chip { display: inline-block; font-size: .74rem; padding: 3px 9px; border-radius: 999px;
  margin: 0 4px 4px 0; border: 1px solid transparent; }
.ai-chip.ok   { background: #d1e7dd; color: #0f5132; }
.ai-chip.miss { background: #f8d7da; color: #842029; }
.ai-chip.sug  { background: #cfe2ff; color: #084298; }

/* match score badge */
.ai-score { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.1rem;
  border: 4px solid #dee2e6; color: #343a40; }
.ai-score.low { border-color: #dc3545; color: #dc3545; }
.ai-score.mid { border-color: #ffc107; color: #b88a00; }
.ai-score.ok  { border-color: #198754; color: #198754; }
