/* ---------- 10. Modales: formulario de producto (ServiceForm) y diálogo (Dialog) ----------
   Cáscara panel→navy, radio 24, padding 32, borde y glow azul. */
.modal-overlay{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:1.5rem;
  background:rgba(2,16,39,.72);-webkit-backdrop-filter:blur(0.375rem);backdrop-filter:blur(0.375rem);}
.modal-overlay.show{display:flex;}
.modal{display:flex;flex-direction:column;width:38.75rem;max-width:100%;max-height:calc(100vh - 3rem);overflow:hidden;
  border:1px solid var(--pn-color-border);border-radius:var(--pn-layout-radius24);background:var(--pn-gradient-shell);
  color:var(--pn-color-white);box-shadow:var(--pn-glow-blue);}
.modal.wide{width:51.25rem;}
.modal-head{display:flex;flex-direction:column;gap:0.25rem;padding:2rem 2rem 1rem;}
.modal-head .path{margin:0 0 0.25rem;color:var(--pn-color-muted);font:400 0.75rem/1.125rem var(--font-sans);letter-spacing:2px;text-transform:uppercase;}
.modal-head .title{color:var(--pn-color-white);font:700 2rem/2.5rem var(--font-sans);letter-spacing:-.6px;}
.modal-head .eslogan{margin-top:0.5rem;color:var(--pn-color-cyan);font:500 1.1875rem/1.75rem var(--font-sans);letter-spacing:-.15px;}
.modal-head .desc{margin-top:0.25rem;color:var(--pn-color-muted);font:400 0.8125rem/1.25rem var(--font-sans);}
.modal-body{flex:1;min-height:0;overflow-y:auto;padding:8px 32px 16px;scrollbar-color:var(--pn-color-subtle) var(--pn-color-disabled);}
.modal-foot{display:flex;justify-content:flex-end;gap:0.75rem;padding:1rem 2rem 2rem;}
/* Eliminar: solo al editar una instancia existente, empujado al extremo opuesto de Cancelar/Guardar */
#btnDeleteInstance{display:none;margin-right:auto;}
#popupConexionField, #popupSdwanField, #popupBackupField{display:none;}
.multi-tag{display:inline-block;margin:0.5rem 0.5rem 0 0;padding:2px 0.75rem;border:1px solid var(--pn-color-cyan);border-radius:var(--pn-layout-pill);
  color:var(--pn-color-cyan);font:400 0.8125rem/1.25rem var(--font-sans);}

.dialog-overlay{z-index:120;}
.pn-dialog{display:flex;flex-direction:column;gap:1rem;width:38.75rem;max-width:100%;padding:2rem;
  border:1px solid var(--pn-color-border);border-radius:var(--pn-layout-radius24);background:var(--pn-gradient-shell);
  color:var(--pn-color-white);box-shadow:var(--pn-glow-blue);}
.pn-dialog__title{margin:0;color:var(--pn-color-white);font:700 2rem/2.5rem var(--font-sans);letter-spacing:-.6px;}
.pn-dialog__body{margin:0;color:var(--pn-color-muted);font:400 1rem/1.5rem var(--font-sans);}
.pn-dialog .field{margin:0;}
.pn-dialog__actions{display:flex;gap:0.75rem;margin-top:0.5rem;}
.pn-dialog__actions .btn{flex:1;}