/**
 * Autorización de datos y banner de cookies — TShop
 *
 * Astra estiliza `button` e `input` en páginas WooCommerce con 0,1,1
 * (`.woocommerce-page button`): los botones del banner van con doble clase y
 * fondo, color y font-family EXPLÍCITOS también en hover/focus/active.
 */

/* ==================== Casillas de autorización ==================== */

.tsc-consent {
  display: grid;
  gap: 0.75rem;
  margin: 0 0 1.35rem;
  padding: 1rem;
  border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius);
  background: var(--surface-container-lowest);
}

.tsc-consent__row {
  display: grid;
  grid-template-columns: 1.15rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
  margin: 0;
  font-size: 0.83rem;
  line-height: 1.5;
  color: var(--on-surface-variant);
  cursor: pointer;
}

.tsc-consent input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  flex: none;
  margin: 0.1rem 0 0;
  accent-color: var(--primary);
  cursor: pointer;
}

.tsc-consent a {
  color: var(--primary);
  font-weight: 600;
}

.tsc-consent__req {
  color: var(--error);
  text-decoration: none;
  border: 0;
  font-weight: 700;
}

/* Marca de error cuando el envío se rechaza por falta de autorización. */
.tsc-consent.has-error {
  border-color: var(--error);
  box-shadow: 0 0 0 3px rgba(144, 74, 68, 0.15);
}

/* ==================== Banner de cookies ==================== */

.tsc-cookies {
  position: fixed;
  z-index: 99990; /* bajo el drawer del carrito (100000) y los modales */
  inset-inline: 0;
  bottom: 0;
  padding: 1rem;
  display: flex;
  justify-content: center;
  pointer-events: none;
}

.tsc-cookies[hidden] {
  display: none !important;
}

.tsc-cookies__box {
  pointer-events: auto;
  width: 100%;
  max-width: 46rem;
  padding: 1.25rem 1.35rem;
  border: 1.5px solid var(--outline-variant);
  border-radius: var(--radius);
  background: var(--surface-container-lowest);
  color: var(--on-surface);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}

.tsc-cookies .tsc-cookies__title {
  font-family: var(--font-headline);
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.2;
  margin: 0 0 0.5rem;
  color: var(--on-surface);
}

.tsc-cookies__text {
  margin: 0 0 1rem;
  font-size: 0.87rem;
  line-height: 1.55;
  color: var(--on-surface-variant);
}

.tsc-cookies__text a {
  color: var(--primary);
  font-weight: 600;
}

/* Preferencias */
.tsc-cookies__prefs {
  display: grid;
  gap: 0.6rem;
  margin: 0 0 1rem;
  padding: 0.9rem 1rem;
  border-radius: var(--radius);
  background: var(--surface-container);
}

.tsc-cookies__prefs[hidden] {
  display: none !important;
}

.tsc-cookies__pref {
  display: grid;
  grid-template-columns: 1.15rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
  margin: 0;
  cursor: pointer;
}

.tsc-cookies__pref.is-locked {
  cursor: default;
  opacity: 0.75;
}

.tsc-cookies__pref input[type="checkbox"] {
  width: 1.15rem;
  height: 1.15rem;
  margin: 0.15rem 0 0;
  accent-color: var(--primary);
}

.tsc-cookies__pref strong {
  display: block;
  font-size: 0.87rem;
  color: var(--on-surface);
}

.tsc-cookies__pref em {
  font-style: normal;
  font-size: 0.79rem;
  color: var(--on-surface-variant);
}

/* Acciones */
.tsc-cookies__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: flex-end;
}

.tsc-cookies .tsc-btn {
  font-family: var(--font-text);
  font-weight: 600;
  font-size: 0.88rem;
  line-height: 1.3;
  padding: 0.7rem 1.1rem;
  margin: 0;
  cursor: pointer;
  border: 1.5px solid transparent;
  border-radius: var(--radius);
  background-color: var(--primary);
  color: var(--on-primary);
  transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.tsc-cookies .tsc-btn:hover,
.tsc-cookies .tsc-btn:focus,
.tsc-cookies .tsc-btn:active {
  background-color: var(--on-primary-container);
  color: var(--on-primary);
  border-color: transparent;
}

.tsc-cookies .tsc-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.tsc-cookies .tsc-btn--ghost {
  background-color: transparent;
  color: var(--primary);
  border-color: var(--outline-variant);
}

.tsc-cookies .tsc-btn--ghost:hover,
.tsc-cookies .tsc-btn--ghost:focus,
.tsc-cookies .tsc-btn--ghost:active {
  background-color: var(--surface-container);
  color: var(--primary);
  border-color: var(--primary);
}

.tsc-cookies .tsc-btn[hidden] {
  display: none !important;
}

@media (max-width: 560px) {
  .tsc-cookies {
    padding: 0.5rem;
  }

  .tsc-cookies__actions {
    justify-content: stretch;
  }

  .tsc-cookies .tsc-btn {
    flex: 1 1 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tsc-cookies * {
    transition: none !important;
  }
}