/* ============================================================
   JEGADAT — Legal pages styles
   Used by: politica-privacidad.html, terminos-condiciones.html
   ============================================================ */

/* ── Layout ── */
.legal-main    { padding-top: 5rem; min-height: 100vh; }
.legal-hero    { padding: 4.5rem 0 3.5rem; }
.legal-hero-title { font-size: clamp(1.75rem, 4vw, 3rem); }
.legal-content { padding-top: 3.5rem; padding-bottom: 6rem; }

/* ── Sections & headings ── */
.legal-section { margin-bottom: 3.5rem; }

.legal-h2 {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 0.75rem;
    margin-bottom: 2rem;
    letter-spacing: -0.01em;
}
.dark .legal-h2 { color: #f1f5f9; border-color: rgba(255,255,255,0.08); }

/* ── Body text ── */
.legal-p { color: #475569; line-height: 1.8; margin-bottom: 1rem; font-size: 0.9375rem; }
.dark .legal-p { color: #94a3b8; }
.legal-p strong { color: #0f172a; }
.dark .legal-p strong { color: #f1f5f9; }

.legal-p-last  { color: #475569; line-height: 1.8; margin-bottom: 0; font-size: 0.9375rem; }
.dark .legal-p-last { color: #94a3b8; }
.legal-p-last strong { color: #0f172a; }
.dark .legal-p-last strong { color: #f1f5f9; }

.legal-p-sm    { color: #475569; line-height: 1.8; font-size: 0.875rem; margin-bottom: 0; }
.dark .legal-p-sm { color: #94a3b8; }

.legal-intro   { font-size: 1.0625rem; color: #475569; line-height: 1.8; margin-bottom: 0; }
.dark .legal-intro { color: #94a3b8; }
.legal-intro strong { color: #0f172a; }
.dark .legal-intro strong { color: #f1f5f9; }

.legal-p-sm-mt { color: #475569; line-height: 1.8; font-size: 0.875rem; margin-top: 1rem; margin-bottom: 0; }
.dark .legal-p-sm-mt { color: #94a3b8; }
.legal-p-sm-mt strong { color: #0f172a; }
.dark .legal-p-sm-mt strong { color: #f1f5f9; }

/* ── Info cards ── */
.legal-card { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 1rem; overflow: hidden; }
.dark .legal-card { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }

.legal-card-padded { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem 1.5rem; }
.dark .legal-card-padded { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
.legal-card-padded .legal-card-title { font-weight: 700; color: #0f172a; margin-bottom: 0.25rem; }
.dark .legal-card-padded .legal-card-title { color: #f1f5f9; }
.legal-card-padded p { font-size: 0.875rem; color: #64748b; margin-bottom: 0.125rem; }
.legal-card-padded p:last-child { margin-bottom: 0; }

.legal-row { display: flex; gap: 1rem; padding: 0.75rem 1.5rem; border-bottom: 1px solid #e2e8f0; }
.dark .legal-row { border-color: rgba(255,255,255,0.07); }
.legal-row:last-child { border-bottom: none; }

.legal-label { font-weight: 700; color: #0f172a; min-width: 10rem; font-size: 0.875rem; flex-shrink: 0; }
.dark .legal-label { color: #f1f5f9; }

.legal-value { color: #475569; font-size: 0.875rem; }
.dark .legal-value { color: #94a3b8; }

/* ── Lists ── */
.legal-list { list-style: none; padding: 0; margin: 0; }
.legal-list li { display: flex; gap: 0.75rem; padding: 0.5rem 0; color: #475569; font-size: 0.9375rem; line-height: 1.7; }
.dark .legal-list li { color: #94a3b8; }
.legal-list li::before { content: attr(data-marker); color: #6366f1; font-weight: 700; flex-shrink: 0; }
.legal-list li.prohibited { color: #ef4444; }
.dark .legal-list li.prohibited { color: #ef4444; }

/* ── Data table (section 2, privacidad) ── */
.legal-table-wrap { overflow-x: auto; border-radius: 0.875rem; border: 1px solid #e2e8f0; margin-bottom: 1.25rem; }
.dark .legal-table-wrap { border-color: rgba(255,255,255,0.08); }
.legal-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.legal-table thead tr { background: #f1f5f9; border-bottom: 1px solid #e2e8f0; }
.dark .legal-table thead tr { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); }
.legal-table th { text-align: left; padding: 0.875rem 1.25rem; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: #0f172a; }
.dark .legal-table th { color: #f1f5f9; }
.legal-table tbody tr { border-bottom: 1px solid #f1f5f9; }
.dark .legal-table tbody tr { border-color: rgba(255,255,255,0.05); }
.legal-table tbody tr:last-child { border-bottom: none; }
.legal-table td { padding: 0.875rem 1.25rem; color: #64748b; }
.dark .legal-table td { color: #94a3b8; }
.legal-table td:first-child { color: #334155; font-weight: 500; }
.dark .legal-table td:first-child { color: #cbd5e1; }

/* ── Habeas Data contact box (privacidad §5) ── */
.legal-contact-box { background: rgba(99,102,241,0.06); border: 1px solid rgba(99,102,241,0.2); border-radius: 1rem; padding: 1.5rem 2rem; margin-bottom: 1.25rem; }
.legal-contact-box-label { font-size: 0.875rem; color: #475569; margin-bottom: 0.375rem; }
.dark .legal-contact-box-label { color: #94a3b8; }
.legal-contact-box-email { font-size: 1.125rem; font-weight: 700; color: #6366f1; margin-bottom: 0.25rem; }
.legal-contact-box-email a { color: #6366f1; text-decoration: none; }
.legal-contact-box-subject { font-size: 0.8125rem; color: #94a3b8; }

/* ── Deadline stats (privacidad §5) ── */
.legal-stats { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.legal-stat { flex: 1; min-width: 200px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.875rem; padding: 1.25rem; text-align: center; }
.dark .legal-stat { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.07); }
.legal-stat-number { font-size: 1.5rem; font-weight: 800; color: #6366f1; margin-bottom: 0.25rem; }
.legal-stat-label  { font-size: 0.8125rem; color: #64748b; font-weight: 600; margin-bottom: 0; }
.legal-stat-sub    { font-size: 0.75rem; color: #94a3b8; margin-top: 0.25rem; margin-bottom: 0; }

/* ── Code inline ── */
.legal-code { font-size: 0.8125rem; background: #f1f5f9; padding: 0.1rem 0.3rem; border-radius: 0.25rem; }
.dark .legal-code { background: rgba(255,255,255,0.08); }

/* ── Cookies (privacidad §9) ── */
.pill { display: inline-block; font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding: 0.2rem 0.6rem; border-radius: 9999px; }
.pill-on  { background: rgba(99,102,241,0.1); color: #6366f1; border: 1px solid rgba(99,102,241,0.25); }
.pill-opt { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }
.dark .pill-opt { background: rgba(255,255,255,0.05); color: #64748b; border-color: rgba(255,255,255,0.1); }

.cookie-box { border: 1px solid #e2e8f0; border-radius: 0.875rem; padding: 1.25rem 1.5rem; margin-bottom: 0.75rem; }
.dark .cookie-box { border-color: rgba(255,255,255,0.08); }
.cookie-box h3 { font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #0f172a; margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.5rem; }
.dark .cookie-box h3 { color: #f1f5f9; }
.cookie-box p  { font-size: 0.875rem; color: #64748b; line-height: 1.6; }
.cookie-box strong { color: #334155; }
.dark .cookie-box p  { color: #64748b; }

/* ── Rights items (privacidad §4) ── */
.right-item { display: flex; gap: 1rem; padding: 1rem 1.25rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.875rem; margin-bottom: 0.625rem; }
.dark .right-item { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.07); }
.right-tag  { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #6366f1; min-width: 6rem; padding-top: 0.125rem; flex-shrink: 0; }
.right-desc { font-size: 0.875rem; color: #475569; line-height: 1.6; }
.dark .right-desc { color: #94a3b8; }

/* ── Provider boxes (privacidad §7) ── */
.provider-box { border: 1px solid #e2e8f0; border-radius: 0.875rem; padding: 1.25rem 1.5rem; margin-bottom: 0.75rem; }
.dark .provider-box { border-color: rgba(255,255,255,0.08); }
.provider-box h3 { font-size: 0.875rem; font-weight: 700; color: #0f172a; margin-bottom: 0.375rem; }
.dark .provider-box h3 { color: #f1f5f9; }
.provider-box p  { font-size: 0.875rem; color: #64748b; line-height: 1.6; }

/* ── Warning box (terminos §2) ── */
.legal-warning { background: #fefce8; border: 1px solid #fde68a; border-radius: 0.875rem; padding: 1rem 1.5rem; }
.legal-warning p { font-size: 0.875rem; color: #92400e; margin: 0; }

/* ── Law tag group (terminos) ── */
.legal-tags { margin-bottom: 1.25rem; display: flex; flex-wrap: wrap; gap: 0.375rem; }
.law-tag { display: inline-block; font-size: 0.75rem; font-weight: 600; color: #64748b; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 0.375rem; padding: 0.25rem 0.625rem; margin: 0.2rem 0.15rem; }
.dark .law-tag { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); color: #64748b; }

/* ── Policy link box (terminos §7) ── */
.legal-link-box { background: rgba(99,102,241,0.06); border: 1px solid rgba(99,102,241,0.18); border-radius: 0.875rem; padding: 1rem 1.5rem; margin-bottom: 1rem; }
.legal-link-box a { font-size: 0.9375rem; }

/* ── CTA (both pages) ── */
.legal-cta          { background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%); border: 1px solid #c7d2fe; border-radius: 1.25rem; padding: 3rem 2.5rem; text-align: center; }
.legal-cta-eyebrow  { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #6366f1; margin-bottom: 0.75rem; }
.legal-cta-title    { color: #1e1b4b; }
.legal-cta-text     { font-size: 0.9375rem; color: #6b7280; margin-bottom: 1.75rem; }

/* ── Responsive typography ── */
@media (min-width: 768px) {
    .legal-h2      { font-size: 1.4375rem; }
    .legal-p       { font-size: 1rem; }
    .legal-p-last  { font-size: 1rem; }
}

/* ── Overflow protection (all screen sizes) ── */
.legal-p, .legal-p-last, .legal-p-sm, .legal-p-sm-mt, .legal-intro,
.legal-value, .legal-desc, .right-desc,
.provider-box p, .legal-card-padded p, .cookie-box p,
.legal-contact-box-subject { overflow-wrap: break-word; word-break: break-word; }

.legal-link-box a { overflow-wrap: break-word; word-break: break-all; }

/* Allow pill badge to wrap below title on narrow screens */
.cookie-box h3 { flex-wrap: wrap; }

/* Dark mode for elements missing it */
.dark .provider-box p      { color: #94a3b8; }
.dark .legal-card-padded p { color: #94a3b8; }

/* ── Mobile adjustments ── */
@media (max-width: 639px) {
    /* Info card rows: stack label above value */
    .legal-row        { flex-direction: column; gap: 0.125rem; padding: 0.75rem 1rem; }
    .legal-label      { min-width: 0; }

    /* Contact box: less horizontal padding */
    .legal-contact-box { padding: 1.25rem 1.125rem; }

    /* Stats: smaller min-width so they still wrap nicely */
    .legal-stat       { min-width: 140px; }

    /* CTA: tighter padding */
    .legal-cta        { padding: 2rem 1.25rem; }

    /* Rights items: stack tag above description */
    .right-item       { flex-direction: column; gap: 0.25rem; }
    .right-tag        { min-width: 0; }

    /* Reduce hero vertical padding */
    .legal-hero       { padding: 3rem 0 2.5rem; }

    /* Less bottom padding on content */
    .legal-content    { padding-bottom: 4rem; }
}