/* ══════════════════════════════════════════════════════════════════
   cookies.css — CSS adicional específico de cookies.php
   (se carga junto con legal.css)
   ══════════════════════════════════════════════════════════════════ */

/* ── TIPOS DE COOKIES — tarjetas ── */
.cookie-tipos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }
.cookie-tipo { background: var(--off); border: 1.5px solid var(--line); border-radius: var(--r-md); padding: 22px 24px; transition: border-color .2s; }
.cookie-tipo:hover { border-color: var(--mint); }
.cookie-tipo strong { display: block; font-size: .88rem; font-weight: 800; color: var(--ink); margin-bottom: 6px; }
.cookie-tipo span { font-size: .8rem; color: var(--mid); line-height: 1.6; }

/* ── TABLA ── */
.cookie-table-wrap { overflow-x: auto; margin: 20px 0; border-radius: var(--r-md); border: 1.5px solid var(--line); }
.cookie-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.cookie-table thead { background: var(--ink); color: var(--white); }
.cookie-table thead th { padding: 14px 18px; text-align: left; font-weight: 700; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.cookie-table tbody tr { border-bottom: 1px solid var(--line); }
.cookie-table tbody tr:last-child { border-bottom: none; }
.cookie-table tbody tr:nth-child(even) { background: var(--off); }
.cookie-table td { padding: 13px 18px; color: var(--mid); vertical-align: top; line-height: 1.5; }
.cookie-table td:first-child { font-weight: 700; color: var(--ink); white-space: nowrap; }
.badge { display: inline-block; font-size: .65rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 20px; }
.badge-tecnica { background: var(--mint-pale); color: var(--mint-dim); }
.badge-analitica { background: #fef3c7; color: #92400e; }
.badge-terceros { background: #ede9fe; color: #5b21b6; }

/* ── NAVEGADORES ── */
.nav-list { list-style: none; margin: 16px 0; }
.nav-list li { font-size: .9rem; color: var(--mid); line-height: 1.8; padding-left: 24px; position: relative; margin-bottom: 10px; }
.nav-list li:last-child { margin-bottom: 0; }
.nav-list li::before { content: '→'; color: var(--mint); font-weight: 700; position: absolute; left: 0; top: 0; line-height: 1.8; }
.nav-list li a { color: var(--mint-dim); text-decoration: underline; }
.nav-list li a:hover { color: var(--mint); }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .cookie-tipos { grid-template-columns: 1fr; }
}