/* styles/pages/modules.css — «Модули компании» и «Модули клиента». Рядом с pa-* платформы (platform.css), те же переменные. */
.mod-page { max-width: 980px; }
.mod-list { list-style: none; margin: 18px 0 0; padding: 0; border: 1px solid var(--border-default); border-radius: var(--radius-md, 10px); overflow: hidden; }
.mod-row { display: grid; grid-template-columns: minmax(0, 1.5fr) 250px minmax(0, 1.2fr); gap: 8px 20px; align-items: start; padding: 14px 16px; background: var(--surface-card, var(--surface-elevated)); }
.mod-row + .mod-row { border-top: 1px solid var(--border-default); }
.mod-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mod-name { font-size: var(--text-md, 15px); font-weight: 650; color: var(--text-primary); }
.mod-desc { font-size: var(--text-sm, 13px); line-height: 1.5; color: var(--text-muted); }
.mod-scope { font-size: 11.5px; color: var(--text-muted); opacity: .85; }
.mod-state { padding-top: 2px; }
.mod-ctl { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.mod-note { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--text-muted); }

/* выключатель: настоящий checkbox со ролью switch, виден фокус клавиатуры */
.mod-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: var(--text-sm, 13px); font-weight: 600; color: var(--text-primary); }
.mod-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mod-switch__track { position: relative; width: 38px; height: 22px; border-radius: 999px; background: var(--border-strong, #8a8f98); transition: background .15s; flex: none; }
.mod-switch__track::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; }
.mod-switch input:checked + .mod-switch__track { background: var(--status-success, #2f9e63); }
.mod-switch input:checked + .mod-switch__track::after { transform: translateX(16px); }
.mod-switch input:focus-visible + .mod-switch__track { outline: 2px solid var(--accent, #3b82f6); outline-offset: 2px; }
.mod-switch--off, .mod-switch input:disabled ~ * { cursor: not-allowed; opacity: .6; }

.mod-plat { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.mod-until { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mod-until[hidden], .js-mod-save[hidden] { display: none; }
.mod-forever { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-sm, 13px); cursor: pointer; }
.mod-until .form-input { width: auto; }

.mod-off { margin: 12vh auto 0; max-width: 460px; align-items: flex-start; gap: 10px; }

@media (max-width: 720px) {
  .mod-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .mod-state { padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .mod-switch__track, .mod-switch__track::after { transition: none; }
}