/* Etapa 17.9 — Polimento profissional e estabilidade */
:root {
  --tap-promo-focus: 0 0 0 3px rgba(220, 38, 38, .22);
  --tap-promo-radius-sm: 10px;
  --tap-promo-radius-md: 14px;
  --tap-promo-radius-lg: 20px;
  --tap-promo-shadow-soft: 0 8px 28px rgba(15, 23, 42, .08);
  --tap-promo-transition: 180ms ease;
}

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, [role="button"], a { touch-action: manipulation; }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--tap-promo-focus) !important;
}

button, .btn, [class*="button"], [class*="botao"] {
  transition: transform var(--tap-promo-transition), box-shadow var(--tap-promo-transition), opacity var(--tap-promo-transition), background-color var(--tap-promo-transition);
}
button:not(:disabled):active, .btn:not(:disabled):active { transform: translateY(1px) scale(.99); }
button:disabled, .btn:disabled { cursor: not-allowed; opacity: .62; }

.card, [class*="card"], .panel, [class*="painel"] { transition: box-shadow var(--tap-promo-transition), transform var(--tap-promo-transition); }

.is-hidden, [hidden] { display: none !important; }

.table-responsive, .table-wrap, [data-responsive-table] {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table { max-width: 100%; }

.tap-skeleton {
  position: relative;
  overflow: hidden;
  background: #e5e7eb;
  color: transparent !important;
  border-radius: 8px;
}
.tap-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent);
  animation: tap-skeleton 1.25s infinite;
}
@keyframes tap-skeleton { 100% { transform: translateX(100%); } }

.tap-offline-banner {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: 99999;
  transform: translateX(-50%);
  width: min(calc(100% - 28px), 520px);
  padding: 12px 16px;
  border-radius: 14px;
  background: #111827;
  color: #fff;
  box-shadow: 0 16px 40px rgba(0,0,0,.28);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

.tap-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99998;
  max-width: min(380px, calc(100% - 36px));
  padding: 12px 16px;
  border-radius: 14px;
  background: #111827;
  color: #fff;
  box-shadow: 0 14px 36px rgba(0,0,0,.24);
  font-size: 14px;
  animation: tap-toast-in .2s ease both;
}
@keyframes tap-toast-in { from { opacity: 0; transform: translateY(8px); } }

.tap-image-fallback {
  object-fit: contain !important;
  background: #f3f4f6;
  padding: 12px;
}

@media (hover: hover) {
  .card:hover, [class*="card"]:hover { box-shadow: var(--tap-promo-shadow-soft); }
}

@media (max-width: 720px) {
  input, select, textarea { font-size: 16px !important; }
  .tap-toast { right: 14px; bottom: 14px; }
  button, .btn, [role="button"] { min-height: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
