/* UMA — ajustes 17/08/2026: iPad Tarefas + Programa de Criadores */
.uma-tasks-plan-hero-layout {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: space-between;
  gap: 1.5rem;
}
.uma-tasks-plan-hero-stats {
  width: 100%;
  min-width: 0 !important;
}
@media (min-width: 1536px) {
  .uma-tasks-plan-hero-layout {
    flex-direction: row !important;
    align-items: flex-end !important;
  }
  .uma-tasks-plan-hero-stats {
    width: auto;
    min-width: 500px !important;
  }
}

.uma-creator-card {
  border-color: rgba(255, 44, 72, .38) !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(255, 0, 51, .15), transparent 31%),
    radial-gradient(circle at 8% 100%, rgba(255, 0, 51, .07), transparent 36%),
    linear-gradient(145deg, rgba(31, 7, 12, .97), rgba(7, 13, 27, .995)) !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.30), 0 0 44px rgba(255,0,51,.09) !important;
}
.uma-creator-card input[type="text"],
.uma-creator-card input[type="email"],
.uma-creator-card input[type="url"] {
  color-scheme: dark;
}
.uma-creator-modal-backdrop {
  background: rgba(0,0,0,.78) !important;
  backdrop-filter: blur(6px);
}
.uma-creator-modal {
  border-color: rgba(255, 60, 88, .34) !important;
  background: #0b0d19 !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.68), 0 0 52px rgba(255,0,51,.11) !important;
}
@media (max-width: 1024px) {
  .uma-creator-layout { align-items: stretch !important; }
}

/* Estilos explícitos do Programa de Criadores: independem de novas classes Tailwind no build antigo. */
.uma-creator-card { border: 1px solid rgba(255,44,72,.38); border-radius: 1rem; padding: 1.5rem; overflow: visible; }
.uma-creator-layout { display:flex; flex-direction:column; gap:1.5rem; }
.uma-creator-badge { display:inline-flex; align-items:center; gap:.5rem; border:1px solid rgba(248,113,113,.30); border-radius:999px; background:rgba(239,68,68,.10); padding:.25rem .75rem; color:#fecaca; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.15em; }
.uma-creator-help { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:999px; border:1px solid rgba(252,165,165,.25); background:rgba(248,113,113,.07); color:#fee2e2; font-weight:700; cursor:pointer; }
.uma-creator-tips { position:absolute; left:0; top:36px; z-index:40; width:300px; max-width:82vw; border:1px solid rgba(252,165,165,.25); border-radius:.75rem; background:rgba(18,11,22,.98); padding:1rem; text-align:left; box-shadow:0 24px 70px rgba(0,0,0,.55); }
.uma-creator-title-accent,.uma-creator-highlight { color:#fca5a5 !important; }
.uma-creator-status-card { width:100%; flex-shrink:0; border:1px solid rgba(252,165,165,.20); border-radius:.75rem; background:rgba(239,68,68,.045); padding:1rem; }
.uma-creator-cta,.uma-creator-submit,.uma-creator-success-btn { border:0; border-radius:.75rem; background:#ff0033 !important; color:#fff !important; font-weight:600; cursor:pointer; box-shadow:0 10px 28px rgba(255,0,51,.22); }
.uma-creator-cta:hover,.uma-creator-submit:hover,.uma-creator-success-btn:hover { background:#ff1748 !important; }
.uma-creator-terms-link { color:rgba(254,202,202,.80) !important; cursor:pointer; }
.uma-creator-terms-link:hover { color:#fee2e2 !important; text-decoration:underline; }
.uma-creator-modal-backdrop { position:fixed !important; inset:0 !important; z-index:100 !important; display:flex !important; align-items:center; justify-content:center; padding:1rem; }
.uma-creator-modal { width:100%; max-width:42rem; max-height:90vh; overflow-y:auto; border-radius:1rem; }
.uma-creator-modal-head { position:sticky; top:0; z-index:10; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(248,113,113,.15); background:rgba(11,13,25,.96); padding:1rem 1.25rem; }
.uma-creator-close { width:36px; height:36px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.10); border-radius:.5rem; background:transparent; color:#a7adbf; cursor:pointer; }
.uma-creator-term-note { border:1px solid rgba(248,113,113,.20); border-radius:.75rem; background:rgba(248,113,113,.055); padding:1rem; color:rgba(254,226,226,.88); }
.uma-creator-success-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(110,231,183,.30); border-radius:999px; background:rgba(52,211,153,.10); color:#6ee7b7; }
.uma-creator-form { padding:1.25rem; }
.uma-creator-input { width:100%; height:44px; margin-top:.375rem; border:1px solid rgba(252,165,165,.20); border-radius:.75rem; background:rgba(0,0,0,.20); padding:0 .875rem; color:#f5f7ff; outline:none; }
.uma-creator-input:focus { border-color:rgba(248,113,113,.55); }
.uma-creator-check { display:flex; align-items:flex-start; gap:.75rem; border:1px solid rgba(255,255,255,.08); border-radius:.75rem; background:rgba(255,255,255,.02); padding:.75rem; }
.uma-creator-check-terms { border-color:rgba(252,165,165,.16); background:rgba(248,113,113,.035); }
@media (min-width: 1024px) {
  .uma-creator-layout { flex-direction:row; align-items:center; justify-content:space-between; }
  .uma-creator-status-card { width:330px; }
}
@media (min-width: 640px) {
  .uma-creator-card { padding:1.75rem; }
  .uma-creator-form { padding:1.5rem; }
}

/* =========================================================
   UMA — refinamentos UX 17/08/2026
   1) Ajuda do Programa de Criadores abre para cima
   2) Termos menores + rolagem interna elegante
   3) Drawer mobile sempre rolável (inclui Central Estratégica)
   ========================================================= */

/* Tooltip do ? — o box fica no fim da página, então abrir para cima evita corte. */
.uma-creator-tips {
  top: auto !important;
  bottom: calc(100% + 10px) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(320px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  z-index: 10020 !important;
}

/* Pequena seta visual apontando para o botão de ajuda. */
.uma-creator-tips::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 11px;
  height: 11px;
  transform: translateX(-50%) rotate(45deg);
  border-right: 1px solid rgba(252,165,165,.25);
  border-bottom: 1px solid rgba(252,165,165,.25);
  background: rgba(18,11,22,.98);
}

/* No celular, alinha o tooltip pela esquerda para não escapar da viewport. */
@media (max-width: 639px) {
  .uma-creator-tips {
    left: 0 !important;
    transform: none !important;
    width: min(300px, calc(100vw - 40px)) !important;
  }
  .uma-creator-tips::after {
    left: 22px;
    transform: rotate(45deg);
  }
}

/* Modal do Programa de Criadores: menor e verdadeiramente centralizado. */
.uma-creator-modal-backdrop {
  z-index: 10000 !important;
  padding: clamp(14px, 3vh, 28px) !important;
  align-items: center !important;
}

.uma-creator-modal {
  width: min(100%, 580px) !important;
  max-width: 580px !important;
  max-height: min(76dvh, 660px) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 16px !important;
}

.uma-creator-modal-head {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  padding: 14px 18px !important;
}

/* O conteúdo — e não o modal inteiro — passa a rolar. */
.uma-creator-modal > :nth-child(2) {
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 74, 103, .55) rgba(255,255,255,.045);
}

.uma-creator-modal > :nth-child(2)::-webkit-scrollbar {
  width: 8px;
}
.uma-creator-modal > :nth-child(2)::-webkit-scrollbar-track {
  background: rgba(255,255,255,.035);
  border-radius: 999px;
  margin: 8px 0;
}
.uma-creator-modal > :nth-child(2)::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(255,0,51,.76), rgba(224,55,93,.52));
  border: 2px solid #0b0d19;
  border-radius: 999px;
}
.uma-creator-modal > :nth-child(2)::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(255,23,72,.92), rgba(238,72,110,.72));
}

@media (max-width: 639px) {
  .uma-creator-modal-backdrop {
    padding: 12px !important;
  }
  .uma-creator-modal {
    max-height: 82dvh !important;
    border-radius: 14px !important;
  }
}

/*
 * Menu lateral mobile.
 * A Central Estratégica usa um background fixo próprio; em alguns celulares
 * isso fazia o drawer herdar uma altura ruim do viewport. 100dvh + scroll no
 * próprio drawer remove essa dependência e mantém todas as opções acessíveis.
 */
@media (max-width: 767px) {
  div.fixed.inset-0.z-50 {
    height: 100dvh !important;
    max-height: 100dvh !important;
  }

  div.fixed.inset-0.z-50 > div.relative.flex.h-full[class*="w-[280px]"] {
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }

  div.fixed.inset-0.z-50 > div.relative.flex.h-full[class*="w-[280px]"] > [class*="overflow-y-auto"] {
    min-height: 0 !important;
    overflow-y: visible !important;
    flex: 0 0 auto !important;
  }
}
