/* =====================================================================
   Acceso privado y panel de gestión
   Complementa estilos.css; sólo se carga en /panel.
   ===================================================================== */

/* --------------------------------------------------------------- Acceso */
.acceso {
  min-height: 100vh; display: grid; place-items: center; padding: 2rem 1.25rem;
  background:
    radial-gradient(900px 400px at 15% 0%, rgba(0, 186, 180, .16), transparent 60%),
    radial-gradient(700px 380px at 90% 10%, rgba(110, 33, 119, .13), transparent 62%),
    var(--fondo-gris);
}
.acceso__caja {
  width: min(100%, 430px); background: #fff; border: 1px solid var(--linea);
  border-radius: var(--radio); padding: 2rem; box-shadow: var(--sombra-alta);
}
.marca--acceso { margin-bottom: 1.75rem; }
.acceso__caja h1 { font-size: 1.6rem; margin-bottom: .5rem; }
.acceso__nota { color: var(--tinta-suave); font-size: .92rem; }
.acceso__reenvio { text-align: center; margin-top: .75rem; }
.acceso__volver { text-align: center; margin: 1.25rem 0 0; font-size: .88rem; }

.campo--codigo {
  font-family: var(--fuente-titulo); font-size: 1.75rem; font-weight: 700;
  letter-spacing: .35em; text-align: center; padding-block: .75rem;
}
.campo--codigo::placeholder { letter-spacing: .35em; color: #c8d2dd; }

/* ---------------------------------------------------------- Barra panel */
.panel-barra {
  position: sticky; top: 0; z-index: 40; background: var(--fondo-oscuro); color: #fff;
}
.panel-barra__fila {
  display: flex; align-items: center; gap: 1.5rem; min-height: 66px; flex-wrap: wrap;
}
.marca--panel { color: #fff; }
.marca--panel .marca__texto small { color: rgba(255, 255, 255, .6); }

.panel-nav { display: flex; gap: 1.15rem; margin-left: auto; flex-wrap: wrap; }
.panel-nav a { color: rgba(255, 255, 255, .82); font-size: .92rem; font-weight: 500; padding: .35rem 0; }
.panel-nav a:hover { color: #fff; text-decoration: none; }
.panel-nav a.activo { color: #fff; box-shadow: inset 0 -2px 0 var(--teal); }

.panel-barra__usuario { display: flex; align-items: center; gap: .75rem; font-size: .88rem; }
.panel-barra__usuario > span { color: rgba(255, 255, 255, .78); }
.panel-barra__sitio { color: rgba(255, 255, 255, .78); font-size: .85rem; }
.panel-barra__usuario .boton--texto { color: rgba(255, 255, 255, .78); }
.panel-barra__usuario .boton--texto:hover { color: #fff; }

.panel { padding: 2rem 0 4rem; min-height: 60vh; }
.panel__bajada { color: var(--tinta-suave); max-width: 70ch; }
.panel-pie { background: var(--fondo-gris); border-top: 1px solid var(--linea); padding: 1.25rem 0; }
.panel-pie p { margin: 0; font-size: .82rem; color: var(--tinta-suave); }

.panel-titulo {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 1.5rem; flex-wrap: wrap;
}
.panel-seccion { margin-top: 2.5rem; }
.panel-seccion__cabecera {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem;
}
.panel-seccion__cabecera h2 { margin: 0; font-size: 1.2rem; }
.panel-vacio {
  background: var(--fondo-gris); border: 1px dashed var(--linea); border-radius: var(--radio);
  padding: 2rem; text-align: center; color: var(--tinta-suave);
}
.panel-nota { font-size: .9rem; color: var(--tinta-suave); }
.panel-nota--alerta { color: #a3302a; }
.migas--panel { color: var(--tinta-suave); margin-bottom: 1rem; }
.migas--panel a { color: var(--teal-oscuro); }

/* ---------------------------------------------------------------- Chips */
/* En el sitio público la etiqueta sólida va sobre la cabecera oscura; aquí
   necesita el color del pilar como fondo para leerse sobre blanco. */
.panel .etiqueta-pilar--solida {
  background: var(--pilar, var(--teal)); color: #fff; position: static;
  display: inline-block; margin: 0;
}

.estado-chip {
  display: inline-block; font-size: .74rem; font-weight: 600; letter-spacing: .03em;
  padding: .18rem .6rem; border-radius: 999px;
}
.estado-chip::first-letter { text-transform: uppercase; }
.estado-chip--publicada { background: rgba(0, 186, 180, .16); color: #00706c; }
.estado-chip--pendiente { background: rgba(255, 183, 27, .22); color: #8a5d00; }
.estado-chip--rechazada { background: rgba(255, 68, 56, .14); color: #a3302a; }

.perfil-chip {
  display: inline-block; font-size: .74rem; font-weight: 600; padding: .18rem .6rem;
  border-radius: 999px;
}
.perfil-chip--admin { background: rgba(110, 33, 119, .14); color: var(--morado); }
.perfil-chip--solucion {
  background: var(--fondo-gris); color: var(--tinta-suave); border: 1px solid var(--linea);
}

/* ------------------------------------------------------------- Revisión */
.revision { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.revision__item {
  display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 1.25rem;
  align-items: center; background: #fff; border: 1px solid var(--linea);
  border-left: 4px solid var(--amarillo); border-radius: var(--radio); padding: 1rem 1.25rem;
}
.revision__logo {
  width: 76px; height: 56px; display: grid; place-items: center;
  background: var(--fondo-gris); border-radius: var(--radio-s); overflow: hidden;
}
.revision__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.revision__logo span { font-family: var(--fuente-titulo); font-size: 1.5rem; color: var(--tinta-suave); }
.revision__datos h3 { margin: 0 0 .2rem; font-size: 1.05rem; }
.revision__meta {
  display: flex; align-items: center; gap: .5rem; margin: 0 0 .25rem;
  font-size: .85rem; color: var(--tinta-suave);
}
.revision__titular { margin: 0 0 .25rem; font-size: .92rem; }
.revision__contacto { margin: 0; font-size: .82rem; color: var(--tinta-suave); }
.revision__acciones { display: flex; gap: .5rem; align-items: center; }

.revision-panel {
  background: var(--fondo-gris); border: 1px solid var(--linea); border-radius: var(--radio);
  padding: 1.25rem; margin-bottom: 1.75rem;
}
.revision-panel h2 {
  font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-suave);
}
.revision-panel p { font-size: .92rem; }
.revision-panel__acciones { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.revision-panel__rechazo { display: flex; gap: .5rem; flex: 1; min-width: 280px; }

.ficha-resumen {
  display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 1.5rem;
  align-items: center; background: #fff; border: 1px solid var(--linea);
  border-radius: var(--radio); padding: 1.5rem; box-shadow: var(--sombra);
}
.ficha-resumen__logo { display: grid; place-items: center; }
.ficha-resumen__logo img { max-height: 70px; object-fit: contain; }
.ficha-resumen__datos h2 { margin: .35rem 0 .3rem; }
.ficha-resumen__acciones { display: grid; gap: .5rem; }

.panel-atajos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.panel-atajos a {
  display: block; padding: 1.1rem; background: #fff; border: 1px solid var(--linea);
  border-radius: var(--radio); color: var(--tinta);
}
.panel-atajos a:hover { border-color: var(--teal); text-decoration: none; }
.panel-atajos strong { display: block; margin-bottom: .2rem; }
.panel-atajos span { font-size: .85rem; color: var(--tinta-suave); }

/* --------------------------------------------------------------- Tablas */
.pestanas {
  display: flex; gap: .3rem; flex-wrap: wrap; border-bottom: 1px solid var(--linea);
  margin: 1.5rem 0 1rem;
}
.pestanas a {
  padding: .55rem .9rem; color: var(--tinta-suave); font-size: .92rem; font-weight: 500;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.pestanas a:hover { color: var(--tinta); text-decoration: none; }
.pestanas a.activo { color: var(--teal-oscuro); border-bottom-color: var(--teal); font-weight: 600; }
.pestanas span {
  display: inline-block; margin-left: .3rem; font-size: .78rem;
  background: var(--fondo-gris); border-radius: 999px; padding: .05rem .45rem;
}

.buscador--panel { max-width: 560px; }
.buscador--panel input[type="search"] { padding-left: 1rem; }

.tabla-envoltura {
  overflow-x: auto; border: 1px solid var(--linea); border-radius: var(--radio); background: #fff;
}
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabla th {
  text-align: left; font-family: var(--fuente-titulo); font-size: .74rem;
  text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-suave);
  padding: .75rem 1rem; border-bottom: 1px solid var(--linea); white-space: nowrap;
}
.tabla td { padding: .75rem 1rem; border-bottom: 1px solid var(--linea); vertical-align: middle; }
.tabla tr:last-child td { border-bottom: 0; }
.tabla__sub { display: block; font-size: .8rem; color: var(--tinta-suave); }
.tabla__fecha { white-space: nowrap; color: var(--tinta-suave); font-size: .85rem; }
.tabla__acciones {
  display: flex; gap: .35rem; align-items: center; flex-wrap: wrap; justify-content: flex-end;
}
.tabla__acciones form { display: inline; }

.celda-solucion { display: flex; align-items: center; gap: .75rem; }
.celda-solucion__logo {
  width: 46px; height: 34px; flex: none; display: grid; place-items: center;
  background: var(--fondo-gris); border-radius: 6px; overflow: hidden;
}
.celda-solucion__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.celda-solucion span { display: block; font-size: .8rem; color: var(--tinta-suave); }

/* ------------------------------------------------------------- Mensajes */
.mensajes { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1rem; }
.mensaje {
  background: #fff; border: 1px solid var(--linea); border-left: 4px solid var(--teal);
  border-radius: var(--radio); padding: 1.25rem;
}
.mensaje--leido { border-left-color: var(--linea); opacity: .78; }
.mensaje__cabecera { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.mensaje__cabecera h2 { font-size: 1.05rem; margin-bottom: .3rem; }
.mensaje__meta { margin: 0 0 .2rem; font-size: .84rem; color: var(--tinta-suave); }
.mensaje__cuerpo { white-space: pre-wrap; margin: .9rem 0; }

/* -------------------------------------------------------- Otros del panel */
.radio--bloque {
  align-items: flex-start; gap: .7rem; padding: .9rem 1rem; border: 1px solid var(--linea);
  border-radius: var(--radio-s); background: #fff;
}
.radio--bloque:has(input:checked) {
  border-color: var(--teal); box-shadow: 0 0 0 3px rgba(0, 186, 180, .14);
}
.radio--bloque strong { display: block; font-weight: 600; }
.radio--bloque span { font-size: .85rem; color: var(--tinta-suave); }
.perfil-opciones { gap: .6rem; }

.vista-previa {
  margin-bottom: .5rem; border: 1px solid var(--linea); border-radius: var(--radio-s);
  overflow: hidden; background: var(--fondo-gris); max-width: 260px;
}
.vista-previa img { width: 100%; height: auto; }
.vista-previa--logo { padding: .5rem; }
.vista-previa--logo img { max-height: 70px; width: auto; margin-inline: auto; }

.datos--panel dt { margin-top: 1rem; }
.datos--panel dd { font-size: 1rem; }

.formulario__acciones--fila { flex-direction: row; align-items: center; gap: 1rem; }

.boton--chico { padding: .4rem .85rem; font-size: .82rem; }
.boton--peligro { background: var(--rojo); border-color: var(--rojo); color: #fff; }
.boton--peligro:hover { background: #e23a2f; border-color: #e23a2f; }
.boton--texto-peligro { color: var(--rojo); }

.zona-peligro {
  margin-top: 3rem; border: 1px solid rgba(255, 68, 56, .35); border-radius: var(--radio);
  padding: 1.25rem; background: rgba(255, 68, 56, .04);
}
.zona-peligro h2 { font-size: 1rem; color: #a3302a; }
.zona-peligro p { font-size: .9rem; color: var(--tinta-suave); }

@media (max-width: 860px) {
  .revision__item { grid-template-columns: 1fr; }
  .revision__acciones { justify-content: flex-start; }
  .ficha-resumen { grid-template-columns: 1fr; }
  .panel-barra__fila { min-height: 0; padding-block: .75rem; }
  .panel-nav { order: 3; width: 100%; margin-left: 0; }
  .panel-barra__usuario { margin-left: auto; }
}