/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400&display=swap');

/* ============================================
   PAPER THEME (только светлая)
   ============================================ */
[data-bs-theme="light"] {
  /* Backgrounds */
  --bg-primary: #FBF8F1;
  --bg-surface: #FFFFFF;
  --bg-surface-2: #F6F1E7;
  --bg-surface-3: #F1EADD;

  /* Borders */
  --border: #E8E0D2;
  --border-strong: #DCD2BE;

  /* Text */
  --text-primary: #3A3630;
  --text-muted: #6B6456;
  --text-disabled: #8C8474;

  /* Accent */
  --accent: #1ABB9C;
  --accent-2: #149174;
  --accent-ink: #0F7D63;
  --accent-ink-hover: #0B6A54;
  --accent-soft: #E3F7F1;
  --accent-soft-border: #c7ece2;

  /* Semantic: saturated / soft / ink */
  --success: #2fb344;
  --success-soft: #E7F6E9;
  --success-ink: #1e7a2c;
  --warning: #e8a33d;
  --warning-soft: #FCF2E2;
  --warning-ink: #8a5a12;
  --warning-2: #B8761C;
  --danger: #d63939;
  --danger-soft: #FBE9E9;
  --danger-ink: #a32020;
  --danger-2: #b02f2f;
  --info: #3d8bff;
  --info-soft: #E8F1FF;
  --info-ink: #1f5bbf;

  /* Shape and shadow */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-btn: 9px;
  --shadow: 0 1px 2px rgba(58,54,48,.05), 0 6px 20px rgba(58,54,48,.06);

  /* Bootstrap overrides */
  --bs-body-bg: var(--bg-primary);
  --bs-body-color: var(--text-primary);
  --bs-secondary-color: var(--text-muted);
  --bs-secondary-bg: var(--bg-surface-2);
  --bs-tertiary-bg: var(--bg-surface);
  --bs-tertiary-color: var(--text-primary);
  --bs-link-color: var(--accent-ink);
  --bs-link-hover-color: var(--accent-ink-hover);
  --bs-primary: var(--accent-ink);
  --bs-primary-rgb: 15, 125, 99;
  --bs-success-rgb: 47, 179, 68;
  --bs-warning-rgb: 232, 163, 61;
  --bs-danger-rgb: 214, 57, 57;
  --bs-info-rgb: 61, 139, 255;
  --bs-border-color: var(--border);
  --bs-border-radius: var(--radius);
  --bs-border-radius-sm: var(--radius-sm);
  --bs-heading-color: var(--text-primary);
  --bs-navbar-color: var(--text-primary);
  --bs-navbar-hover-color: var(--accent-ink);
  --bs-navbar-brand-color: var(--text-primary);
  --bs-dropdown-bg: var(--bg-surface);
  --bs-dropdown-link-color: var(--text-primary);
  --bs-dropdown-link-hover-bg: var(--bg-surface-2);
  --bs-dropdown-link-hover-color: var(--text-primary);
  --bs-dropdown-border-color: var(--border);
  --bs-modal-content-bg: var(--bg-surface);
  --bs-modal-header-border-color: var(--border);
  --bs-modal-footer-border-color: var(--border);
  --bs-pagination-bg: var(--bg-surface);
  --bs-pagination-color: var(--text-primary);
  --bs-pagination-border-color: var(--border);
  --bs-pagination-hover-bg: var(--bg-surface-2);
  --bs-pagination-hover-color: var(--text-primary);
  --bs-pagination-active-bg: var(--accent-ink);
  --bs-pagination-active-color: #ffffff;
  --bs-pagination-active-border-color: var(--accent-ink);
  --bs-table-striped-bg: rgba(58, 54, 48, .025);
  --bs-table-hover-bg: var(--bg-surface-2);
  --bs-card-bg: var(--bg-surface);
  --bs-card-cap-bg: var(--bg-surface-2);
  --bs-input-bg: var(--bg-surface);
  --bs-input-color: var(--text-primary);
  --bs-input-border-color: var(--border-strong);
  --bs-input-focus-border-color: var(--accent-2);
  --bs-form-valid-color: var(--success-ink);
  --bs-form-invalid-color: var(--danger-ink);
  --bs-success: var(--success);
  --bs-warning: var(--warning);
  --bs-danger: var(--danger);
  --bs-dark: var(--bg-surface-2);
  --bs-dark-rgb: 246, 241, 231;
}

/* Typography */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

.card h5,
.card h6 {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
}

.card h5 { font-size: 1.125rem; }
.card h6 { font-size: 1rem; }

thead th {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 0.82em;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--text-muted);
}

label,
.form-label {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 0.82em;
  color: var(--text-muted);
}

.case-number,
.mono-text {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 400;
  font-size: 0.9em;
}

/* ============================================
   3.1 BUTTONS — у каждой кнопки свой :hover
   ============================================ */
.btn {
  border-radius: var(--radius-btn);
  font-weight: 600;
  transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.btn-sm {
  border-radius: 7px;
  padding: 5px 10px;
}

.btn:disabled,
.btn.disabled {
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}

/* Залитые: темнеет собственная заливка */
.btn-primary {
  background: var(--accent-ink);
  border-color: var(--accent-ink);
  color: #ffffff;
}
.btn-primary:hover,
.btn-primary:active {
  background: var(--accent-ink-hover);
  border-color: var(--accent-ink-hover);
  color: #ffffff;
}

.btn-danger {
  background: var(--danger);
  border-color: var(--danger);
  color: #ffffff;
}
.btn-danger:hover,
.btn-danger:active {
  background: var(--danger-2);
  border-color: var(--danger-2);
  color: #ffffff;
}

/* На бумаге: фон на ступень ниже по лестнице */
.btn-outline-primary {
  background: transparent;
  border-color: var(--accent-2);
  color: var(--accent-ink);
}
.btn-outline-primary:hover,
.btn-outline-primary:active {
  background: var(--accent-soft);
  border-color: var(--accent-2);
  color: var(--accent-ink);
}

.btn-secondary {
  background: var(--bg-surface-2);
  border-color: var(--border-strong);
  color: var(--text-primary);
}
.btn-secondary:hover,
.btn-secondary:active {
  background: var(--bg-surface-3);
  border-color: var(--text-muted);
  color: var(--text-primary);
}

.btn-light {
  background: var(--bg-surface);
  border-color: var(--border-strong);
  color: var(--text-primary);
}
.btn-light:hover,
.btn-light:active {
  background: var(--bg-surface-2);
  border-color: var(--text-muted);
  color: var(--text-primary);
}

.btn-outline-secondary {
  background: transparent;
  border-color: var(--border-strong);
  color: var(--text-muted);
}
.btn-outline-secondary:hover,
.btn-outline-secondary:active {
  background: var(--bg-surface-2);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.btn-outline-light {
  background: transparent;
  border-color: var(--border-strong);
  color: var(--text-primary);
}
.btn-outline-light:hover,
.btn-outline-light:active {
  background: var(--bg-surface-2);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.btn-outline-danger {
  background: transparent;
  border-color: var(--border-strong);
  color: var(--danger-ink);
}
.btn-outline-danger:hover,
.btn-outline-danger:active {
  background: var(--danger-soft);
  border-color: var(--danger);
  color: var(--danger-ink);
}

/* ============================================
   3.2 FORMS
   ============================================ */
.form-control,
.form-select {
  height: 42px;
  padding: 0 12px;
  border-radius: var(--radius-sm);
  background-color: var(--bg-surface);
  border-color: var(--border-strong);
  color: var(--text-primary);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

textarea.form-control {
  height: auto;
  min-height: 96px;
  padding: 8px 12px;
  resize: vertical;
}

.form-control:hover:not(:focus):not(:disabled):not([readonly]),
.form-select:hover:not(:focus):not(:disabled) {
  border-color: var(--text-muted);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px var(--accent-soft);
  outline: none;
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
  background-color: var(--bg-surface-3);
  color: var(--text-disabled);
  opacity: 1;
}

.form-check-input {
  border-color: var(--border-strong);
  transition: border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}
.form-check-input:hover {
  border-color: var(--accent-2);
}
.form-check-input:checked {
  background-color: var(--accent-2);
  border-color: var(--accent-2);
}
.form-check-input:focus {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px var(--accent-soft);
  outline: none;
}

.form-control.is-invalid,
.form-select.is-invalid {
  border-color: var(--danger);
}
.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px var(--danger-soft);
}
.invalid-feedback {
  color: var(--danger-ink);
}

/* ============================================
   3.3 TABLES
   ============================================ */
thead th {
  background-color: var(--bg-surface-2);
}

tbody tr {
  transition: background 120ms ease;
}
tbody tr:hover > * {
  background-color: var(--bg-surface-2);
}

.case-row {
  border-left: 3px solid transparent;
}
.case-row.status-draft   { border-left-color: var(--warning); }
.case-row.status-active  { border-left-color: var(--success); }
.case-row.status-deleted { border-left-color: var(--text-muted); }

tr.table-secondary {
  --bs-table-bg: var(--bg-surface-3);
  --bs-table-color: var(--text-muted);
}

/* ============================================
   3.4 BADGES — пастельные; !important точечно
   ============================================ */
.badge {
  border-radius: 7px;
  font-weight: 700;
  font-size: 0.8em;
}
.badge.bg-success {
  background-color: var(--success-soft) !important;
  color: var(--success-ink) !important;
}
.badge.bg-warning,
.badge.bg-warning.text-dark {
  background-color: var(--warning-soft) !important;
  color: var(--warning-ink) !important;
}
.badge.bg-danger {
  background-color: var(--danger-soft) !important;
  color: var(--danger-ink) !important;
}
.badge.bg-dark,
.badge.bg-secondary {
  background-color: var(--bg-surface-2) !important;
  color: var(--text-muted) !important;
}

/* ============================================
   3.5 CARDS, NAVBAR, FOOTER
   ============================================ */
.content-card {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.card-header,
.card-header.bg-light,
.card-header.bg-secondary,
.card-header.text-bg-secondary {
  background-color: var(--bg-surface-2) !important;
  color: var(--text-primary) !important;
  border-bottom: 1px solid var(--border);
}

.card-footer.bg-light {
  background-color: var(--bg-surface-2) !important;
}

.navbar {
  background-color: var(--bs-tertiary-bg);
  border-bottom: 1px solid var(--border);
}

footer {
  border-top: 1px solid var(--border);
}

.warning-icon {
  color: var(--warning-2);
}

/* ============================================
   3.6 DROPDOWNS, MODALS, PAGINATION, TOASTS, ALERTS
   ============================================ */
.dropdown-menu,
.modal-content {
  background-color: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--bg-surface-2);
  color: var(--text-primary);
}

.page-link {
  transition: background 150ms ease, color 150ms ease;
}

/* Тост автосохранения несёт сигнал «успех» — пастельно-зелёный */
.toast,
.toast.text-bg-success {
  background-color: var(--success-soft) !important;
  color: var(--success-ink) !important;
  border: 1px solid var(--success) !important;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.toast .toast-body {
  color: var(--success-ink) !important;
}

.alert-success {
  --bs-alert-color: var(--success-ink);
  --bs-alert-bg: var(--success-soft);
  --bs-alert-border-color: var(--success);
}
.alert-warning {
  --bs-alert-color: var(--warning-ink);
  --bs-alert-bg: var(--warning-soft);
  --bs-alert-border-color: var(--warning);
}
.alert-danger,
.alert-error {
  --bs-alert-color: var(--danger-ink);
  --bs-alert-bg: var(--danger-soft);
  --bs-alert-border-color: var(--danger);
}
.alert-info {
  --bs-alert-color: var(--info-ink);
  --bs-alert-bg: var(--info-soft);
  --bs-alert-border-color: var(--info);
}
.alert-error {
  color: var(--bs-alert-color);
  background-color: var(--bs-alert-bg);
  border: 1px solid var(--bs-alert-border-color);
}

/* ============================================
   3.7 CHOICES.JS
   ============================================ */
[data-bs-theme="light"] {
  --choices-primary-color: var(--accent);
  --choices-highlight-color: var(--accent);
  --choices-highlighted-color: var(--bg-surface-2);
  --choices-bg-color: var(--bg-surface);
  --choices-bg-color-dropdown: var(--bg-surface);
  --choices-bg-color-disabled: var(--bg-surface-3);
  --choices-disabled-color: var(--bg-surface-3);
  --choices-text-color: var(--text-primary);
  --choices-keyline-color: var(--border-strong);
  --choices-item-color: var(--accent-ink);
  --choices-invalid-color: var(--danger);
  --choices-border-radius: var(--radius-sm);
}

.choices__inner {
  min-height: 42px;
  padding: 4px 12px;
  background-color: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.choices:hover:not(.is-focused):not(.is-disabled) .choices__inner {
  border-color: var(--text-muted);
}
.choices.is-focused .choices__inner,
.choices.is-open .choices__inner {
  border-color: var(--accent-2);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
.choices.is-disabled .choices__inner {
  background-color: var(--bg-surface-3);
  color: var(--text-disabled);
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
  background-color: var(--bg-surface);
  border-color: var(--border);
  box-shadow: var(--shadow);
}
.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
  background-color: var(--bg-surface-2);
  color: var(--accent-ink);
}

/* Чип выбранной статьи — бледная пилюля, не заливка */
.choices__list--multiple .choices__item,
.choices__list--multiple .choices__item.is-highlighted {
  background: var(--accent-soft);
  color: var(--accent-ink);
  border: 1px solid var(--accent-soft-border);
  border-radius: 999px;
}
.choices[data-type*="select-multiple"] .choices__button,
.choices[data-type*="text"] .choices__button {
  border-left: 1px solid var(--accent-soft-border);
  opacity: .6;
  transition: opacity 150ms ease;
}
.choices[data-type*="select-multiple"] .choices__button:hover,
.choices[data-type*="text"] .choices__button:hover {
  opacity: 1;
}

/* ============================================
   3.8 REDUCED MOTION — последним в файле
   ============================================ */
@media (prefers-reduced-motion: reduce) {
  .btn,
  .form-control,
  .form-select,
  .form-check-input,
  tbody tr,
  .case-row,
  .page-link,
  .choices__inner,
  .choices__button {
    transition: none;
  }

  .btn:focus-visible,
  .form-control:focus,
  .form-select:focus,
  .form-check-input:focus,
  .choices.is-focused .choices__inner {
    box-shadow: none;
    outline: 2px solid var(--accent);
    outline-offset: 1px;
  }
}