/* Калькулятор стажа — периоды работы + результат. Scoped под #stazh-calc. */

/* Единый шрифт (Unbounded, sans-serif) — перебиваем serif-фолбэк из inputs-style. */
#stazh-calc, #stazh-calc .calculator,
#stazh-calc input, #stazh-calc select, #stazh-calc button, #stazh-calc textarea,
#stazh-calc .label-text, #stazh-calc .tax-result span,
#stazh-calc .tax-result .amount-group span, #stazh-calc .amount-group span:first-child {
  font-family: "Unbounded", sans-serif;
}
#stazh-calc .calculator { color: #000; }

/* ── Вкладки «Что считаем» ────────────────────────────────── */
#stazh-calc .st-tabs { display: flex; gap: 6px; margin-bottom: 6px; }
#stazh-calc .st-tabs .tab-button {
  flex: 1 1 0; min-width: 0; white-space: nowrap; text-align: center;
  padding: 12px 14px; font-size: 13px; line-height: 1.2; border-radius: 12px;
  border: 1px solid #ddd; background: #fff; color: #000; cursor: pointer; transition: .15s;
}
#stazh-calc .st-tabs .tab-button:hover { background: #f7f9fc; }
#stazh-calc .st-tabs .tab-button.active { background: #000; color: #fff; border-color: #000; }
#stazh-calc .st-mode-hint { margin: 0 0 14px; font-size: 12px; line-height: 1.5; opacity: .6; }

/* ── Нативные radio/checkbox — сброс глобального инпут-стиля ── */
#stazh-calc input[type="checkbox"], #stazh-calc input[type="radio"] {
  appearance: auto; -webkit-appearance: auto;
  width: 18px; height: 18px; min-width: 18px; flex: none;
  margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
  display: inline-block; accent-color: #000; cursor: pointer;
}

/* ── Периоды работы ───────────────────────────────────────── */
#stazh-calc .st-periods-label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 10px; }
#stazh-calc .st-period {
  border: 1px solid #e5e7eb; border-radius: 14px; padding: 14px 14px 12px; margin-bottom: 14px; background: #fff;
}
#stazh-calc .st-period + .st-period { margin-top: 0; }
#stazh-calc .st-period .form-group__wrapper { margin-bottom: 10px; align-items: stretch; }
#stazh-calc .st-period .form-group { flex: 1 1 0; min-width: 0; margin-bottom: 0; }
#stazh-calc .st-period .st-emp-wrap { margin-bottom: 10px; }

/* поля-даты с плавающим label */
#stazh-calc .form-group input[type="date"] {
  width: 100%; height: 60px; padding: 22px 12px 6px; margin: 0;
  border: 1px solid #ddd; border-radius: 14px; background: #fff; color: #000;
  font-size: 14px; display: block; text-align: left;
}
#stazh-calc .form-group input[type="date"]:disabled { background: #f4f5f7; color: #9aa0a6; }
#stazh-calc .form-group label { top: 8px; left: 12px; }

/* вторая строка: «по наст. время» + тип периода + удалить */
#stazh-calc .st-row2 { display: flex; align-items: center; gap: 8px; }
#stazh-calc .st-open { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; white-space: nowrap; cursor: pointer; }
#stazh-calc .st-type-wrap { flex: 1 1 auto; min-width: 0; position: relative; }
#stazh-calc select.st-type {
  width: 100%; height: 44px; padding: 6px 34px 6px 12px; margin: 0;
  border: 1px solid #ddd; border-radius: 12px; background: #fff; color: #000;
  font-size: 12.5px; appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 10l5 5l5-5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
#stazh-calc .st-remove {
  flex: 0 0 auto; width: 40px; height: 40px; padding: 0; border: 1px solid #eee; border-radius: 12px;
  background: #fff; color: #b00020; font-size: 14px; cursor: pointer; line-height: 1;
}
#stazh-calc .st-remove:hover { background: #fdecef; opacity: 1; }

#stazh-calc .st-add {
  width: auto; margin: 2px 0 14px; padding: 10px 16px; border: 1px dashed #bbb; border-radius: 12px;
  background: #fff; font-family: "Unbounded", sans-serif; font-size: 12px; color: #000; cursor: pointer;
}
#stazh-calc .st-add:hover { background: #f7f9fc; opacity: 1; }

/* ── Параметры расчёта ────────────────────────────────────── */
#stazh-calc .st-params { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
#stazh-calc .st-params .form-group { flex: 0 0 200px; margin-bottom: 0; }
#stazh-calc .st-lastday { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; cursor: pointer; line-height: 1.4; }
#stazh-calc .st-hint { margin: 8px 0 0; font-size: 12px; line-height: 1.5; opacity: .6; }
#stazh-calc .st-warn {
  margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: #8a1c1c;
  background: #fdf3f3; border: 1px solid #f2d0d0; border-radius: 12px; padding: 10px 12px;
}

/* ── Кнопки ───────────────────────────────────────────────── */
#stazh-calc .st-actions { display: flex; gap: 10px; margin: 16px 0 4px; }
#stazh-calc .st-actions button { width: auto; flex: 0 0 auto; padding: 13px 22px; border-radius: 12px; cursor: pointer; }
#stazh-calc .st-reset { background: #fff; border: 1px solid #ddd; color: #000; }

/* ── Результат ────────────────────────────────────────────── */
#stazh-calc .calculator__result { margin-top: 16px; }
#stazh-calc .st-main { margin-bottom: 6px; }
/* Итоговые цифры — в общем шрифте (Unbounded), 14px жирным (фидбек владельца 2026-07-13) */
#stazh-calc .st-main .amount-group span:first-child { font-size: 14px; font-weight: 700; line-height: 1.3; }
#stazh-calc .st-sub .amount-group span:first-child { font-size: 14px; font-weight: 700; }
#stazh-calc .st-sick .amount-group span:first-child { font-size: 14px; font-weight: 700; }
#stazh-calc .st-sick-note { font-size: 11px; font-weight: 400; opacity: .6; }

#stazh-calc .st-status {
  margin-top: 10px; font-size: 12.5px; line-height: 1.5; border-radius: 12px; padding: 12px 14px;
}
#stazh-calc .st-status.ok { background: #f2f8f2; border: 1px solid #cfe6cf; }
#stazh-calc .st-status.no { background: #fdf6ec; border: 1px solid #f0dcae; }

#stazh-calc .st-how { border: 1px solid #ddd; border-radius: 12px; padding: 0; margin-top: 12px; }
#stazh-calc .st-how summary { cursor: pointer; padding: 12px 16px; font-size: 12px; list-style: none; user-select: none; }
#stazh-calc .st-how summary::-webkit-details-marker { display: none; }
#stazh-calc .st-how summary::before { content: "▸ "; }
#stazh-calc .st-how[open] summary::before { content: "▾ "; }
#stazh-calc .st-how ol { margin: 0; padding: 4px 16px 16px 34px; }
#stazh-calc .st-how li { font-size: 12px; line-height: 1.6; color: #000; margin-bottom: 6px; }

#stazh-calc .st-copy {
  margin-top: 12px; padding: 10px 16px; border: 1px solid #ddd; border-radius: 12px;
  background: #fff; font-family: "Unbounded", sans-serif; font-size: 12px; color: #000; cursor: pointer;
}
#stazh-calc .st-copy:hover { background: #f7f9fc; opacity: 1; }

/* ── Мобайл ───────────────────────────────────────────────── */
@media screen and (max-width: 767px) {
  #stazh-calc .st-period .form-group__wrapper { flex-direction: row; gap: 6px; }
  #stazh-calc .st-period .form-group input[type="date"] { font-size: 12.5px; padding: 22px 6px 6px; }
  #stazh-calc .st-row2 { flex-wrap: wrap; }
  #stazh-calc .st-open { order: 1; flex: 1 1 100%; }
  #stazh-calc .st-type-wrap { order: 2; flex: 1 1 auto; }
  #stazh-calc .st-remove { order: 3; }
  #stazh-calc .st-params .form-group { flex: 1 1 100%; }
}

/* ── Распознавание трудовой книжки ────────────────────────── */
#stazh-calc .st-ocr { margin-bottom: 14px; }
#stazh-calc .st-ocr-toggle {
  width: auto; display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 16px; border: 1px dashed #bbb; border-radius: 12px; background: #fff;
  font-family: "Unbounded", sans-serif; font-size: 13px; color: #000; cursor: pointer; transition: .15s;
}
#stazh-calc .st-ocr-toggle:hover { background: #f7f9fc; opacity: 1; }
#stazh-calc .st-ocr-toggle.open { border-style: solid; border-color: #000; }
#stazh-calc .st-ocr-ico { font-size: 15px; line-height: 1; }
#stazh-calc .st-ocr-privacy-hint { margin: 8px 0 0; max-width: 640px; font-size: 11.5px; line-height: 1.5; color: #55605f; }

#stazh-calc .st-ocr-panel {
  margin-top: 10px; border: 1px solid #e5e7eb; border-radius: 14px; padding: 14px; background: #fbfcfe;
}
#stazh-calc .st-ocr-drop {
  border: 1.5px dashed #c3c9d4; border-radius: 12px; padding: 22px 16px; text-align: center;
  cursor: pointer; background: #fff; transition: .15s;
}
#stazh-calc .st-ocr-drop:hover, #stazh-calc .st-ocr-drop.over { border-color: #000; background: #f7f9fc; }
#stazh-calc .st-ocr-drop-main { margin: 0 0 4px; font-size: 13px; font-weight: 600; }
#stazh-calc .st-ocr-drop-sub { margin: 0; font-size: 11.5px; line-height: 1.45; opacity: .6; }
#stazh-calc .st-ocr-privacy { margin: 10px 0 0; font-size: 11.5px; line-height: 1.5; opacity: .7; }

#stazh-calc .st-ocr-progress { height: 4px; background: #e9edf3; border-radius: 4px; overflow: hidden; margin-top: 12px; }
#stazh-calc .st-ocr-bar { height: 100%; width: 0; background: #000; transition: width .2s ease; }
#stazh-calc .st-ocr-status { margin: 10px 0 0; font-size: 12px; line-height: 1.5; }
#stazh-calc .st-ocr-status.ok { color: #1c6b2b; }
#stazh-calc .st-ocr-status.err { color: #8a1c1c; }

#stazh-calc .st-ocr-found { margin-top: 12px; border-top: 1px solid #e5e7eb; padding-top: 12px; }
#stazh-calc .st-ocr-found-title { margin: 0 0 6px; font-size: 12.5px; font-weight: 600; }
#stazh-calc .st-ocr-list { margin: 0 0 10px; padding-left: 20px; }
#stazh-calc .st-ocr-list li { font-size: 12.5px; line-height: 1.7; }
#stazh-calc .st-ocr-empty { margin: 0; font-size: 12px; line-height: 1.5; opacity: .75; }
#stazh-calc .st-ocr-apply-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#stazh-calc .st-ocr-apply {
  width: auto; padding: 10px 18px; border: 0; border-radius: 12px; background: #000; color: #fff;
  font-family: "Unbounded", sans-serif; font-size: 12.5px; cursor: pointer;
}
#stazh-calc .st-ocr-apply:hover { opacity: .85; background: #000; }
#stazh-calc .st-ocr-check { font-size: 11px; opacity: .6; }

#stazh-calc .st-ocr-rawwrap { margin-top: 10px; }
#stazh-calc .st-ocr-rawwrap summary { cursor: pointer; font-size: 11.5px; opacity: .6; list-style: none; }
#stazh-calc .st-ocr-rawwrap summary::-webkit-details-marker { display: none; }
#stazh-calc .st-ocr-rawwrap summary::before { content: "▸ "; }
#stazh-calc .st-ocr-rawwrap[open] summary::before { content: "▾ "; }
#stazh-calc textarea.st-ocr-raw {
  width: 100%; margin-top: 8px; border: 1px solid #ddd; border-radius: 10px; padding: 10px;
  font-family: ui-monospace, monospace; font-size: 11px; line-height: 1.5; color: #333; background: #fff; resize: vertical;
}

/* ── Поле работодателя в строке периода ───────────────────── */
/* отступ низа .st-emp-wrap задаётся выше (#stazh-calc .st-period .st-emp-wrap) —
   специфичность (1,2,0), иначе перебивается «.st-period .form-group{margin-bottom:0}» */
#stazh-calc .form-group input.st-emp {
  width: 100%; height: 52px; padding: 22px 12px 6px; margin: 0;
  border: 1px solid #ddd; border-radius: 14px; background: #fff; color: #000; font-size: 14px; display: block;
}

/* ── Таблица периодов в результате ────────────────────────── */
#stazh-calc .st-table-wrap { margin-top: 12px; border-top: 1px solid #e5e7eb; padding-top: 12px; }
#stazh-calc .st-table-title { font-size: 12.5px; font-weight: 600; margin-bottom: 8px; }
#stazh-calc .st-table-scroll { overflow-x: auto; }
#stazh-calc .st-result-table { width: 100%; border-collapse: collapse; font-size: 12px; }
#stazh-calc .st-result-table th, #stazh-calc .st-result-table td { border: 1px solid #e5e7eb; padding: 7px 9px; text-align: left; vertical-align: top; }
#stazh-calc .st-result-table th { background: #f7f9fc; font-weight: 600; font-size: 11.5px; }
#stazh-calc .st-result-table td:nth-child(3) { white-space: nowrap; }
#stazh-calc .st-overlap-note { margin: 8px 0 0; font-size: 11px; opacity: .7; }

/* ── Кнопки результата ────────────────────────────────────── */
#stazh-calc .st-result-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
#stazh-calc .st-result-actions .st-copy { margin-top: 0; }
#stazh-calc .st-print-btn {
  margin: 0; padding: 10px 16px; border: 1px solid #000; border-radius: 12px; background: #000; color: #fff;
  font-family: "Unbounded", sans-serif; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
}
#stazh-calc .st-print-btn:hover { opacity: .85; background: #000; }
#stazh-calc .st-print-ico { font-size: 13px; line-height: 1; }
#stazh-calc .st-pdf-btn {
  margin: 0; padding: 10px 16px; border: 1px solid #000; border-radius: 12px; background: #fff; color: #000;
  font-family: "Unbounded", sans-serif; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
}
#stazh-calc .st-pdf-btn:hover { background: #f7f9fc; }
#stazh-calc .st-pdf-btn:disabled { opacity: .55; cursor: default; }

/* Лист печати/PDF — на экране скрыт, печатается через iframe (см. printSheet в JS) */
.st-print { display: none; }

/* ── Таблицы в тексте ─────────────────────────────────────── */
.st-table { width: 100%; border-collapse: collapse; margin: 8px 0 12px; font-size: 14px; }
.st-table th, .st-table td { border: 1px solid #e5e7eb; padding: 8px 10px; text-align: left; vertical-align: top; }
.st-table th { background: #f7f9fc; font-weight: 600; }
.st-table td:first-child { font-weight: 600; }