/* Carenado Bugs. Misma familia visual que el panel de soporte, con un acento propio para distinguirlos. */
:root {
  --fondo:#faf9f5; --tarjeta:#ffffff; --texto:#1f1e1d; --suave:#5f5e5a; --borde:#e3e1da;
  --acento:#1d4e5f; --acento-hover:#163d4a; --acento-suave:#e3eef1;
  --aviso:#fdecea; --aviso-texto:#8a1f17; --mensaje:#eaf3de; --mensaje-texto:#27500a;
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:var(--fondo); color:var(--texto); font:16px/1.6 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
h1 { font-size:22px; font-weight:500; margin:0 0 16px; line-height:1.3; }
h2 { font-size:17px; font-weight:500; margin:18px 0 8px; }
h2:first-child { margin-top:0; }
a { color:#185fa5; }
:focus-visible { outline:2px solid #2f7f95; outline-offset:2px; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.barra { display:flex; flex-wrap:wrap; align-items:center; padding:12px 24px; background:var(--tarjeta); border-bottom:1px solid var(--borde); border-top:4px solid var(--acento); }
.marca { color:var(--acento); text-decoration:none; font-weight:600; margin-right:28px; }
.menu { display:flex; flex-wrap:wrap; flex:1; }
.menu a { color:var(--suave); text-decoration:none; font-size:15px; padding:4px 0; margin-right:20px; }
.menu a:hover { color:var(--texto); }
.salir { display:flex; align-items:center; margin:0; }
.quien { color:var(--suave); font-size:14px; margin-right:14px; }
.enlace { background:none; border:0; color:#185fa5; cursor:pointer; font:inherit; padding:0; text-decoration:underline; }

.contenedor { max-width:1040px; margin:28px auto; padding:0 20px; }
.cabecera-pagina { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; }
.cabecera-pagina .boton-enlace { margin-bottom:12px; }
.migas { margin:0 0 12px; font-size:14px; }
.tarjeta { background:var(--tarjeta); border:1px solid var(--borde); border-radius:12px; padding:20px 24px; margin-bottom:16px; }
.angosta { max-width:400px; margin:56px auto; }
.medio { max-width:620px; }
.vacio { text-align:left; }
.ayuda { color:var(--suave); font-size:14px; margin:-6px 0 16px; }
.nota { font-size:13px; color:var(--suave); margin:6px 0; }
.mensaje { background:var(--mensaje); color:var(--mensaje-texto); padding:10px 14px; border-radius:8px; font-size:14px; margin:0 0 16px; }
.aviso { background:var(--aviso); color:var(--aviso-texto); padding:10px 12px; border-radius:8px; font-size:14px; }

label { display:block; font-size:14px; color:var(--suave); margin:14px 0 6px; }
input[type=text], input[type=email], select, textarea { width:100%; padding:9px 12px; font:inherit; border:1px solid #c9c6bc; border-radius:8px; background:#fff; color:var(--texto); }
textarea { font-size:15px; resize:vertical; }
.campo-codigo { font-size:26px; letter-spacing:6px; text-align:center; font-variant-numeric:tabular-nums; }
fieldset { border:0; padding:0; margin:16px 0 0; }
legend { font-size:14px; color:var(--suave); padding:0; margin-bottom:4px; }
.opcion { display:flex; align-items:center; margin:6px 0; color:var(--texto); font-size:15px; cursor:pointer; }
.opcion input { width:auto; margin:0 8px 0 0; }
.sin-margen { margin:0; }

button { font:inherit; }
button.primario { margin-top:20px; width:100%; padding:10px 14px; color:#fff; background:var(--acento); border:0; border-radius:8px; cursor:pointer; }
button.primario:hover { background:var(--acento-hover); }
button.ancho-auto, .ancho-auto { width:auto; }
button.secundario { margin-top:12px; padding:8px 14px; background:#fff; border:1px solid #b4b2a9; border-radius:8px; cursor:pointer; color:var(--texto); }
button.secundario:hover { border-color:var(--acento); }
.boton-enlace { padding:7px 12px; font-size:14px; border:1px solid #b4b2a9; background:#fff; border-radius:8px; text-decoration:none; color:var(--texto); }
.boton-enlace:hover { border-color:var(--acento); }
.en-linea { display:flex; flex-wrap:wrap; align-items:center; }
.en-linea > * { margin-right:10px; }
.en-linea input[type=text] { flex:1; min-width:200px; }
.en-linea button.primario, .en-linea button.secundario { margin-top:0; }
.fila-producto { padding:8px 0; border-bottom:1px solid var(--borde); }
.fila-producto:last-child { border-bottom:0; }

.filtros { display:flex; flex-wrap:wrap; margin:4px 0 16px; }
.filtros a { margin-right:6px; padding:6px 12px; border-radius:8px; text-decoration:none; color:var(--suave); font-size:14px; }
.filtros a:hover { background:var(--acento-suave); }
.filtros a.activo { background:var(--acento); color:#fff; }

.lista { display:flex; flex-direction:column; }
.caso { display:flex; align-items:center; margin-bottom:8px; padding:12px 16px; background:var(--tarjeta); border:1px solid var(--borde); border-radius:10px; text-decoration:none; color:var(--texto); }
.caso:hover { border-color:var(--acento); }
.caso-cuerpo { flex:1; min-width:0; display:flex; flex-direction:column; margin:0 12px; }
.caso-asunto { font-weight:500; overflow-wrap:anywhere; }
.caso-meta { display:flex; flex-wrap:wrap; font-size:13px; color:var(--suave); }
.caso-meta span { margin-right:14px; }
.caso-estado { display:flex; flex-wrap:wrap; justify-content:flex-end; }
.caso-estado .etq { margin-left:6px; }

/* Urgencia: el numero siempre se ve; el color solo lo refuerza. */
.urg { flex:none; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:8px; font-weight:600; font-size:15px; font-variant-numeric:tabular-nums; }
.urg.grande { width:40px; height:40px; font-size:18px; }
.urg-1 { background:#e8eef1; color:#36505c; }
.urg-2 { background:#dbeaf5; color:#0c447c; }
.urg-3 { background:#fdf0d2; color:#6b4a05; }
.urg-4 { background:#fbdcc4; color:#7a3205; }
.urg-5 { background:#f6c9c9; color:#7a1414; }

.etq { font-size:12.5px; padding:3px 10px; border-radius:6px; background:#f1efe8; color:var(--suave); white-space:nowrap; }
.etq.bug { background:var(--acento-suave); color:var(--acento); font-weight:600; }
.etq.res-bug_valido { background:#f6c9c9; color:#7a1414; }
.etq.res-sugerencia_ok { background:#eaf3de; color:#27500a; }
.etq.res-no_es_bug { background:#f1efe8; color:var(--suave); }
.etq.res-no_replicable { background:#fdf0d2; color:#6b4a05; }
.etq.res-mas_informacion { background:#dbeaf5; color:#0c447c; }

.encabezado-caso { display:flex; align-items:center; margin-bottom:16px; }
.encabezado-caso .urg { margin-right:14px; }
.encabezado-caso h1 { margin:0; overflow-wrap:anywhere; }
.columnas { display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:16px; align-items:start; }
.datos { display:grid; grid-template-columns:max-content 1fr; gap:6px 16px; margin:0 0 8px; font-size:15px; }
.datos dt { color:var(--suave); }
.datos dd { margin:0; overflow-wrap:anywhere; }
.texto-largo { white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 8px; font-size:15px; background:#f6f5f0; border-radius:8px; padding:10px 12px; max-height:60vh; overflow-y:auto; }
.rondas { margin:0; padding-left:20px; font-size:15px; }

.escala { display:flex; margin-top:6px; }
.escala-item { margin:0 8px 0 0; }
.escala-item input { position:absolute; opacity:0; width:1px; height:1px; }
.escala-item span { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid #b4b2a9; border-radius:8px; background:#fff; color:var(--texto); font-weight:600; cursor:pointer; }
.escala-item input:checked + span { background:var(--acento); border-color:var(--acento); color:#fff; }
.escala-item input:focus-visible + span { outline:2px solid #2f7f95; outline-offset:2px; }

.tabla-scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:14px; }
th, td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--borde); vertical-align:top; }
th { color:var(--suave); font-weight:400; white-space:nowrap; }

@media (max-width:560px) {
  .barra { padding:10px 14px; }
  .contenedor { padding:0 12px; }
  .caso { flex-wrap:wrap; }
  .caso-estado { justify-content:flex-start; width:100%; }
  .datos { grid-template-columns:1fr; gap:0; }
  .datos dd { margin-bottom:8px; }
}