/* =====================================================================
   Avisos y diálogos de TalosPOL
   - .tp-aviso*: toasts propios (js/ui/avisos.js)
   - .swal2-*: tema sobrio para SweetAlert2 (sin tocar su lógica)
   ===================================================================== */
:root {
    --tp-tx: #1b2430;
    --tp-tx2: #5b6675;
    --tp-bd: #dfe3e9;
    --tp-card: #fff;
    --tp-fondo: #f4f6f9;
    --tp-pri: #0a3d62;
    --tp-pri-hover: #0d4d7a;
    --tp-ok: #1f8a4c;   --tp-ok-bg: #e6f4ec;
    --tp-info: #1f5f99; --tp-info-bg: #e7f0f9;
    --tp-av: #a35f00;   --tp-av-bg: #fdf2e0;
    --tp-er: #c0392b;   --tp-er-bg: #fbeae8;
    --tp-er-hover: #a93226;
    --tp-sombra: 0 10px 30px rgba(16, 24, 36, .16), 0 2px 6px rgba(16, 24, 36, .08);
}

/* ---------- Toasts ---------- */
.tp-avisos {
    position: fixed; top: 14px; left: 50%; transform: translateX(-50%); z-index: 10003;
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    pointer-events: none; width: max-content; max-width: calc(100vw - 24px);
}
.tp-aviso {
    pointer-events: auto; position: relative; overflow: hidden;
    display: flex; align-items: flex-start; gap: 10px;
    width: 340px; max-width: 100%; box-sizing: border-box;
    padding: 11px 10px 11px 12px;
    background: var(--tp-card); color: var(--tp-tx);
    border: 1px solid var(--tp-bd); border-radius: 10px; box-shadow: var(--tp-sombra);
    font: 14px/1.4 Arial, sans-serif;
    animation: tp-aviso-entra .26s cubic-bezier(.2, .9, .3, 1.1);
}
.tp-aviso-sale { animation: tp-aviso-sale .2s ease-in forwards; }
.tp-aviso-latido { animation: tp-aviso-latido .3s ease-out; }
.tp-aviso-icono {
    flex: none; width: 22px; height: 22px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; margin-top: 1px;
}
.tp-aviso-icono svg, .tp-aviso-cerrar svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.tp-aviso-texto { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.tp-aviso-titulo { font-weight: 600; }
.tp-aviso-detalle { color: var(--tp-tx2); font-size: 13px; margin-top: 1px; }
.tp-aviso-cerrar {
    flex: none; border: 0; background: transparent; color: var(--tp-tx2);
    width: 24px; height: 24px; margin: -2px -2px 0 0; padding: 0; border-radius: 6px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; opacity: .7;
}
.tp-aviso-cerrar:hover, .tp-aviso-cerrar:focus-visible { opacity: 1; background: var(--tp-fondo); outline: none; }
.tp-aviso-barra { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: currentColor; opacity: .35; transform-origin: left; }
.tp-aviso-ok    { color: var(--tp-ok); }   .tp-aviso-ok .tp-aviso-icono    { background: var(--tp-ok-bg); }
.tp-aviso-info  { color: var(--tp-info); } .tp-aviso-info .tp-aviso-icono  { background: var(--tp-info-bg); }
.tp-aviso-aviso { color: var(--tp-av); }   .tp-aviso-aviso .tp-aviso-icono { background: var(--tp-av-bg); }
.tp-aviso-error { color: var(--tp-er); }   .tp-aviso-error .tp-aviso-icono { background: var(--tp-er-bg); }
.tp-aviso .tp-aviso-texto { color: var(--tp-tx); }
@keyframes tp-aviso-entra { from { opacity: 0; transform: translateY(-14px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes tp-aviso-sale { to { opacity: 0; transform: translateY(-10px) scale(.98); } }
@keyframes tp-aviso-latido { 50% { transform: scale(1.03); } }
@media (max-width: 576px) {
    .tp-avisos { left: 10px; right: 10px; top: 10px; transform: none; width: auto; align-items: stretch; max-width: none; }
    .tp-aviso { width: auto; }
}
@media print { .tp-avisos { display: none !important; } }

/* ---------- SweetAlert2: fondo y ventana ---------- */
.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation { background: rgba(16, 24, 36, .45); }
.swal2-popup:not(.swal2-toast) {
    border-radius: 12px; padding: 20px 22px 16px; color: var(--tp-tx);
    font-family: Arial, sans-serif; box-shadow: 0 20px 50px rgba(16, 24, 36, .28);
    grid-template-columns: auto minmax(0, 1fr); align-items: center;
}
.swal2-popup:not(.swal2-toast) > * { grid-column: 1 / -1; }
.swal2-popup:not(.swal2-toast) > .swal2-icon { grid-column: 1; grid-row: 1; }
.swal2-popup:not(.swal2-toast) > .swal2-title { grid-column: 2; grid-row: 1; }
.swal2-popup:not(.swal2-toast) > .swal2-close { grid-column: 2; grid-row: 1; align-self: start; }
.swal2-show:not(.swal2-toast) { animation: tp-dialogo-entra .2s cubic-bezier(.2, .9, .3, 1.05); }
.swal2-hide:not(.swal2-toast) { animation: tp-dialogo-sale .14s ease-in forwards; }
@keyframes tp-dialogo-entra { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes tp-dialogo-sale { to { opacity: 0; transform: scale(.97); } }

/* Icono pequeño a la izquierda del título (las medidas de SweetAlert2 van en em) */
.swal2-popup:not(.swal2-toast) > .swal2-icon {
    font-size: 6.4px; margin: 0 14px 0 0; border-width: .3em; align-self: center;
}
.swal2-popup:not(.swal2-toast) > .swal2-icon .swal2-icon-content { font-size: 3.6em; font-weight: 700; }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-warning  { border-color: #f0b452; color: #c97a00; background: var(--tp-av-bg); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-question { border-color: #9cb8d6; color: var(--tp-pri); background: var(--tp-info-bg); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-info     { border-color: #9cb8d6; color: var(--tp-info); background: var(--tp-info-bg); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-error    { border-color: #e9a59d; background: var(--tp-er-bg); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-error [class^=swal2-x-mark-line] { background-color: var(--tp-er); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-success { border-color: #93cfac; }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-success [class^=swal2-success-line] { background-color: var(--tp-ok); }
.swal2-popup:not(.swal2-toast) > .swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(31, 138, 76, .25); }

/* Textos */
.swal2-popup:not(.swal2-toast) > .swal2-title {
    padding: 0; margin: 0; text-align: left; font-size: 1.15rem; font-weight: 600; line-height: 1.35; color: var(--tp-tx);
}
.swal2-popup:not(.swal2-toast).swal2-has-close > .swal2-title, .swal2-popup:not(.swal2-toast):has(> .swal2-close[style*="flex"]) > .swal2-title { padding-right: 28px; }
.swal2-popup:not(.swal2-toast) > .swal2-html-container {
    margin: 10px 0 0; padding: 0; text-align: left; font-size: .95rem; line-height: 1.5; color: var(--tp-tx2);
}
.swal2-popup:not(.swal2-toast) > .swal2-footer { margin: 14px 0 0; padding: 10px 0 0; border-top-color: var(--tp-bd); font-size: .85rem; color: var(--tp-tx2); }
.swal2-popup:not(.swal2-toast) > .swal2-validation-message {
    margin: 12px 0 0; border-radius: 8px; background: var(--tp-er-bg); color: var(--tp-er); font-size: .9rem; justify-content: flex-start; padding: 8px 12px;
}
.swal2-popup:not(.swal2-toast) > .swal2-validation-message::before { background-color: var(--tp-er); min-width: 1.2em; height: 1.2em; font-size: .8em; margin: 0 .6em 0 0; }
.swal2-close { color: var(--tp-tx2); font-size: 1.9em; width: 1.3em; height: 1.3em; border-radius: 8px; margin: -6px -8px 0 0; }
.swal2-close:hover { color: var(--tp-tx); background: var(--tp-fondo); }
.swal2-close:focus-visible { box-shadow: 0 0 0 3px rgba(10, 61, 98, .25); }

/* Campos */
.swal2-popup .swal2-input, .swal2-popup .swal2-textarea, .swal2-popup .swal2-select, .swal2-popup .swal2-file {
    border: 1px solid #ccd3dc; border-radius: 8px; box-shadow: none; font-size: .95rem; color: var(--tp-tx);
}
.swal2-popup .swal2-input:focus, .swal2-popup .swal2-textarea:focus, .swal2-popup .swal2-select:focus {
    border-color: var(--tp-pri); box-shadow: 0 0 0 3px rgba(10, 61, 98, .15); outline: none;
}
.swal2-popup .swal2-input.swal2-inputerror, .swal2-popup .swal2-textarea.swal2-inputerror { border-color: var(--tp-er) !important; box-shadow: 0 0 0 3px rgba(192, 57, 43, .15) !important; }

/* Botones: Cancelar a la izquierda, la acción a la derecha */
.swal2-popup:not(.swal2-toast) > .swal2-actions {
    justify-content: flex-end; width: 100%; margin: 18px 0 0; padding: 0; gap: 8px; flex-wrap: wrap;
}
.swal2-actions > .swal2-cancel { order: 1; }
.swal2-actions > .swal2-deny { order: 2; }
.swal2-actions > .swal2-confirm { order: 3; }
.swal2-actions > .swal2-loader { order: 4; border-color: var(--tp-pri) transparent var(--tp-pri) transparent; }
.swal2-popup:not(.swal2-toast) > .swal2-actions:not(.swal2-loading) .swal2-styled {
    margin: 0; padding: 8px 16px; border-radius: 8px; font: 600 .92rem/1.3 Arial, sans-serif;
    box-shadow: none; transition: background-color .15s, border-color .15s, color .15s;
}
.swal2-styled.swal2-confirm { background-color: var(--tp-pri) !important; border: 1px solid var(--tp-pri) !important; color: #fff !important; }
.swal2-styled.swal2-confirm:hover { background-color: var(--tp-pri-hover) !important; background-image: none !important; }
.swal2-styled.swal2-cancel, .swal2-styled.swal2-deny {
    background-color: #fff !important; border: 1px solid #ccd3dc !important; color: var(--tp-tx) !important;
}
.swal2-styled.swal2-cancel:hover, .swal2-styled.swal2-deny:hover { background-color: var(--tp-fondo) !important; background-image: none !important; }
.swal2-styled.swal2-confirm.tp-peligro { background-color: var(--tp-er) !important; border-color: var(--tp-er) !important; }
.swal2-styled.swal2-confirm.tp-peligro:hover { background-color: var(--tp-er-hover) !important; }
.swal2-styled.swal2-deny.tp-peligro { color: var(--tp-er) !important; border-color: #e9b8b2 !important; }
.swal2-styled:focus { box-shadow: none !important; outline: none; }
.swal2-styled:focus-visible { box-shadow: 0 0 0 3px rgba(10, 61, 98, .25) !important; }
.swal2-styled.tp-peligro:focus-visible { box-shadow: 0 0 0 3px rgba(192, 57, 43, .25) !important; }

/* «Cargando…»: compacto y centrado */
.swal2-popup.tp-cargando, .swal2-popup:not(.swal2-toast):has(> .swal2-actions.swal2-loading) { width: auto; min-width: 240px; max-width: 360px; padding: 22px 26px; }
.swal2-popup:not(.swal2-toast):has(> .swal2-actions.swal2-loading) > .swal2-title { text-align: center; font-size: 1.05rem; }
.swal2-popup:not(.swal2-toast):has(> .swal2-actions.swal2-loading) > .swal2-html-container { text-align: center; }
.swal2-popup:not(.swal2-toast) > .swal2-actions.swal2-loading { justify-content: center; margin-top: 14px; }

/* Toasts que aún se lanzan con Swal (toast: true) */
.swal2-popup.swal2-toast {
    border: 1px solid var(--tp-bd); border-radius: 10px; box-shadow: var(--tp-sombra);
    font-family: Arial, sans-serif; color: var(--tp-tx); padding: 10px 12px;
}
.swal2-popup.swal2-toast .swal2-title { font-size: .95rem; font-weight: 600; color: var(--tp-tx); }
.swal2-popup.swal2-toast .swal2-timer-progress-bar { background: rgba(10, 61, 98, .3); height: 2px; }

/* Móvil: la ventana sube desde abajo y los botones ocupan todo el ancho */
@media (max-width: 576px) {
    .swal2-container:not(.swal2-top):not(.swal2-top-end):not(.swal2-top-start):not(.swal2-bottom-end):not(.swal2-bottom-start):not(.swal2-top-right):not(.swal2-bottom-right) { padding: 0; }
    .swal2-container.swal2-center > .swal2-popup:not(.swal2-toast):not(.tp-cargando) {
        grid-row: 3; align-self: end; justify-self: stretch; width: 100% !important; max-width: none;
        border-radius: 16px 16px 0 0; padding: 20px 18px calc(16px + env(safe-area-inset-bottom));
    }
    .swal2-container.swal2-center > .swal2-popup:not(.swal2-toast):not(.tp-cargando):has(> .swal2-actions.swal2-loading) { grid-row: 2; align-self: center; justify-self: center; width: auto !important; border-radius: 12px; }
    .swal2-container.swal2-center > .swal2-show:not(.swal2-toast):not(.tp-cargando) { animation: tp-dialogo-sube .24s cubic-bezier(.2, .9, .3, 1); }
    .swal2-container.swal2-center > .swal2-hide:not(.swal2-toast):not(.tp-cargando) { animation: tp-dialogo-baja .16s ease-in forwards; }
    .swal2-popup:not(.swal2-toast) > .swal2-actions:not(.swal2-loading) { flex-direction: column-reverse; }
    .swal2-popup:not(.swal2-toast) > .swal2-actions:not(.swal2-loading) .swal2-styled { width: 100%; padding: 12px 16px; font-size: 1rem; }
    .swal2-actions > .swal2-cancel { order: 1; } .swal2-actions > .swal2-deny { order: 2; } .swal2-actions > .swal2-confirm { order: 3; }
}
@keyframes tp-dialogo-sube { from { transform: translateY(100%); } to { transform: none; } }
@keyframes tp-dialogo-baja { to { transform: translateY(100%); } }
@media (prefers-reduced-motion: reduce) {
    .tp-aviso, .tp-aviso-sale, .swal2-show, .swal2-hide { animation-duration: .01ms !important; }
}

/* Campo propio del diálogo (input: 'text', 'textarea'…): a todo el ancho, alineado con el texto */
.swal2-popup:not(.swal2-toast) > .swal2-input, .swal2-popup:not(.swal2-toast) > .swal2-textarea,
.swal2-popup:not(.swal2-toast) > .swal2-select, .swal2-popup:not(.swal2-toast) > .swal2-file {
    margin: 14px 0 0; width: 100%; max-width: 100%; box-sizing: border-box;
}
.swal2-popup:not(.swal2-toast) > .swal2-input-label { justify-content: flex-start; margin: 14px 0 0; font-size: .9rem; color: var(--tp-tx); font-weight: 600; }
.swal2-popup:not(.swal2-toast) > .swal2-radio, .swal2-popup:not(.swal2-toast) > .swal2-checkbox { justify-content: flex-start; margin: 12px 0 0; background: transparent; }