/* Modals and confirmations: one shared presentation, no module-specific palette.
   Colors and motion: datalyse-modern.css (--dt-*). Behavior: datalyse-ui.js.
   Classes, scrolling and animation names are part of the existing engine contract. */
:root[data-bs-theme] body :is(.modal-content, .dui-modal__content, .dui-bootbox,
 .ai-form-modal, .ai-language-modal, .ai-rag-modal-content, .el-tpl-modal-dialog) {
  background: var(--dt-overlay) !important;
  color: var(--dt-text);
  border: 0 !important;
  border-radius: var(--dt-radius-lg) !important;
  box-shadow: var(--dt-pop-shadow) !important;
}
.modal-content { overflow: hidden; }
:root[data-bs-theme] body :is(.modal-header, .modal-footer,
 .ai-form-modal-header, .ai-form-modal-footer, .ai-rag-modal-header, .el-tpl-modal-head, .el-tpl-right-topbar) {
  background: transparent; border: 0 !important; box-shadow: none;
}
.modal-header, .modal-body { padding: 20px 24px; }
.modal-title { color: var(--dt-text); font-weight: 600; font-size: 16px; }
.modal-body { color: var(--dt-text); }
/* Modales de modalsInfo (165_classMARC.js): .modal__body > .modal__body-inner(.is-padded) + .modal__actions. Su geometría vivía
   en 165_app.css, que index.html dejó de cargar el 09-11-2026 (ef31c67a): el cuerpo se quedó sin relleno, los botones sin fila y
   los campos sin medida («Añadir nota» del RecordPanel, add-department, send-sms…). Repuesta aquí con el ritmo de
   .modal-header/.modal-body (20/24) y sin línea extra; las clases son contrato del motor. */
.modal__body { position: relative; display: flex; flex-flow: column nowrap; min-height: 0; }
.modal__body-inner { position: relative; flex: 1 1 auto; min-height: 0; max-height: 76vh; padding: 20px 24px; overflow: visible !important; overflow-y: auto !important; }
.modal-header + .modal__body .modal__body-inner { padding-top: 4px; }
.modal__actions { display: flex; flex: 0 0 auto; flex-flow: row wrap; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 24px 20px; }
.modal-footer { padding: 16px 24px; }
.modal-backdrop.show, .dui-modal__backdrop, .dui-bootbox-backdrop {
  background: var(--dt-backdrop); -webkit-backdrop-filter: none; backdrop-filter: none;
}
.modal-backdrop.show { opacity: 1; }
/* Existing editor dialogs use their original controllers and the shared skin. */
:root[data-bs-theme] body :is(.ai-form-modal-overlay, .ai-rag-modal, .el-tpl-modal-backdrop) {
  background: var(--dt-backdrop) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Compact confirmations: a single card, readable copy and separated actions. */
.dui-bootbox-backdrop {
  position: fixed; inset: 0; z-index: 1080; display: flex;
  align-items: center; justify-content: center; padding: 16px;
  animation: dui-bb-in var(--dt-dur-2) var(--dt-ease-out);
}
.dui-bootbox-backdrop.dui-bootbox--closing { animation: dui-bb-out var(--dt-dur-2) var(--dt-ease-in) forwards; }
@keyframes dui-bb-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dui-bb-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes dui-bb-pop { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.dui-bootbox-backdrop .dui-bootbox {
  width: 100%; max-width: 500px; margin: 0;
  display: flex; flex-direction: column; overflow: hidden;
  font-family: var(--font-sans); animation: dui-bb-pop var(--dt-dur-3) var(--dt-ease-out);
}
.dui-bootbox-size-large .dui-bootbox { max-width: 720px; }
.dui-bootbox-size-small .dui-bootbox { max-width: 360px; }
:root[data-bs-theme] body .dui-bootbox > .modal-content {
  display: flex; flex-direction: column;
  background: transparent !important; box-shadow: none !important;
}
.dui-bootbox-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-shrink: 0; gap: 12px; padding: 20px 20px 6px;
}
.dui-bootbox-title { margin: 0; flex: 1; min-width: 0; font-size: 16px; line-height: 24px; font-weight: 600; letter-spacing: -.01em; }
.dui-bootbox-close {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 24px; height: 24px; margin: 0; padding: 0; font-size: 16px;
  border: 0; border-radius: var(--dt-radius-sm); background: transparent; color: var(--dt-muted); cursor: pointer;
}
.dui-bootbox-close:hover { background: var(--dt-hover); color: var(--dt-text); }
.dui-bootbox-body {
  max-height: 70vh; overflow-y: auto;
  padding: 20px 20px 0; color: var(--dt-muted); font-size: 14px; line-height: 21px;
}
.dui-bootbox-header + .dui-bootbox-body { padding-top: 0; }
.dui-bootbox-body .bootbox-body { color: var(--dt-muted); overflow-wrap: anywhere; }
.dui-bootbox-body .bootbox-input { width: 100%; margin-top: 12px; padding: 8px 12px; font: inherit; }
.dui-bootbox-footer { display: flex; justify-content: flex-end; flex-shrink: 0; flex-wrap: wrap; gap: 8px; padding: 16px 20px 20px; }
:root[data-bs-theme] body .dui-bootbox-footer .btn { min-height: 40px; margin: 0; padding: 9px 14px; border-radius: var(--dt-radius) !important; font-size: 14px; line-height: 20px; }
:root[data-bs-theme] body .dui-bootbox-footer .bootbox-cancel { margin-inline-end: auto; background: var(--dt-surface-2) !important; color: var(--dt-text) !important; }
:root[data-bs-theme] body .dui-bootbox-footer .bootbox-accept.btn-primary { background: var(--dt-cta) !important; color: var(--dt-cta-fg) !important; }
:root[data-bs-theme] body .dui-bootbox-footer .bootbox-accept.btn-primary:hover { background: var(--dt-cta-hover) !important; }
@media (max-width: 380px) { .dui-bootbox-footer .btn { flex: 1; } }

/* Record drawers share the same neutral surface, preserving their positions. */
:root[data-bs-theme] body :is(#rpn-panel, #rpb-panel, #rp-panel:not(.wide)) {
  background: var(--dt-overlay); color: var(--dt-text); border: 0; box-shadow: none;
}
:root[data-bs-theme] body :is(#rpn-head, #rpn-foot, #rpb-head, #rpb-foot) {
  background: var(--dt-overlay); border: 0;
}

/* ── modales: salida con fade (dUI.Modal.hide → animateClose(el, …, 180, 'dtFadeOut')); .show se queda mientras dura .is-closing ── */
@keyframes dtFadeOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes dtModalOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(8px) scale(.98); } }
.modal.is-closing { pointer-events: none; animation: dtFadeOut var(--dt-dur-2) var(--dt-ease) both !important; }
.modal.is-closing .modal-dialog { animation: dtModalOut var(--dt-dur-2) var(--dt-ease) both !important; }
.modal-backdrop.dui-backdrop.is-closing { opacity: 0 !important; transition: opacity var(--dt-dur-2) var(--dt-ease); }

@media (prefers-reduced-motion: reduce) {
  .modal.is-closing, .modal.is-closing .modal-dialog, .modal-backdrop.dui-backdrop.is-closing { animation: none !important; transition: none !important; }
}

/* Shared modal geometry: centering is the default, including legacy markup
   without modal-dialog-centered. Large content scrolls inside its body. */
.modal.dui-modal {
  --dui-modal-gap: max(16px, env(safe-area-inset-top), env(safe-area-inset-right), env(safe-area-inset-bottom), env(safe-area-inset-left));
  height: 100vh;
  height: 100dvh;
  overscroll-behavior: contain;
}
.modal.dui-modal > .modal-dialog {
  display: flex;
  align-items: center;
  width: calc(100% - 2 * var(--dui-modal-gap));
  height: auto;
  min-height: calc(100% - 2 * var(--dui-modal-gap));
  margin: var(--dui-modal-gap) auto;
}
.modal.dui-modal > .modal-dialog > .modal-content {
  max-height: calc(100vh - 2 * var(--dui-modal-gap));
  max-height: calc(100dvh - 2 * var(--dui-modal-gap));
  overflow: auto;
}
.modal.dui-modal > .modal-dialog > .modal-content:has(.modal-body) { overflow: hidden; }
.modal.dui-modal > .modal-dialog > .modal-content > .modal-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.modal.dui-modal > .modal-dialog > .modal-content > :is(.modal-header, .modal-footer) { flex-shrink: 0; }
.modal.dui-modal > .modal-fullscreen {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
@media (max-width: 575.98px) {
.modal.dui-modal > .modal-fullscreen-sm-down {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen-sm-down > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
}
@media (max-width: 767.98px) {
.modal.dui-modal > .modal-fullscreen-md-down {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen-md-down > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
}
@media (max-width: 991.98px) {
.modal.dui-modal > .modal-fullscreen-lg-down {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen-lg-down > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
}
@media (max-width: 1299.98px) {
.modal.dui-modal > .modal-fullscreen-xl-down {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen-xl-down > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
}
@media (max-width: 1399.98px) {
.modal.dui-modal > .modal-fullscreen-xxl-down {
  --dui-modal-gap: 0px;
  width: 100%; max-width: none; min-height: 100%; height: 100%; margin: 0;
}
.modal.dui-modal > .modal-fullscreen-xxl-down > .modal-content { height: 100%; max-height: 100%; border-radius: 0 !important; }
}

.modal.fade .modal-dialog { transform: translateY(8px) scale(.98); transition: transform var(--dt-dur-3) var(--dt-ease-out); }
.modal.show .modal-dialog { transform: none; }
.modal.fade, .modal-backdrop.fade { transition: opacity var(--dt-dur-2) var(--dt-ease); }

@media (prefers-reduced-motion: reduce) {
  .modal.fade, .modal.fade .modal-dialog, .modal-backdrop.fade,
  .dui-bootbox-backdrop, .dui-bootbox-backdrop .dui-bootbox { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  :root[data-bs-theme] body :is(.modal-content, .dui-modal__content, .dui-bootbox, #rpn-panel, #rpb-panel) { border: 1px solid CanvasText !important; }
}

/* === Botón de cerrar de modales: .btn-close (Bootstrap) y .modal-close-btn (custom) ===
   !important en tamaño/opacity/padding porque .modal .modal-header .btn-close en
   165_behaviours.css:100 tiene mayor especificidad (0,3,0) que .btn-close (0,1,0). */
.btn-close, .modal-close-btn {
  box-sizing: border-box !important;
  width: 32px !important;
  height: 32px !important;
  padding: 6px !important;
  border-radius: 8px !important;
  opacity: 1 !important;
  background-color: transparent;
  background-size: 14px !important;
  transition: background-color .18s ease, color .18s ease, filter .18s ease, transform .08s ease, box-shadow .15s ease !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.modal-close-btn .ti, .modal-close-btn i {
  font-size: 16px;
  line-height: 1;
  transition: color .18s ease !important;
}
/* Hover: fondo sutil que se adapta al tema vía var(--dt-hover):
   light → rgba(0,0,0,.05) | dark → rgba(255,255,255,.06).
   Selector .btn-plain.modal-close-btn:hover (especificidad 0,3,0) vence
   .btn-plain:Hover { background: 0 0 !important } de 165_app.css:755.
   IMPORTANTE: usamos background-color (no shorthand) para preservar el
   background-image del .btn-close (SVG de la X). El shorthand background
   sobrescribiría background-image: none y haría desaparecer la X. */
.btn-close:hover,
.modal-close-btn:hover,
.btn-plain.modal-close-btn:hover {
  background-color: var(--dt-hover) !important;
  color: inherit !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
}
.btn-close:hover { filter: none !important; }

.modal-close-btn:hover .ti, .modal-close-btn:hover i {
  color: inherit !important;
}