/* =========================================================
   Tema público: oscuro (default) / claro
   Control: html[data-theme="dark"|"light"] + botón data-theme-toggle
   ========================================================= */

/* ---------- Toggle control ---------- */
.app-theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: #e4e4e7;
  border-radius: 999px;
  padding: 0.4rem 0.85rem;
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.app-theme-toggle:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
}

.app-theme-toggle i {
  font-size: 0.95rem;
}

html[data-theme="light"] .app-theme-toggle {
  border-color: rgba(15, 23, 42, 0.12);
  background: #fff;
  color: #0f172a;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}

html[data-theme="light"] .app-theme-toggle:hover {
  background: #f8fafc;
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.18);
}

/* ---------- Variables light para tenant-portal ---------- */
html[data-theme="light"] {
  --tp-bg: #f4f6f9;
  --tp-bg-elevated: #ffffff;
  --tp-surface: #ffffff;
  --tp-surface-2: #f8fafc;
  --tp-surface-hover: #f1f5f9;
  --tp-ink: #0f172a;
  --tp-muted: #64748b;
  --tp-faint: #94a3b8;
  --tp-line: rgba(15, 23, 42, 0.08);
  --tp-line-strong: rgba(15, 23, 42, 0.14);
  --tp-primary: #0f172a;
  --tp-accent: #6366f1;
  --tp-accent-soft: rgba(99, 102, 241, 0.1);
  --tp-ok: #059669;
  --tp-warn: #d97706;
  --tp-edu: #2563eb;
  --tp-salud: #059669;
  --tp-tech: #0891b2;
  --tp-empresa: #6366f1;
  --tp-fundacion: #d97706;
  --tp-gobierno: #0f172a;
  --tp-asistencial: #db2777;
  --tp-otro: #64748b;
}

/* Shell público claro */
html[data-theme="light"] body.app-public-body:has(.tenant-shell),
html[data-theme="light"] body.app-public-body:has(.portal-shell),
html[data-theme="light"] body.app-public-body:has(.appmf-home),
html[data-theme="light"] body.app-public-body:has(.appmf-legal) {
  background: var(--tp-bg) !important;
  color: var(--tp-ink);
}

html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-navbar,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-navbar,
html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-navbar,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-navbar {
  background: rgba(255, 255, 255, 0.9) !important;
  border-bottom: 1px solid var(--tp-line) !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-brand,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-brand,
html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-brand,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-brand,
html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-nav-link,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-nav-link,
html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-nav-link,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-nav-link {
  color: #0f172a !important;
}

html[data-theme="light"] body.app-public-body:has(.tenant-shell) footer,
html[data-theme="light"] body.app-public-body:has(.portal-shell) footer,
html[data-theme="light"] body.app-public-body:has(.appmf-home) footer,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) footer,
html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-footer,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-footer,
html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-footer,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-footer {
  background: #ffffff !important;
  border-top: 1px solid var(--tp-line) !important;
  color: #64748b !important;
}

/* Shells */
html[data-theme="light"] .tenant-shell,
html[data-theme="light"] .portal-shell {
  background:
    radial-gradient(900px 420px at 12% -8%, rgba(99, 102, 241, 0.08), transparent 55%),
    radial-gradient(700px 360px at 100% 0%, rgba(14, 165, 233, 0.06), transparent 50%),
    var(--tp-bg);
  color: var(--tp-ink);
}

html[data-theme="light"] .tp-hero-panel {
  background: linear-gradient(180deg, #ffffff, #f8fafc);
  border-color: var(--tp-line);
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}

html[data-theme="light"] .tp-kicker {
  color: #4f46e5;
  background: rgba(99, 102, 241, 0.08);
  border-color: rgba(99, 102, 241, 0.16);
}

html[data-theme="light"] .tp-title { color: #0f172a; }
html[data-theme="light"] .tp-subtitle { color: #64748b; }

html[data-theme="light"] .tp-search-main {
  background: #fff;
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
}

html[data-theme="light"] .tp-search-main:focus-within {
  border-color: rgba(99, 102, 241, 0.45);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12);
}

html[data-theme="light"] .tp-search-input { color: #0f172a; }
html[data-theme="light"] .tp-search-input::placeholder { color: #94a3b8; }
html[data-theme="light"] .tp-search-clear {
  background: #f1f5f9;
  color: #64748b;
}

html[data-theme="light"] .tp-filter-chip {
  background: #fff;
  color: #475569;
  border-color: var(--tp-line);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03);
}

html[data-theme="light"] .tp-filter-chip.active {
  background: #0f172a;
  color: #fff;
  border-color: transparent;
}

html[data-theme="light"] .tp-filter-chip.active .tp-count {
  background: rgba(255, 255, 255, 0.2);
}

html[data-theme="light"] .tp-card,
html[data-theme="light"] .module-card,
html[data-theme="light"] .portal-side-card,
html[data-theme="light"] .portal-stat,
html[data-theme="light"] .tp-empty {
  background: #fff;
  border-color: var(--tp-line);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

html[data-theme="light"] .tp-card:hover,
html[data-theme="light"] .module-card:hover {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .tp-logo,
html[data-theme="light"] .tp-icon,
html[data-theme="light"] .module-icon {
  background: #f1f5f9;
  border-color: var(--tp-line);
  color: #0f172a;
}

html[data-theme="light"] .tp-card-body h3,
html[data-theme="light"] .tenant-name,
html[data-theme="light"] .module-card h5,
html[data-theme="light"] .portal-side-card h3,
html[data-theme="light"] .portal-section-title h2,
html[data-theme="light"] .portal-stat strong {
  color: #0f172a;
}

html[data-theme="light"] .tp-meta,
html[data-theme="light"] .module-card p,
html[data-theme="light"] .portal-side-list li,
html[data-theme="light"] .portal-section-title span,
html[data-theme="light"] .tp-search-hint {
  color: #64748b;
}

html[data-theme="light"] .tp-pill {
  background: #f8fafc;
  border-color: var(--tp-line);
  color: #475569;
}

html[data-theme="light"] .tp-pill.is-ok {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

html[data-theme="light"] .tp-role-select {
  background: #fff !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  color: #0f172a !important;
}

html[data-theme="light"] .tp-role-select option {
  background: #fff;
  color: #0f172a;
}

html[data-theme="light"] .tp-cta,
html[data-theme="light"] .module-go {
  color: #4f46e5;
}

html[data-theme="light"] .tp-card:hover .tp-cta,
html[data-theme="light"] .module-card:hover .module-go {
  color: #312e81;
}

html[data-theme="light"] .tenant-shell .btn-primary,
html[data-theme="light"] .portal-shell .btn-primary,
html[data-theme="light"] .tenant-shell .btn-brand,
html[data-theme="light"] .portal-shell .btn-brand {
  background: #0f172a !important;
  border-color: #0f172a !important;
  color: #fff !important;
}

html[data-theme="light"] .tenant-shell .btn-outline-secondary,
html[data-theme="light"] .portal-shell .btn-outline-secondary,
html[data-theme="light"] .tenant-shell .btn-outline-primary,
html[data-theme="light"] .portal-shell .btn-outline-primary {
  border-color: rgba(15, 23, 42, 0.14);
  color: #0f172a;
  background: #fff;
}

/* ---------- Home light ---------- */
html[data-theme="light"] .appmf-home {
  color: #0f172a !important;
  background:
    radial-gradient(900px 420px at 10% -10%, rgba(99, 102, 241, 0.08), transparent 55%),
    radial-gradient(700px 360px at 100% 0%, rgba(14, 165, 233, 0.06), transparent 50%),
    #f4f6f9 !important;
}

html[data-theme="light"] .appmf-home h2,
html[data-theme="light"] .appmf-home h3,
html[data-theme="light"] .appmf-home h4,
html[data-theme="light"] .appmf-home h5,
html[data-theme="light"] .appmf-home h6,
html[data-theme="light"] .appmf-section-head h2,
html[data-theme="light"] .appmf-hero-title,
html[data-theme="light"] .appmf-hero-subtitle {
  color: #0f172a !important;
}

html[data-theme="light"] .appmf-brand-text {
  background: linear-gradient(90deg, #0f172a, #4f46e5 55%, #0891b2);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="light"] .appmf-muted,
html[data-theme="light"] .appmf-home .text-muted,
html[data-theme="light"] .appmf-hero-text {
  color: #64748b !important;
}

html[data-theme="light"] .appmf-badge {
  background: rgba(99, 102, 241, 0.08);
  color: #4f46e5;
  border-color: rgba(99, 102, 241, 0.16);
}

html[data-theme="light"] .appmf-btn-primary {
  background: #0f172a !important;
  color: #fff !important;
}

html[data-theme="light"] .appmf-btn-primary:hover {
  background: #1e293b !important;
  color: #fff !important;
}

html[data-theme="light"] .appmf-btn-outline {
  background: #fff !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #0f172a !important;
}

html[data-theme="light"] .appmf-btn-outline:hover {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
}

html[data-theme="light"] .appmf-hero-card,
html[data-theme="light"] .appmf-solution-card,
html[data-theme="light"] .appmf-mod-group,
html[data-theme="light"] .appmf-capability,
html[data-theme="light"] .appmf-usecase,
html[data-theme="light"] .appmf-benefits-box,
html[data-theme="light"] .appmf-about-stat,
html[data-theme="light"] .appmf-final-cta {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
  color: #0f172a;
}

html[data-theme="light"] .appmf-tag {
  background: #f8fafc;
  color: #334155;
  border-color: rgba(15, 23, 42, 0.08);
}

html[data-theme="light"] .appmf-tag i { color: #6366f1; }

html[data-theme="light"] .appmf-hero-stats div {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, 0.08);
}

html[data-theme="light"] .appmf-hero-stats strong { color: #0f172a; }
html[data-theme="light"] .appmf-hero-stats span { color: #64748b; }

html[data-theme="light"] .appmf-check-list li { color: #334155; }
html[data-theme="light"] .appmf-check-list li::before,
html[data-theme="light"] .appmf-check-list li::after { background: #6366f1; }

html[data-theme="light"] .appmf-mod-group h3,
html[data-theme="light"] .appmf-mod-group li span,
html[data-theme="light"] .appmf-capability strong,
html[data-theme="light"] .appmf-usecase h6,
html[data-theme="light"] .appmf-about-stat__value,
html[data-theme="light"] .appmf-final-cta h3,
html[data-theme="light"] .appmf-benefits-box h2 {
  color: #0f172a !important;
}

html[data-theme="light"] .appmf-mod-group li small,
html[data-theme="light"] .appmf-capability span,
html[data-theme="light"] .appmf-about-stat__label {
  color: #64748b !important;
}

html[data-theme="light"] .appmf-mod-group li {
  border-bottom-color: rgba(15, 23, 42, 0.06);
}

html[data-theme="light"] .appmf-code {
  color: #4f46e5;
  background: rgba(99, 102, 241, 0.1);
  border-color: rgba(99, 102, 241, 0.18);
}

html[data-theme="light"] .appmf-solution-card:hover,
html[data-theme="light"] .appmf-capability:hover,
html[data-theme="light"] .appmf-usecase:hover {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

/* ---------- Privacy / legal light ---------- */
html[data-theme="light"] .appmf-legal {
  background:
    radial-gradient(800px 360px at 10% -10%, rgba(99, 102, 241, 0.08), transparent 55%),
    #f4f6f9 !important;
  color: #0f172a !important;
}

html[data-theme="light"] .appmf-legal-panel {
  background: #fff !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}

html[data-theme="light"] .appmf-legal-title { color: #0f172a !important; }
html[data-theme="light"] .appmf-legal-lead,
html[data-theme="light"] .appmf-legal-meta { color: #64748b !important; }
html[data-theme="light"] .appmf-legal h2 { color: #0f172a !important; }
html[data-theme="light"] .appmf-legal p,
html[data-theme="light"] .appmf-legal li { color: #334155 !important; }
html[data-theme="light"] .appmf-legal a { color: #4f46e5 !important; }

html[data-theme="light"] .appmf-legal .appmf-badge {
  background: rgba(99, 102, 241, 0.08);
  color: #4f46e5;
  border-color: rgba(99, 102, 241, 0.16);
}

html[data-theme="light"] .appmf-legal .appmf-hr {
  border-top-color: rgba(15, 23, 42, 0.08);
}

/* Layout buttons on light public pages */
html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-btn-primary,
html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-btn-primary,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-btn-primary,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-btn-primary {
  background: #0f172a !important;
  border-color: #0f172a !important;
  color: #fff !important;
}

html[data-theme="light"] body.app-public-body:has(.appmf-home) .app-btn-outline,
html[data-theme="light"] body.app-public-body:has(.tenant-shell) .app-btn-outline,
html[data-theme="light"] body.app-public-body:has(.portal-shell) .app-btn-outline,
html[data-theme="light"] body.app-public-body:has(.appmf-legal) .app-btn-outline {
  background: #fff !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  color: #0f172a !important;
}
