/* MOVA · Consentimiento de cookies */

/* IMPORTANTE: estos bloques usan display:grid/flex, que ANULA el atributo
   [hidden] (una hoja de autor gana a la del navegador). Sin esta regla el
   modal queda a pantalla completa con opacity:0 y se traga todos los clics
   de la página: nada es pulsable. */
.mova-consent[hidden],
.mova-consent-modal[hidden] { display: none !important; }
.mova-consent {
  position: fixed;
  left: 16px; right: 16px; bottom: 16px;
  z-index: 9990;
  max-width: 560px;
  margin-inline: auto;
  background: var(--paper, #fff);
  color: var(--text, #2C1810);
  border: 1px solid rgba(44,24,16,.12);
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(44,24,16,.20);
  padding: 22px;
  font-family: var(--font, system-ui, sans-serif);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .3s ease, transform .3s ease;
}
.mova-consent.is-open { opacity: 1; transform: translateY(0); }
.mova-consent h2 {
  margin: 0 0 8px;
  font-size: 1.05rem;
  font-weight: 700;
  font-family: var(--font, system-ui, sans-serif);
}
.mova-consent p { margin: 0 0 14px; font-size: .875rem; line-height: 1.55; color: var(--muted, rgba(44,24,16,.72)); }
.mova-consent a { color: var(--green-ink, #856640); font-weight: 600; text-decoration: underline; }

.mova-consent-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mova-consent-actions button {
  flex: 1 1 auto;
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 999px;
  border: 1px solid rgba(44,24,16,.18);
  background: #fff;
  color: var(--text, #2C1810);
  font: inherit;
  font-size: .875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s, border-color .2s;
}
.mova-consent-actions button:hover { background: #F5F0E6; }
.mova-consent-actions .primary {
  background: var(--green-ink, #856640);
  border-color: var(--green-ink, #856640);
  color: #fff;
}
.mova-consent-actions .primary:hover { background: #7A5C39; border-color: #7A5C39; }
.mova-consent-actions .link {
  flex: 1 1 100%;
  border: none;
  background: none;
  text-decoration: underline;
  color: var(--muted, rgba(44,24,16,.72));
  font-weight: 500;
}
.mova-consent-actions .link:hover { background: none; color: var(--text, #2C1810); }

/* ── Modal de configuración ── */
.mova-consent-modal {
  position: fixed; inset: 0; z-index: 9995;
  display: grid; place-items: center;
  padding: 20px;
  background: rgba(44,24,16,.55);
  opacity: 0;
  transition: opacity .25s ease;
  font-family: var(--font, system-ui, sans-serif);
}
.mova-consent-modal.is-open { opacity: 1; }
.mova-consent-modal .box {
  width: min(560px, 100%);
  max-height: min(86vh, 720px);
  overflow-y: auto;
  background: var(--paper, #fff);
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 30px 80px rgba(44,24,16,.30);
}
.mova-consent-modal h2 { margin: 0 0 6px; font-size: 1.25rem; font-weight: 700; }
.mova-consent-modal > .box > p { font-size: .875rem; color: var(--muted, rgba(44,24,16,.72)); margin: 0 0 20px; line-height: 1.55; }

.mova-cat {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 16px 0;
  border-top: 1px solid rgba(44,24,16,.10);
}
.mova-cat input[type="checkbox"] { width: 20px; height: 20px; margin-top: 3px; flex: 0 0 auto; accent-color: var(--green-ink, #856640); cursor: pointer; }
.mova-cat input[disabled] { cursor: not-allowed; opacity: .55; }
.mova-cat-body { flex: 1; }
.mova-cat strong { display: block; font-size: .9375rem; margin-bottom: 3px; }
.mova-cat span { display: block; font-size: .8125rem; color: var(--muted, rgba(44,24,16,.72)); line-height: 1.5; }
.mova-cat-tag { font-size: .6875rem; text-transform: uppercase; letter-spacing: .08em; color: var(--green-ink, #856640); font-weight: 700; }

.mova-consent-modal .foot { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.mova-consent-modal .foot button {
  flex: 1 1 auto; min-height: 44px; padding: 11px 18px;
  border-radius: 999px; border: 1px solid rgba(44,24,16,.18);
  background: #fff; font: inherit; font-size: .875rem; font-weight: 600; cursor: pointer;
}
.mova-consent-modal .foot .primary { background: var(--green-ink, #856640); border-color: var(--green-ink, #856640); color: #fff; }

/* ── Tabla de cookies ── */
.mova-cookie-table { width: 100%; border-collapse: collapse; font-size: .8125rem; margin: 18px 0; }
.mova-cookie-table th, .mova-cookie-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid rgba(44,24,16,.10); vertical-align: top; }
.mova-cookie-table th { font-weight: 700; background: rgba(184,149,106,.10); }
.mova-cookie-table-wrap { overflow-x: auto; }

/* ── Placeholder de Google Maps ── */
/* El iframe no ocupa sitio hasta que hay consentimiento. Antes seguía en el
   flujo con su min-height, así que bajo el placeholder quedaban ~400 px en
   blanco. Al aceptar, el placeholder desaparece y el iframe toma su altura. */
[data-map-wrap] { position: relative; height: 100%; }

/* El iframe solo tiene src cuando hay consentimiento (lo pone consent.js).
   Sin src no debe ocupar: antes seguía en el flujo con su min-height y
   dejaba ~400 px en blanco bajo el placeholder. El selector :not([src])
   deja de aplicar solo en cuanto se acepta, sin necesidad de clases.
   Lleva dos selectores de atributo a propósito, para ganar en especificidad
   a .map-panel iframe y .contact-map-block iframe, que fijan display:block. */
[data-map-wrap] > iframe:not([src]) { display: none; }

/* El placeholder llena el hueco que le da la rejilla, en vez de dejar
   blanco el resto del panel. */
[data-map-wrap] > .map-placeholder { height: 100%; }
.map-placeholder {
  display: grid; place-items: center; text-align: center;
  gap: 14px; padding: 40px 24px;
  background: #EDE7DC;
  border-radius: var(--radius, 20px);
  min-height: 280px;
  font-family: var(--font, system-ui, sans-serif);
}
[data-map-wrap].map-loaded .map-placeholder { display: none; }
.map-placeholder p { margin: 0; font-size: .875rem; color: var(--muted, rgba(44,24,16,.72)); max-width: 42ch; line-height: 1.55; }
.map-placeholder button {
  min-height: 44px; padding: 11px 22px; border-radius: 999px;
  border: none; background: var(--green-ink, #856640); color: #fff;
  font: inherit; font-size: .875rem; font-weight: 600; cursor: pointer;
}
.map-placeholder button:hover { background: #7A5C39; }
.map-placeholder .map-alt { font-size: .8125rem; }
.map-placeholder .map-alt a { color: var(--green-ink, #856640); font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .mova-consent, .mova-consent-modal { transition: none; }
}

/* ── Avisos dentro de la política de cookies ── */
.cookie-note {
  font-size: .875rem;
  padding: 12px 16px;
  background: rgba(184,149,106,.10);
  border-radius: 10px;
}
.cookie-warning {
  margin: 20px 0;
  padding: 16px 18px;
  background: #FDF1E4;
  border-left: 3px solid #B25E00;
  border-radius: 0 10px 10px 0;
}
.cookie-warning p { margin: 0; font-size: .875rem; line-height: 1.6; }
.mova-cookie-table code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .8125rem;
  background: rgba(44,24,16,.06);
  padding: .1em .4em;
  border-radius: 4px;
  word-break: break-word;
}