/**
 * Estilos de validación con Parsley (sin usar las clases .is-invalid de
 * Bootstrap, para no arrastrar su ícono de fondo). Parsley marca el control
 * inválido con la clase .parsley-error; aquí pintamos el borde en rojo y
 * mostramos el mensaje debajo del campo, a ancho completo.
 */

/* Mensaje de error: bloque debajo del campo, texto rojo pequeño. */
.parsley-errors-list {
    display: block;
    width: 100%;
    margin: .3rem 0 0;
    padding: 0;
    list-style: none;
    font-size: .8125rem;
    line-height: 1.25;
    color: #dc3545;
}
.parsley-errors-list li,
.parsley-errors-list span { display: block; }

/* Borde rojo en el control inválido (input, select, textarea). */
.parsley-error,
.form-control.parsley-error,
.form-select.parsley-error {
    border-color: #dc3545 !important;
}
.parsley-error:focus {
    box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .25) !important;
}

/* Wrapper con ícono del portal (.input-icon): pinta también el recuadro del
   ícono en rojo cuando el control interno es inválido. */
.input-icon:has(.parsley-error) .icon {
    border-color: #dc3545;
    color: #dc3545;
}

/* ── Estilo limpio para TODOS los modales del sistema ── */
.modal-content { border: none; border-radius: .8rem; overflow: hidden; box-shadow: 0 12px 40px rgba(15, 30, 55, .25); }
.modal-header { border-bottom: none; padding: .9rem 1.1rem; }
.modal-header .modal-title { font-weight: 600; }
.modal-footer { border-top: 1px solid #eef2f7; }

/* Tarjetas internas: sin bordes/sombras duros del tema. */
.modal .card {
    border: none;
    border-radius: .7rem;
    box-shadow: 0 1px 4px rgba(20, 40, 70, .07);
    overflow: hidden;
}
.modal .card-header {
    background: #fff;
    border-bottom: 2px solid #eef2f7;
    color: #1d3b5a;
    font-size: .82rem;
    letter-spacing: .4px;
    text-transform: uppercase;
    padding: .6rem .9rem;
}
.modal .card-header i { color: #3b7ddd; }
.modal .card-body { padding: .6rem .9rem .8rem; }

/* Filas etiqueta/valor (dl.row): etiqueta en micro-mayúsculas, valor legible. */
.modal dl.row { font-size: .9rem; margin-bottom: 0; }
.modal dl.row > dt,
.modal dl.row > dd {
    padding: .45rem .25rem;
    border-bottom: 1px solid #eef2f7;
    margin: 0;
}
.modal dl.row > dt {
    font-weight: 600;
    color: #7488a0;
    text-transform: uppercase;
    font-size: .68rem;
    letter-spacing: .5px;
    align-self: center;
}
.modal dl.row > dd {
    color: #1f2d3d;
    font-weight: 500;
    word-break: break-word;
}
.modal dl.row > dd:last-of-type,
.modal dl.row > dt:last-of-type { border-bottom: none; }

/* Específico del modal de detalle de trámite. */
#modalDetalle .modal-body { background: #f4f7fb; }
#modalDetalle #det_remitente { font-size: 1.05rem; color: #16283c; }
#modalDetalle #det_rem_avatar {
    width: 48px !important; height: 48px !important; flex-basis: 48px !important;
    box-shadow: 0 2px 6px rgba(59, 125, 221, .35);
}
#modalDetalle #det_timeline .list-group-item { border: none; padding: .6rem .2rem .6rem 1.1rem; position: relative; }
#modalDetalle #det_timeline .list-group-item::before {
    content: ''; position: absolute; left: .15rem; top: .95rem; bottom: -.3rem; width: 2px; background: #e2e8f0;
}
#modalDetalle #det_timeline .list-group-item:last-child::before { display: none; }

/* Fila de trámite prioritario (entidad del Estado / institución pública). */
tr.fila-prioritaria > td {
    background-color: #fff8e1 !important; /* ámbar muy suave */
    box-shadow: inset 3px 0 0 #f5b301;    /* barra lateral ámbar */
}
tr.fila-prioritaria:hover > td { background-color: #fff3cd !important; }

/* Fila de trámite POSIBLE SPAM / bot. */
tr.fila-sospechosa > td {
    background-color: #fdecea !important; /* rojo muy suave */
    box-shadow: inset 3px 0 0 #dc3545;
}
tr.fila-sospechosa:hover > td { background-color: #f8d7da !important; }

/* Select2: marca en rojo el contenedor cuando el <select> es inválido. */
.parsley-error + .select2-container--default .select2-selection,
.parsley-error + .select2-container .select2-selection {
    border-color: #dc3545 !important;
}

/*
 * Neutraliza el ícono de fondo (!) que Bootstrap añade a .is-invalid, por si
 * algún control conserva esa clase de otro origen: solo dejamos el borde/rojo
 * de Parsley, sin íconos superpuestos.
 */
.form-control.is-invalid,
.form-select.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
    background-image: none !important;
}