/*
 * Tema v2 (tki) - modais, offcanvas (gaveta), toasts e SweetAlert2.
 * Dialog do tki: superficie com borda, cantos de 16px, sombra grande, fundo
 * escurecido 50%; cabecalho sem faixa colorida (titulo 18px/600), rodape com
 * botoes a direita.
 */

/* ---------- Modal ---------- */

html.tki-layout .modal {
  --bs-modal-bg: var(--tki-card);
  --bs-modal-color: var(--tki-fg);
  --bs-modal-border-color: var(--tki-border);
  --bs-modal-border-radius: var(--tki-radius-card);
  --bs-modal-inner-border-radius: calc(var(--tki-radius-card) - 1px);
  --bs-modal-box-shadow: var(--tki-shadow-pop);
  --bs-modal-header-border-color: var(--tki-border);
  --bs-modal-footer-border-color: var(--tki-border);
  --bs-modal-header-padding: 20px 24px;
  --bs-modal-padding: 24px;
  --bs-modal-title-line-height: 1.3;
}

html.tki-layout .modal-backdrop {
  --bs-backdrop-bg: #000;
  --bs-backdrop-opacity: 0.5;
}

html.tki-layout .modal-content {
  background-color: var(--tki-card) !important;
  color: var(--tki-fg) !important;
  border: 1px solid var(--tki-border) !important;
  border-radius: var(--tki-radius-card) !important;
  box-shadow: var(--tki-shadow-pop) !important;
  overflow: hidden;
}

/* Cabecalho: sempre na superficie (o template pinta #2b2d3b; algumas paginas
   usam bg-primary/bg-danger + text-white). */
html.tki-layout .modal-header {
  background: var(--tki-card) !important;
  background-image: none !important;
  color: var(--tki-fg) !important;
  border-bottom: 1px solid var(--tki-border) !important;
  padding: 20px 24px;
  gap: 12px;
}

html.tki-layout .modal-header :is(.modal-title, h1, h2, h3, h4, h5, h6),
html.tki-layout .modal-header.text-white,
html.tki-layout .modal-header .text-white {
  color: var(--tki-fg) !important;
}

html.tki-layout .modal-header .modal-title,
html.tki-layout .modal-title {
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

html.tki-layout .modal-header :is(p, small, .text-muted, .text-white-50, .opacity-75) {
  color: var(--tki-muted) !important;
  opacity: 1 !important;
}

html.tki-layout .modal-header .btn-close {
  margin: -4px -6px -4px auto;
}

html.tki-layout .modal-body {
  color: var(--tki-fg);
  padding: 24px;
}

html.tki-layout .modal-footer {
  background: var(--tki-card) !important;
  border-top: 1px solid var(--tki-border) !important;
  padding: 16px 24px;
  gap: 8px;
}

html.tki-layout .modal-footer > * { margin: 0; }

html.tki-layout .modal-body.bg-light,
html.tki-layout .modal-footer.bg-light { background: var(--tki-surface-2) !important; }

@media (max-width: 575.98px) {
  html.tki-layout .modal-dialog:not(.modal-fullscreen) { margin: 12px; }
  html.tki-layout .modal-header { padding: 16px 18px; }
  html.tki-layout .modal-body { padding: 18px; }
  html.tki-layout .modal-footer { padding: 14px 18px; }
  html.tki-layout .modal-footer > :is(.btn, .tki-btn) { flex: 1 1 0; justify-content: center; min-height: 44px; }
}

/* ---------- Offcanvas (gaveta) ---------- */

html.tki-layout .offcanvas {
  --bs-offcanvas-bg: var(--tki-card);
  --bs-offcanvas-color: var(--tki-fg);
  --bs-offcanvas-border-color: var(--tki-border);
  --bs-offcanvas-box-shadow: var(--tki-shadow-pop);
  background-color: var(--tki-card) !important;
  color: var(--tki-fg) !important;
}

html.tki-layout .offcanvas-header {
  border-bottom: 1px solid var(--tki-border);
  padding: 20px 24px;
}

html.tki-layout .offcanvas-title { font-size: 18px; font-weight: 600; color: var(--tki-fg); }

/* ---------- Toast ---------- */

html.tki-layout .toast {
  --bs-toast-bg: var(--tki-card);
  --bs-toast-color: var(--tki-fg);
  --bs-toast-border-color: var(--tki-border);
  --bs-toast-header-bg: var(--tki-card);
  --bs-toast-header-color: var(--tki-fg);
  --bs-toast-header-border-color: var(--tki-border);
  --bs-toast-border-radius: var(--tki-radius-control);
  --bs-toast-box-shadow: var(--tki-shadow-pop);
  border-radius: var(--tki-radius-control) !important;
  box-shadow: var(--tki-shadow-pop) !important;
  font-size: 14px;
}

html.tki-layout .toast:not([class*='bg-']):not([class*='text-bg-']) {
  background-color: var(--tki-card) !important;
  color: var(--tki-fg) !important;
  border: 1px solid var(--tki-border) !important;
}

html.tki-layout .toast:not([class*='bg-']):not([class*='text-bg-']) .toast-header,
html.tki-layout .toast:not([class*='bg-']):not([class*='text-bg-']) .toast-body {
  background: transparent !important;
  color: var(--tki-fg) !important;
  border-bottom-color: var(--tki-border) !important;
}

/* Toast colorido (text-bg-success, bg-danger...): cores de estado com texto
   branco legivel */
html.tki-layout .toast:is(.bg-success, .text-bg-success) { background-color: #047857 !important; color: #fff !important; }
html.tki-layout .toast:is(.bg-danger, .text-bg-danger) { background-color: #dc2626 !important; color: #fff !important; }
html.tki-layout .toast:is(.bg-warning, .text-bg-warning) { background-color: #b45309 !important; color: #fff !important; }
html.tki-layout .toast:is(.bg-info, .text-bg-info) { background-color: #0369a1 !important; color: #fff !important; }
html.tki-layout .toast:is(.bg-primary, .text-bg-primary) { background-color: var(--tki-primary) !important; color: #fff !important; }
html.tki-layout .toast[class*='bg-'] :is(.toast-body, .toast-header) { color: inherit !important; background: transparent !important; }

/* ---------- SweetAlert2 ---------- */

html.tki-layout .swal2-popup {
  background: var(--tki-card) !important;
  color: var(--tki-fg) !important;
  border: 1px solid var(--tki-border);
  border-radius: var(--tki-radius-card) !important;
  box-shadow: var(--tki-shadow-pop);
  font-family: 'DM Sans', sans-serif !important;
}

html.tki-layout .swal2-title { color: var(--tki-fg) !important; font-size: 20px !important; font-weight: 600 !important; }
html.tki-layout .swal2-html-container,
html.tki-layout .swal2-content { color: var(--tki-muted) !important; font-size: 15px !important; }

html.tki-layout .swal2-styled {
  border-radius: var(--tki-radius-control) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 9px 18px !important;
  box-shadow: none !important;
}

html.tki-layout .swal2-styled.swal2-confirm { background: var(--tki-primary) !important; color: #fff !important; }
html.tki-layout .swal2-styled.swal2-cancel { background: var(--tki-card) !important; color: var(--tki-fg) !important; border: 1px solid var(--tki-input-border) !important; }
html.tki-layout .swal2-styled.swal2-deny { background: #dc2626 !important; color: #fff !important; }

html.tki-layout .swal2-input,
html.tki-layout .swal2-textarea,
html.tki-layout .swal2-select {
  background: var(--tki-input-bg) !important;
  color: var(--tki-fg) !important;
  border: 1px solid var(--tki-input-border) !important;
  border-radius: var(--tki-radius-control) !important;
  box-shadow: none !important;
}