/* Visual único: azul como ação principal, verde só para sucesso, vermelho só para erro. */
:root {
  --color-purple-50: var(--color-blue-50);
  --color-purple-100: var(--color-blue-100);
  --color-purple-200: var(--color-blue-200);
  --color-purple-300: var(--color-blue-300);
  --color-purple-400: var(--color-blue-400);
  --color-purple-500: var(--color-blue-500);
  --color-purple-600: var(--color-blue-600);
  --color-purple-700: var(--color-blue-700);
  --color-purple-800: var(--color-blue-800);
  --color-purple-900: var(--color-blue-900);
  --color-purple-950: var(--color-blue-950);
  --color-indigo-50: var(--color-blue-50);
  --color-indigo-100: var(--color-blue-100);
  --color-indigo-300: var(--color-blue-300);
  --color-indigo-400: var(--color-blue-400);
  --color-indigo-500: var(--color-blue-500);
  --color-indigo-600: var(--color-blue-600);
  --color-indigo-700: var(--color-blue-700);
  --color-indigo-800: var(--color-blue-800);
  --color-indigo-900: var(--color-blue-900);
  --color-indigo-950: var(--color-blue-950);
}

button,
input,
select,
textarea {
  border-radius: 0.75rem;
}

button {
  font-weight: 600;
}

button svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

button.rounded-full,
.rounded-full {
  border-radius: 9999px;
}

html[data-tema="claro"],
html[data-tema="vidro"] { color-scheme: light; }
html[data-tema="escuro"] { color-scheme: dark; }

html[data-tema="claro"] body,
html[data-tema="claro"] .min-h-screen,
html[data-tema="vidro"] body,
html[data-tema="vidro"] .min-h-screen {
  background: #f8fafc !important;
  color: #0f172a;
}
html[data-tema="escuro"] body,
html[data-tema="escuro"] .min-h-screen {
  background: #0b1220 !important;
  color: #e2e8f0;
}

html[data-tema="claro"] header {
  background: rgba(255,255,255,.92) !important;
  border-bottom: 1px solid #e2e8f0 !important;
  box-shadow: 0 8px 20px -12px rgba(15,23,42,.18);
}
html[data-tema="vidro"] header {
  background: rgba(255,255,255,.55) !important;
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.7) !important;
}
html[data-tema="escuro"] header {
  background: rgba(11,18,32,.9) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
html[data-tema="escuro"] header h1 { color: #f8fafc !important; }
html[data-tema="escuro"] header p { color: #94a3b8 !important; }

html[data-tema="escuro"] nav.fixed {
  background: rgba(11,18,32,.92) !important;
  border-top-color: rgba(255,255,255,.08) !important;
  color: #cbd5e1;
}

html[data-tema] main input,
html[data-tema] main button.rounded-2xl.border {
  border-radius: 12px !important;
  border: 1px solid #e2e8f0 !important;
  background: rgba(255,255,255,.8) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
html[data-tema="vidro"] main input,
html[data-tema="vidro"] main button.rounded-2xl.border {
  background: rgba(255,255,255,.45) !important;
  backdrop-filter: blur(12px);
  border-color: rgba(255,255,255,.7) !important;
}
html[data-tema="escuro"] main input,
html[data-tema="escuro"] main button.rounded-2xl.border {
  background: rgba(15,23,42,.72) !important;
  color: #e2e8f0 !important;
  border-color: rgba(255,255,255,.12) !important;
}
html[data-tema="escuro"] main input::placeholder { color: #94a3b8; }

html[data-tema] main button.bg-blue-600,
html[data-tema] nav .bg-blue-600 {
  background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 8px 16px -6px rgba(37,99,235,.45) !important;
}

html[data-tema] article {
  border-radius: 18px !important;
  box-shadow: 0 10px 25px -5px rgba(0,0,0,.05), 0 8px 10px -6px rgba(0,0,0,.03), inset 0 1px 0 rgba(255,255,255,.45) !important;
}
html[data-tema="claro"] article:not(.ticket-tom) {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border: 1px solid rgba(226,232,240,.95) !important;
}
html[data-tema="vidro"] article:not(.ticket-tom) {
  background: linear-gradient(180deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.38) 100%) !important;
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.65) !important;
}
html[data-tema="escuro"] article:not(.ticket-tom) {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 28px -10px rgba(0,0,0,.45) !important;
}
html[data-tema="escuro"] article:not(.ticket-tom) h3,
html[data-tema="escuro"] article:not(.ticket-tom) .text-slate-900,
html[data-tema="escuro"] article:not(.ticket-tom) .text-slate-800,
html[data-tema="escuro"] article:not(.ticket-tom) .text-slate-700 {
  color: #f8fafc !important;
}
html[data-tema="escuro"] article:not(.ticket-tom) .text-slate-500,
html[data-tema="escuro"] article:not(.ticket-tom) .text-slate-400 {
  color: #cbd5e1 !important;
}

html[data-tema="claro"] .ticket-tom {
  background: linear-gradient(180deg, hsl(var(--tom-h) calc(var(--tom-s) * .55) 96%) 0%, hsl(var(--tom-h) var(--tom-s) 90%) 100%) !important;
  border: 1px solid hsl(var(--tom-h) calc(var(--tom-s) * .45) 82%) !important;
}
html[data-tema="vidro"] .ticket-tom {
  background: linear-gradient(180deg, hsl(var(--tom-h) calc(var(--tom-s) * .5) 96% / .62) 0%, hsl(var(--tom-h) var(--tom-s) 90% / .34) 100%) !important;
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.62) !important;
}
html[data-tema="escuro"] .ticket-tom {
  background: linear-gradient(180deg, hsl(var(--tom-h) calc(var(--tom-s) * .72) 34%) 0%, hsl(var(--tom-h) calc(var(--tom-s) * .8) 18%) 100%) !important;
  border: 1px solid hsl(var(--tom-h) calc(var(--tom-s) * .4) 42% / .7) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 12px 28px -10px rgba(0,0,0,.5) !important;
  --ink: #ffffff !important;
  --muted: rgba(255,255,255,.78) !important;
  --line: rgba(255,255,255,.16) !important;
  --chip: rgba(255,255,255,.16) !important;
  --chip-ink: #ffffff !important;
}
html[data-tema] .ticket-tom .border-t {
  border-top-color: rgba(0,0,0,.06) !important;
}
html[data-tema="escuro"] .ticket-tom .border-t {
  border-top-color: rgba(255,255,255,.12) !important;
}
html[data-tema] .ticket-tom span.bg-rose-100,
html[data-tema] .ticket-tom span.bg-amber-100,
html[data-tema] .ticket-tom span.bg-blue-100,
html[data-tema] .ticket-tom span.bg-slate-100 {
  border-radius: 20px !important;
}
html[data-tema="claro"] .ticket-escuro span.w-2\.5,
html[data-tema="vidro"] .ticket-escuro span.w-2\.5 {
  background-color: var(--ink) !important;
}

.tema-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: rgba(255,255,255,.75);
}
html[data-tema="vidro"] .tema-switch {
  background: rgba(255,255,255,.4);
  border-color: rgba(255,255,255,.7);
  backdrop-filter: blur(10px);
}
html[data-tema="escuro"] .tema-switch {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
}
html[data-tema="escuro"] .tema-switch button { color: #cbd5e1; }
html[data-tema="escuro"] .tema-switch button[aria-pressed="true"] {
  background: #f8fafc;
  color: #0f172a;
}

html[data-tema="escuro"] [class*="bg-white"]:not(.ticket-tom) {
  background-color: #121a2b !important;
  color: #e2e8f0;
}
html[data-tema="escuro"] [class*="bg-slate-50"]:not(.ticket-tom) {
  background-color: #182236 !important;
}
html[data-tema="escuro"] [class*="bg-slate-100"] {
  background-color: #243044 !important;
}
html[data-tema="escuro"] [class*="border-slate-200"]:not(.ticket-tom),
html[data-tema="escuro"] [class*="border-slate-100"]:not(.ticket-tom),
html[data-tema="escuro"] [class*="border-slate-300"]:not(.ticket-tom) {
  border-color: rgba(255,255,255,.12) !important;
}
html[data-tema="escuro"] .text-slate-900,
html[data-tema="escuro"] .text-slate-800 { color: #f8fafc !important; }
html[data-tema="escuro"] .text-slate-700,
html[data-tema="escuro"] .text-slate-600 { color: #cbd5e1 !important; }
html[data-tema="escuro"] .text-slate-500,
html[data-tema="escuro"] .text-slate-400 { color: #94a3b8 !important; }

html[data-tema="escuro"] [class*="bg-blue-50"] {
  background-color: rgba(37,99,235,.2) !important;
  border-color: rgba(147,197,253,.35) !important;
}
html[data-tema="escuro"] .text-blue-800,
html[data-tema="escuro"] .text-blue-700,
html[data-tema="escuro"] .text-blue-600 { color: #93c5fd !important; }
html[data-tema="escuro"] .text-blue-500 { color: #7dd3fc !important; }

html[data-tema="escuro"] [class*="bg-amber-50"] {
  background-color: rgba(245,158,11,.18) !important;
  border-color: rgba(252,211,77,.35) !important;
}
html[data-tema="escuro"] .text-amber-800,
html[data-tema="escuro"] .text-amber-700,
html[data-tema="escuro"] .text-amber-600 { color: #fcd34d !important; }

html[data-tema="escuro"] [class*="bg-emerald-50"] {
  background-color: rgba(16,185,129,.18) !important;
  border-color: rgba(110,231,183,.35) !important;
}
html[data-tema="escuro"] .text-emerald-800,
html[data-tema="escuro"] .text-emerald-700,
html[data-tema="escuro"] .text-emerald-600 { color: #6ee7b7 !important; }

html[data-tema="escuro"] [class*="bg-rose-50"] {
  background-color: rgba(244,63,94,.18) !important;
  border-color: rgba(253,164,175,.35) !important;
}
html[data-tema="escuro"] .text-rose-800,
html[data-tema="escuro"] .text-rose-700,
html[data-tema="escuro"] .text-rose-600 { color: #fda4af !important; }

html[data-tema="escuro"] [class*="bg-purple-50"] {
  background-color: rgba(59,130,246,.18) !important;
  border-color: rgba(147,197,253,.3) !important;
}
html[data-tema="escuro"] .text-purple-700,
html[data-tema="escuro"] .text-purple-600 { color: #93c5fd !important; }

html[data-tema="escuro"] main input,
html[data-tema="escuro"] main select,
html[data-tema="escuro"] main textarea,
html[data-tema="escuro"] main button[class*="border"] {
  background-color: #1e293b !important;
  color: #f8fafc !important;
  border-color: rgba(255,255,255,.16) !important;
}
html[data-tema="escuro"] main button.bg-blue-600,
html[data-tema="escuro"] .bg-blue-600,
html[data-tema="escuro"] button.bg-slate-900 {
  background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
html[data-tema="escuro"] [class*="hover:bg-slate-50"]:hover,
html[data-tema="escuro"] [class*="hover:bg-white"]:hover,
html[data-tema="escuro"] [class*="hover:bg-slate-100"]:hover {
  background-color: #243044 !important;
}
html[data-tema="escuro"] .ticket-tom {
  color: #ffffff;
}