/* "WhatsApp" theme (added 2026-09-14) — same mechanism as the other theme-*.css files.
   `html.theme-whatsapp` (light) / `html.theme-whatsapp.dark` (WhatsApp's real dark mode). */

html.theme-whatsapp:not(.dark) {
    --wa-bg: #f0f2f5;
    --wa-surface: #ffffff;
    --wa-surface-recessed: #f7f8fa;
    --wa-fill: #e9edef;
    --wa-fill-strong: #d1d7db;
    --wa-border: #e9edef;
    --wa-border-soft: #f0f2f5;
    --wa-border-strong: #cfd4d7;
    --wa-text-heading: #111b21;
    --wa-text-body: #667781;
    --wa-text-faint: #8696a0;
    --wa-accent: #00a884;
    --wa-accent-solid: #00a884;
    --wa-accent-hover: #06906f;
    --wa-hover-tint: rgba(0, 168, 132, 0.06);
    --wa-hover-tint-strong: rgba(0, 168, 132, 0.1);
    --focus-accent: var(--wa-accent);
    --focus-ring: rgba(0, 168, 132, 0.25);
    color-scheme: light;
}
html.theme-whatsapp.dark {
    --wa-bg: #0b141a;
    --wa-surface: #202c33;
    --wa-surface-recessed: #111b21;
    --wa-fill: #2a3942;
    --wa-fill-strong: #384953;
    --wa-border: #2a3942;
    --wa-border-soft: #212f37;
    --wa-border-strong: #384953;
    --wa-text-heading: #e9edef;
    --wa-text-body: #8696a0;
    --wa-text-faint: #667781;
    --wa-accent: #06cf9c;
    --wa-accent-solid: #00a884;
    --wa-accent-hover: #06cf9c;
    --wa-hover-tint: rgba(6, 207, 156, 0.1);
    --wa-hover-tint-strong: rgba(6, 207, 156, 0.16);
    --focus-accent: var(--wa-accent);
    --focus-ring: rgba(6, 207, 156, 0.25);
    color-scheme: dark;
}

/* "Personality" touches (added 2026-09-15) — see theme-instagram.css's comment for the full
   rationale. WhatsApp Web's real font stack (same Meta family as Facebook, but WhatsApp doesn't
   pull in Segoe UI/Inter the way Facebook's own stack does). WhatsApp's chat bubbles/buttons are
   friendlier/rounder than this app's default — border-radius scoped to button/a elements only,
   same reasoning as Instagram's. */
html.theme-whatsapp { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; }
html.theme-whatsapp button.rounded-lg, html.theme-whatsapp a.rounded-lg { border-radius: 0.75rem !important; }
html.theme-whatsapp body { color: var(--wa-text-heading); }
html.theme-whatsapp body.bg-white { background-color: var(--wa-bg) !important; background-image: none !important; }
html.theme-whatsapp .bg-white { background-color: var(--wa-surface) !important; }
html.theme-whatsapp .bg-zinc-50 { background-color: var(--wa-surface-recessed) !important; }
html.theme-whatsapp .bg-zinc-100 { background-color: var(--wa-fill) !important; }
html.theme-whatsapp .bg-zinc-200 { background-color: var(--wa-fill-strong) !important; }
html.theme-whatsapp .bg-zinc-900 { background-color: var(--wa-accent-solid) !important; }
html.theme-whatsapp .bg-zinc-700, html.theme-whatsapp .bg-zinc-800 { background-color: var(--wa-accent-hover) !important; }
html.theme-whatsapp .bg-zinc-900\/40 { background-color: rgba(0, 0, 0, 0.5) !important; }
html.theme-whatsapp .bg-zinc-50\/40, html.theme-whatsapp .bg-zinc-50\/50, html.theme-whatsapp .bg-zinc-50\/60 { background-color: var(--wa-hover-tint) !important; }
html.theme-whatsapp .bg-zinc-200\/60 { background-color: var(--wa-hover-tint-strong) !important; }
html.theme-whatsapp .text-zinc-700, html.theme-whatsapp .text-zinc-800, html.theme-whatsapp .text-zinc-900 { color: var(--wa-text-heading) !important; }
html.theme-whatsapp .text-zinc-500, html.theme-whatsapp .text-zinc-600 { color: var(--wa-text-body) !important; }
html.theme-whatsapp .text-zinc-300, html.theme-whatsapp .text-zinc-400 { color: var(--wa-text-faint) !important; }
html.theme-whatsapp .placeholder\:text-zinc-400::placeholder { color: var(--wa-text-faint) !important; }
html.theme-whatsapp .border-zinc-100 { border-color: var(--wa-border-soft) !important; }
html.theme-whatsapp .divide-zinc-100 > :not([hidden]) ~ :not([hidden]) { border-color: var(--wa-border-soft) !important; }
html.theme-whatsapp .border-zinc-200 { border-color: var(--wa-border) !important; }
html.theme-whatsapp .border-zinc-300 { border-color: var(--wa-border-strong) !important; }
html.theme-whatsapp .border-zinc-400 { border-color: var(--wa-accent) !important; }
html.theme-whatsapp .border-zinc-900 { border-color: var(--wa-accent-solid) !important; }
html.theme-whatsapp .ring-zinc-100 { --tw-ring-color: rgba(0, 168, 132, 0.12) !important; }
html.theme-whatsapp .ring-zinc-500\/10, html.theme-whatsapp .ring-zinc-900\/10 { --tw-ring-color: rgba(0, 168, 132, 0.2) !important; }
html.theme-whatsapp .hover\:bg-zinc-50:hover, html.theme-whatsapp .hover\:bg-zinc-100:hover, html.theme-whatsapp .hover\:bg-zinc-200:hover,
html.theme-whatsapp .hover\:bg-zinc-50\/40:hover, html.theme-whatsapp .hover\:bg-zinc-50\/50:hover, html.theme-whatsapp .hover\:bg-zinc-50\/60:hover { background-color: var(--wa-hover-tint) !important; }
html.theme-whatsapp .hover\:bg-zinc-200\/60:hover { background-color: var(--wa-hover-tint-strong) !important; }
html.theme-whatsapp .has-\[\:checked\]\:bg-zinc-50:has(:checked), html.theme-whatsapp .has-\[\:checked\]\:bg-zinc-100:has(:checked) { background-color: var(--wa-hover-tint) !important; }
html.theme-whatsapp .capa-nc-group:hover td { background-color: var(--wa-hover-tint-strong) !important; }
html.theme-whatsapp .capa-nc-group:hover td:first-child,
html.theme-whatsapp tbody:not(.capa-nc-group) tr:not([class*="hover:bg"]):hover td:first-child { box-shadow: inset 3px 0 0 0 var(--wa-accent) !important; }
html.theme-whatsapp tbody:not(.capa-nc-group) tr:not([class*="hover:bg"]):hover { background-color: var(--wa-hover-tint-strong) !important; }
html.theme-whatsapp .hover\:bg-zinc-700:hover, html.theme-whatsapp .hover\:bg-zinc-800:hover { background-color: var(--wa-accent-hover) !important; }
html.theme-whatsapp .hover\:text-zinc-600:hover { color: var(--wa-text-body) !important; }
html.theme-whatsapp .hover\:text-zinc-700:hover, html.theme-whatsapp .hover\:text-zinc-800:hover, html.theme-whatsapp .hover\:text-zinc-900:hover { color: var(--wa-text-heading) !important; }
html.theme-whatsapp .hover\:border-zinc-400:hover { border-color: var(--wa-accent) !important; }
html.theme-whatsapp .hover\:border-zinc-900:hover { border-color: var(--wa-accent-solid) !important; }
html.theme-whatsapp .focus\:border-zinc-400:focus { border-color: var(--wa-accent) !important; }
html.theme-whatsapp .focus\:ring-zinc-100:focus { --tw-ring-color: rgba(0, 168, 132, 0.15) !important; }
html.theme-whatsapp .focus\:ring-zinc-900:focus { --tw-ring-color: rgba(0, 168, 132, 0.25) !important; }
html.theme-whatsapp input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html.theme-whatsapp select, html.theme-whatsapp textarea { background-color: var(--wa-surface) !important; color: var(--wa-text-heading) !important; border-color: var(--wa-border) !important; }
html.theme-whatsapp input::placeholder, html.theme-whatsapp textarea::placeholder { color: var(--wa-text-faint) !important; }
html.theme-whatsapp input[type="checkbox"], html.theme-whatsapp input[type="radio"] { accent-color: var(--wa-accent-solid); }
html.theme-whatsapp.dark input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); }
html.theme-whatsapp input[type="date"], html.theme-whatsapp input[type="time"], html.theme-whatsapp input[type="datetime-local"],
html.theme-whatsapp input[type="month"], html.theme-whatsapp input[type="week"] { color-scheme: inherit; }
html.theme-whatsapp ::-webkit-scrollbar-track { background: transparent; }
html.theme-whatsapp ::-webkit-scrollbar-thumb { background: var(--wa-border-strong); border-radius: 999px; }
html.theme-whatsapp ::-webkit-scrollbar-thumb:hover { background: var(--wa-accent); }
html.theme-whatsapp.dark .bg-amber-50, html.theme-whatsapp.dark .bg-amber-100 { background-color: rgba(245, 158, 11, 0.14) !important; }
html.theme-whatsapp.dark .text-amber-600, html.theme-whatsapp.dark .text-amber-700, html.theme-whatsapp.dark .text-amber-800 { color: #fbbf24 !important; }
html.theme-whatsapp.dark .bg-blue-50, html.theme-whatsapp.dark .bg-blue-100 { background-color: rgba(59, 130, 246, 0.14) !important; }
html.theme-whatsapp.dark .text-blue-600, html.theme-whatsapp.dark .text-blue-700, html.theme-whatsapp.dark .text-blue-800 { color: #60a5fa !important; }
html.theme-whatsapp.dark .bg-emerald-50, html.theme-whatsapp.dark .bg-emerald-100 { background-color: rgba(6, 207, 156, 0.16) !important; }
html.theme-whatsapp.dark .text-emerald-600, html.theme-whatsapp.dark .text-emerald-700, html.theme-whatsapp.dark .text-emerald-800 { color: #4ade80 !important; }
html.theme-whatsapp.dark .bg-red-50, html.theme-whatsapp.dark .bg-red-100 { background-color: rgba(239, 68, 68, 0.14) !important; }
html.theme-whatsapp.dark .text-red-600, html.theme-whatsapp.dark .text-red-700 { color: #f87171 !important; }
html.theme-whatsapp.dark .bg-violet-50 { background-color: rgba(139, 92, 246, 0.14) !important; }
html.theme-whatsapp.dark .text-violet-600, html.theme-whatsapp.dark .text-violet-700 { color: #a78bfa !important; }
html.theme-whatsapp.dark .bg-sky-50 { background-color: rgba(59, 130, 246, 0.14) !important; }
html.theme-whatsapp.dark .text-sky-600 { color: #60a5fa !important; }
html.theme-whatsapp.dark .bg-teal-50 { background-color: rgba(20, 184, 166, 0.14) !important; }
html.theme-whatsapp.dark .text-teal-600, html.theme-whatsapp.dark .text-teal-700 { color: #2dd4bf !important; }
html.theme-whatsapp.dark .bg-rose-50 { background-color: rgba(244, 63, 94, 0.14) !important; }
html.theme-whatsapp.dark .text-rose-600 { color: #fb7185 !important; }
html.theme-whatsapp.dark .bg-orange-50 { background-color: rgba(249, 115, 22, 0.14) !important; }
html.theme-whatsapp.dark .text-orange-600, html.theme-whatsapp.dark .text-orange-700 { color: #fb923c !important; }
html.theme-whatsapp.dark .bg-indigo-50 { background-color: rgba(99, 102, 241, 0.14) !important; }
html.theme-whatsapp.dark .text-indigo-600 { color: #818cf8 !important; }
