/* NeonCyber v2 - safe scoped overrides for Layout2:NeonCyber */
:root[data-neon-cyber="1"],
:root.neon-cyber-force {
  --nc-bg: #05070f;
  --nc-bg-deep: #071327;
  --nc-surface: rgba(8, 16, 34, 0.88);
  --nc-surface-strong: rgba(10, 20, 42, 0.96);
  --nc-cyan: #00f6ff;
  --nc-pink: #ff2ea6;
  --nc-text: #e9f4ff;
  --nc-text-dim: #8ea3cb;
  --nc-border: rgba(0, 246, 255, 0.26);
  --nc-radius: 20px;
  --nc-shadow: 0 18px 44px rgba(0, 0, 0, 0.46);
  --nc-glow-cyan: 0 0 18px rgba(0, 246, 255, 0.28);
  --nc-glow-pink: 0 0 18px rgba(255, 46, 166, 0.18);
}

@keyframes ncPulseGlow {
  0%,
  100% {
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45), 0 0 16px rgba(0, 246, 255, 0.28), 0 0 28px rgba(255, 46, 166, 0.16);
  }
  50% {
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.5), 0 0 24px rgba(0, 246, 255, 0.42), 0 0 38px rgba(255, 46, 166, 0.28);
  }
}

@keyframes ncNeonOffBlink {
  0%,
  19%,
  22%,
  62%,
  64%,
  100% {
    filter: brightness(1);
    opacity: 1;
  }
  20%,
  21%,
  63% {
    filter: brightness(0.68);
    opacity: 0.84;
  }
}

@keyframes ncGradientMove {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 200% 50%;
  }
}

@keyframes ncBorderSweep {
  0% {
    transform: translateX(-120%) skewX(-20deg);
    opacity: 0;
  }
  20% {
    opacity: 0.35;
  }
  60% {
    opacity: 0.5;
  }
  100% {
    transform: translateX(180%) skewX(-20deg);
    opacity: 0;
  }
}

@keyframes ncFloat {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-3px);
  }
}

:root[data-neon-cyber="1"] body,
:root.neon-cyber-force body {
  position: relative;
  color: var(--nc-text);
  background:
    radial-gradient(900px 460px at 12% -8%, rgba(0, 246, 255, 0.13), transparent 62%),
    radial-gradient(900px 460px at 88% 0%, rgba(255, 46, 166, 0.14), transparent 62%),
    linear-gradient(180deg, var(--nc-bg-deep) 0%, var(--nc-bg) 100%) !important;
}

:root[data-neon-cyber="1"] body::before,
:root.neon-cyber-force body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
  background-size: 100% 28px, 28px 100%;
  opacity: 0.22;
  mix-blend-mode: screen;
}

:root[data-neon-cyber="1"] #app,
:root.neon-cyber-force #app {
  opacity: 1 !important;
  visibility: visible !important;
}

:root[data-neon-cyber="1"] .btn,
:root[data-neon-cyber="1"] .van-button,
:root.neon-cyber-force .btn,
:root.neon-cyber-force .van-button {
  position: relative;
  overflow: hidden;
  color: #ecf7ff !important;
  border: 1px solid rgba(0, 246, 255, 0.5) !important;
  background: linear-gradient(120deg, rgba(0, 246, 255, 0.2), rgba(255, 46, 166, 0.18), rgba(0, 246, 255, 0.2)) !important;
  background-size: 220% 220% !important;
  border-radius: var(--nc-radius) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42), 0 0 20px rgba(0, 246, 255, 0.38), 0 0 28px rgba(255, 46, 166, 0.18) !important;
  animation: ncPulseGlow 2.8s ease-in-out infinite, ncNeonOffBlink 6.2s steps(1, end) infinite, ncGradientMove 3.4s linear infinite;
  transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

:root[data-neon-cyber="1"] .btn::before,
:root[data-neon-cyber="1"] .van-button::before,
:root.neon-cyber-force .btn::before,
:root.neon-cyber-force .van-button::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(100deg, transparent 15%, rgba(0, 246, 255, 0.5) 40%, rgba(255, 46, 166, 0.48) 58%, transparent 82%);
  animation: ncBorderSweep 2.8s linear infinite;
}

:root[data-neon-cyber="1"] .btn:hover,
:root[data-neon-cyber="1"] .van-button:hover,
:root.neon-cyber-force .btn:hover,
:root.neon-cyber-force .van-button:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45), 0 0 20px rgba(255, 46, 166, 0.4) !important;
}

:root[data-neon-cyber="1"] .btn-primary,
:root[data-neon-cyber="1"] .van-button--primary,
:root.neon-cyber-force .btn-primary,
:root.neon-cyber-force .van-button--primary {
  background: linear-gradient(135deg, #00f6ff 0%, #18d5ff 40%, #ff2ea6 100%) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #05131d !important;
  font-weight: 700;
  border-radius: calc(var(--nc-radius) + 2px) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.48), 0 0 24px rgba(0, 246, 255, 0.42), 0 0 34px rgba(255, 46, 166, 0.32) !important;
}

:root[data-neon-cyber="1"] input,
:root[data-neon-cyber="1"] textarea,
:root[data-neon-cyber="1"] select,
:root[data-neon-cyber="1"] .van-field__control,
:root[data-neon-cyber="1"] .form-control,
:root.neon-cyber-force input,
:root.neon-cyber-force textarea,
:root.neon-cyber-force select,
:root.neon-cyber-force .van-field__control,
:root.neon-cyber-force .form-control {
  color: var(--nc-text) !important;
  background: rgba(6, 14, 31, 0.84) !important;
  border: 1px solid rgba(0, 246, 255, 0.3) !important;
}

:root[data-neon-cyber="1"] input:focus,
:root[data-neon-cyber="1"] textarea:focus,
:root[data-neon-cyber="1"] select:focus,
:root[data-neon-cyber="1"] .van-field__control:focus,
:root[data-neon-cyber="1"] .form-control:focus,
:root.neon-cyber-force input:focus,
:root.neon-cyber-force textarea:focus,
:root.neon-cyber-force select:focus,
:root.neon-cyber-force .van-field__control:focus,
:root.neon-cyber-force .form-control:focus {
  border-color: rgba(255, 46, 166, 0.62) !important;
  box-shadow: 0 0 0 2px rgba(255, 46, 166, 0.14), 0 0 14px rgba(0, 246, 255, 0.24) !important;
}

:root[data-neon-cyber="1"] .card,
:root[data-neon-cyber="1"] .van-card,
:root[data-neon-cyber="1"] .van-cell,
:root[data-neon-cyber="1"] .van-popup,
:root.neon-cyber-force .card,
:root.neon-cyber-force .van-card,
:root.neon-cyber-force .van-cell,
:root.neon-cyber-force .van-popup {
  background: linear-gradient(160deg, rgba(8, 16, 34, 0.9), rgba(11, 20, 42, 0.8)) !important;
  border-color: var(--nc-border) !important;
}

/* Neon radius para grade de jogos e cards relacionados */
:root[data-neon-cyber="1"] .van-grid-item__content,
:root[data-neon-cyber="1"] .van-grid-item,
:root[data-neon-cyber="1"] [class*="game-card"],
:root[data-neon-cyber="1"] [class*="game_item"],
:root[data-neon-cyber="1"] [class*="game-item"],
:root[data-neon-cyber="1"] [class*="slot-card"],
:root[data-neon-cyber="1"] [class*="provider-card"],
:root.neon-cyber-force .van-grid-item__content,
:root.neon-cyber-force .van-grid-item,
:root.neon-cyber-force [class*="game-card"],
:root.neon-cyber-force [class*="game_item"],
:root.neon-cyber-force [class*="game-item"],
:root.neon-cyber-force [class*="slot-card"],
:root.neon-cyber-force [class*="provider-card"] {
  position: relative;
  border-radius: calc(var(--nc-radius) + 2px) !important;
  border: 2px solid rgba(0, 246, 255, 0.44) !important;
  background: linear-gradient(160deg, rgba(8, 18, 38, 0.92), rgba(10, 20, 42, 0.82), rgba(8, 18, 38, 0.92)) !important;
  background-size: 240% 240% !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.46), 0 0 22px rgba(0, 246, 255, 0.34), 0 0 30px rgba(255, 46, 166, 0.2) !important;
  animation: ncPulseGlow 3.2s ease-in-out infinite, ncNeonOffBlink 8.5s steps(1, end) infinite, ncGradientMove 4.2s linear infinite, ncFloat 4.8s ease-in-out infinite;
  overflow: hidden;
}

:root[data-neon-cyber="1"] .van-grid-item__content::after,
:root[data-neon-cyber="1"] [class*="game-card"]::after,
:root[data-neon-cyber="1"] [class*="game-item"]::after,
:root.neon-cyber-force .van-grid-item__content::after,
:root.neon-cyber-force [class*="game-card"]::after,
:root.neon-cyber-force [class*="game-item"]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(0, 246, 255, 0.22) 50%, rgba(255, 46, 166, 0.2) 60%, transparent 75%);
  pointer-events: none;
  animation: ncBorderSweep 3.8s ease-in-out infinite;
}

:root[data-neon-cyber="1"] .van-grid-item__content:hover,
:root[data-neon-cyber="1"] [class*="game-card"]:hover,
:root[data-neon-cyber="1"] [class*="game-item"]:hover,
:root.neon-cyber-force .van-grid-item__content:hover,
:root.neon-cyber-force [class*="game-card"]:hover,
:root.neon-cyber-force [class*="game-item"]:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 46, 166, 0.58) !important;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.52), 0 0 26px rgba(255, 46, 166, 0.42), 0 0 28px rgba(0, 246, 255, 0.32) !important;
}

/* Botoes com radius neon mais forte */
:root[data-neon-cyber="1"] .btn,
:root[data-neon-cyber="1"] .van-button,
:root[data-neon-cyber="1"] button,
:root.neon-cyber-force .btn,
:root.neon-cyber-force .van-button,
:root.neon-cyber-force button {
  border-radius: 14px !important;
  border: 1px solid rgba(0, 246, 255, 0.5) !important;
}

:root[data-neon-cyber="1"] .btn-primary,
:root[data-neon-cyber="1"] .van-button--primary,
:root.neon-cyber-force .btn-primary,
:root.neon-cyber-force .van-button--primary {
  border-radius: 14px !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.42), 0 0 16px rgba(0, 246, 255, 0.36), 0 0 18px rgba(255, 46, 166, 0.26) !important;
}

:root[data-neon-cyber="1"] .tabbar,
:root[data-neon-cyber="1"] .navbar,
:root[data-neon-cyber="1"] .header,
:root.neon-cyber-force .tabbar,
:root.neon-cyber-force .navbar,
:root.neon-cyber-force .header {
  background: linear-gradient(180deg, rgba(6, 12, 28, 0.94), rgba(4, 9, 22, 0.86)) !important;
  border-bottom: 1px solid rgba(0, 246, 255, 0.24) !important;
}

:root[data-neon-cyber="1"] a,
:root.neon-cyber-force a {
  color: #68f8ff !important;
}

:root[data-neon-cyber="1"] .text-muted,
:root.neon-cyber-force .text-muted {
  color: var(--nc-text-dim) !important;
}

:root[data-neon-cyber="1"] .page-wrapper,
:root[data-neon-cyber="1"] .page-content,
:root.neon-cyber-force .page-wrapper,
:root.neon-cyber-force .page-content {
  background: transparent !important;
}

:root[data-neon-cyber="1"] .container,
:root[data-neon-cyber="1"] .container-xxl,
:root.neon-cyber-force .container,
:root.neon-cyber-force .container-xxl {
  position: relative;
  z-index: 1;
}

:root[data-neon-cyber="1"] .card,
:root[data-neon-cyber="1"] .modal-content,
:root[data-neon-cyber="1"] .dropdown-menu,
:root.neon-cyber-force .card,
:root.neon-cyber-force .modal-content,
:root.neon-cyber-force .dropdown-menu {
  background: linear-gradient(160deg, var(--nc-surface), rgba(11, 20, 42, 0.78)) !important;
  border: 1px solid var(--nc-border) !important;
  border-radius: calc(var(--nc-radius) + 2px) !important;
  box-shadow: var(--nc-shadow), var(--nc-glow-cyan), var(--nc-glow-pink) !important;
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}

:root[data-neon-cyber="1"] .card-header,
:root[data-neon-cyber="1"] .modal-header,
:root[data-neon-cyber="1"] .dropdown-header,
:root.neon-cyber-force .card-header,
:root.neon-cyber-force .modal-header,
:root.neon-cyber-force .dropdown-header {
  background: linear-gradient(135deg, rgba(0, 246, 255, 0.12), rgba(255, 46, 166, 0.08)) !important;
  border-color: rgba(0, 246, 255, 0.2) !important;
}

:root[data-neon-cyber="1"] .card-title,
:root[data-neon-cyber="1"] .modal-title,
:root[data-neon-cyber="1"] h1,
:root[data-neon-cyber="1"] h2,
:root[data-neon-cyber="1"] h3,
:root.neon-cyber-force .card-title,
:root.neon-cyber-force .modal-title,
:root.neon-cyber-force h1,
:root.neon-cyber-force h2,
:root.neon-cyber-force h3 {
  color: #f1fbff !important;
  letter-spacing: 0.02em;
}

:root[data-neon-cyber="1"] .navbar,
:root[data-neon-cyber="1"] .tabbar,
:root[data-neon-cyber="1"] .header,
:root[data-neon-cyber="1"] .topbar,
:root.neon-cyber-force .navbar,
:root.neon-cyber-force .tabbar,
:root.neon-cyber-force .header,
:root.neon-cyber-force .topbar {
  background: linear-gradient(180deg, rgba(5, 10, 24, 0.96), rgba(4, 9, 22, 0.88)) !important;
  border-bottom: 1px solid rgba(0, 246, 255, 0.24) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3) !important;
}

:root[data-neon-cyber="1"] .footer,
:root.neon-cyber-force .footer {
  background: linear-gradient(180deg, rgba(4, 9, 22, 0.84), rgba(5, 10, 24, 0.96)) !important;
  border-top: 1px solid rgba(0, 246, 255, 0.18) !important;
}

:root[data-neon-cyber="1"] .table,
:root.neon-cyber-force .table {
  color: var(--nc-text) !important;
}

:root[data-neon-cyber="1"] .table thead th,
:root.neon-cyber-force .table thead th {
  background: rgba(0, 246, 255, 0.08) !important;
  color: #f6feff !important;
  border-color: rgba(0, 246, 255, 0.16) !important;
}

:root[data-neon-cyber="1"] .table > :not(caption) > * > *,
:root.neon-cyber-force .table > :not(caption) > * > * {
  background-color: transparent !important;
  border-color: rgba(142, 163, 203, 0.18) !important;
}

:root[data-neon-cyber="1"] .toast,
:root.neon-cyber-force .toast {
  background: rgba(7, 19, 39, 0.96) !important;
  border: 1px solid rgba(0, 246, 255, 0.22) !important;
  color: var(--nc-text) !important;
  box-shadow: var(--nc-shadow) !important;
}

:root[data-neon-cyber="1"] .toast-header,
:root.neon-cyber-force .toast-header {
  background: rgba(255, 255, 255, 0.02) !important;
  color: var(--nc-text) !important;
  border-bottom: 1px solid rgba(0, 246, 255, 0.14) !important;
}

:root[data-neon-cyber="1"] .alert,
:root.neon-cyber-force .alert {
  border: 1px solid rgba(0, 246, 255, 0.18) !important;
  background: linear-gradient(135deg, rgba(0, 246, 255, 0.06), rgba(255, 46, 166, 0.06)) !important;
  color: var(--nc-text) !important;
}

:root[data-neon-cyber="1"] .form-control,
:root[data-neon-cyber="1"] .form-select,
:root[data-neon-cyber="1"] input,
:root[data-neon-cyber="1"] textarea,
:root.neon-cyber-force .form-control,
:root.neon-cyber-force .form-select,
:root.neon-cyber-force input,
:root.neon-cyber-force textarea {
  min-height: 44px;
  border-radius: 14px !important;
}

:root[data-neon-cyber="1"] .nav-tabs,
:root[data-neon-cyber="1"] .nav-pills,
:root.neon-cyber-force .nav-tabs,
:root.neon-cyber-force .nav-pills {
  border-color: rgba(0, 246, 255, 0.14) !important;
}

:root[data-neon-cyber="1"] .nav-tabs .nav-link,
:root[data-neon-cyber="1"] .nav-pills .nav-link,
:root.neon-cyber-force .nav-tabs .nav-link,
:root.neon-cyber-force .nav-pills .nav-link {
  border-color: transparent !important;
  color: var(--nc-text-dim) !important;
}

:root[data-neon-cyber="1"] .nav-tabs .nav-link.active,
:root[data-neon-cyber="1"] .nav-pills .nav-link.active,
:root.neon-cyber-force .nav-tabs .nav-link.active,
:root.neon-cyber-force .nav-pills .nav-link.active {
  color: #05131d !important;
  background: linear-gradient(135deg, #00f6ff, #ff2ea6) !important;
  box-shadow: 0 10px 20px rgba(0, 246, 255, 0.18) !important;
}

:root[data-neon-cyber="1"] .pagination .page-link,
:root.neon-cyber-force .pagination .page-link {
  background: rgba(6, 14, 31, 0.9) !important;
  border-color: rgba(0, 246, 255, 0.16) !important;
  color: var(--nc-text) !important;
}

:root[data-neon-cyber="1"] .pagination .page-link:hover,
:root.neon-cyber-force .pagination .page-link:hover {
  background: rgba(0, 246, 255, 0.08) !important;
  color: #f7feff !important;
}

@media (min-width: 1200px) {
  :root[data-neon-cyber="1"] .container-xxl,
  :root.neon-cyber-force .container-xxl {
    max-width: 1360px;
  }

  :root[data-neon-cyber="1"] .card,
  :root.neon-cyber-force .card {
    border-radius: 24px !important;
  }

  :root[data-neon-cyber="1"] .btn,
  :root.neon-cyber-force .btn {
    min-height: 46px;
  }
}

@media (max-width: 991.98px) {
  :root[data-neon-cyber="1"] body::before,
  :root.neon-cyber-force body::before {
    opacity: 0.12;
    background-size: 100% 34px, 34px 100%;
  }

  :root[data-neon-cyber="1"] .card,
  :root[data-neon-cyber="1"] .van-grid-item__content,
  :root[data-neon-cyber="1"] [class*="game-card"],
  :root[data-neon-cyber="1"] [class*="game-item"],
  :root.neon-cyber-force .card,
  :root.neon-cyber-force .van-grid-item__content,
  :root.neon-cyber-force [class*="game-card"],
  :root.neon-cyber-force [class*="game-item"] {
    animation: none !important;
  }

  :root[data-neon-cyber="1"] .card,
  :root.neon-cyber-force .card {
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.34), 0 0 14px rgba(0, 246, 255, 0.18) !important;
  }

  :root[data-neon-cyber="1"] .btn,
  :root[data-neon-cyber="1"] .van-button,
  :root.neon-cyber-force .btn,
  :root.neon-cyber-force .van-button {
    width: 100%;
  }

  :root[data-neon-cyber="1"] .navbar,
  :root[data-neon-cyber="1"] .tabbar,
  :root[data-neon-cyber="1"] .header,
  :root[data-neon-cyber="1"] .topbar,
  :root.neon-cyber-force .navbar,
  :root.neon-cyber-force .tabbar,
  :root.neon-cyber-force .header,
  :root.neon-cyber-force .topbar {
    box-shadow: none !important;
  }
}

@media (max-width: 576px) {
  :root[data-neon-cyber="1"] body,
  :root.neon-cyber-force body {
    background:
      radial-gradient(800px 420px at 18% -10%, rgba(0, 246, 255, 0.12), transparent 62%),
      linear-gradient(180deg, var(--nc-bg-deep) 0%, var(--nc-bg) 100%) !important;
  }

  :root[data-neon-cyber="1"] .card,
  :root.neon-cyber-force .card {
    border-radius: 18px !important;
  }

  :root[data-neon-cyber="1"] .btn,
  :root[data-neon-cyber="1"] .van-button,
  :root.neon-cyber-force .btn,
  :root.neon-cyber-force .van-button {
    min-height: 42px;
    padding-inline: 14px;
  }

  :root[data-neon-cyber="1"] .table,
  :root.neon-cyber-force .table {
    font-size: 0.875rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-neon-cyber="1"] .btn,
  :root[data-neon-cyber="1"] .van-button,
  :root[data-neon-cyber="1"] .van-grid-item__content,
  :root[data-neon-cyber="1"] [class*="game-card"],
  :root[data-neon-cyber="1"] [class*="game-item"],
  :root.neon-cyber-force .btn,
  :root.neon-cyber-force .van-button,
  :root.neon-cyber-force .van-grid-item__content,
  :root.neon-cyber-force [class*="game-card"],
  :root.neon-cyber-force [class*="game-item"] {
    transition: none !important;
    animation: none !important;
  }

  :root[data-neon-cyber="1"] .van-grid-item__content::after,
  :root[data-neon-cyber="1"] [class*="game-card"]::after,
  :root[data-neon-cyber="1"] [class*="game-item"]::after,
  :root.neon-cyber-force .van-grid-item__content::after,
  :root.neon-cyber-force [class*="game-card"]::after,
  :root.neon-cyber-force [class*="game-item"]::after {
    animation: none !important;
  }
}
