/* ==========================================================================
   5Region Console — integration layer for the Yii2 backend.
   Only what the server-rendered pages need on top of the approved prototype CSS
   (tokens.css / app.css / screens/*.css are copied unchanged).
   ========================================================================== */

/* Theme toggle icons (prototype injected this rule from shell.js) */
:root[data-theme="dark"] .theme-ic-dark, :root:not([data-theme="dark"]) .theme-ic-light { display: none; }

/* Server-side validation beside the field */
.field-error { font-size: var(--fs-xs); color: var(--err); line-height: 1.45; }
.field-error:empty { display: none; }
.field.has-error .input, .field.has-error .select, .field.has-error .textarea, .field.has-error .input-affix { border-color: var(--err-dot); }
.field.has-error .label { color: var(--err); }
.toggle-text { display: flex; flex-direction: column; gap: 2px; }
.field > input[type=hidden] + .check, .field > input[type=hidden] + .switch { align-self: flex-start; }

/* Server flash messages: toasts when JS runs, callout otherwise */
.flash-fallback { margin-bottom: var(--s-4); }

/* Pager rendered as links (prototype used buttons) */
.pager a, .pager span.pager-gap { min-width: 28px; height: 28px; padding: 0 6px; border-radius: var(--r-sm); color: var(--text-2); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; display: inline-grid; place-items: center; }
.pager a:hover { background: var(--surface-3); color: var(--text); }
.pager a.is-active { background: var(--surface-3); color: var(--text); font-weight: 600; }
.pager a.is-disabled { opacity: .35; pointer-events: none; }
.pager .i { width: 14px; height: 14px; }

/* «Not connected» / «No data yet» states for prepared sections */
.na { color: var(--text-3); font-weight: 500; }
.na-value { font-size: var(--fs-md); font-weight: 600; color: var(--text-3); letter-spacing: -0.01em; }
.chart-empty { display: grid; place-items: center; min-height: 160px; border: 1px dashed var(--line-strong); border-radius: var(--r); color: var(--text-3); font-size: var(--fs-sm); text-align: center; padding: 16px;
  background: repeating-linear-gradient(0deg, transparent 0 39px, var(--line-soft) 39px 40px); }
.chart-empty .empty-ic { margin: 0 auto 8px; }
.src-badge { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-2xs); font-weight: 600; letter-spacing: .02em; color: var(--text-3); }
button[data-unavailable], a[data-unavailable] { cursor: help; }
.btn.is-unavailable { opacity: .55; }
.btn.is-unavailable:hover { background: var(--surface); }

/* Article list: link-based pager on phones, empty result keeps the header full width */
.art-table.is-empty { table-layout: auto; }
@media (max-width: 767px) {
  .table-foot .pager a:not(.pg-arrow), .table-foot .pager .pager-gap { display: none; }
}

/* ---------- Editor: body block, raw-HTML mode and TinyMCE chrome in the design tokens ---------- */
.ed-page { padding: 0 !important; max-width: none !important; }
.field-plain .field-error { display: block; margin-top: 4px; }
.insp-err { display: block; margin: -2px 0 8px; }
.insp-row.has-error .picker, .insp-row.has-error .input { border-color: var(--err-dot); }
.ed-body-wrap { margin-top: 8px; }
.ed-body-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0 6px; border-bottom: 1px solid var(--line); }
.ed-body-head .switch { font-size: var(--fs-sm); color: var(--text-2); }
.ed-legacy-warn { margin: 10px 0 4px; }
.ed-preserve-hint { margin-top: 8px; }
.ed-source { min-height: 420px; font-family: var(--font-serif); font-size: 17px; line-height: 1.6; background: var(--surface); }
.ed-source.is-raw { font-family: var(--font-mono); font-size: 12.5px; line-height: 1.55; tab-size: 2; white-space: pre-wrap; }
.ed-body-wrap.has-error .tox-tinymce, .ed-body-wrap.has-error .ed-source { box-shadow: 0 0 0 1px var(--err-dot); }
.hero-fig.is-over, .hero-empty.is-over { outline: 2px dashed var(--focus); outline-offset: 2px; }
.save-state { cursor: default; }

.ed-body-wrap .tox.tox-tinymce { border: 0; border-radius: 0; background: transparent; }
.ed-body-wrap .tox .tox-editor-container, .ed-body-wrap .tox .tox-edit-area, .ed-body-wrap .tox .tox-edit-area__iframe { background: transparent; }
.ed-body-wrap .tox .tox-edit-area::before { display: none; }
.ed-body-wrap .tox .tox-editor-header { background: color-mix(in srgb, var(--bg) 92%, transparent); border-bottom: 1px solid var(--line); box-shadow: none !important; padding: 0 !important; }
.ed-body-wrap .tox .tox-toolbar, .ed-body-wrap .tox .tox-toolbar__overflow, .ed-body-wrap .tox .tox-toolbar__primary { background: transparent; border: 0; }
.ed-body-wrap .tox .tox-toolbar__group { padding: 0 4px; border-color: var(--line) !important; }
.ed-body-wrap .tox .tox-tbtn { color: var(--text-2); border-radius: var(--r-sm); height: 30px; }
.ed-body-wrap .tox .tox-tbtn svg { fill: var(--text-2); }
.ed-body-wrap .tox .tox-tbtn:hover, .ed-body-wrap .tox .tox-tbtn:focus { background: var(--surface-3); color: var(--text); }
.ed-body-wrap .tox .tox-tbtn:hover svg { fill: var(--text); }
.ed-body-wrap .tox .tox-tbtn--enabled, .ed-body-wrap .tox .tox-tbtn--enabled:hover { background: var(--surface-3); color: var(--text); }
.ed-body-wrap .tox .tox-tbtn--disabled svg, .ed-body-wrap .tox .tox-tbtn:disabled svg { fill: var(--text-4); }
.ed-body-wrap .tox .tox-tbtn__select-label { color: var(--text-2); font: 500 var(--fs-sm)/1 var(--font-sans); }
.ed-body-wrap .tox .tox-split-button:hover { box-shadow: 0 0 0 1px var(--line-strong) inset; }
/* menus, dialogs and notifications are rendered by TinyMCE at <body> level */
.tox .tox-menu, .tox .tox-collection--list, .tox .tox-dialog, .tox .tox-pop__dialog { background: var(--surface) !important; border-color: var(--line) !important; color: var(--text); }
:root[data-theme="dark"] .tox .tox-menu, :root[data-theme="dark"] .tox .tox-dialog { background: var(--surface-2) !important; }
.tox .tox-collection__item, .tox .tox-dialog__title, .tox .tox-dialog__body, .tox .tox-label, .tox .tox-form__group label { color: var(--text) !important; font-family: var(--font-sans) !important; }
.tox .tox-collection--list .tox-collection__item--active { background: var(--surface-3) !important; }
.tox .tox-collection__item-icon svg, .tox .tox-collection__item-caret svg, .tox .tox-collection__item-checkmark svg { fill: var(--text-2) !important; }
.tox .tox-textfield, .tox .tox-textarea, .tox .tox-listboxfield .tox-listbox--select, .tox .tox-selectfield select { background: var(--surface) !important; color: var(--text) !important; border-color: var(--line-strong) !important; border-radius: var(--r) !important; }
.tox .tox-dialog__header, .tox .tox-dialog__footer { background: transparent !important; border-color: var(--line-soft) !important; }
.tox .tox-button:not(.tox-button--secondary):not(.tox-button--naked) { background: var(--accent) !important; border-color: var(--accent) !important; color: var(--on-accent) !important; border-radius: var(--r) !important; }
.tox .tox-button--secondary { background: var(--surface) !important; color: var(--text) !important; border-color: var(--line-strong) !important; border-radius: var(--r) !important; }
.tox .tox-button--naked svg, .tox .tox-dialog__body-nav-item { color: var(--text-2) !important; fill: var(--text-2) !important; }
.tox-dialog-wrap__backdrop { background: var(--overlay) !important; }
.view.is-unavailable, .chip.is-unavailable { opacity: .55; cursor: help; }
.view.is-unavailable:hover, .chip.is-unavailable:hover { background: transparent; color: var(--text-2); }

/* SEO: prepared rows and passed checks */
.iss-row.is-prepared { opacity: .7; }
.iss-row.is-prepared .iss-count b.na { font-size: var(--fs-xs); font-weight: 600; color: var(--text-3); }
.iss-row.is-ok { cursor: default; }
.iss-row.is-ok:hover { background: transparent; }
.iss-sev.ok { color: var(--ok); background: var(--ok-soft); }
.mtile .na-value { font-size: var(--fs-md); }
#sev-filter a { color: var(--text-2); }
#sev-filter a:hover { color: var(--text); }
#sev-filter a.is-active { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); }
:root[data-theme="dark"] #sev-filter a.is-active { background: var(--line-strong); }
.chart-empty > div { background: var(--surface); padding: 10px 18px; border-radius: var(--r); }

/* The hidden bulk bar must not intercept taps on the phone tab bar underneath it */
.bulkbar:not(.is-on) { pointer-events: none; }
/* TinyMCE's oxide skin uses higher-specificity selectors; the console tokens must win in both themes */
.ed-body-wrap .tox:not(.tox-tinymce-inline) .tox-editor-header { background: color-mix(in srgb, var(--bg) 92%, transparent) !important; border-bottom: 1px solid var(--line) !important; box-shadow: none !important; }
.ed-body-wrap .tox .tox-toolbar-overlord, .ed-body-wrap .tox .tox-toolbar, .ed-body-wrap .tox .tox-toolbar__primary, .ed-body-wrap .tox .tox-toolbar__overflow { background: transparent !important; }
.ed-body-wrap .tox .tox-tbtn, .ed-body-wrap .tox .tox-tbtn--select, .ed-body-wrap .tox .tox-split-button { background: transparent !important; }
.ed-body-wrap .tox .tox-tbtn:hover, .ed-body-wrap .tox .tox-tbtn--enabled, .ed-body-wrap .tox .tox-tbtn:focus-visible { background: var(--surface-3) !important; }
.ed-body-wrap .tox .tox-toolbar__group:not(:last-of-type) { border-right: 1px solid var(--line) !important; }
.ed-body-wrap .tox .tox-tbtn svg, .ed-body-wrap .tox .tox-tbtn__select-chevron svg { fill: var(--text-2) !important; }
.ed-body-wrap .tox .tox-tbtn--disabled svg { fill: var(--text-4) !important; }
.ed-body-wrap .tox .tox-tbtn__select-label { color: var(--text-2) !important; }
.tox .tox-menu.tox-collection--list .tox-collection__item { color: var(--text) !important; }
.tox .tox-collection__item-label * { color: inherit !important; }