/* Brand correction for game detail and cart.
   Keeps checkout/card flows in the approved Playful Premium style instead of competitor orange/brown. */

.app.game-detail-page,
.app.cart-page {
  background:
    radial-gradient(circle at 8% 0%, rgba(58, 120, 255, 0.18), transparent 34%),
    radial-gradient(circle at 96% 12%, rgba(93, 231, 255, 0.12), transparent 30%),
    #050916;
}

.game-detail-art {
  border-color: rgba(93, 231, 255, 0.34) !important;
  background:
    radial-gradient(circle at 16% 10%, rgba(93, 231, 255, 0.22), transparent 32%),
    radial-gradient(circle at 84% 16%, rgba(89, 126, 255, 0.22), transparent 31%),
    linear-gradient(135deg, rgba(20, 52, 94, 0.94), rgba(7, 13, 28, 0.98)) !important;
  box-shadow:
    0 24px 70px rgba(0, 0, 0, 0.44),
    0 0 0 1px rgba(93, 231, 255, 0.08) inset,
    0 0 42px rgba(55, 145, 255, 0.1);
}

.game-detail-art::after {
  background: radial-gradient(ellipse at center, rgba(93, 231, 255, 0.22), transparent 62%);
}

.game-detail-theme-ufc .game-detail-art,
.game-detail-theme-black-flag .game-detail-art,
.game-detail-theme-fc26 .game-detail-art,
.game-detail-theme-fc25 .game-detail-art {
  border-color: rgba(93, 231, 255, 0.36) !important;
  background:
    radial-gradient(circle at 18% 10%, rgba(93, 231, 255, 0.24), transparent 33%),
    radial-gradient(circle at 84% 16%, rgba(116, 91, 255, 0.22), transparent 31%),
    linear-gradient(135deg, rgba(19, 50, 91, 0.94), rgba(7, 13, 28, 0.98)) !important;
}

.game-detail-art-tag {
  background: linear-gradient(100deg, #5de7ff, #4e80ff 54%, #f1d06a) !important;
  color: #06111f;
  box-shadow: 0 12px 24px rgba(93, 231, 255, 0.18);
}

.game-detail-price-card,
.cart-list,
.cart-summary,
.cart-form-card,
.cart-empty {
  border-color: rgba(93, 231, 255, 0.14) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(93, 231, 255, 0.12), transparent 38%),
    linear-gradient(135deg, rgba(14, 31, 57, 0.96), rgba(8, 13, 29, 0.96)) !important;
}

.game-detail-price-main,
.cart-line-price,
.cart-total-row strong {
  color: #fffdf8;
  text-shadow:
    0 6px 24px rgba(93, 231, 255, 0.16),
    0 2px 0 rgba(0, 0, 0, 0.22) !important;
}

.game-detail-cart,
.cart-pay-button {
  min-height: 58px;
  background: linear-gradient(100deg, #5de7ff, #4e80ff 58%, #6c5dff) !important;
  color: #06111f !important;
  box-shadow:
    0 18px 38px rgba(78, 128, 255, 0.25),
    0 0 0 1px rgba(255, 255, 255, 0.18) inset !important;
}

.game-detail-cart.is-in-cart {
  background: linear-gradient(100deg, #f3d575, #f7b84d 54%, #61d5ff) !important;
  color: #06111f !important;
  box-shadow:
    0 18px 38px rgba(243, 213, 117, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.22) inset !important;
}

.cart-pay-button {
  font-size: 18px;
  letter-spacing: -0.2px;
}

.cart-check-row input:checked {
  border-color: #5de7ff !important;
  background: linear-gradient(135deg, #5de7ff, #4e80ff) !important;
  box-shadow: 0 0 0 4px rgba(93, 231, 255, 0.12) !important;
}

.cart-explain {
  border-color: rgba(93, 231, 255, 0.18) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(93, 231, 255, 0.1), transparent 38%),
    linear-gradient(135deg, rgba(14, 31, 57, 0.94), rgba(8, 13, 29, 0.96)) !important;
}

.cart-explain li::before {
  background: #5de7ff !important;
  box-shadow: 0 0 14px rgba(93, 231, 255, 0.55) !important;
}

.cart-remove {
  background: rgba(93, 231, 255, 0.1) !important;
  color: rgba(237, 243, 255, 0.86) !important;
}

.cart-remove:hover,
.cart-qty button:hover {
  color: #5de7ff !important;
}

.cart-promo-row,
.cart-check-row {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(93, 231, 255, 0.12) !important;
}

@media (max-width: 560px) {
  .game-detail-cart,
  .cart-pay-button {
    min-height: 56px;
  }
}