/*
 * Utilitárias Tailwind usadas nos templates que NÃO estão em output.css.
 *
 * Motivo: output.css é gerado por `npm run css:build` (Tailwind CLI) e commitado
 * no repositório — o deploy (build.sh) não roda o build. Quando um template passa
 * a usar uma classe nova, ela só existe depois de alguém rodar o build com Node
 * instalado. Este arquivo cobre essa lacuna com os MESMOS valores do Tailwind v3.
 *
 * Ao rodar `npm run css:build` novamente, o Tailwind gera essas classes
 * nativamente e este arquivo vira redundante (mas inofensivo — mesmos valores).
 */

/* Espaçamento */
.-mb-2 { margin-bottom: -0.5rem }
.-mt-0\.5 { margin-top: -0.125rem }
.mb-1\.5 { margin-bottom: 0.375rem }
.pb-3 { padding-bottom: 0.75rem }
.pb-36 { padding-bottom: 9rem }
.pl-4 { padding-left: 1rem }
.pr-4 { padding-right: 1rem }
.pl-9 { padding-left: 2.25rem }
.pl-11 { padding-left: 2.75rem }
.pr-3 { padding-right: 0.75rem }
.pr-10 { padding-right: 2.5rem }
.pr-12 { padding-right: 3rem }
.px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem }
.space-y-0 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: 0; margin-bottom: 0 }
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
}

/* Posicionamento e tamanho */
.inset-y-0 { top: 0; bottom: 0 }
.top-3 { top: 0.75rem }
.left-3 { left: 0.75rem }
.z-\[210\] { z-index: 210 }
.z-\[220\] { z-index: 220 }
.z-\[999\] { z-index: 999 }
.max-h-36 { max-height: 9rem }
.max-h-\[70vh\] { max-height: 70vh }
.max-w-\[55\%\] { max-width: 55% }
.min-w-\[1\.25rem\] { min-width: 1.25rem }
.pointer-events-none { pointer-events: none }
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.shadow-xl {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

/* Bordas */
.border-t-4 { border-top-width: 4px }
.border-amber-100 { --tw-border-opacity: 1; border-color: rgb(254 243 199 / var(--tw-border-opacity)) }

/* Cores de fundo/texto */
.bg-amber-400 { --tw-bg-opacity: 1; background-color: rgb(251 191 36 / var(--tw-bg-opacity)) }
.bg-amber-50\/60 { background-color: rgb(255 251 235 / 0.6) }
.bg-gray-50\/60 { background-color: rgb(249 250 251 / 0.6) }
.bg-white\/15 { background-color: rgb(255 255 255 / 0.15) }
.bg-brand-orange\/90 { background-color: rgb(232 119 34 / 0.9) }
.text-amber-800 { --tw-text-opacity: 1; color: rgb(146 64 14 / var(--tw-text-opacity)) }
.text-white\/50 { color: rgb(255 255 255 / 0.5) }

/* Variantes de estado */
.hover\:text-brand-blue:hover { --tw-text-opacity: 1; color: rgb(30 111 160 / var(--tw-text-opacity)) }
.hover\:border-brand-blue\/40:hover { border-color: rgb(30 111 160 / 0.4) }
.active\:bg-gray-100:active { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)) }
.active\:bg-amber-50:active { --tw-bg-opacity: 1; background-color: rgb(255 251 235 / var(--tw-bg-opacity)) }
.active\:bg-orange-50:active { --tw-bg-opacity: 1; background-color: rgb(255 247 237 / var(--tw-bg-opacity)) }
.active\:bg-brand-blue\/5:active { background-color: rgb(30 111 160 / 0.05) }
.active\:bg-brand-blue\/10:active { background-color: rgb(30 111 160 / 0.1) }
.active\:bg-white\/25:active { background-color: rgb(255 255 255 / 0.25) }
.active\:opacity-70:active { opacity: 0.7 }
.disabled\:opacity-60:disabled { opacity: 0.6 }
.disabled\:opacity-70:disabled { opacity: 0.7 }
.file\:mr-2::file-selector-button { margin-right: 0.5rem }
.file\:text-xs::file-selector-button { font-size: 0.75rem; line-height: 1rem }

/* Home (jul/2026) */
.text-brand-blue-dark { --tw-text-opacity: 1; color: rgb(22 78 117 / var(--tw-text-opacity)) }
.divide-gray-50 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(249 250 251 / var(--tw-divide-opacity));
}
/* Barra de rolagem discreta nos seletores horizontais (não cobre o conteúdo) */
.scroll-suave { scrollbar-width: thin; scrollbar-color: rgb(255 255 255 / 0.35) transparent }
.scroll-suave::-webkit-scrollbar { height: 4px }
.scroll-suave::-webkit-scrollbar-track { background: transparent }
.scroll-suave::-webkit-scrollbar-thumb { background: rgb(255 255 255 / 0.35); border-radius: 999px }