/* Estilos para privacidad y cookies - coherentes con styles.css de la landing */
/* Reutilizamos variables definidas en css/styles.css (paleta oro/marrón) */

html, body { height: 100%; }
body{
  margin:0;
  padding: 40px 16px;
  /* Fondo y tipografía heredan de styles.css; solo centramos el layout */
  display:flex; align-items:flex-start; justify-content:center;
}

.container{
  max-width: 1000px;
  width: 100%;
  background: var(--warm-white);
  border: 1px solid rgba(212, 145, 10, 0.25);
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 2.2rem;
}

/* Make the header span the full width of the card (bleed to the edges)
   without changing the container padding. This only affects the privacy page. */
.container > .header {
  margin-left: -2.2rem;
  margin-right: -2.2rem;
  /* pull header up to cover container top padding and hide the white strip */
  margin-top: -2.2rem;
  padding-left: 2.2rem !important;
  padding-right: 2.2rem !important;
  /* increase vertical space so header looks taller and covers the top */
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
  border-top-left-radius: var(--border-radius-lg);
  border-top-right-radius: var(--border-radius-lg);
}

/* Ensure the privacy header logo ignores inline width and uses the global size */
.container > .header .site-logo { width: 96px !important; height: auto !important; }
@media (max-width: 1024px){
  .container > .header .site-logo { width: 68px !important; }
}

/* Títulos y textos alineados con la landing */
h1{
  font-family: Georgia, 'Times New Roman', Times, serif;
  color: var(--deep-brown);
  font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  margin: 0 0 0.5rem 0;
}
h2{
  color: var(--deep-brown);
  font-size: clamp(1.2rem, 2.2vw, 1.35rem);
  margin: 1.2rem 0 0.4rem;
}
h3{ color: var(--deep-brown); }
p{ color: var(--text-medium); line-height: 1.7; }

/* Tablas con estilo suave y bordes redondeados */
table{ width:100%; border-collapse: separate; border-spacing: 0 10px; margin: 1rem 0 1.2rem; }
th, td{ padding: 12px 14px; text-align:left; }
th{ color: var(--deep-brown); font-weight: 700; }
tr td{
  background: linear-gradient(135deg, var(--rich-cream), #f0e2c7);
  border: 1px solid rgba(212,145,10,0.25);
  border-radius: 10px;
}

hr{ border: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(212,145,10,0.4), transparent); margin: 1.5rem 0; }

/* Links con color dorado */
a{ color: var(--primary-gold); text-decoration: underline; }

/* Cookie banner: softer, neutral appearance aligned with site palette */
#cookie-banner{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 22px;
  width: min(980px, calc(100% - 28px));
  background: var(--warm-white);
  color: var(--text-dark);
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(212,145,10,0.12);
  box-shadow: var(--shadow-warm);
  display: none;
  gap: 12px;
  align-items: center;
  z-index: 9999;
}
#cookie-banner p{ margin:0; flex:1; font-size: 0.95rem; }
#cookie-banner div{ display:flex; gap:8px; }
#cookie-banner button{
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  cursor: pointer;
  font-weight: 700;
  background: transparent;
  color: var(--deep-brown);
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
#cookie-banner button:hover{ box-shadow: none; }
#cookie-banner button:focus-visible{ outline: 3px solid rgba(212,145,10,0.14); outline-offset: 2px; }

/* Primary - subtle warm tone */
#cookie-banner .accept{
  background: rgba(253,185,19,0.12);
  color: var(--deep-brown);
  border-color: rgba(253,185,19,0.28);
}
#cookie-banner .accept:hover{ background: rgba(253,185,19,0.16); }

/* Secondary - light outline */
#cookie-banner .reject{
  background: transparent;
  color: var(--deep-brown);
  border-color: rgba(42,24,16,0.12);
}
#cookie-banner .reject:hover{ background: rgba(42,24,16,0.04); }

/* Config as subtle link */
#cookie-banner .config{
  background: transparent;
  color: var(--text-medium);
  border: none;
  text-decoration: underline;
}

#cookie-settings{
  display: none;
  background: var(--warm-white);
  color: var(--text-dark);
  padding: 12px;
  border-radius: 10px;
  box-shadow: var(--shadow-warm);
  position: absolute;
  bottom: 78px;
  left: 50%;
  transform: translateX(-50%);
  width: min(640px, calc(100% - 60px));
  border: 1px solid rgba(212, 145, 10, 0.12);
}
#cookie-settings p{ color: var(--deep-brown); margin: 0 0 10px; }
#cookie-settings label{ color: var(--text-medium); }

/* Nota de pie opcional */
.footer-note{ text-align:center; color: var(--text-light); font-size: 0.95rem; margin-top: 18px; }

@media (max-width: 640px){
  body{ padding: 16px 10px; }
  .container{ padding: 1.2rem; border-radius: 12px; }
  .container > .header {
    margin-left: -1.2rem;
    margin-right: -1.2rem;
    margin-top: -1.2rem;
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
    padding-top: 0.9rem !important;
    padding-bottom: 0.9rem !important;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
  }
  #cookie-banner{ flex-direction: column; align-items: stretch; padding: 14px; }
  #cookie-banner div{ justify-content: flex-end; }
  #cookie-settings{ position: static; transform: none; width: 100%; margin-top: 8px; }
}