/* Modal de formulário (cadastro/edição) — mesmo visual do cockpit/filtro de requisições, centralizado (padrão de tela de ERP).
   O modal fica fora do .ck-root (é incluído depois do rodapé), então define a própria paleta, com fallback hex.
   Prefixo mf- (nunca "ad": bloqueadores de anúncio escondem). */

.mf-modal {
    --mf-blue: #6366f1;  --mf-blue-rgb: 99, 102, 241;
    --mf-green: #22c55e; --mf-green-rgb: 34, 197, 94;
    --mf-amber: #f59e0b; --mf-amber-rgb: 245, 158, 11;
    --mf-red: #ef4444;   --mf-red-rgb: 239, 68, 68;
    --mf-t-blue: #4338ca; --mf-t-amber: #92400e; --mf-t-green: #166534; --mf-t-red: #991b1b;
    --mf-card: #ffffff; --mf-card-2: #f4f6fb;
    --mf-line: var(--motryz-border, #e5e7eb);
    --mf-strong: var(--motryz-text-strong, #111827);
    --mf-sub: var(--motryz-text-subtle, #6b7280);
    --mf-muted: #5b6779;
}
.dark-only .mf-modal { --mf-strong: #e8ecf7; --mf-sub: #a6aec1; --mf-line: #3b465b; --motryz-text-strong: #e8ecf7; --motryz-text-subtle: #a6aec1; --motryz-text-muted: #98a6ad; --motryz-border: #3b465b; --motryz-border-soft: #3b465b; --mf-card: #262b38; --mf-card-2: #1d2230; --mf-t-blue: #a5b4fc; --mf-t-amber: #fbbf24; --mf-t-green: #4ade80; --mf-t-red: #f87171; --mf-muted: #98a6ad; }

.mf-modal .modal-dialog.mf-dialog { max-width: 640px; }
.mf-content {
    max-height: calc(100vh - 3.5rem); border: 1px solid var(--mf-line); border-radius: 16px; overflow: hidden;
    background: var(--mf-card); color: var(--mf-strong); box-shadow: 0 24px 60px rgba(15, 23, 42, .28);
}
.mf-content, .mf-form, .mf-topo, .mf-topo-tit, .mf-corpo, .mf-pe { text-align: left; }   /* o tema centraliza <header> */
.mf-form { display: flex; flex-direction: column; max-height: calc(100vh - 3.5rem); min-height: 0; margin: 0; }

/* topo */
.mf-topo {
    flex: 0 0 auto; display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px 14px;
    background: linear-gradient(135deg, rgba(var(--mf-blue-rgb), .14), rgba(var(--mf-blue-rgb), .03));
    border-bottom: 1px solid var(--mf-line);
}
.mf-topo-ico {
    flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
    border-radius: 12px; background: var(--mf-blue); color: #fff; font-size: 16px; box-shadow: 0 4px 10px rgba(var(--mf-blue-rgb), .35);
}
.mf-topo-tit { flex: 1 1 auto; min-width: 0; }
.mf-topo-tit h5 { margin: 0; font-size: var(--motryz-font-xl, 1.125rem); font-weight: 700; color: var(--mf-strong); }
.mf-topo-tit p { margin: 2px 0 0; font-size: var(--motryz-font-xs, .75rem); color: var(--mf-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mf-fechar {
    flex: 0 0 auto; width: 34px; height: 34px; border: 1px solid var(--mf-line); border-radius: 10px;
    background: var(--mf-card); color: var(--mf-sub); cursor: pointer;
}
.mf-fechar:hover { color: var(--mf-t-red); border-color: rgba(var(--mf-red-rgb), .5); }

/* corpo */
.mf-corpo { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 20px 20px; }
.mf-secao { padding: 14px 0; border-bottom: 1px dashed var(--mf-line); }
.mf-secao:last-child { border-bottom: 0; padding-bottom: 0; }
.mf-secao-t {
    display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em; color: var(--mf-sub);
}
.mf-secao-t i { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: rgba(var(--mf-blue-rgb), .14); color: var(--mf-t-blue); font-size: 11px; }

.mf-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.mf-grade .mf-largo { grid-column: 1 / -1; }
.mf-campo { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.mf-campo > label, .mf-rotulo { margin: 0; font-size: var(--motryz-font-xs, .75rem); font-weight: 600; color: var(--mf-strong); display: flex; align-items: center; gap: 8px; }
.mf-campo > label { justify-content: space-between; }
.mf-campo > label .text-danger { margin-left: 2px; }
.mf-cont { font-size: 11px; font-weight: 600; color: var(--mf-muted); font-variant-numeric: tabular-nums; }
.mf-campo .form-control, .mf-campo .form-select {
    height: 40px; border-radius: 10px; border: 1px solid var(--mf-line); background-color: var(--mf-card-2); color: var(--mf-strong);
    font-size: var(--motryz-font-sm, .8125rem);
}
.mf-campo .form-control:focus, .mf-campo .form-select:focus { border-color: var(--mf-blue); box-shadow: 0 0 0 3px rgba(var(--mf-blue-rgb), .25); background-color: var(--mf-card); }
.mf-campo .form-control:disabled, .mf-campo .form-control[readonly] { color: var(--mf-sub); opacity: 1; cursor: not-allowed; }
.mf-dica { margin: 0; font-size: 11px; color: var(--mf-muted); line-height: 1.4; }

/* campo de senha com olho */
.mf-senha { position: relative; }
.mf-senha .form-control { padding-right: 42px; }
.mf-olho {
    position: absolute; top: 3px; right: 3px; width: 34px; height: 34px; border: 0; border-radius: 8px;
    background: transparent; color: var(--mf-sub); cursor: pointer;
}
.mf-olho:hover { color: var(--mf-t-blue); background: rgba(var(--mf-blue-rgb), .1); }
.mf-olho:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--mf-blue-rgb), .3); }

/* escolha Não/Sim (os radios continuam sendo o campo "logs") */
.mf-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 4px; border: 1px solid var(--mf-line); border-radius: 12px; background: var(--mf-card-2); }
.mf-seg input { position: absolute; opacity: 0; pointer-events: none; }
.mf-seg label {
    display: flex; align-items: center; justify-content: center; gap: 6px; height: 32px; margin: 0; border-radius: 9px; cursor: pointer;
    color: var(--mf-sub); font-size: var(--motryz-font-sm, .8125rem); font-weight: 600; user-select: none; transition: background .15s, color .15s;
}
.mf-seg label:hover { color: var(--mf-strong); }
.mf-seg input:checked + label { background: var(--mf-card); color: var(--mf-t-blue); box-shadow: 0 1px 3px rgba(15, 23, 42, .15); }
.mf-seg input:checked + label.mf-sim { color: var(--mf-t-green); }
.mf-seg input:focus-visible + label { box-shadow: 0 0 0 3px rgba(var(--mf-blue-rgb), .3); }

/* aviso em destaque (cofre de senhas) */
.mf-aviso {
    display: flex; gap: 12px; padding: 12px 14px; border-radius: 12px; text-align: left;
    background: rgba(var(--mf-green-rgb), .1); border: 1px solid rgba(var(--mf-green-rgb), .4); color: var(--mf-strong);
}
.mf-aviso > i { flex: 0 0 auto; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: rgba(var(--mf-green-rgb), .2); color: var(--mf-t-green); }
.mf-aviso strong { display: block; font-size: var(--motryz-font-sm, .8125rem); }
.mf-aviso span { display: block; margin-top: 2px; font-size: 11.5px; color: var(--mf-sub); line-height: 1.45; }

/* rodapé fixo */
.mf-pe {
    flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding: 14px 20px;
    background: var(--mf-card); border-top: 1px solid var(--mf-line);
}
.mf-obrig { margin-right: auto; font-size: 11px; color: var(--mf-muted); }
.mf-obrig b { color: var(--mf-t-red); }
.mf-gravar { min-width: 130px; font-weight: 700; }
.mf-sair { border: 1px solid var(--mf-line); background: var(--mf-card-2); color: var(--mf-sub); font-weight: 600; }
.mf-sair:hover { color: var(--mf-strong); border-color: rgba(var(--mf-blue-rgb), .5); background: var(--mf-card-2); }

@media (max-width: 575px) {
    .mf-modal .modal-dialog.mf-dialog { margin: .5rem; }
    .mf-grade { grid-template-columns: minmax(0, 1fr); }
    .mf-obrig { display: none; }
    .mf-gravar { min-width: 0; flex: 1 1 auto; }
}

/* ---------- tema escuro (fase 7): o tema usa body.dark-only .form-control (mais específico) e apagava o fundo recuado ---------- */
body.dark-only .mf-modal .mf-campo .form-control, body.dark-only .mf-modal .mf-campo .form-select { background-color: var(--mf-card-2); color: var(--mf-strong); border-color: var(--mf-line); }
body.dark-only .mf-modal .mf-campo .form-control::placeholder { color: var(--mf-muted); opacity: 1; }
body.dark-only .mf-modal .mf-campo .form-control:focus, body.dark-only .mf-modal .mf-campo .form-select:focus { background-color: var(--mf-card); }
body.dark-only .mf-modal .mf-campo .form-control:disabled, body.dark-only .mf-modal .mf-campo .form-select:disabled, body.dark-only .mf-modal .mf-campo .form-control[readonly] { background-color: var(--mf-card-2); color: var(--mf-sub); opacity: 1; }

/* o tema pinta .modal-content com body.dark-only .modal-content (mais específico que .mf-content) */
body.dark-only .mf-modal .mf-content { background: var(--mf-card); color: var(--mf-strong); border-color: var(--mf-line); }

/* acessibilidade (fase 7): foco visível dentro do modal, alvo de toque e movimento reduzido */
.mf-modal :is(a, button, [role="button"], [tabindex], input:not(.mf-seg input), select, textarea):focus-visible { outline: 2px solid var(--mf-blue); outline-offset: 2px; }
.dark-only .mf-modal :is(a, button, [role="button"], [tabindex], input:not(.mf-seg input), select, textarea):focus-visible { outline-color: #a5b4fc; }
@media (pointer: coarse) { .mf-modal .mf-fechar { min-width: 44px; min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .mf-modal, .mf-modal *, .mf-modal *::before, .mf-modal *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }