/* RMT_SAC · estilos base (sin dependencias externas) */
:root {
  --fondo: #f4f6f8;
  --tarjeta: #ffffff;
  --texto: #1f2933;
  --suave: #6b7280;
  --borde: #e3e7eb;
  /* Azul corporativo del logo como color principal (confirmado; el anterior era #0b5fa5 / #08497f) */
  --primario: #004088;
  --primario-oscuro: #002f66;
  --peligro: #b42318;
  --ok: #067647;
  --info: #175cd3;
  /* Colores corporativos, extraídos del logo de Rounding (docs/logo.png) */
  --azul-rmt: #004088;
  --magenta: #92006a;
  --radio: 8px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--texto); background: var(--fondo); min-height: 100vh; display: flex; flex-direction: column; }
a { color: var(--primario); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.5rem; margin: 0 0 1rem; }
h2 { font-size: 1.1rem; margin: 0 0 .75rem; }
h3 { font-size: 1rem; margin: 1rem 0 .5rem; }
code.password { font-size: 1.15rem; background: #fff; border: 1px dashed var(--info); padding: .15rem .5rem; border-radius: 4px; user-select: all; }

/* Cabecera */
.cabecera { display: flex; align-items: center; gap: 1.5rem; padding: .5rem 1.5rem; background: var(--tarjeta); border-bottom: 1px solid var(--borde); flex-wrap: wrap; }
.marca { display: flex; align-items: center; gap: .6rem; font-weight: 600; color: var(--texto); }
.marca img { height: 36px; }
.nav { display: flex; gap: .25rem; flex: 1; }
.nav a { padding: .4rem .75rem; border-radius: var(--radio); color: var(--texto); }
.nav a:hover { background: var(--fondo); text-decoration: none; }
.nav a.activo { background: var(--primario); color: #fff; }
.quien { display: flex; align-items: center; gap: .75rem; font-size: .9rem; }
.contenido { flex: 1; width: 100%; max-width: 1280px; margin: 0 auto; padding: 1.25rem 1.5rem 2rem; }
.pie { text-align: center; color: var(--suave); font-size: .8rem; padding: 1rem; }

/* Tarjetas y disposición */
.tarjeta { background: var(--tarjeta); border: 1px solid var(--borde); border-radius: var(--radio); padding: 1rem 1.25rem; margin-bottom: 1rem; }
.tarjeta.sin-relleno { padding: 0; overflow: hidden; }
.tarjeta.estrecha { max-width: 440px; margin: 3rem auto; }
.login { text-align: center; }
.login form { text-align: left; }
.logo-login { height: 140px; max-width: 100%; margin: .25rem 0 .75rem; }
.dos-columnas { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.detalle { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1rem; align-items: start; }
.fila-titulo { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: .5rem; }
.fila-titulo h1 { margin-bottom: .25rem; }
.migas { color: var(--suave); font-size: .85rem; margin: 0 0 .25rem; }
.codigo { font-family: ui-monospace, Consolas, monospace; color: var(--suave); font-weight: 500; }
.etiquetas { margin: 0; display: flex; gap: .4rem; flex-wrap: wrap; }
@media (max-width: 900px) { .dos-columnas, .detalle { grid-template-columns: 1fr; } .cabecera { gap: .75rem; } }

/* Tablas */
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabla th, .tabla td { padding: .5rem .75rem; text-align: left; border-bottom: 1px solid var(--borde); vertical-align: middle; }
.tabla th { font-weight: 600; color: var(--suave); font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; background: #fafbfc; }
.tabla tr:last-child td { border-bottom: none; }
.tabla tr:hover td { background: #fafbfc; }
.tabla .num { text-align: right; }
.tabla tr.inactivo td { color: var(--suave); }
.tabla input, .tabla select { margin: 0; }
.acciones-fila { white-space: nowrap; }

/* Etiquetas de estado/prioridad */
.etiqueta { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 600; background: #eef1f4; color: #374151; white-space: nowrap; }
.etiqueta-cliente { background: #e0f2fe; color: #075985; }
.etiqueta-interno { background: #fef3c7; color: #92400e; }
.prioridad-baja { background: #e5e7eb; color: #374151; }
.prioridad-media { background: #dbeafe; color: #1e40af; }
.prioridad-alta { background: #ffedd5; color: #9a3412; }
.prioridad-critica { background: #fee2e2; color: #991b1b; }
.estado-nueva { background: #ede9fe; color: #5b21b6; }
.estado-triada { background: #e0e7ff; color: #3730a3; }
.estado-pendiente_aprobacion { background: #fef3c7; color: #92400e; }
.estado-en_curso { background: #dbeafe; color: #1e40af; }
.estado-en_revision { background: #cffafe; color: #155e75; }
.estado-pendiente_cliente { background: #ffedd5; color: #9a3412; }
.estado-resuelta { background: #d1fae5; color: #065f46; }
.estado-cerrada { background: #e5e7eb; color: #4b5563; }
.estado-rechazada { background: #fee2e2; color: #991b1b; }

/* Formularios */
label { display: block; font-size: .88rem; font-weight: 500; margin-bottom: .75rem; }
label.inline { display: inline-flex; align-items: center; gap: .4rem; margin: 0; }
label.check { font-weight: 400; }
input[type=text], input[type=email], input[type=password], input[type=search], input[type=number], input[type=date], input[type=time], input[type=url], select, textarea {
  display: block; width: 100%; margin-top: .25rem; padding: .45rem .6rem; border: 1px solid #cbd2d9; border-radius: 6px; font: inherit; background: #fff; color: var(--texto);
}
input[type=file] { margin-top: .25rem; font-size: .85rem; }
input:focus, select:focus, textarea:focus { outline: 2px solid #93c5fd; border-color: var(--primario); }
textarea { resize: vertical; }
.rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 1rem; }
.fila-formulario { display: flex; gap: .75rem; align-items: flex-end; flex-wrap: wrap; margin-top: .75rem; }
.fila-formulario label { margin: 0; min-width: 140px; }
.fila-formulario label.crece { flex: 1; min-width: 220px; }
.fila-formulario input, .fila-formulario select { width: 100%; }
.fila { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.fila .btn { margin-left: auto; }
.acciones { display: flex; gap: .5rem; margin: .5rem 0 1rem; }
.filtros { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; align-items: center; }
.filtros input, .filtros select { width: auto; margin: 0; min-width: 150px; }
.filtros input[type=search] { min-width: 260px; flex: 1; }
.nota { color: var(--suave); font-size: .85rem; margin: .5rem 0 0; }
form.inline { display: inline; }

/* Botones */
.btn { display: inline-block; padding: .45rem .9rem; border-radius: 6px; border: 1px solid #cbd2d9; background: #fff; color: var(--texto); font: inherit; font-weight: 500; cursor: pointer; text-decoration: none; }
.btn:hover { background: #f0f2f5; text-decoration: none; }
.btn-primario { background: var(--primario); border-color: var(--primario); color: #fff; }
.btn-primario:hover { background: var(--primario-oscuro); }
.btn-suave { background: transparent; border-color: transparent; color: var(--primario); }
.btn-suave:hover { background: #eef1f4; }
.btn-peq { padding: .2rem .55rem; font-size: .82rem; }
.btn.ancho { width: 100%; }

/* Avisos */
.aviso { padding: .65rem 1rem; border-radius: var(--radio); margin-bottom: 1rem; border: 1px solid; }
.aviso-ok { background: #ecfdf3; border-color: #abefc6; color: var(--ok); }
.aviso-error { background: #fef3f2; border-color: #fecdca; color: var(--peligro); }
.aviso-info { background: #eff8ff; border-color: #b2ddff; color: var(--info); }

/* Detalle de incidencia */
.campos { margin: 0; }
.campo { margin-bottom: .9rem; }
.campo dt, .meta dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--suave); font-weight: 600; }
.campo dd, .meta dd { margin: .15rem 0 0; }
.meta { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: .35rem .75rem; align-items: baseline; }
.meta dt { align-self: baseline; }
.pre { white-space: pre-wrap; word-break: break-word; }
.adjuntos { list-style: none; padding: 0; margin: .25rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.comentario { border-top: 1px solid var(--borde); padding: .75rem 0; }
.comentario header { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-bottom: .3rem; }
.comentario.de-staff { border-left: 3px solid var(--primario); padding-left: .75rem; }
.comentario.de-cliente { border-left: 3px solid #9ca3af; padding-left: .75rem; }
.comentario.interno { background: #fffbeb; border-left-color: #f59e0b; }
.formulario-comentario { margin-top: 1rem; border-top: 1px solid var(--borde); padding-top: 1rem; }
.historial, .lista-simple { list-style: none; padding: 0; margin: 0; }
.historial li { padding: .35rem 0; border-bottom: 1px solid var(--borde); font-size: .88rem; }
.historial li:last-child { border-bottom: none; }
.lista-simple li { padding: .4rem 0; border-bottom: 1px solid var(--borde); display: flex; gap: .5rem; align-items: baseline; flex-wrap: wrap; }
.lista-simple li:last-child { border-bottom: none; }
.suave { color: var(--suave); font-weight: 400; }
.paginacion { display: flex; gap: .25rem; margin: 1rem 0; }
.paginacion a { padding: .25rem .6rem; border: 1px solid var(--borde); border-radius: 4px; background: #fff; }
.paginacion a.activo { background: var(--primario); color: #fff; border-color: var(--primario); }

/* Campos obligatorios y zona de adjuntos */
.obligatorio { color: var(--peligro); font-weight: 700; }
.leyenda { margin: -.5rem 0 1rem; }
label[hidden] { display: none; }
.zona-adjuntos { border: 2px dashed #cbd2d9; border-radius: var(--radio); padding: .9rem 1rem; margin-bottom: .75rem; background: #fafbfc; transition: background .15s, border-color .15s; }
.zona-adjuntos.arrastrando { background: #eff8ff; border-color: var(--primario); }
.zona-adjuntos-etiqueta { margin: 0; cursor: pointer; }
.zona-adjuntos-etiqueta input[type=file] { display: block; margin-top: .5rem; }
.zona-adjuntos-lista { list-style: none; padding: 0; margin: .5rem 0 0; }
.zona-adjuntos-lista li { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .25rem 0; border-top: 1px solid var(--borde); font-size: .9rem; }

/* Zona de adjuntos v2: área clara para arrastrar */
.zona-adjuntos { border: none; padding: 0; background: transparent; }
.zona-adjuntos-titulo { display: block; font-size: .88rem; font-weight: 500; margin-bottom: .35rem; }
.zona-adjuntos-area { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; min-height: 120px; padding: 1.25rem; margin: 0; border: 2px dashed #9ca3af; border-radius: var(--radio); background: #fafbfc; text-align: center; cursor: pointer; font-weight: 400; transition: background .15s, border-color .15s; }
.zona-adjuntos-area:hover, .zona-adjuntos.arrastrando .zona-adjuntos-area { background: #eff8ff; border-color: var(--primario); }
.zona-adjuntos-icono { font-size: 1.6rem; color: var(--primario); line-height: 1; }
.zona-adjuntos-texto { font-size: .9rem; color: var(--suave); }
.zona-adjuntos-texto strong { color: var(--texto); font-size: 1rem; }
.zona-adjuntos-area input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.zona-adjuntos-lista li { justify-content: flex-start; }
.zona-adjuntos-lista .crece { flex: 1; }
.zona-adjuntos-vista { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; flex: none; font-size: 1.4rem; }
.zona-adjuntos-vista img { max-width: 48px; max-height: 48px; border-radius: 4px; border: 1px solid var(--borde); object-fit: cover; }

/* Galería de adjuntos guardados */
.adjuntos-galeria { list-style: none; padding: 0; margin: .25rem 0 0; display: flex; flex-wrap: wrap; gap: .75rem; }
.adjuntos-galeria li { width: 160px; font-size: .82rem; }
.adjuntos-galeria a { display: block; color: var(--texto); }
.adjuntos-galeria img { display: block; width: 160px; height: 110px; object-fit: cover; border: 1px solid var(--borde); border-radius: 6px; background: #fff; }
.adjuntos-galeria .icono-fichero { display: flex; align-items: center; justify-content: center; width: 160px; height: 110px; font-size: 2.4rem; border: 1px solid var(--borde); border-radius: 6px; background: #fafbfc; }
.adjuntos-galeria .nombre-fichero { display: block; margin-top: .25rem; word-break: break-all; }
.adjuntos-galeria a:hover img, .adjuntos-galeria a:hover .icono-fichero { border-color: var(--primario); }

/* Todos los inputs con la misma altura (date/time/url incluidos) */
input[type=text], input[type=email], input[type=password], input[type=search], input[type=number], input[type=date], input[type=time], input[type=url], select { min-height: 2.4rem; line-height: 1.3; }
input[type=time] { width: 100%; max-width: 160px; }

/* Rejilla de formulario: etiquetas de dos líneas alineadas, inputs a la misma altura */
.rejilla label { display: flex; flex-direction: column; justify-content: flex-end; }
.rejilla label > .suave, .rejilla label > .obligatorio { display: inline; }
.rejilla label > input, .rejilla label > select, .rejilla label > textarea { margin-top: auto; }
.rejilla input[type=time] { max-width: none; }

/* Imputación de horas */
.formulario-horas { margin-top: 1rem; border-top: 1px solid var(--borde); padding-top: .5rem; }
.tabla .adjuntos-galeria li { width: 110px; }
.tabla .adjuntos-galeria img, .tabla .adjuntos-galeria .icono-fichero { width: 110px; height: 76px; }

/* Estado actual destacado en el detalle de incidencia */
.cabecera-derecha { display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; flex: none; }
.estado-actual { display: flex; flex-direction: column; align-items: center; min-width: 220px; padding: .6rem 1.25rem; border-radius: var(--radio); border: 2px solid currentColor; text-align: center; line-height: 1.25; }
.estado-actual strong { font-size: 1.35rem; font-weight: 700; }
.estado-actual-etiqueta { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; opacity: .85; }
.estado-actual-desde { font-size: .78rem; opacity: .85; margin-top: .15rem; }
@media (max-width: 700px) { .fila-titulo { flex-direction: column; } .cabecera-derecha { align-items: stretch; width: 100%; } }

/* Tabla de horas: filas compactas con detalle desplegable */
.tabla-horas .desplegar { font-size: .95rem; padding: .1rem .45rem; }
.tabla-horas .detalle-imputacion td { background: #fafbfc; }
.tabla-horas .detalle-imputacion .campo { margin: .25rem 0 .5rem; }
.tabla-horas .detalle-imputacion dt { display: block; }

/* Fechas con hora en el listado, sin partir en dos líneas */
.tabla .fecha-hora { white-space: nowrap; }

/* Botones de icono (eliminar líneas en listados) */
.btn-icono { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border-color: transparent; background: transparent; color: var(--suave); border-radius: 6px; }
.btn-icono .icono { display: block; }
.btn-icono:hover { background: #eef1f4; color: var(--texto); }
.btn-eliminar:hover { background: #fef3f2; color: var(--peligro); }

/* Columna de acciones estrecha; iconos con color según la acción */
.tabla .col-acciones, .tabla .acciones-fila { width: 1%; white-space: nowrap; text-align: right; }
.tabla .acciones-fila form + form { margin-left: .15rem; }
.btn-activar:hover { background: #ecfdf3; color: var(--ok); }

/* ---------- Ancho de página y responsive ---------- */
.contenido { max-width: 1440px; }
.tabla-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabla-incidencias .col-titulo { min-width: 220px; }
.cuadros { display: flex; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.cuadro-horas { color: var(--texto); background: #fff; border-color: var(--magenta); text-decoration: none; min-width: 160px; }
.cuadro-horas:hover { text-decoration: none; background: #fdf2f8; }
.cuadro-horas strong, .cuadro-horas .estado-actual-etiqueta { color: var(--magenta); }
@media (max-width: 1100px) {
  .contenido { padding: 1rem; }
  .filtros input[type=search] { min-width: 200px; }
}
@media (max-width: 800px) {
  .oculta-movil { display: none; }
  .cabecera { padding: .5rem .75rem; gap: .5rem; }
  .marca span { display: none; }
  .nav { order: 3; width: 100%; overflow-x: auto; }
  .nav a { white-space: nowrap; }
  .quien { margin-left: auto; }
  .quien span { display: none; }
  .fila-titulo { flex-direction: column; align-items: stretch; }
  .cabecera-derecha { align-items: stretch; width: 100%; }
  .cuadros { justify-content: stretch; }
  .cuadros > * { flex: 1; }
  .filtros { flex-direction: column; align-items: stretch; }
  .filtros input, .filtros select { width: 100%; min-width: 0; }
  .fila-formulario { flex-direction: column; align-items: stretch; }
  .fila-formulario label, .fila-formulario label.crece { min-width: 0; }
  .rejilla { grid-template-columns: 1fr; }
  .tarjeta.estrecha { margin: 1rem auto; }
  .meta { grid-template-columns: 1fr; gap: 0 .5rem; }
  .meta dt { margin-top: .4rem; }
  .adjuntos-galeria li { width: calc(50% - .4rem); }
  .adjuntos-galeria img, .adjuntos-galeria .icono-fichero { width: 100%; }
  h1 { font-size: 1.25rem; }
}

/* Sin desbordamiento horizontal en móvil */
@media (max-width: 900px) { .dos-columnas, .detalle { grid-template-columns: minmax(0, 1fr); } }
.columna-principal, .columna-lateral { min-width: 0; }
.campo dd a, .pre { overflow-wrap: anywhere; }
.tabla-horas-scroll { overflow-x: auto; }

/* Filtros plegables en móvil */
.btn-filtros { display: none; margin-bottom: .75rem; width: 100%; }
@media (max-width: 800px) {
  .btn-filtros { display: block; }
  .filtros { display: none; }
  .filtros.abierto { display: flex; }
}

/* Los campos ocultos por configuración no se muestran nunca (prevalece sobre la rejilla) */
label[hidden], [hidden] { display: none !important; }

/* Configuración del formulario de incidencia (ficha de cliente) */
.config-formulario { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.config-lista { border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden; }
.config-fila { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0; padding: .7rem .9rem; border-bottom: 1px solid var(--borde); cursor: pointer; font-weight: 400; }
.config-fila:last-child { border-bottom: none; }
.config-fila:hover { background: #fafbfc; }
.config-texto { display: flex; flex-direction: column; line-height: 1.3; }
.config-texto .suave { font-size: .82rem; }
.config-entornos label { margin-bottom: .75rem; }
.config-entornos textarea { min-height: 150px; }
@media (max-width: 800px) { .config-formulario { grid-template-columns: 1fr; } }

/* Interruptor (checkbox estilizado) */
.interruptor { position: relative; display: inline-block; width: 42px; height: 24px; flex: none; }
.interruptor input { position: absolute; opacity: 0; width: 0; height: 0; }
.interruptor-pista { position: absolute; inset: 0; background: #cbd2d9; border-radius: 999px; transition: background .15s; }
.interruptor-pista::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: #fff; border-radius: 50%; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.interruptor input:checked + .interruptor-pista { background: var(--primario); }
.interruptor input:checked + .interruptor-pista::after { transform: translateX(18px); }
.interruptor input:focus-visible + .interruptor-pista { outline: 2px solid #93c5fd; outline-offset: 2px; }

/* Listado de incidencias en dos líneas */
.lista-incidencias { list-style: none; margin: 0; padding: 0; }
.lista-incidencias li { border-bottom: 1px solid var(--borde); }
.lista-incidencias li:last-child { border-bottom: none; }
.inc-fila { display: block; padding: .7rem 1rem; color: var(--texto); text-decoration: none; }
.inc-fila:hover { background: #fafbfc; text-decoration: none; }
.inc-linea1 { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.inc-codigo { font-family: ui-monospace, Consolas, monospace; font-weight: 600; color: var(--primario); white-space: nowrap; }
.inc-titulo { font-weight: 600; flex: 1; min-width: 200px; }
.inc-etiquetas { display: flex; align-items: center; gap: .4rem; margin-left: auto; }
.inc-horas { min-width: 3.5rem; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; color: var(--primario); font-size: .9rem; }
.inc-linea2 { display: flex; flex-wrap: wrap; gap: .15rem .4rem; margin-top: .25rem; font-size: .84rem; color: var(--suave); }
.inc-linea2 strong { font-weight: 600; color: #4b5563; }
.inc-cliente { color: #075985; font-weight: 600; }
.inc-linea2 .sep { color: #cbd2d9; }
.inc-actualizada { margin-left: auto; white-space: nowrap; }
@media (max-width: 800px) {
  .inc-titulo { min-width: 0; flex-basis: 100%; order: 3; }
  .inc-etiquetas { margin-left: auto; }
  .inc-actualizada { margin-left: 0; flex-basis: 100%; }
}

/* Estado destacado en el listado: bloque fijo a la izquierda + borde de color en la fila */
.inc-estado { display: inline-block; min-width: 150px; text-align: center; padding: .3rem .6rem; border-radius: 6px; font-size: .82rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap; }
.inc-fila { border-left: 5px solid transparent; }
.inc-linea2 { padding-left: calc(150px + .6rem); }
.fila-estado-nueva { border-left-color: #7c3aed; }
.fila-estado-triada { border-left-color: #4f46e5; }
.fila-estado-pendiente_aprobacion { border-left-color: #d97706; }
.fila-estado-en_curso { border-left-color: #2563eb; }
.fila-estado-en_revision { border-left-color: #0891b2; }
.fila-estado-pendiente_cliente { border-left-color: #ea580c; }
.fila-estado-resuelta { border-left-color: #059669; }
.fila-estado-cerrada { border-left-color: #9ca3af; }
.fila-estado-rechazada { border-left-color: #dc2626; }
@media (max-width: 800px) {
  .inc-estado { min-width: 0; order: 0; }
  .inc-codigo { order: 1; }
  .inc-etiquetas { order: 2; }
  .inc-linea2 { padding-left: 0; }
}

/* Listas del panel: mismo formato que el listado, sin relleno lateral de la tarjeta */
.panel-lista .lista-incidencias { margin: 0 -1.25rem -1rem; border-top: 1px solid var(--borde); }
.lista-incidencias.compacta .inc-estado { min-width: 130px; font-size: .78rem; padding: .25rem .5rem; }
.lista-incidencias.compacta .inc-linea2 { padding-left: calc(130px + .6rem); }
.lista-incidencias.compacta .inc-titulo { min-width: 120px; }
@media (max-width: 800px) { .lista-incidencias.compacta .inc-linea2 { padding-left: 0; } .lista-incidencias.compacta .inc-estado { min-width: 0; } }

/* Lista editable de entornos y columna "por defecto" */
.config-titulo { display: block; font-size: .88rem; font-weight: 500; margin-bottom: .35rem; }
.lista-entornos { border: 1px solid var(--borde); border-radius: var(--radio); overflow: hidden; margin-bottom: .5rem; }
.lista-entornos-cab, .lista-entornos-fila { display: grid; grid-template-columns: 1fr 90px 40px; align-items: center; gap: .5rem; padding: .35rem .6rem; border-bottom: 1px solid var(--borde); }
.lista-entornos-cab { background: #fafbfc; font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--suave); font-weight: 600; }
.lista-entornos-cab span:nth-child(2), .lista-entornos-fila input[type=radio] { justify-self: center; }
.lista-entornos-fila:last-child { border-bottom: none; }
.lista-entornos-fila input[type=text] { margin: 0; }
.lista-entornos-fila input[type=radio], .col-defecto input[type=radio] { width: 18px; height: 18px; margin: 0; cursor: pointer; accent-color: var(--primario); }
.config-entornos .btn-peq { margin-bottom: .5rem; }
.tabla .col-defecto { width: 1%; text-align: center; white-space: nowrap; }

/* Página de ayuda */
.ayuda { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 1rem; align-items: start; }
.ayuda-indice { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: .35rem; font-size: .9rem; }
.ayuda-indice strong { margin-bottom: .25rem; }
.ayuda-cuerpo section { scroll-margin-top: 1rem; }
.ayuda-cuerpo h3 { margin-top: 1rem; }
.ayuda-cuerpo ul, .ayuda-cuerpo ol { padding-left: 1.25rem; }
.ayuda-cuerpo li { margin-bottom: .35rem; }
.ayuda-cuerpo code { background: #f0f2f5; padding: .05rem .3rem; border-radius: 4px; }
.tabla-estados td:first-child { width: 1%; white-space: nowrap; }
.preguntas dt { font-weight: 600; margin-top: .75rem; }
.preguntas dd { margin: .2rem 0 0; }
@media (max-width: 800px) { .ayuda { grid-template-columns: 1fr; } .ayuda-indice { position: static; } }

/* Iconos de la cabecera (ayuda, contraseña, salir) */
.btn-cabecera { width: 34px; height: 34px; color: var(--texto); }
.btn-cabecera .icono { width: 20px; height: 20px; }
.btn-cabecera:hover { background: var(--fondo); color: var(--primario); }
.btn-cabecera.activo { background: var(--primario); color: #fff; }
.quien { gap: .35rem; }
.quien > span { margin-right: .4rem; }

/* Panel del cliente: indicadores y barras */
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
@media (max-width: 800px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: .9rem .6rem; background: var(--tarjeta); border: 1px solid var(--borde); border-radius: var(--radio); color: var(--texto); text-decoration: none; min-height: 96px; }
a.kpi:hover { border-color: var(--primario); text-decoration: none; }
.kpi-valor { font-size: 2rem; font-weight: 700; color: var(--primario); line-height: 1.1; }
.kpi-texto { font-size: .82rem; color: var(--suave); margin-top: .25rem; line-height: 1.25; }
.kpi-alerta { border-color: #ea580c; background: #fff7ed; } .kpi-alerta .kpi-valor { color: #c2410c; }
.kpi-aviso { border-color: #d97706; background: #fffbeb; } .kpi-aviso .kpi-valor { color: #b45309; }
.tres-columnas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.barras { list-style: none; margin: 0; padding: 0; }
.barras li { display: grid; grid-template-columns: minmax(110px, auto) 1fr 2.5rem; align-items: center; gap: .6rem; padding: .3rem 0; }
.barras li strong { text-align: right; }
.barra { display: block; height: 10px; background: #eef1f4; border-radius: 999px; overflow: hidden; }
.barra-relleno { display: block; height: 100%; border-radius: 999px; background: var(--primario); }
.barra-relleno.estado-nueva { background: #7c3aed; } .barra-relleno.estado-triada { background: #4f46e5; }
.barra-relleno.estado-pendiente_aprobacion { background: #d97706; } .barra-relleno.estado-en_curso { background: #2563eb; }
.barra-relleno.estado-en_revision { background: #0891b2; } .barra-relleno.estado-pendiente_cliente { background: #ea580c; }
.barra-relleno.estado-resuelta { background: #059669; }
.barra-relleno.prioridad-critica { background: #dc2626; } .barra-relleno.prioridad-alta { background: #ea580c; }
.barra-relleno.prioridad-media { background: #2563eb; } .barra-relleno.prioridad-baja { background: #9ca3af; }
@media (max-width: 900px) { .tres-columnas { grid-template-columns: 1fr; } }

.tabla tr.fila-yo td { background: #eff8ff; }

/* Detalle: apartados de la descripción separados con sutileza */
.campos .campo { margin: 0; padding: .6rem 0 .75rem; border-bottom: 1px solid var(--borde); }
.campos .campo:last-child { border-bottom: none; }
.campos .campo dt { display: flex; align-items: center; gap: .45rem; margin-bottom: .2rem; }
.campos .campo dt::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--magenta); }
.campos .campo dd { margin: 0; padding-left: .95rem; }
.campos .campo.campo-principal dd { font-size: 1rem; }

/* Editor de texto enriquecido (Quill) integrado con el estilo de los formularios */
.editor-rico { margin-top: .25rem; border-radius: 6px; }
.editor-rico .ql-toolbar.ql-snow { border: 1px solid #cbd2d9; border-radius: 6px 6px 0 0; background: #fafbfc; padding: .3rem .4rem; }
.editor-rico .ql-container.ql-snow { border: 1px solid #cbd2d9; border-top: none; border-radius: 0 0 6px 6px; font: inherit; font-size: .95rem; background: #fff; }
.editor-rico .ql-editor { line-height: 1.5; color: var(--texto); font-weight: 400; }
.editor-rico { margin-bottom: .75rem; }
label.etiqueta-editor { margin-bottom: 0; cursor: text; }
.editor-rico .ql-editor.ql-blank::before { color: #9ca3af; font-style: normal; }
.editor-rico:focus-within .ql-toolbar.ql-snow, .editor-rico:focus-within .ql-container.ql-snow { border-color: var(--primario); }
.editor-rico.editor-error .ql-container.ql-snow { border-color: var(--peligro); }
.ql-snow .ql-tooltip { z-index: 20; }

/* Contenido enriquecido mostrado */
.rico { overflow-wrap: anywhere; }
.rico p { margin: 0 0 .4rem; }
.rico p:last-child { margin-bottom: 0; }
.rico ul, .rico ol { margin: .2rem 0 .5rem; padding-left: 1.4rem; }
.rico li { margin-bottom: .15rem; }
.rico blockquote { margin: .3rem 0; padding: .2rem .8rem; border-left: 3px solid #cbd2d9; color: #4b5563; }
.rico pre, .rico .ql-code-block-container { margin: .3rem 0; padding: .5rem .7rem; background: #f3f4f6; border-radius: 6px; font-family: ui-monospace, Consolas, monospace; font-size: .85rem; white-space: pre-wrap; }
.rico .ql-align-center { text-align: center; } .rico .ql-align-right { text-align: right; } .rico .ql-align-justify { text-align: justify; }
.rico .ql-indent-1 { padding-left: 2em; } .rico .ql-indent-2 { padding-left: 4em; } .rico .ql-indent-3 { padding-left: 6em; }

/* Contenido enriquecido mostrado con las reglas del editor (listas, sangrías, alineación) */
.rico.ql-editor { padding: 0; height: auto; overflow: visible; white-space: normal; font: inherit; line-height: 1.5; counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; }
.rico.ql-editor p { white-space: pre-wrap; }
.rico.ql-editor ol { padding-left: 1.5em; }
.rico.ql-editor li[data-list="bullet"], .rico.ql-editor li[data-list="ordered"] { list-style-type: none; }
.rico.ql-editor .ql-code-block-container { background: #23241f; color: #f8f8f2; border-radius: 6px; padding: .5rem .75rem; margin: .35rem 0; overflow-x: auto; font-family: ui-monospace, Consolas, monospace; font-size: .85rem; }
.rico.ql-editor .ql-code-block { white-space: pre-wrap; }
.rico.ql-editor a { color: var(--primario); text-decoration: underline; }

/* Adjuntos pendientes: previsualización y título */
.zona-adjuntos-lista li { align-items: flex-start; }
.zona-adjuntos-vista { text-decoration: none; }
.zona-adjuntos-vista img { cursor: zoom-in; }
.zona-adjuntos-datos { display: flex; flex-direction: column; gap: .25rem; }
.zona-adjuntos-nombre { font-size: .88rem; }
.zona-adjuntos-datos input[type=text] { margin: 0; font-size: .85rem; padding: .3rem .5rem; min-height: 0; }
.adjuntos-galeria img { cursor: zoom-in; }

/* Visor de imágenes (lightbox) */
.visor { position: fixed; inset: 0; z-index: 100; background: rgba(17, 24, 39, .92); display: flex; flex-direction: column; }
.visor-barra { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem 1rem; color: #fff; background: rgba(0,0,0,.35); }
.visor-titulo { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.visor-botones { display: flex; align-items: center; gap: .25rem; flex: none; }
.visor-btn { color: #fff; font-size: 1.1rem; width: 34px; height: 34px; }
.visor-btn:hover { background: rgba(255,255,255,.15); color: #fff; }
.visor-zoom { min-width: 4.5rem; text-align: center; font-size: .85rem; opacity: .85; }
.visor-lienzo { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 1rem; cursor: zoom-out; }
.visor-lienzo img { max-width: 100%; max-height: 100%; object-fit: contain; box-shadow: 0 4px 30px rgba(0,0,0,.5); background: #fff; cursor: zoom-in; }
.visor-lienzo img[style*="max-width: none"] { cursor: zoom-out; max-height: none; align-self: flex-start; margin: auto; }
body.sin-scroll { overflow: hidden; }

/* ---------- Iconos Lucide ---------- */
.icono { width: 16px; height: 16px; display: inline-block; vertical-align: middle; flex: none; }
.btn-cabecera .icono { width: 20px; height: 20px; }
.visor-btn .icono { width: 20px; height: 20px; }
.zona-adjuntos-icono .icono { width: 28px; height: 28px; }
.icono-fichero .icono { width: 40px; height: 40px; color: #6b7280; }
.zona-adjuntos-vista .icono { width: 28px; height: 28px; color: #6b7280; }
.icono * { transition: transform .25s ease; transform-box: fill-box; transform-origin: center; }

/* Animaciones de la cabecera (solo al pasar el ratón; respetan "reducir movimiento") */
@media (prefers-reduced-motion: no-preference) {
  @keyframes balanceo { 0% { transform: rotate(0); } 25% { transform: rotate(-12deg); } 60% { transform: rotate(10deg); } 100% { transform: rotate(0); } }
  /* Contraseña: la llave gira como al abrir */
  .anim-llave .icono { transition: transform .35s cubic-bezier(.34,1.56,.64,1); }
  .anim-llave:hover .icono { transform: rotate(-30deg); }
  /* Salir: la flecha sale de la puerta */
  .anim-salir:hover .icono polyline, .anim-salir:hover .icono line { animation: salida .7s ease; }
  @keyframes salida { 0% { transform: translateX(0); } 45% { transform: translateX(4px); opacity: .6; } 46% { transform: translateX(-4px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } }
}

/* Chevron de los desplegables: gira al abrir */
.desplegar .icono, .btn-filtros .icono { transition: transform .2s ease; }
.desplegar.abierto .icono, .btn-filtros.abierto .icono:last-child { transform: rotate(90deg); }
.btn-filtros { display: none; align-items: center; justify-content: center; gap: .4rem; }
@media (max-width: 800px) { .btn-filtros { display: flex; } }

@media (prefers-reduced-motion: no-preference) {
  /* Ayuda (corregido): el interrogante gira alrededor del centro del círculo, bien visible */
  .anim-ayuda:hover .icono path { transform-box: view-box; transform-origin: 12px 12px; animation: interrogante .7s ease; }
  @keyframes interrogante { 0% { transform: rotate(0) scale(1); } 30% { transform: rotate(-20deg) scale(1.15); } 65% { transform: rotate(14deg) scale(1.1); } 100% { transform: rotate(0) scale(1); } }
  .anim-ayuda:hover .icono circle { animation: latido .7s ease; }
  @keyframes latido { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.12); } }

  /* Papelera: la tapa se levanta */
  .anim-papelera .icono path:nth-child(1), .anim-papelera .icono path:nth-child(3) { transform-box: view-box; transform-origin: 12px 6px; transition: transform .25s ease; }
  .anim-papelera:hover .icono path:nth-child(1), .anim-papelera:hover .icono path:nth-child(3) { transform: translateY(-2.2px) rotate(-10deg); }
  /* Desactivar: la X gira y se agranda (bien visible) y la persona se aparta un poco; Activar: el tick se dibuja */
  .anim-desactivar .icono line { transform-box: view-box; transform-origin: 19.5px 10.5px; transition: transform .3s cubic-bezier(.34,1.56,.64,1); }
  .anim-desactivar:hover .icono line { transform: rotate(90deg) scale(1.45); }
  .anim-desactivar .icono path, .anim-desactivar .icono circle { transition: transform .3s ease; }
  .anim-desactivar:hover .icono path, .anim-desactivar:hover .icono circle { transform: translateX(-1.5px); }
  .anim-activar .icono polyline { stroke-dasharray: 12; stroke-dashoffset: 0; }
  .anim-activar:hover .icono polyline { animation: dibujar .5s ease; }
  @keyframes dibujar { from { stroke-dashoffset: 12; } to { stroke-dashoffset: 0; } }
  /* Máscara: se inclina como al ponérsela */
  .anim-mascara:hover .icono { animation: balanceo .6s ease; }
  /* Guardar: pulso */
  .anim-guardar:hover .icono { animation: latido .45s ease; }
  /* Adjuntos: la flecha de subida rebota al pasar por la zona; el PDF se eleva */
  .zona-adjuntos-area:hover .zona-adjuntos-icono .icono, .zona-adjuntos.arrastrando .zona-adjuntos-icono .icono { animation: rebote .7s ease infinite; }
  @keyframes rebote { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
  .adjuntos-galeria a:hover .icono-fichero .icono, .zona-adjuntos-vista:hover .icono { transform: translateY(-2px) scale(1.08); color: var(--primario); }
  .adjuntos-galeria img, .zona-adjuntos-vista img { transition: transform .2s ease, box-shadow .2s ease; }
  .adjuntos-galeria a:hover img, .zona-adjuntos-vista:hover img { transform: scale(1.03); box-shadow: 0 4px 14px rgba(0,0,0,.15); }
  /* Visor: los botones de zoom se agrandan */
  .visor-btn:hover .icono { transform: scale(1.2); }
}

/* Cabeceras de grupo en el listado */
.lista-incidencias li.grupo-cabecera { display: flex; justify-content: space-between; align-items: center; padding: .55rem 1rem; margin-top: 1.25rem; background: #f3f6f9; border-top: 1px solid var(--borde); border-left: 5px solid #9ca3af; font-size: .85rem; }
.lista-incidencias li.grupo-cabecera:first-child { margin-top: 0; border-top: none; }
.lista-incidencias li.grupo-cabecera + li .inc-fila { border-top: none; }
.grupo-titulo { font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.grupo-n { color: var(--suave); }
.grupo-prioridad-critica { border-left-color: #dc2626 !important; } .grupo-prioridad-alta { border-left-color: #ea580c !important; }
.grupo-prioridad-media { border-left-color: #2563eb !important; } .grupo-prioridad-baja { border-left-color: #9ca3af !important; }
.grupo-estado-nueva { border-left-color: #7c3aed !important; } .grupo-estado-triada { border-left-color: #4f46e5 !important; }
.grupo-estado-pendiente_aprobacion { border-left-color: #d97706 !important; } .grupo-estado-en_curso { border-left-color: #2563eb !important; }
.grupo-estado-en_revision { border-left-color: #0891b2 !important; } .grupo-estado-pendiente_cliente { border-left-color: #ea580c !important; }
.grupo-estado-resuelta { border-left-color: #059669 !important; } .grupo-estado-cerrada { border-left-color: #9ca3af !important; } .grupo-estado-rechazada { border-left-color: #dc2626 !important; }

/* Ficha de cliente: valores por defecto del alta (bloque a todo el ancho bajo las dos columnas) */
.config-defectos { grid-column: 1 / -1; border-top: 1px solid var(--borde); padding-top: .9rem; }
.config-defectos-campos { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: .75rem; }
.config-defectos-campos label { margin: 0; min-width: 200px; }
.config-defectos-nota { font-size: .82rem; flex: 1; min-width: 240px; padding-bottom: .5rem; }
/* Tabla dentro de una tarjeta con relleno */
.bloque-tabla { margin: 0 -1.25rem 1rem; border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); }

/* Canal de entrada (email, teléfono…) en el listado */
.inc-canal { display: inline-flex; align-items: center; color: var(--magenta); }
.inc-canal .icono { width: 15px; height: 15px; }

/* Estados añadidos: Desplegada en pruebas, Bloqueada, Aparcada */
.estado-en_pruebas { background: #ccfbf1; color: #115e59; }
.estado-bloqueada { background: #fecaca; color: #7f1d1d; }
.estado-aparcada { background: #f3e8ff; color: #581c87; }
.fila-estado-en_pruebas { border-left-color: #0d9488; }
.fila-estado-bloqueada { border-left-color: #b91c1c; }
.fila-estado-aparcada { border-left-color: #7e22ce; }
.barra-relleno.estado-en_pruebas { background: #0d9488; } .barra-relleno.estado-bloqueada { background: #b91c1c; } .barra-relleno.estado-aparcada { background: #7e22ce; }
.grupo-estado-en_pruebas { border-left-color: #0d9488 !important; } .grupo-estado-bloqueada { border-left-color: #b91c1c !important; } .grupo-estado-aparcada { border-left-color: #7e22ce !important; }

/* Alertas */
.inc-alerta { display: inline-flex; align-items: center; }
.inc-alerta .icono, .inc-alerta-texto .icono, .alerta-chip .icono { width: 15px; height: 15px; }
.alerta-alta { color: #b91c1c; } .alerta-media { color: #c2410c; } .alerta-baja { color: #a16207; }
.inc-alerta-texto { display: inline-flex; align-items: center; gap: .25rem; font-weight: 600; }
.alerta-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .6rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #fff7ed; border: 1px solid currentColor; }
.tarjeta-alertas { border-color: #fdba74; }
.tarjeta-alertas h2 { display: flex; align-items: center; gap: .4rem; color: #c2410c; }
.tarjeta-alertas h2 .icono { width: 20px; height: 20px; }

/* Categorías técnicas e hitos */
.etiqueta-cat { background: color-mix(in srgb, var(--cat) 14%, white); color: var(--cat); border: 1px solid color-mix(in srgb, var(--cat) 35%, white); }
.etiqueta-hito { background: #fff; color: #4b5563; border: 1px dashed #9ca3af; display: inline-flex; align-items: center; gap: .25rem; }
.etiqueta-hito .icono, td .lucide-flag { width: 13px; height: 13px; }
.punto-cat { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--cat); margin-right: .3rem; }
.categorias-campo { border: 1px solid var(--borde); border-radius: 6px; padding: .5rem .75rem; margin: 0 0 .75rem; display: flex; flex-direction: column; gap: .3rem; }
.categorias-campo legend { font-size: .88rem; font-weight: 500; padding: 0 .3rem; }
.categorias-campo label.check { font-size: .9rem; }
input[type=color] { width: 44px; height: 32px; padding: 2px; border: 1px solid #cbd2d9; border-radius: 6px; background: #fff; cursor: pointer; }

/* Listado: tipificación compacta (puntos de color + bandera) */
.inc-tipif { display: inline-flex; align-items: center; gap: .2rem; }
.inc-tipif .punto-cat { margin: 0; width: 9px; height: 9px; cursor: help; }
.inc-hito { display: inline-flex; color: #6b7280; cursor: help; }
.inc-hito .icono { width: 13px; height: 13px; }