/* ==========================================================================
   DS Modal Kit — pop-ups premium da área do cliente
   Diálogos de confirmação, modais de edição, prompts e toasts.
   Depende dos tokens de ds-cliente.css (com fallbacks para uso isolado).
   ========================================================================== */

:root{
  --lui-ink:#131a26;
  --lui-mut:#68738a;
  --lui-line:#e7ebf2;
  --lui-primary:#111827;
  --lui-danger:#e5484d;
  --lui-success:#0f9d58;
  --lui-warn:#f59e0b;
  --lui-radius:18px;
  --lui-shadow:0 26px 70px -18px rgba(17,26,44,.34), 0 6px 18px -8px rgba(17,26,44,.16);
}

/* ---------- Overlay ---------- */
.lui-ov{
  position:fixed; inset:0; z-index:9500;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  background:rgba(13,20,34,.52);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  opacity:0; visibility:hidden;
  transition:opacity .2s ease, visibility .2s ease;
}
.lui-ov.open{opacity:1; visibility:visible}
body.lui-lock{overflow:hidden}

/* ---------- Caixa ---------- */
.lui-modal{
  width:100%; max-width:520px;
  max-height:calc(100vh - 40px);
  display:flex; flex-direction:column;
  background:#fff;
  border-radius:var(--lui-radius);
  box-shadow:var(--lui-shadow);
  transform:translateY(14px) scale(.97);
  opacity:0;
  transition:transform .24s cubic-bezier(.2,.9,.3,1), opacity .2s ease;
  overflow:hidden;
}
.lui-ov.open .lui-modal{transform:none; opacity:1}
.lui-modal.lui-sm{max-width:430px}
.lui-modal.lui-lg{max-width:720px}

.lui-head{
  display:flex; align-items:flex-start; gap:12px;
  padding:20px 20px 14px;
  border-bottom:1px solid var(--lui-line);
}
.lui-head .lui-ico{
  width:42px; height:42px; flex:0 0 42px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  background:#eaf2ff; color:var(--lui-primary);
}
.lui-head .lui-ico svg{width:20px;height:20px;stroke-width:1.9;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.lui-danger .lui-head .lui-ico{background:#fdecec;color:var(--lui-danger)}
.lui-success .lui-head .lui-ico{background:#e8f7ef;color:var(--lui-success)}
.lui-warn .lui-head .lui-ico{background:#fef4e2;color:var(--lui-warn)}
.lui-head .lui-tt{flex:1;min-width:0}
.lui-head h3{
  margin:0; font-size:16.5px; line-height:1.3; font-weight:700;
  color:var(--lui-ink); font-family:'Poppins','Inter',system-ui,sans-serif;
}
.lui-head p{margin:5px 0 0; font-size:13.5px; line-height:1.5; color:var(--lui-mut)}
.lui-x{
  width:32px;height:32px;flex:0 0 32px;border-radius:10px;border:0;cursor:pointer;
  background:#f3f5f9;color:#6c7789;display:flex;align-items:center;justify-content:center;transition:.15s;
}
.lui-x:hover{background:#e9edf4;color:var(--lui-ink)}
.lui-x svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}

.lui-body{padding:18px 20px; overflow:auto; -webkit-overflow-scrolling:touch}
.lui-body:empty{display:none}
.lui-body > form{margin:0}
.lui-body label{display:block;font-size:12px;font-weight:600;color:var(--lui-mut);margin-bottom:5px}
.lui-body input:not([type=checkbox]):not([type=radio]),
.lui-body select,.lui-body textarea{
  width:100%;padding:10px 12px;border:1px solid #dfe4ec;border-radius:11px;font-size:14px;
  font-family:inherit;color:var(--lui-ink);background:#fff;
}
.lui-body input:focus,.lui-body select:focus,.lui-body textarea:focus{
  outline:none;border-color:var(--lui-primary);box-shadow:0 0 0 3px rgba(255,106,0,.16);
}

.lui-foot{
  display:flex; gap:9px; justify-content:flex-end;
  padding:14px 20px; border-top:1px solid var(--lui-line); background:#fbfcfe;
}
.lui-btn{
  appearance:none;border:1px solid transparent;cursor:pointer;
  padding:10px 17px;border-radius:11px;font-size:13.5px;font-weight:600;
  font-family:inherit;display:inline-flex;align-items:center;gap:7px;transition:.15s;
}
.lui-btn-ghost{background:#fff;border-color:#dfe4ec;color:#48536a}
.lui-btn-ghost:hover{background:#f4f6fa}
.lui-btn-primary{background:var(--lui-primary);color:#fff}
.lui-btn-primary:hover{filter:brightness(1.06)}
.lui-btn-danger{background:var(--lui-danger);color:#fff}
.lui-btn-danger:hover{filter:brightness(1.06)}

/* respiro para formulários legados renderizados dentro do modal */
.lui-body form > div,
.lui-body form > label,
.lui-body form > .mb-3,
.lui-body form > .field{margin-bottom:13px}
.lui-body form > div:last-of-type{margin-bottom:0}
.lui-body form > label{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--lui-ink);text-transform:none}
.lui-body form > label input[type=checkbox]{width:auto}
/* botões nativos das páginas legadas dentro do modal remoto */
.lui-body .btn,
.lui-body button[type=submit]{
  width:100%;justify-content:center;margin-top:16px;
  padding:11px 16px;border-radius:11px;border:0;cursor:pointer;
  background:var(--lui-primary);color:#fff;font-weight:600;font-size:14px;font-family:inherit;
}
.lui-body .btn:hover,.lui-body button[type=submit]:hover{filter:brightness(1.06)}
.lui-body .btn-danger{background:var(--lui-danger)}

/* ---------- Loading ---------- */
.lui-load{display:flex;align-items:center;justify-content:center;gap:10px;padding:44px 12px;color:var(--lui-mut);font-size:13.5px}
.lui-spin{
  width:20px;height:20px;border-radius:50%;
  border:2.4px solid #e3e8f0;border-top-color:var(--lui-primary);
  animation:lui-spin .7s linear infinite;
}
@keyframes lui-spin{to{transform:rotate(360deg)}}

/* ---------- Toasts ---------- */
.lui-toasts{
  position:fixed;z-index:9600;right:16px;bottom:16px;
  display:flex;flex-direction:column;gap:9px;pointer-events:none;
}
.lui-toast{
  pointer-events:auto;display:flex;align-items:flex-start;gap:10px;
  min-width:250px;max-width:360px;padding:12px 14px;border-radius:14px;
  background:#fff;border:1px solid var(--lui-line);
  box-shadow:0 16px 40px -14px rgba(17,26,44,.3);
  font-size:13.5px;line-height:1.45;color:var(--lui-ink);
  transform:translateY(10px);opacity:0;transition:.22s cubic-bezier(.2,.9,.3,1);
}
.lui-toast.in{transform:none;opacity:1}
.lui-toast .ic{width:22px;height:22px;flex:0 0 22px;border-radius:7px;display:flex;align-items:center;justify-content:center;background:#eaf2ff;color:var(--lui-primary)}
.lui-toast .ic svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.lui-toast.ok .ic{background:#e8f7ef;color:var(--lui-success)}
.lui-toast.err .ic{background:#fdecec;color:var(--lui-danger)}
.lui-toast.warn .ic{background:#fef4e2;color:var(--lui-warn)}

/* ---------- Mobile: vira bottom sheet ---------- */
@media (max-width:560px){
  .lui-ov{padding:0;align-items:flex-end}
  .lui-modal{
    max-width:none;border-radius:22px 22px 0 0;
    max-height:92vh;transform:translateY(100%);
  }
  .lui-ov.open .lui-modal{transform:none}
  .lui-foot{position:sticky;bottom:0}
  .lui-foot .lui-btn{flex:1;justify-content:center}
  .lui-toasts{left:12px;right:12px;bottom:12px}
  .lui-toast{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .lui-ov,.lui-modal,.lui-toast{transition:none}
}

/* Tema único claro para consistência com o restante do sistema. */
