/* Основа CRM: шрифты и токены сайта, шапка, уведомления. Кабинеты — классы ac-* из accounts.css (прототип). */
@font-face { font-family: "Inter VM"; src: url("fonts/Inter-Variable.fa73927aeaa6.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Montserrat VM"; src: url("fonts/Montserrat-Variable.308c51d11d90.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  --vm-yellow: #f4b000;
  --vm-ink: #1a1a1a;
  --vm-paper: #f5f6f2;
  --vm-line: #e4e5df;
  --crm-danger: #8a2c26;
  --crm-danger-bg: #fbe3e0;
  --crm-success: #32623c;
  --crm-success-bg: #e7f1e6;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: "Inter VM", system-ui, sans-serif; color: #20221e; background: var(--vm-paper); }
a { color: inherit; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.crm-container { width: min(1440px, 100%); margin: 0 auto; padding: 0 20px; }
.crm-header { position: sticky; top: 0; z-index: 20; background: #fff; box-shadow: 0 1px 0 var(--vm-line); }
.crm-header-inner { display: flex; align-items: center; gap: 16px; min-height: 64px; }
.crm-logo img { display: block; height: 30px; width: auto; }
.crm-world { padding: 4px 10px; border-radius: 8px; background: #fff0c5; color: #594000; font-size: 12px; font-weight: 700; }
.crm-logout { display: flex; align-items: center; gap: 12px; margin-left: auto; font-size: 13px; }
.crm-logout .ac-button { min-height: 36px; padding: 6px 12px; font-size: 12px; }

.crm-messages { display: grid; gap: 8px; margin-bottom: 20px; }
.crm-message { margin: 0; padding: 12px 16px; border-radius: 12px; background: #eaede3; font-size: 13px; }
.crm-message--success { background: var(--crm-success-bg); color: var(--crm-success); }
.crm-message--error { background: var(--crm-danger-bg); color: var(--crm-danger); }

.ac-status--danger { color: var(--crm-danger); background: var(--crm-danger-bg); margin-left: 6px; }
.ac-status--muted { color: #6b6f66; background: #f0f1ec; }
.ac-auth-layout--single { grid-template-columns: minmax(0, 520px); justify-content: center; }

.crm-qr { display: grid; place-items: center; padding: 16px; margin: 0 0 16px; border: 1px solid var(--vm-line); border-radius: 16px; background: #fff; }
.crm-qr svg { width: 220px; height: 220px; }
.crm-secret { font-family: ui-monospace, monospace; font-size: 13px; overflow-wrap: anywhere; background: #f1f3ec; padding: 2px 6px; border-radius: 6px; }
.crm-link-button { margin-top: 16px; padding: 0; border: 0; background: none; color: #645000; font: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

.crm-pagination { display: flex; align-items: center; justify-content: center; gap: 16px; padding-top: 16px; font-size: 13px; }
.crm-definition { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 10px 16px; margin: 0; font-size: 13px; }
.crm-definition dt { color: #62655f; }
.crm-definition dd { margin: 0; overflow-wrap: anywhere; }
.crm-inline-form { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 16px 0; }
.crm-inline-form > label { flex: 1 1 200px; }
.crm-check { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.ac-toolbar .crm-check input { display: inline-block; width: 18px; height: 18px; min-height: 0; padding: 0; accent-color: #af7c00; }
.crm-copy { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; }
.crm-copy code { flex: 1 1 320px; padding: 12px; border-radius: 12px; background: #f1f3ec; font-size: 12px; overflow-wrap: anywhere; }
.crm-overdue td:first-child { box-shadow: inset 3px 0 0 var(--crm-danger); }

@media (max-width: 650px) {
  .crm-container { padding: 0 16px; }
  .crm-definition { grid-template-columns: 1fr; }
  .crm-world, .crm-logout span { display: none; }
}
