/* ==========================================================================
   Rodolfo Auto Import — extras.css
   Añadidos del backend sobre el diseño original: piezas que el mockup no
   necesitaba porque no tenía datos reales (paginación del inventario, avatares
   de texto, chips de filtro activo).
   Se mantiene en un archivo aparte para no mezclarlo con el CSS del diseño.
   ========================================================================== */

/* ------------------------------------------------------------ paginación -- */
.pager {
  display: flex;
  justify-content: center;
  margin-top: 2.6rem;
}

.pagination {
  display: flex;
  align-items: center;
  gap: .4rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.pagination__link {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding: 0 .7rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--txt-2);
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  transition: border-color .2s, color .2s, background .2s;
}

.pagination__link:hover {
  border-color: var(--line-2);
  color: var(--txt);
  background: var(--bg-700);
}

.pagination__link.is-active {
  background: var(--grad-red);
  border-color: transparent;
  color: #fff;
}

.pagination__link.is-disabled {
  opacity: .35;
  pointer-events: none;
}

.pagination__gap {
  padding: 0 .3rem;
  color: var(--txt-3);
}

/* -------------------------------------------------------- chips activos -- */
.active-chips:empty { display: none; }

.chip-active {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .38rem .75rem;
  border: 1px solid var(--line-2);
  border-radius: 99px;
  background: var(--bg-700);
  color: var(--txt);
  font: inherit;
  font-size: .84rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .2s, background .2s;
}

.chip-active:hover {
  border-color: var(--red);
  background: var(--bg-600);
}

.chip-active i { font-size: .95em; opacity: .7; }

.chip-active--reset { color: var(--txt-2); }

/* --------------------------------------------- avatar de texto (fallback) -- */
.testimonial__avatar--txt {
  display: grid;
  place-items: center;
  background: var(--grad-red);
  color: #fff;
  font-weight: 700;
  font-size: .95rem;
  letter-spacing: .02em;
}

/* ------------------------------------------ estado de carga del listado -- */
[data-inv-grid] { transition: opacity .18s ease; }
[data-inv-grid].is-cargando { opacity: .45; pointer-events: none; }

/* --------------------------------------------- errores de formulario AJAX -- */
.field__error:empty { display: none; }

/* ------------------------------------------- hero sin inventario cargado -- */
.hero-slide--vacio {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: .7rem;
  color: var(--txt-3);
  text-align: center;
  padding: 1.5rem;
}

.hero-slide--vacio i { font-size: 2.6rem; opacity: .5; }
.hero-slide--vacio p { font-size: .9rem; }
.hero-slide--vacio::after { content: none; }

/* ------------------------------- descripción de la ficha del vehículo ----- */
/* pre-line en vez de nl2br: el texto sigue escapado por Blade y los saltos que
   escribió el vendedor en el panel se ven igual en la web. */
.detail-block__texto {
  color: var(--txt-2);
  white-space: pre-line;
}