/* Añadidos propios de este port. Se carga después de style.css y antes del CSS
   por ruta. Los archivos del tema (style.css, bootstrap.css, blog.css,
   productos*.css, …) son byte-idénticos a los de Drupal y no se tocan: todo lo
   que haya que sumar va aquí. */

/* ---------------------------------------------------------------------------
   1. Reglas de Drupal core que el tema da por hechas
   --------------------------------------------------------------------------- */

/* system.base.css — la usan los <span class="rdf-meta element-hidden">. */
.element-hidden {
  display: none;
}

.form-textarea-wrapper textarea {
  display: block;
  margin: 0;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.container-inline div,
.container-inline label {
  display: inline;
}

.container-inline .fieldset-wrapper {
  display: block;
}

.nowrap {
  white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   2. Título del teaser de producto
   En Drupal el <h2> de /productos/<marca> es texto plano; aquí se enlaza a la
   ficha del modelo (que en Drupal queda inalcanzable). El color lo tiene que
   heredar del h2 (#27255F) y no del <a> global (#C2842B).
   --------------------------------------------------------------------------- */

.node-producto h2 a {
  color: inherit;
}

.node-producto h2 a:hover,
.node-producto h2 a:focus {
  color: #c2842b;
}

/* ---------------------------------------------------------------------------
   3. Scrollbar con los colores del tema
   Riel #F5F5F5 (el gris del tema), pulgar #27255F (azul Persis) y #C2842B
   (dorado) al pasar el cursor.

   WebKit/Blink (Chrome, Edge, Safari, Opera) usan los pseudoelementos
   ::-webkit-scrollbar. Firefox usa las propiedades estándar, dentro de un
   @supports que solo se cumple donde NO existen los pseudoelementos: Chrome
   121+ soporta las dos y `scrollbar-color` gana sobre ::-webkit-scrollbar, lo
   que nos dejaría sin el color de hover.
   --------------------------------------------------------------------------- */

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  background-color: #27255f;
  border: 3px solid #f5f5f5;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #c2842b;
}

::-webkit-scrollbar-thumb:active {
  background-color: #27255f;
}

/* Esquina donde se cruzan las dos barras. */
::-webkit-scrollbar-corner {
  background-color: #f5f5f5;
}

@supports not selector(::-webkit-scrollbar) {
  html {
    scrollbar-width: auto;
    scrollbar-color: #27255f #f5f5f5;
  }
}
