/* Общая форма заявки (public/js/order-form.js). Только дизайн-токены (src/styles/tokens.css). */
.of { font: var(--text-s)/1.45 var(--font-sans); color: var(--color-ink); }
.of-kicker { font: 700 11px var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--color-accent); margin: 0 0 var(--space-2); }
.of-f { display: block; margin: 0 0 var(--space-4); border: 0; padding: 0; min-width: 0; font-weight: 700; }
.of-f legend { padding: 0; margin-bottom: var(--space-1); font-weight: 700; }
.of-hint { font-weight: 400; color: var(--color-muted); }
.of input:not([type=checkbox]), .of textarea {
  display: block; width: 100%; box-sizing: border-box; margin-top: var(--space-1); padding: 10px 12px;
  font: 400 var(--text-m) var(--font-sans); color: var(--color-ink); background: var(--color-paper);
  border: 1px solid var(--color-line); border-radius: var(--radius);
}
.of input:focus, .of textarea:focus { outline: 2px solid color-mix(in srgb, var(--color-accent) 40%, transparent); border-color: var(--color-accent); }
.of [aria-invalid=true] { border-color: var(--color-accent); background: color-mix(in srgb, var(--color-accent) 6%, var(--color-paper)); }
.of-chk { display: flex; gap: var(--space-2); align-items: flex-start; font-weight: 400; margin: 6px 0; cursor: pointer; }
.of-chk input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--color-accent); }
.of-consent { font-size: 12.5px; color: var(--color-muted); margin: var(--space-2) 0 var(--space-4); }
.of-consent[aria-invalid=true], .of-consent:has([aria-invalid=true]) { color: var(--color-accent); }
.of-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }   /* ловушка для спамеров */
.of-actions { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); align-items: center; margin: 0; }
.of-btn { font: 700 var(--text-m) var(--font-sans); background: var(--color-accent); color: var(--color-paper); border: 0; border-radius: var(--radius);
          padding: 12px 22px; cursor: pointer; }
.of-btn:disabled { opacity: .6; cursor: default; }
.of-note { color: var(--color-muted); font-size: 12.5px; flex: 1 1 200px; }
.of-small { display: block; font-size: 12.5px; margin-top: var(--space-1); }
.of-msg { color: var(--color-accent); font-weight: 700; margin: var(--space-2) 0 0; min-height: 1em; }
.of-msg:empty { display: none; }
.of-ok { border: 2px solid var(--color-accent); padding: var(--space-4); background: color-mix(in srgb, var(--color-accent) 5%, var(--color-paper));
         font: var(--text-s)/1.5 var(--font-sans); }
.of-ok p { margin: 0 0 var(--space-2); font-size: var(--text-m); line-height: 1.5; }
.of-ok .of-hint { font-size: var(--text-s); }
.of-ok .of-no { font: 700 var(--text-xl)/1.1 var(--font-serif); color: var(--color-ink); margin: var(--space-1) 0 var(--space-3); }
.of-ok .of-kicker { font-size: 11px; }
.of-tg { display: inline-block; text-decoration: none; margin: var(--space-2) 0; }
.of-ok .of-mail { font-size: var(--text-s); margin-top: var(--space-1); }
.of-ok .of-mail a { overflow-wrap: anywhere; }
/* 13.11.2026: кнопка без согласия — неактивна на вид (aria-disabled), блок «Удобнее написать самим?», «Спасибо!» */
.of-btn[aria-disabled=true] { opacity: .45; cursor: not-allowed; }
.of-note { display: block; margin: var(--space-2) 0 0; }
.of-ok-h { font: 700 var(--text-xl)/1.1 var(--font-serif); color: var(--color-ink); margin: 0 0 var(--space-2) !important; }
.of-ok p { overflow-wrap: anywhere; }
.of-self { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--color-line); font: var(--text-s)/1.45 var(--font-sans); }
.of-self-h { font: 700 var(--text-m) var(--font-serif); margin: 0 0 var(--space-3); }
.of-self-btns { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; }
.of-btn2 { display: inline-block; font: 700 var(--text-s) var(--font-sans); color: var(--color-accent); background: var(--color-paper); text-decoration: none;
           border: 1px solid var(--color-accent); border-radius: var(--radius); padding: 10px 16px; cursor: pointer; }
.of-btn2:hover { background: color-mix(in srgb, var(--color-accent) 7%, var(--color-paper)); }
.of-copied { margin: var(--space-2) 0 0; color: var(--color-muted); }
/* без поля контакта (CONTACT_FIELD = false): только две кнопки */
.of-self-only { margin-top: 0; padding-top: 0; border-top: 0; }
.of-self-only .of-self-btns .of-btn { text-decoration: none; display: inline-block; }