/* diaspora.ro source-first module extracted from #cv-dialog-system-20260904; behavior preserved during migration. */
/* Unified dialog system: one visual language for every CV Builder surface. */
:root {
  --cv-dialog-ink: #172033;
  --cv-dialog-muted: #64748b;
  --cv-dialog-line: #e2e8f0;
  --cv-dialog-soft: #f8fafc;
  --cv-dialog-blue: #2457a6;
  --cv-dialog-shadow: 0 24px 80px rgba(15, 23, 42, .22);
}
.share-overlay,
.email-overlay,
.fs-overlay,
#history-overlay,
#photo-editor-overlay,
#vw-overlay,
#translate-modal,
#cv-auth-gate {
  box-sizing: border-box;
  background: rgba(15, 23, 42, .62) ;
  backdrop-filter: blur(10px) ;
  -webkit-backdrop-filter: blur(10px) ;
}
.share-overlay,
.email-overlay,
.fs-overlay,
#photo-editor-overlay,
#vw-overlay,
#translate-modal,
#cv-auth-gate {
  padding: clamp(12px, 3vw, 28px) ;
}
.share-overlay.open,
.email-overlay.open,
.fs-overlay.open,
#photo-editor-overlay.open,
#vw-overlay.open,
#cv-auth-gate.open {
  display: flex ;
}
.share-box,
.email-box,
#translate-modal > div,
#cv-auth-gate .cv-auth-box,
#photo-editor-overlay .photo-editor-card,
#vw-overlay .vw-sheet,
#fs-overlay .fs-inner {
  box-sizing: border-box ;
  width: min(100%, 560px) ;
  max-height: min(92dvh, 820px) ;
  overflow: auto ;
  border: 1px solid var(--cv-dialog-line) ;
  border-radius: 20px ;
  background: #fff ;
  box-shadow: var(--cv-dialog-shadow) ;
  color: var(--cv-dialog-ink);
}
#compare-overlay .share-box,
#package-preview-overlay .share-box,
#fs-overlay .fs-inner {
  width: min(100%, 920px) ;
}
#photo-editor-overlay .photo-editor-card,
#vw-overlay .vw-sheet {
  width: min(100%, 720px) ;
}
#translate-modal > div {
  position: relative ;
  padding: 28px ;
}
#cv-auth-gate .cv-auth-box {
  padding: 30px ;
}
.share-box h3,
.email-box h3,
#translate-modal h2,
#photo-editor-overlay h2,
#vw-overlay h2,
#fs-overlay strong,
#cv-auth-gate .cv-auth-title {
  color: var(--cv-dialog-ink) ;
  letter-spacing: -.025em;
}
.share-box h3,
.email-box h3,
#translate-modal h2,
#photo-editor-overlay h2,
#cv-auth-gate .cv-auth-title {
  font-size: 19px ;
  line-height: 1.25 ;
}
.share-box p,
.email-box p,
#translate-modal p,
#photo-editor-overlay p,
#cv-auth-gate .cv-auth-sub {
  color: var(--cv-dialog-muted) ;
  line-height: 1.55 ;
}
.share-box input,
.share-box select,
.share-box textarea,
.email-box input,
.email-box select,
.email-box textarea,
#translate-modal input,
#translate-modal select,
#translate-modal textarea,
#compare-overlay select {
  box-sizing: border-box;
  border-color: var(--cv-dialog-line) ;
  border-radius: 10px ;
  background: var(--cv-dialog-soft) ;
  color: var(--cv-dialog-ink) ;
  font: inherit;
}
.share-box input:focus,
.share-box select:focus,
.share-box textarea:focus,
.email-box input:focus,
.email-box select:focus,
.email-box textarea:focus,
#translate-modal input:focus,
#translate-modal select:focus,
#translate-modal textarea:focus,
#compare-overlay select:focus {
  outline: none ;
  border-color: var(--cv-dialog-blue) ;
  box-shadow: 0 0 0 3px rgba(36, 87, 166, .12) ;
  background: #fff ;
}
.share-box > button[onclick*="close"],
.email-box > button[onclick*="close"],
#translate-modal > div > button[onclick*="close"],
#cv-auth-gate .cv-auth-close,
#photo-editor-overlay .photo-editor-close,
#vw-overlay .vw-close,
#fs-overlay .fs-close {
  width: 36px ;
  height: 36px ;
  min-width: 36px ;
  min-height: 36px ;
  display: inline-flex ;
  align-items: center ;
  justify-content: center ;
  border: 1px solid var(--cv-dialog-line) ;
  border-radius: 10px ;
  background: #fff ;
  color: var(--cv-dialog-muted) ;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .06) ;
  transition: border-color .18s ease, color .18s ease, background .18s ease ;
}
.share-box > button[onclick*="close"]:hover,
.email-box > button[onclick*="close"]:hover,
#translate-modal > div > button[onclick*="close"]:hover,
#cv-auth-gate .cv-auth-close:hover,
#photo-editor-overlay .photo-editor-close:hover,
#vw-overlay .vw-close:hover,
#fs-overlay .fs-close:hover {
  border-color: #b7c7df ;
  background: #eff6ff ;
  color: var(--cv-dialog-blue) ;
}
.share-box .btn,
.email-box .btn,
#translate-modal #tr-run-btn,
#cv-auth-gate a,
.photo-editor-actions button,
.vw-btn-skip,
.vw-btn-mic,
.vw-btn-next {
  min-height: 44px;
  border-radius: 10px ;
  font-weight: 750 ;
}
.lang-exp-btn,
.tr-lang-btn,
.photo-bg-option,
.photo-editor-rotate button {
  min-height: 42px;
  border-radius: 10px ;
  font-weight: 700 ;
}
#history-drawer {
  width: min(440px, 100vw) ;
  max-width: 100vw ;
  border-left: 1px solid var(--cv-dialog-line) ;
  box-shadow: -24px 0 70px rgba(15, 23, 42, .18) ;
}
#history-drawer h3,
#history-drawer h2 {
  color: var(--cv-dialog-ink) ;
}
#history-drawer .hist-card {
  border-color: var(--cv-dialog-line) ;
  border-radius: 12px ;
  background: #fff ;
}
#fs-overlay .fs-inner {
  max-height: 94dvh ;
}
#fs-overlay .fs-toolbar {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--cv-dialog-line);
  background: #fff;
}
@media (max-width: 640px) {
  .share-overlay,
  .email-overlay,
  .fs-overlay,
  #photo-editor-overlay,
  #vw-overlay,
  #translate-modal,
  #cv-auth-gate {
    align-items: flex-end ;
    padding: 10px ;
  }
  .share-box,
  .email-box,
  #translate-modal > div,
  #cv-auth-gate .cv-auth-box,
  #photo-editor-overlay .photo-editor-card,
  #vw-overlay .vw-sheet,
  #fs-overlay .fs-inner,
  #compare-overlay .share-box,
  #package-preview-overlay .share-box {
    width: 100% ;
    max-height: calc(100dvh - 20px) ;
    border-radius: 18px ;
  }
  .share-box,
  .email-box,
  #translate-modal > div,
  #cv-auth-gate .cv-auth-box {
    padding: 20px ;
  }
  .share-box h3,
  .email-box h3,
  #translate-modal h2,
  #photo-editor-overlay h2,
  #cv-auth-gate .cv-auth-title {
    font-size: 17px ;
  }
  .share-actions,
  .email-box-actions {
    gap: 8px ;
  }
  #fs-overlay .fs-toolbar {
    align-items: flex-start;
    padding: 12px 14px;
  }
}
