/*!
 * Pastelitos Pipo · estilos de páginas legales y aviso de cookies (Prisma Develop).
 * Usa los tokens de site.css (--g, --o, --line, --ff...).
 */

/* ---------- Aviso de cookies ---------- */
.ckbar {
  position: fixed;
  left: 12px;
  right: 12px;
  /* Deja libres el botón de WhatsApp (60px + 16px) y la barra del carrito (~76px). */
  bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  z-index: var(--z-cookies, 36);
  display: grid;
  gap: 12px;
  max-width: 560px;
  margin: 0 auto;
  padding: 14px 16px;
  border-radius: 18px;
  background: var(--card, #fff);
  color: var(--ink, #1d2616);
  border: 1px solid var(--line, #E7E7E7);
  box-shadow: 0 14px 34px rgba(24, 42, 8, .22);
  font-family: var(--ff, system-ui, sans-serif);
  font-size: 14px;
  line-height: 1.45;
  animation: ck-in .35s ease both;
}
.ckbar__txt { margin: 0; }
.ckbar__txt a { color: var(--gt, var(--g, #325419)); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.ckbar__acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ckbar__btn {
  min-height: 44px;
  padding: 10px 16px;
  border: 2px solid var(--g, #325419);
  border-radius: 999px;
  background: var(--g, #325419);
  color: #fff;
  font: 700 14.5px/1.2 var(--ff, system-ui, sans-serif);
  cursor: pointer;
  transition: background-color .2s, border-color .2s;
}
.ckbar__btn { -webkit-user-select: none; user-select: none; touch-action: manipulation; }
@media (hover: hover) and (pointer: fine) { .ckbar__btn:hover { background: var(--g2, #26410f); border-color: var(--g2, #26410f); } }
.ckbar__btn:active { transform: scale(.98); }
.ckbar__btn:focus-visible { outline: 3px solid var(--o, #F2A020); outline-offset: 3px; }
@keyframes ck-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (min-width: 768px) {
  .ckbar { left: 16px; right: auto; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); margin: 0; grid-template-columns: 1fr auto; align-items: center; max-width: 640px; }
  .ckbar__acts { grid-template-columns: auto auto; }
}
@media (prefers-reduced-motion: reduce) {
  .ckbar { animation: none; }
  .ckbar__btn { transition: none; }
}
html.nav-open .ckbar { display: none; }
/* iPhone en horizontal: el aviso no queda bajo la muesca. */
.ckbar { left: max(12px, env(safe-area-inset-left, 0px)); right: max(12px, env(safe-area-inset-right, 0px)); }
@media (min-width: 768px) { .ckbar { left: max(16px, env(safe-area-inset-left, 0px)); right: auto; } }

/* ---------- Páginas legales ---------- */
.legal .legal-nav { margin: 0 0 8px; }
.legal .legal-nav ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.legal .legal-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--line, #E7E7E7);
  background: var(--bg, #F1F1F1);
  color: var(--gt, var(--g, #325419));
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
@media (hover: hover) and (pointer: fine) { .legal .legal-nav a:hover { border-color: var(--g, #325419); } }
.legal .legal-nav a[aria-current="page"] { background: var(--g, #325419); border-color: var(--g, #325419); color: #fff; }
.legal .legal-nav a:focus-visible { outline: 3px solid var(--o, #F2A020); outline-offset: 2px; }
.legal h2 { font-size: 30px; }
.legal-fecha { padding-top: 14px; border-top: 1px solid var(--line, #E7E7E7); font-size: 14px; }
.legal-tabla { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line, #E7E7E7); border-radius: 14px; }
.legal-tabla:focus-visible { outline: 3px solid var(--o, #F2A020); outline-offset: 2px; }
.legal-tabla table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14px; }
.legal-tabla th, .legal-tabla td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line, #E7E7E7); }
.legal-tabla thead th { background: var(--bg, #F1F1F1); color: var(--gt, var(--g, #325419)); font-weight: 700; }
.legal-tabla tbody tr:last-child td { border-bottom: 0; }
.legal-tabla code { font-size: 13px; word-break: break-word; }

/* El texto del aviso no hereda colores de la página donde se muestre (p. ej. la página de bienvenida, que es de texto claro). */
.ckbar .ckbar__txt { margin: 0; color: var(--ink, #1d2616); font-size: 14px; line-height: 1.45; }
.ckbar .ckbar__txt a { color: var(--gt, var(--g, #325419)); font-weight: 600; }

/* ---------- Modo oscuro (usa los tokens de site.css; aquí solo lo que tiene valor propio de respaldo) ---------- */
html[data-theme="dark"] .ckbar { box-shadow: 0 14px 34px rgba(0, 0, 0, .55); border-color: var(--line, #2d3b21); }
html[data-theme="dark"] .ckbar__btn { background: #3f6b21; border-color: #3f6b21; }
@media (hover: hover) and (pointer: fine) { html[data-theme="dark"] .ckbar__btn:hover { background: #4a7a28; border-color: #4a7a28; } }
html[data-theme="dark"] .legal .legal-nav a { background: var(--card, #1b2612); border-color: var(--line, #2d3b21); }
html[data-theme="dark"] .legal .legal-nav a[aria-current="page"] { background: #3f6b21; border-color: #3f6b21; color: #fff; }
html[data-theme="dark"] .legal-tabla thead th { background: var(--card, #1b2612); }