/*
Theme Name: ContOpe Design — Santa Luisa de Palpi
Template: contope-canvas
Description: Tema hijo del motor ContOpe Canvas para el proyecto Santa Luisa de Palpi. Aporta paleta, tipografía e identidad del proyecto sobre las reglas estructurales del padre.
Version: 0.2.7
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: cod-santa-luisa
*/

/*
 * La paleta y las tipografías del proyecto viven acá y en theme.json, no en el
 * CSS de cada página. WordPress emite sus propias reglas globales sobre body y
 * sobre h1–h6 a partir de theme.json; si esas reglas apuntan a otra familia, le
 * ganan al lienzo por especificidad y el sitio se ve con dos identidades según
 * la página. Por eso el orden correcto es: el tema declara la identidad, y el
 * lienzo la extiende. Nunca al revés.
 *
 * Las familias reales del proyecto son dos: Montserrat y Birthstone. Se sirven
 * como @font-face propias, sin pedirle nada a Google.
 *
 * Hubo una tercera, Lora, declarada como «tipografía de citas». Nunca se usó:
 * era un resabio del primer sitio de prueba de Open CoDesign. Se quitó el
 * 2026-09-16 porque una regla de la página legal la había tomado por estar
 * disponible, y el texto de entrada salía con serifas en un sitio que no las
 * usa. Una tipografía declarada y sin uso no es neutra: es una invitación a
 * usarla por accidente.
 */

:root {
  /* Dorado */
  --slp-dorado-50: #f9f6e8;
  --slp-dorado-100: #f1eacb;
  --slp-dorado-300: #eed495;
  --slp-dorado-500: #ddb441;
  --slp-dorado-600: #cda23c;

  /* Oliva */
  --slp-oliva-50: #f5f9f6;
  --slp-oliva-100: #ebf0e3;
  --slp-oliva-300: #babba4;
  --slp-oliva-500: #8e9075;
  --slp-oliva-700: #70745e;

  /* Tierra */
  --slp-tierra-50: #f6f6f3;
  --slp-tierra-100: #ecebe8;
  --slp-tierra-300: #cdc8c6;
  --slp-tierra-500: #968b8a;
  --slp-tierra-700: #6e5f5f;

  /* Roles, para no repetir el valor crudo en el resto de las reglas. */
  --slp-accent: var(--slp-dorado-600);
  --slp-accent-deep: #b58c2c;
  --slp-green: var(--slp-oliva-700);
  --slp-bg: var(--slp-tierra-50);
  --slp-surface: #ffffff;
  --slp-text: var(--slp-oliva-700);
  --slp-muted: var(--slp-tierra-500);
  --slp-border: var(--slp-tierra-300);

  /* Alimenta los ganchos estructurales del motor Canvas con la paleta del proyecto. */
  --cod-border-color: var(--slp-border);

  /* Los mismos nombres que usa el lienzo, para que una pieza pegada en una
     página suelta herede la identidad aunque no traiga su propio :root. */
  --font-hero: 'Birthstone', 'Segoe Script', cursive;
  --font-body: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --max-width: 1180px;

  /* Nombres cortos, para que los documentos del lienzo tomen la paleta de
     ACÁ y no declaren la suya. Hasta el 2026-09-16 cada documento cargaba su
     propia copia con los mismos valores y otros nombres: la hoja central
     existía y no la usaba nadie. Un mismo color definido en seis lugares se
     desincroniza solo. Las tipografías y el ancho ya estaban acá arriba. */
  --dorado-50: var(--slp-dorado-50);
  --dorado-100: var(--slp-dorado-100);
  --dorado-300: var(--slp-dorado-300);
  --dorado-500: var(--slp-dorado-500);
  --dorado-600: var(--slp-dorado-600);
  --oliva-50: var(--slp-oliva-50);
  --oliva-100: var(--slp-oliva-100);
  --oliva-300: var(--slp-oliva-300);
  --oliva-500: var(--slp-oliva-500);
  --oliva-700: var(--slp-oliva-700);
  --tierra-50: var(--slp-tierra-50);
  --tierra-100: var(--slp-tierra-100);
  --tierra-300: var(--slp-tierra-300);
  --tierra-500: var(--slp-tierra-500);
  --tierra-700: var(--slp-tierra-700);
}

body {
  background: var(--slp-bg);
  color: var(--slp-text);
  font-family: var(--font-body);
}

/* Los títulos del proyecto son Montserrat en versales, no una serif. La regla
   global de WordPress ya apunta a la familia correcta desde theme.json; esto
   solo fija el peso y el interlineado para los encabezados que no pasan por el
   lienzo (páginas de sistema, resultados de búsqueda, 404). */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-body);
  font-weight: 700;
  line-height: 1.05;
  color: var(--slp-text);
}

.cod-site-header .wp-block-site-title {
  font-family: var(--font-body);
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.cod-main .wp-block-image img,
.cod-main .wp-block-video video { border-radius: 16px; }

.cod-main .wp-block-button__link {
  font-family: var(--font-body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cod-main .wp-block-button__link:hover { background: var(--slp-accent-deep); }

.cod-main .wp-block-details summary {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 1rem;
}

.cod-main a:where(:not(.wp-element-button)) {
  color: var(--slp-text);
  text-decoration-color: var(--slp-accent);
}

/* ---------------------------------------------------------------------------
   Banner de cookies (CookieAdmin 1.2.3)

   El banner que trae el plugin ocupaba el 42,7% de la pantalla en teléfono
   —400 px de 844— y 315 px de alto en escritorio. Un aviso que tapa media
   pantalla no se lee: se cierra. Y ese fue el motivo real por el que el banner
   se desactivó en septiembre: tapaba el sitio justo cuando alguien llegaba por
   un QR, que es el único momento en que se tiene la atención de una persona
   parada frente a un letrero.

   Acá se reduce tipografía y espacios hasta dejarlo bajo el 15% de la pantalla
   en ambos tamaños, y se oculta el «Powered by CookieAdmin», cuyo logotipo de
   color no pertenece a la paleta del proyecto.

   Los COLORES no se tocan desde acá a propósito: el plugin los emite como
   estilos en línea desde su propia pantalla de ajustes, así que se configuran
   ahí. Pelearles con !important sería esconder dónde se deciden.

   Los tres botones quedan del mismo ancho y peso. Un banner donde «Aceptar»
   es grande y «Rechazar» es chico no recoge un consentimiento válido.
   --------------------------------------------------------------------------- */

.cookieadmin_law_container {
  width: min(400px, calc(100% - 32px));
  font-family: var(--font-body);
}

.cookieadmin_consent_inside {
  padding: 13px 15px 12px;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.14);
}

#cookieadmin_notice_title {
  font-size: 12.5px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding-left: 0;
}

.cookieadmin_notice_con {
  font-size: 11px;
  line-height: 1.42;
  padding: 0;
  margin-top: 5px;
}

#cookieadmin_notice {
  margin: 0;
  font-size: 11px;
  line-height: 1.42;
}

/* En una sola fila y del mismo ancho: los tres pesan igual. */
.cookieadmin_consent_btns {
  gap: 6px;
  margin-top: 10px;
  flex-wrap: nowrap;
  justify-content: stretch;
}

.cookieadmin_consent_inside .cookieadmin_btn {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  padding: 7px 4px;
  font-family: var(--font-body);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 999px;
  white-space: nowrap;
}

/* El logotipo del proveedor no es parte de la identidad del proyecto.
   La licencia Pro además trae una casilla «Hide Powered by Link» en los
   ajustes del plugin; esto lo resuelve aunque esa casilla no se marque. */
.cookieadmin_law_container .cookieadmin-poweredby {
  display: none;
}

/* El panel de «Configurar», con el mismo criterio que el banner:
   tipografía y espacios reducidos, y sin el logotipo del proveedor.
   La regla anterior sólo alcanzaba al banner; el panel es otro contenedor y
   traía su propio «Powered by». */
.cookieadmin_cookie_modal {
  font-family: var(--font-body);
  max-height: 72vh;
}

.cookieadmin_cookie_modal .cookieadmin-poweredby {
  display: none;
}

#cookieadmin_preference_title {
  font-size: 15px;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

.cookieadmin_details_wrapper {
  padding: 0 14px;
  font-size: 11.5px;
  line-height: 1.45;
}

.cookieadmin_details_wrapper p,
.cookieadmin_details_wrapper li,
.cookieadmin_details_wrapper div {
  font-size: 11.5px;
  line-height: 1.45;
}

.cookieadmin_modal_footer {
  padding: 10px 14px;
}

.cookieadmin_modal_footer .cookieadmin_btn,
.cookieadmin_modal_footer_links .cookieadmin_btn {
  font-family: var(--font-body);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 7px 14px;
  border-radius: 999px;
}

/* El borde de los botones es lo único de color que el plugin NO expone en sus
   ajustes: lo trae fijo en gris. Por eso se corrige acá y no allá. El resto de
   los colores —fondos, textos, enlaces, interruptores— se configuran en la
   pantalla de CookieAdmin, que es donde corresponde. */
.cookieadmin_btn {
  border-color: var(--slp-tierra-300);
}

.cookieadmin_btn:hover {
  border-color: var(--slp-dorado-600);
}

/* El plugin trae tres azules escritos a mano en su hoja, sin ajuste que los
   gobierne: el «Siempre activas», el texto por defecto de los botones y el
   interruptor encendido. Son los únicos colores que hay que corregir desde
   acá; todo lo demás sale de su pantalla de ajustes. */
.cookieadmin_act {
  color: var(--slp-dorado-600);
  font-weight: 600;
}

button.cookieadmin_btn {
  color: var(--slp-oliva-700);
}

input:checked + .cookieadmin_slider {
  background-color: var(--slp-dorado-600);
}