/* Radar das Odds v206.57 — responsividade consolidada e loader modal da busca. */

html,
body,
#root {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

body.rc19-premium #root > :is(
  main,
  .app-shell,
  .unified-page-shell,
  .profile-shell,
  .admin-console-shell,
  .subscription-shell,
  .match-statistics-shell
) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

body.rc19-premium :is(
  .app-content,
  .system-page-content,
  .management-page-content,
  .insight-page-content,
  .admin-console-main,
  .workspace,
  .main-area
) {
  min-width: 0;
  max-width: 100%;
}

body.rc19-premium :is(img, svg, canvas, video) {
  max-width: 100%;
}

/* O estado de busca sai do fluxo da página. Ele bloqueia interação e rolagem
   por toque até o mesmo estado real da consulta ser encerrado pelo React. */
body.rc19-premium .radar-search-overlay-v20657 {
  position: fixed;
  z-index: 50000;
  inset: 0;
  width: 100vw;
  min-height: 100dvh;
  padding:
    max(18px, env(safe-area-inset-top, 0px))
    max(16px, env(safe-area-inset-right, 0px))
    max(18px, env(safe-area-inset-bottom, 0px))
    max(16px, env(safe-area-inset-left, 0px));
  display: grid;
  place-items: center;
  overflow: hidden;
  overscroll-behavior: contain;
  touch-action: none;
  color: #f7fbff;
  background: rgba(1, 8, 17, 0.78);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

body.rc19-premium .radar-search-popup-v20657 {
  width: min(440px, 100%);
  max-height: calc(100dvh - 36px);
  padding: 25px 24px 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden auto;
  border: 1px solid rgba(71, 153, 207, 0.58);
  border-radius: 20px;
  color: #f7fbff;
  background:
    radial-gradient(circle at 50% 18%, rgba(28, 154, 205, 0.18), transparent 30%),
    linear-gradient(150deg, #0c304c, #061827 72%);
  box-shadow:
    0 32px 90px rgba(0, 0, 0, 0.58),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  text-align: center;
}

body.rc19-premium .radar-search-visual-v20657 {
  position: relative;
  isolation: isolate;
  width: 156px;
  min-width: 156px;
  height: 156px;
  min-height: 156px;
  margin-bottom: 17px;
  overflow: hidden;
  border: 1px solid rgba(93, 190, 229, 0.6);
  border-radius: 50%;
  background:
    radial-gradient(circle at 68% 28%, #ff8a16 0 3px, transparent 4px),
    radial-gradient(circle at 72% 64%, #54ddff 0 3px, transparent 4px),
    radial-gradient(circle at 32% 69%, #1fe3a5 0 3px, transparent 4px),
    linear-gradient(90deg, transparent 49.4%, rgba(92, 181, 218, 0.22) 50%, transparent 50.6%),
    linear-gradient(0deg, transparent 49.4%, rgba(92, 181, 218, 0.22) 50%, transparent 50.6%),
    repeating-radial-gradient(circle, transparent 0 18px, rgba(75, 169, 209, 0.28) 19px 20px),
    radial-gradient(circle, rgba(18, 101, 140, 0.52), rgba(5, 25, 45, 0.98) 73%);
  box-shadow:
    0 0 0 9px rgba(29, 126, 166, 0.055),
    0 0 42px rgba(37, 175, 224, 0.26),
    inset 0 0 30px rgba(33, 163, 207, 0.22);
}

body.rc19-premium .radar-search-ring-v20657,
body.rc19-premium .radar-search-sweep-v20657,
body.rc19-premium .radar-search-core-v20657 {
  position: absolute;
  display: block;
  border-radius: 50%;
}

body.rc19-premium .radar-search-ring-v20657 {
  inset: 18px;
  border: 1px solid rgba(87, 203, 247, 0.38);
}

body.rc19-premium .radar-search-sweep-v20657 {
  z-index: 2;
  inset: 0;
  background: conic-gradient(
    from 0deg,
    transparent 0 76%,
    rgba(59, 207, 255, 0.08) 81%,
    rgba(59, 207, 255, 0.62) 94%,
    #ff8a16 99%,
    transparent 100%
  );
  -webkit-mask: radial-gradient(circle, transparent 0 5%, #000 7% 100%);
  mask: radial-gradient(circle, transparent 0 5%, #000 7% 100%);
  filter: drop-shadow(0 0 7px rgba(64, 204, 255, 0.55));
  animation: radar-popup-sweep-v20657 2.25s linear infinite;
}

body.rc19-premium .radar-search-core-v20657 {
  z-index: 3;
  inset: 50%;
  width: 9px;
  height: 9px;
  margin: -4.5px;
  background: #ff8a16;
  box-shadow: 0 0 16px rgba(255, 138, 22, 0.9);
}

body.rc19-premium .radar-search-kicker-v20657 {
  padding: 6px 10px;
  border: 1px solid rgba(255, 138, 22, 0.45);
  border-radius: 999px;
  color: #ff9c42;
  background: rgba(255, 122, 11, 0.1);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.08em;
}

body.rc19-premium .radar-search-popup-v20657 h3 {
  margin: 12px 0 7px;
  color: #fff;
  font-size: clamp(20px, 4.2vw, 26px);
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -0.025em;
}

body.rc19-premium .radar-search-popup-v20657 > p {
  max-width: 380px;
  margin: 0;
  color: #b9cee1;
  font-size: 12px;
  line-height: 1.55;
}

body.rc19-premium .radar-search-steps-v20657 {
  width: 100%;
  margin: 17px 0 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

body.rc19-premium .radar-search-steps-v20657 span {
  min-width: 0;
  padding: 7px 5px;
  border: 1px solid rgba(83, 151, 196, 0.26);
  border-radius: 8px;
  color: #a9c7da;
  background: rgba(5, 26, 44, 0.7);
  font-size: 8px;
  font-weight: 750;
  line-height: 1.25;
}

body.rc19-premium .radar-search-progress-v20657 {
  width: min(330px, 90%);
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent, #24c8ff, #ff8a16, transparent) 0 0 / 48% 100% no-repeat,
    rgba(86, 155, 196, 0.16);
  box-shadow: 0 0 12px rgba(36, 200, 255, 0.24);
  animation: radar-popup-progress-v20657 1.65s ease-in-out infinite;
}

@keyframes radar-popup-sweep-v20657 {
  to { transform: rotate(360deg); }
}

@keyframes radar-popup-progress-v20657 {
  from { background-position: -50% 0, 0 0; }
  to { background-position: 155% 0, 0 0; }
}

/* Regras comuns para tablet/celular em todas as páginas. */
@media (max-width: 1365px) {
  body.rc19-premium #root > :is(.app-shell, .unified-page-shell, .profile-shell, .admin-console-shell)
    > .app-topbar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.rc19-premium :is(.system-page-content, .management-page-content, .insight-page-content, .admin-console-main) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: clip !important;
  }

  body.rc19-premium :is(.game-analysis-overlay, .analysis-report-overlay, .bank-v207-modal) {
    padding-left: max(10px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(10px, env(safe-area-inset-right, 0px)) !important;
  }

  body.rc19-premium :is(.support-widget, .support-floating-button) {
    max-width: calc(100vw - 20px) !important;
  }
}

@media (max-width: 640px) {
  body.rc19-premium {
    font-size: 14px;
  }

  body.rc19-premium #root > main.radar-page-v209 > .app-topbar {
    grid-template-columns: 42px minmax(0, 1fr) minmax(62px, auto) 42px !important;
    gap: 5px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar > :is(.menu-toggle, .mobile-filter-button, .account-actions) {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar .mobile-filter-button {
    width: auto !important;
    min-width: 62px !important;
    max-width: 74px !important;
    padding: 0 8px !important;
    gap: 5px !important;
    font-size: 9px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar .topbar-menu.open {
    right: 8px !important;
    left: 8px !important;
    max-height: calc(100dvh - 82px) !important;
    overflow-y: auto !important;
  }

  body.rc19-premium #root > main.radar-page-v209 > .rc20-market-nav {
    grid-template-columns: minmax(0, 1fr) 44px !important;
    grid-template-areas: "context scan" !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .rc20-market-context {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .rc20-market-context > :is(strong, small) {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.rc19-premium #root > main.radar-page-v209 > .radar-workspace-v209 > .controls-panel {
    width: min(360px, 94vw) !important;
    max-width: min(360px, 94vw) !important;
    padding-left: max(13px, env(safe-area-inset-left, 0px)) !important;
    padding-bottom: max(24px, env(safe-area-inset-bottom, 0px)) !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-card,
  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-card > summary {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-market strong,
  body.rc19-premium #root > main.radar-page-v209 #entries .team-badge strong {
    overflow-wrap: anywhere !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .data-quality-strip {
    width: 100% !important;
    padding: 8px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .mobile-pick-quick-actions {
    grid-template-columns: minmax(0, 1fr) repeat(3, 38px) !important;
    gap: 6px !important;
  }

  /* Agenda: hora, nomes completos, placar e estatística têm áreas próprias. */
  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card {
    min-height: 126px !important;
    height: auto !important;
    padding: 10px !important;
    grid-template-columns: minmax(0, 1fr) 46px 40px !important;
    grid-template-areas:
      "time score side"
      "teams score side" !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    gap: 7px 6px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card .match-teams {
    min-width: 0 !important;
    gap: 7px !important;
    overflow: visible !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card :is(.team-badge, .team-badge.right-team) {
    min-width: 0 !important;
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 7px !important;
    overflow: visible !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card :is(.team-badge, .team-badge.right-team) strong {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    color: #f7fbff !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-score-v20646 {
    align-self: center !important;
    width: 44px !important;
    min-width: 44px !important;
    min-height: 46px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-calendar-side-v183 {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-calendar-statistics-button {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  /* Gestão 2.2: nenhum painel ou gráfico força largura de desktop. */
  .bank-v207-shell,
  .bank-v207-page,
  .bank-v207-panel,
  .bank-v208-report-toolbar,
  .bank-v208-report-result,
  .bank-v209-custom-curve {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .bank-v207-header {
    padding: 15px 13px;
  }

  .bank-v207-bank-control {
    grid-template-columns: minmax(0, 1fr) 42px;
  }

  .bank-v207-primary-actions button,
  .bank-v207-periods button,
  .bank-v207-navigation button {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .bank-v207-leg-row {
    width: 100%;
    grid-template-columns: 26px minmax(0, 1fr) 68px 34px;
    gap: 6px;
  }

  .bank-v207-bet-main strong,
  .bank-v207-bet-main small,
  .bank-v207-ranking strong,
  .bank-v207-ranking small {
    max-width: 100%;
  }

  .bank-v208-line-chart,
  .bank-v209-report-line-chart {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  .bank-v208-line-chart svg,
  .bank-v209-report-line-chart svg {
    min-width: 0;
    max-width: 100%;
  }

  .bank-v207-modal > form {
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 12px);
    overflow-y: auto;
  }
}

@media (max-width: 420px) {
  body.rc19-premium .radar-search-popup-v20657 {
    padding: 21px 16px 18px;
    border-radius: 16px;
  }

  body.rc19-premium .radar-search-visual-v20657 {
    width: 136px;
    min-width: 136px;
    height: 136px;
    min-height: 136px;
    margin-bottom: 15px;
  }

  body.rc19-premium .radar-search-steps-v20657 {
    grid-template-columns: 1fr;
  }

  body.rc19-premium .radar-search-steps-v20657 span {
    padding-block: 6px;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar .unified-topbar-brand strong {
    font-size: 9px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-numbers {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-numbers > div {
    min-height: 50px !important;
    padding: 7px 6px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .mobile-pick-quick-actions {
    grid-template-columns: minmax(0, 1fr) repeat(3, 36px) !important;
    gap: 5px !important;
  }

  .bank-v207-page {
    padding-inline: 7px;
  }

  .bank-v207-heading h1 {
    font-size: 24px;
  }

  .bank-v207-primary-actions,
  .bank-v207-kpis,
  .bank-v207-movement-kpis,
  .bank-v207-report-kpis,
  .bank-v207-balance-split,
  .bank-v207-modal-balance {
    grid-template-columns: minmax(0, 1fr);
  }

  .bank-v207-periods {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bank-v207-bet-numbers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bank-v208-donut-wrap,
  .bank-v208-report-summary,
  .bank-v208-report-modal-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 340px) {
  body.rc19-premium #root > main.radar-page-v209 > .app-topbar {
    padding-inline: 6px !important;
    grid-template-columns: 40px minmax(0, 1fr) 58px 40px !important;
    gap: 4px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar .unified-topbar-brand strong {
    display: none !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .app-topbar .mobile-filter-button {
    min-width: 58px !important;
    padding-inline: 5px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card {
    grid-template-columns: minmax(0, 1fr) 42px 36px !important;
    gap: 6px 4px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 .radar-agenda-column-v209 .daily-game-card :is(.team-badge, .team-badge.right-team) {
    grid-template-columns: 25px minmax(0, 1fr) !important;
    gap: 5px !important;
  }

  body.rc19-premium #root > main.radar-page-v209 #entries .premium-pick-numbers {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (orientation: landscape) and (max-height: 520px) and (max-width: 960px) {
  body.rc19-premium .radar-search-popup-v20657 {
    width: min(700px, 100%);
    padding: 14px 18px;
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    grid-template-areas:
      "visual kicker"
      "visual title"
      "visual text"
      "visual steps"
      "visual progress";
    column-gap: 20px;
    text-align: left;
  }

  body.rc19-premium .radar-search-visual-v20657 {
    grid-area: visual;
    width: 126px;
    min-width: 126px;
    height: 126px;
    min-height: 126px;
    margin: 0;
  }

  body.rc19-premium .radar-search-kicker-v20657 { grid-area: kicker; justify-self: start; }
  body.rc19-premium .radar-search-popup-v20657 h3 { grid-area: title; margin: 7px 0 4px; }
  body.rc19-premium .radar-search-popup-v20657 > p { grid-area: text; }
  body.rc19-premium .radar-search-steps-v20657 { grid-area: steps; margin: 8px 0; }
  body.rc19-premium .radar-search-progress-v20657 { grid-area: progress; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  body.rc19-premium .radar-search-sweep-v20657,
  body.rc19-premium .radar-search-progress-v20657 {
    animation: none;
  }
}
