/**
 * Estilos base que Drupal 7 cargaba en TODAS las páginas y que el tema da por
 * sentados.
 *
 * POR QUÉ EXISTE: `ces2020` nunca definió el espaciado de los formularios
 * porque no le hacía falta — lo ponía el núcleo de Drupal
 * (modules/system/system.theme.css y system.base.css), que se cargaba siempre y
 * antes que el tema. Al portar solo el tema, esas reglas quedaron fuera y todos
 * los formularios perdieron sus márgenes: en el modal de login el campo de
 * contraseña quedaba pegado al del RUT, y lo mismo en el registro.
 *
 * Se reproducen aquí SOLO las reglas del núcleo que afectan a la presentación.
 * Lo que era comportamiento (autocompletar, barras de progreso, textarea
 * redimensionable) no se copia: eso lo resuelve el JS del sitio.
 *
 * Va PRIMERO en la cascada, igual que en Drupal, donde el CSS del núcleo es del
 * grupo CSS_SYSTEM y siempre precede al del tema. Así el tema puede seguir
 * sobreescribiendo lo que ya sobreescribía.
 *
 * Origen: Drupal 7.x — modules/system/system.theme.css y system.base.css.
 */

/* ---------------------------------------------------------------- system.theme.css */

/* El espaciado de todo formulario del sitio sale de acá. */
.form-item,
.form-actions {
  margin-top: 1em;
  margin-bottom: 1em;
}

/* Dentro de una tabla los campos van pegados, sin el margen de arriba. */
tr.odd .form-item,
tr.even .form-item {
  margin-top: 0;
  margin-bottom: 0;
  white-space: nowrap;
}

.form-item .description {
  font-size: 0.85em;
}

label {
  display: block;
  font-weight: bold;
}

/* La etiqueta de un checkbox o radio va en la misma línea que el control. */
label.option {
  display: inline;
  font-weight: normal;
}

.form-checkboxes .form-item,
.form-radios .form-item {
  margin-top: 0.4em;
  margin-bottom: 0.4em;
}

.form-type-radio .description,
.form-type-checkbox .description {
  margin-left: 2.4em;
}

/* PROD: #f00 (system.theme.css) */
.marker,
.form-required {
  color: #f00;
}

.form-item input.error,
.form-item textarea.error,
.form-item select.error {
  border: 2px solid red;
}

/* Listas generadas con theme('item_list'). El enlace "Solicitar una nueva
   contraseña" del modal de login es una de ellas. */
.item-list .title {
  font-weight: bold;
}

.item-list ul {
  margin: 0 0 0.75em 0;
  padding: 0;
}

.item-list ul li {
  margin: 0 0 0.25em 1.5em;
  padding: 0;
}

/* ----------------------------------------------------------------- system.base.css */

/*
 * Oculta a la vista pero deja el texto disponible para el lector de pantalla.
 * El tema tiene su propia `.element-invisible` en header.css que solo pone
 * `height: 0` y NO oculta; esta es la del núcleo, que es la que el marcado
 * portado espera.
 */
.element-invisible {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  overflow: hidden;
  height: 1px;
}

.element-invisible.element-focusable:active,
.element-invisible.element-focusable:focus {
  position: static !important;
  clip: auto;
  overflow: visible;
  height: auto;
}

/* -------------------------------------------------------------- system.messages.css */

/*
 * Mensajes de Drupal (estado, advertencia y error), copia exacta del
 * system.messages.css que PROD carga en TODAS las paginas; solo cambia la ruta
 * de los tres iconos (webp, en assets/img/drupal/).
 *
 * POR QUE: sin estas reglas la imagen de fondo del aviso verde (header.css) se
 * repetia por toda la caja («Se han guardado los cambios.» salia con decenas de
 * checks), los avisos de «Comunicaciones» perdian el relleno de arriba y abajo,
 * y el margen superior de 4rem de generales.css los bajaba 58px mas. El tema
 * (header.css, perfil, registro) esta escrito encima de estas reglas.
 */
div.messages {
  background-position: 8px 8px; /* LTR */
  background-repeat: no-repeat;
  border: 1px solid;
  margin: 6px 0;
  padding: 10px 10px 10px 50px; /* LTR */
}

div.status {
  background-image: url(../img/drupal/message-24-ok.webp);
  border-color: #be7;
}
div.status,
.ok {
  color: #234600;
}
div.status,
table tr.ok {
  background-color: #f8fff0;
}

div.warning {
  background-image: url(../img/drupal/message-24-warning.webp);
  border-color: #ed5;
}
div.warning,
.warning {
  color: #840;
}
div.warning,
table tr.warning {
  background-color: #fffce5;
}

div.error {
  background-image: url(../img/drupal/message-24-error.webp);
  border-color: #ed541d;
}
div.error,
.error {
  color: #8c2e0b;
}
div.error,
table tr.error {
  background-color: #fef5f1;
}
div.error p.error {
  color: #333;
}

div.messages ul {
  margin: 0 0 0 1em; /* LTR */
  padding: 0;
}
div.messages ul li {
  list-style-image: none;
}