/* CVguide editor — «красивая» стилизация в духе редактора Gramotix (gx-editor).
   Только визуал, только внутри #cv-editor-workspace #cvguide-inline-editor. Подключается из cv-constructor.tpl.
   Откат: удалить строку <link ... cv-editor-pretty.css> из cv-constructor.tpl. */

#cv-editor-workspace #cvguide-inline-editor{
  --cvp-ink: #1b2430; --cvp-ink2: #52617a; --cvp-ink3: #64748f; --cvp-title: #0b1945;
  --cvp-accent: #2f6bff; --cvp-accent-text: #1f52d9; --cvp-ring: rgba(47, 107, 255, .30);
  --cvp-line: #d3dcec; --cvp-line-soft: #cfdbfa;
  --cvp-card-shadow: 0 1px 2px rgba(20, 40, 80, .06), 0 6px 18px rgba(20, 40, 80, .07);
}

/* ---------- подложка вокруг редактора ---------- */
#cv-editor-workspace #cvguide-inline-editor .workspace{
  gap: 16px; padding: 16px; background: #f4f7ff; border: 1px solid #cbd6ea; border-radius: 28px;
  box-shadow: 0 1px 2px rgba(20, 40, 80, .06), 0 18px 48px rgba(20, 40, 80, .14);
}
#cv-editor-workspace #cvguide-inline-editor .editor-navigation{ margin-bottom: 12px; border: 1px solid #d3dcec; border-radius: 18px; background: rgba(255, 255, 255, .7); }
#cv-editor-workspace #cvguide-inline-editor .tabs button{ font-weight: 500; }
#cv-editor-workspace #cvguide-inline-editor .tabs button[aria-selected="true"]{ color: var(--cvp-accent-text); font-weight: 600; }

/* ---------- карточки формы ---------- */
#cv-editor-workspace #cvguide-inline-editor .form-card{
  border: 1px solid var(--cvp-line); border-radius: 22px; padding: 20px 22px; margin-bottom: 12px;
  background: #fff; box-shadow: var(--cvp-card-shadow);
}
#cv-editor-workspace #cvguide-inline-editor .form-card:last-of-type{ margin-bottom: 0; }
#cv-editor-workspace #cvguide-inline-editor .identity-card{ background: radial-gradient(ellipse at 100% 0%, #edf2ff, transparent 40%), #fff; }
#cv-editor-workspace #cvguide-inline-editor .template-settings{ background: radial-gradient(ellipse at 100% 0%, #e3eaff90, transparent 45%), #fff; }
#cv-editor-workspace #cvguide-inline-editor .form-card h1, #cv-editor-workspace #cvguide-inline-editor .form-card h2{ color: var(--cvp-title); font-weight: 650; letter-spacing: -.01em; margin: 0 0 14px; }
#cv-editor-workspace #cvguide-inline-editor .form-card h2{ font-size: 22px; line-height: 1.25; gap: 12px; }
#cv-editor-workspace #cvguide-inline-editor .section-icon{ width: 34px; height: 34px; border-radius: 11px; }
#cv-editor-workspace #cvguide-inline-editor .eyebrow{ font-size: 10px; line-height: 1.5; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--cvp-ink3); margin-bottom: 4px; }
#cv-editor-workspace #cvguide-inline-editor .identity-heading{ min-height: 100px; margin-bottom: 16px; padding-top: 0; }
#cv-editor-workspace #cvguide-inline-editor .identity-heading h2{ font-size: 28px; font-weight: 650; letter-spacing: -.02em; margin-bottom: 4px; }
#cv-editor-workspace #cvguide-inline-editor .identity-heading p{ font-size: 13px; line-height: 1.45; color: var(--cvp-ink2); }
#cv-editor-workspace #cvguide-inline-editor .field-grid{ gap: 12px 14px; }
#cv-editor-workspace #cvguide-inline-editor .identity-grid{ gap: 18px; margin: 16px 0; }
#cv-editor-workspace #cvguide-inline-editor .name-fields{ gap: 12px; }
#cv-editor-workspace #cvguide-inline-editor .city-row, #cv-editor-workspace #cvguide-inline-editor .birthday{ margin-bottom: 16px; }
#cv-editor-workspace #cvguide-inline-editor .date-grid{ gap: 10px; }

/* заголовки групп — с синей полоской слева */
#cv-editor-workspace #cvguide-inline-editor .birthday > legend, #cv-editor-workspace #cvguide-inline-editor .template-picker > legend, #cv-editor-workspace #cvguide-inline-editor .color-picker > legend, #cv-editor-workspace #cvguide-inline-editor .repeat-item > legend{
  position: relative; float: none; padding: 0 0 0 12px; margin: 0 0 10px; font-size: 16px; line-height: 1.3; font-weight: 700; color: var(--cvp-title);
}
#cv-editor-workspace #cvguide-inline-editor .birthday > legend::before, #cv-editor-workspace #cvguide-inline-editor .template-picker > legend::before, #cv-editor-workspace #cvguide-inline-editor .color-picker > legend::before, #cv-editor-workspace #cvguide-inline-editor .repeat-item > legend::before{
  content: ""; position: absolute; left: 0; top: 2px; bottom: 2px; width: 4px; border-radius: 4px; background: var(--cvp-accent);
}

/* ---------- поля ---------- */
#cv-editor-workspace #cvguide-inline-editor .field label, #cv-editor-workspace #cvguide-inline-editor legend{ font-size: 14px; line-height: 1.4; font-weight: 600; color: var(--cvp-ink); margin-bottom: 6px; transition: color .15s; }
#cv-editor-workspace #cvguide-inline-editor .date-grid .select-trigger{ padding-inline: 12px; font-size: 15px; gap: 4px; }
#cv-editor-workspace #cvguide-inline-editor .date-grid label{ position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); }
#cv-editor-workspace #cvguide-inline-editor .field:focus-within > label{ color: var(--cvp-accent-text); }
#cv-editor-workspace #cvguide-inline-editor .field input, #cv-editor-workspace #cvguide-inline-editor .field select, #cv-editor-workspace #cvguide-inline-editor .field textarea, #cv-editor-workspace #cvguide-inline-editor .select-trigger{
  min-height: 54px; padding: 14px 16px; font-family: inherit; font-size: 16.5px; font-weight: 500; line-height: 1.45; color: var(--cvp-ink);
  background: #fff; border: 1.5px solid #b9c4d8; border-radius: 14px;
  box-shadow: 0 1px 2px rgba(20, 40, 80, .06), 0 3px 8px rgba(20, 40, 80, .04);
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
#cv-editor-workspace #cvguide-inline-editor .field textarea{ min-height: 110px; line-height: 1.55; }
#cv-editor-workspace #cvguide-inline-editor .input-with-icon > input{ padding-left: 46px; }
#cv-editor-workspace #cvguide-inline-editor .input-icon{ left: 16px; }
#cv-editor-workspace #cvguide-inline-editor .field input::placeholder, #cv-editor-workspace #cvguide-inline-editor .field textarea::placeholder{ color: #9aa6ba; font-weight: 400; font-style: italic; opacity: 1; }
#cv-editor-workspace #cvguide-inline-editor .field input:hover:not(:focus), #cv-editor-workspace #cvguide-inline-editor .field textarea:hover:not(:focus), #cv-editor-workspace #cvguide-inline-editor .select-trigger:hover{ border-color: #8ea0bd; }
#cv-editor-workspace #cvguide-inline-editor .field input:not(:placeholder-shown):not(:focus), #cv-editor-workspace #cvguide-inline-editor .field textarea:not(:placeholder-shown):not(:focus){ border-color: #7fa0f0; }
#cv-editor-workspace #cvguide-inline-editor .field input:focus, #cv-editor-workspace #cvguide-inline-editor .field textarea:focus, #cv-editor-workspace #cvguide-inline-editor .select-trigger:focus-visible, #cv-editor-workspace #cvguide-inline-editor .select-trigger[aria-expanded="true"]{
  outline: none; background: #fff; border-color: var(--cvp-accent);
  box-shadow: 0 0 0 4px var(--cvp-ring), 0 6px 18px rgba(47, 107, 255, .16);
}
#cv-editor-workspace #cvguide-inline-editor .field input:user-invalid, #cv-editor-workspace #cvguide-inline-editor .field textarea:user-invalid, #cv-editor-workspace #cvguide-inline-editor .field input[aria-invalid="true"], #cv-editor-workspace #cvguide-inline-editor .field textarea[aria-invalid="true"]{ border-color: #e0405a; }
#cv-editor-workspace #cvguide-inline-editor .select-trigger.is-placeholder{ color: #9aa6ba; font-weight: 400; font-style: italic; }
#cv-editor-workspace #cvguide-inline-editor .select-chevron{ background: #eef3ff; color: #3b60da; }
#cv-editor-workspace #cvguide-inline-editor .field-note, #cv-editor-workspace #cvguide-inline-editor .field-hint{ font-size: 12.5px; line-height: 1.45; color: var(--cvp-ink2); margin-top: 6px; }
#cv-editor-workspace #cvguide-inline-editor .phone-control{ gap: 8px; }
#cv-editor-workspace #cvguide-inline-editor .phone-control > .select-wrap{ width: 108px; }

/* выпадающий список и всплывашки */
#cv-editor-workspace #cvguide-inline-editor .select-popover{ border: 1px solid #dce2ed; border-radius: 14px; box-shadow: 0 8px 24px rgba(20, 40, 80, .14); }
#cv-editor-workspace #cvguide-inline-editor .select-search{ font-size: 14px; border-color: #dce2ed; }
#cv-editor-workspace #cvguide-inline-editor .select-option{ border-radius: 10px; font-size: 14.5px; }
#cv-editor-workspace #cvguide-inline-editor .select-option[aria-selected="true"]{ background: #eef3ff; color: var(--cvp-accent-text); font-weight: 600; }

/* ---------- фото, чекбоксы, переключатели ---------- */
#cv-editor-workspace #cvguide-inline-editor .photo-upload{ border: 1.5px dashed #b9c8ec; border-radius: 16px; transition: border-color .15s, background .15s; }
#cv-editor-workspace #cvguide-inline-editor .photo-upload:hover{ border-color: var(--cvp-accent); }
#cv-editor-workspace #cvguide-inline-editor .photo-actions button{ font-size: 12px; font-weight: 500; color: #4a6ab0; }
#cv-editor-workspace #cvguide-inline-editor .check-field{ font-size: 14px; font-weight: 500; }
#cv-editor-workspace #cvguide-inline-editor .check-field input{ border: 1.5px solid #b9c4d8; }
#cv-editor-workspace #cvguide-inline-editor .setting-switch{ border: 1px solid var(--cvp-line); border-radius: 16px; background: #f9faff; padding: 14px 16px; }
#cv-editor-workspace #cvguide-inline-editor .setting-copy strong{ font-size: 14px; color: var(--cvp-ink); }
#cv-editor-workspace #cvguide-inline-editor .setting-copy small{ font-size: 12.5px; color: var(--cvp-ink2); }
#cv-editor-workspace #cvguide-inline-editor .settings-preferences{ gap: 8px; margin: 14px 0 16px; }

/* ---------- раскрывашки, «добавить», повторяемые блоки ---------- */
#cv-editor-workspace #cvguide-inline-editor .disclosure{ margin-top: 16px; }
#cv-editor-workspace #cvguide-inline-editor .disclosure > .field-grid, #cv-editor-workspace #cvguide-inline-editor .disclosure > .field{ margin-top: 14px; }
#cv-editor-workspace #cvguide-inline-editor .disclosure summary, #cv-editor-workspace #cvguide-inline-editor .add-button{ border: 1.5px dashed #bccaea; border-radius: 14px; background: #f9faff; color: #4a6ab0; font-size: 14px; font-weight: 600; min-height: 46px; }
#cv-editor-workspace #cvguide-inline-editor .repeat-item{ padding-top: 22px; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #e3e9f5; }
#cv-editor-workspace #cvguide-inline-editor .repeat-item > legend{ padding-top: 0; }
#cv-editor-workspace #cvguide-inline-editor .repeat-actions{ top: -20px; }
#cv-editor-workspace #cvguide-inline-editor .text-button{ font-size: 13px; font-weight: 500; color: #3b60da; }
#cv-editor-workspace #cvguide-inline-editor .icon-button{ border-radius: 11px; }

/* готовые формулировки — таблетки как у Gramotix */
#cv-editor-workspace #cvguide-inline-editor .suggest-box{ margin: 10px 0 14px; }
#cv-editor-workspace #cvguide-inline-editor .suggestions{ gap: 6px; margin: 10px 0 14px; }
#cv-editor-workspace #cvguide-inline-editor .suggestions button, #cv-editor-workspace #cvguide-inline-editor .suggest-chips button{
  display: inline-flex; align-items: center; min-height: 34px; padding: 6px 14px; border: 1px solid var(--cvp-line-soft); border-radius: 999px;
  background: #fff; color: var(--cvp-accent-text); font-size: 13.5px; font-weight: 500; line-height: 1.3; transition: background-color .15s, border-color .15s;
}
#cv-editor-workspace #cvguide-inline-editor .suggestions button:hover, #cv-editor-workspace #cvguide-inline-editor .suggest-chips button:hover{ background: #eef3ff; border-color: #afc4f7; color: var(--cvp-accent-text); }
#cv-editor-workspace #cvguide-inline-editor .suggestions button[aria-pressed="true"], #cv-editor-workspace #cvguide-inline-editor .suggest-chips button[aria-pressed="true"]{ background: #e4ecff; border-color: #8fadf7; color: #2a56d6; font-weight: 600; }
#cv-editor-workspace #cvguide-inline-editor .suggest-more > summary{ border: 1.5px dashed #bccaea; border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; color: #4a6ab0; }
#cv-editor-workspace #cvguide-inline-editor .suggest-panel{ border: 1px solid var(--cvp-line); border-radius: 16px; background: #f9faff; }
#cv-editor-workspace #cvguide-inline-editor .suggest-search{ min-height: 44px; border: 1.5px solid #b9c4d8; border-radius: 12px; font-size: 15px; }
#cv-editor-workspace #cvguide-inline-editor .wording-button{ height: 40px; margin: 8px 0 4px; border: 1px solid var(--cvp-line-soft); border-radius: 12px; background: #f1f5ff; font-size: 13.5px; }

/* ---------- кнопки ---------- */
#cv-editor-workspace #cvguide-inline-editor .primary-button{ min-height: 44px; border-radius: 13px; font-size: 14px; font-weight: 600; border: .8px solid #3a6df0; box-shadow: inset 0 1px 1px rgba(255, 255, 255, .31), 0 3px 6px rgba(49, 95, 223, .14); }
#cv-editor-workspace #cvguide-inline-editor .change-template{ min-height: 44px; border: .8px solid var(--cvp-line-soft); border-radius: 13px; font-size: 14px; }
#cv-editor-workspace #cvguide-inline-editor .hint-toggle{ min-height: 32px; border: 1px solid var(--cvp-line-soft); font-weight: 500; }
#cv-editor-workspace #cvguide-inline-editor .template-option{ border: 2px solid #fff; border-radius: 16px; box-shadow: 0 1px 2px rgba(20, 40, 80, .08), 0 4px 10px rgba(20, 40, 80, .06); }
#cv-editor-workspace #cvguide-inline-editor .template-option:has(:checked){ border-color: var(--cvp-accent); box-shadow: 0 0 0 3px var(--cvp-ring); }
#cv-editor-workspace #cvguide-inline-editor .template-picker{ margin-top: 16px; }
#cv-editor-workspace #cvguide-inline-editor .color-picker{ margin-block: 16px; }
#cv-editor-workspace #cvguide-inline-editor .template-grid{ gap: 14px 12px; }

/* ---------- предпросмотр ---------- */
#cv-editor-workspace #cvguide-inline-editor .preview-panel{
  padding: 18px 18px 16px; border: 1px solid var(--cvp-line); border-radius: 22px; background: #fff; box-shadow: var(--cvp-card-shadow);
}
#cv-editor-workspace #cvguide-inline-editor .preview-heading{ padding: 0 2px 10px; }
#cv-editor-workspace #cvguide-inline-editor .preview-heading .eyebrow{ font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--cvp-title); }
#cv-editor-workspace #cvguide-inline-editor .preview-toolbar{ margin-bottom: 12px; }
#cv-editor-workspace #cvguide-inline-editor .preview-empty-hint{ font-size: 12.5px; color: var(--cvp-ink2); }
#cv-editor-workspace #cvguide-inline-editor .preview-stage{ padding: 16px; background: #cdd3de; border-radius: 14px; box-shadow: inset 0 1px 4px rgba(20, 30, 60, .18); }
#cv-editor-workspace #cvguide-inline-editor #pdf-canvas{ border-radius: 4px; box-shadow: 0 2px 4px rgba(20, 30, 60, .2), 0 14px 34px rgba(20, 30, 60, .3); }
#cv-editor-workspace #cvguide-inline-editor .save-status{ font-size: 12px; }

/* ---------- окна ---------- */
#cv-editor-workspace #cvguide-inline-editor dialog{ border: 1px solid var(--cvp-line); border-radius: 22px; background: #fff; box-shadow: 0 24px 80px rgba(20, 40, 80, .28); }
#cv-editor-workspace #cvguide-inline-editor .dialog-heading h2{ font-weight: 650; color: var(--cvp-title); letter-spacing: -.01em; }
#cv-editor-workspace #cvguide-inline-editor .download-options button{ border: 1px solid var(--cvp-line); border-radius: 14px; background: #f9faff; }

/* ---------- адаптив ---------- */
@media (max-width: 1100px){
  #cv-editor-workspace #cvguide-inline-editor .form-card{ padding: 18px; }
}
@media (max-width: 900px){
  #cv-editor-workspace #cvguide-inline-editor .workspace{ padding: 12px; border-radius: 22px; }
  #cv-editor-workspace #cvguide-inline-editor .form-card{ padding: 18px; }
  #cv-editor-workspace #cvguide-inline-editor .identity-grid{ grid-template-columns: 112px minmax(0, 1fr); gap: 16px; }
  #cv-editor-workspace #cvguide-inline-editor .photo-upload{ width: 112px; }
}
@media (max-width: 560px){
  #cv-editor-workspace #cvguide-inline-editor .workspace{ padding: 8px; border-radius: 18px; gap: 10px; }
  #cv-editor-workspace #cvguide-inline-editor .form-card{ border-radius: 16px; padding: 16px 14px; margin-bottom: 10px; border-width: 1px; }
  #cv-editor-workspace #cvguide-inline-editor .form-card h2{ font-size: 20px; margin-bottom: 12px; }
  #cv-editor-workspace #cvguide-inline-editor .identity-heading h2{ font-size: 24px; }
  #cv-editor-workspace #cvguide-inline-editor .field input, #cv-editor-workspace #cvguide-inline-editor .field select, #cv-editor-workspace #cvguide-inline-editor .field textarea, #cv-editor-workspace #cvguide-inline-editor .select-trigger{ font-size: 16px; }
  #cv-editor-workspace #cvguide-inline-editor .identity-grid{ grid-template-columns: 86px minmax(0, 1fr); gap: 14px; }
  #cv-editor-workspace #cvguide-inline-editor .photo-upload{ width: 86px; }
  #cv-editor-workspace #cvguide-inline-editor .date-grid{ gap: 6px; }
  #cv-editor-workspace #cvguide-inline-editor .date-grid .select-trigger{ padding-inline: 8px; font-size: 14px; }
  #cv-editor-workspace #cvguide-inline-editor .date-grid .select-chevron{ width: 16px; background: transparent; }
  #cv-editor-workspace #cvguide-inline-editor .preview-panel{ padding: 14px 10px 12px; border-radius: 16px; }
  #cv-editor-workspace #cvguide-inline-editor .preview-stage{ padding: 10px; }
  #cv-editor-workspace #cvguide-inline-editor dialog{ border-radius: 18px; }
}
