/* ==========================================================
   Got Hot Wheels Auctions - Panel Restyle v19
   Softer texture system + tighter panels/pages/footer
   Loaded last to calm down the texture overhaul.
   ========================================================== */

:root {
  --ghw19-red: #ed111c;
  --ghw19-red-dark: #9f0007;
  --ghw19-orange: #ff9d00;
  --ghw19-yellow: #ffd34d;
  --ghw19-ink: #030406;
  --ghw19-panel: rgba(7, 10, 14, .94);
  --ghw19-panel2: rgba(11, 15, 21, .96);
  --ghw19-line: rgba(255,255,255,.12);
  --ghw19-carbon: url('/images/ghw-textures/ghw-carbon-texture.png');
  --ghw19-grunge: url('/images/ghw-textures/ghw-dark-grunge-texture.png');
}

html, body { max-width: 100%; overflow-x: hidden !important; }

body {
  background:
    radial-gradient(circle at 50% 0, rgba(255,157,0,.045), transparent 34rem),
    linear-gradient(rgba(0,0,0,.88), rgba(0,0,0,.92)),
    var(--ghw19-carbon) center top repeat !important;
  background-size: auto, auto, 660px 413px !important;
  color: #fff !important;
}

/* Do not let previous texture patch paint every section the exact same way. */
main,
.ghw-page,
.ghw-main,
.ghw-content,
.ghw-content-page,
.ghw-dashboard-page,
.ghw-orders-page,
.ghw-messages-page,
.ghw-listing-page,
.ghw-detail-page,
.ghw-checkout-page,
.ghw-admin-page,
.ghw-search-page,
.ghw-sell-page,
.ghw-section-dark {
  background: transparent !important;
}

/* Header logo glow: visible, but controlled. */
.ghwV5-logo,
.ghw5-logoWrap,
.ghw-logo,
.site-logo,
a[href="/"][class*="logo"],
.logo-wrap {
  position: relative !important;
  isolation: isolate !important;
}

.ghwV5-logo::before,
.ghw5-logoWrap::before,
.ghw-logo::before,
.site-logo::before,
a[href="/"][class*="logo"]::before,
.logo-wrap::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: 4% !important;
  right: 2% !important;
  top: 18% !important;
  bottom: 6% !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse at 46% 55%, rgba(255,210,0,.34) 0%, rgba(255,125,0,.26) 34%, rgba(237,17,28,.21) 58%, rgba(237,17,28,0) 78%) !important;
  filter: blur(22px) !important;
  transform: scale(1.08) !important;
}

.ghwV5-logo img,
.ghw5-logoWrap img,
.ghw-logo img,
.site-logo img,
.logo-wrap img {
  filter:
    drop-shadow(0 0 6px rgba(255,185,0,.36))
    drop-shadow(0 0 15px rgba(237,17,28,.28)) !important;
}

/* Blinking LIVE dot and badges. */
@keyframes ghw19LivePulse {
  0%, 100% { opacity: 1; transform: scale(1); filter: drop-shadow(0 0 3px rgba(255,0,0,.65)); }
  50% { opacity: .48; transform: scale(.92); filter: drop-shadow(0 0 15px rgba(255,0,0,1)); }
}
@keyframes ghw19LiveBadgePulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 8px rgba(237,17,28,.38); }
  50% { opacity: .58; box-shadow: 0 0 18px rgba(237,17,28,.88); }
}

.ghw19-live-dot,
.ghw-live-dot,
.live-dot,
.ghw-section-heading .dot,
.ghw-auction-heading .dot,
.ghw-featured-heading .dot,
.ghwV5-liveDot {
  animation: ghw19LivePulse .95s infinite ease-in-out !important;
  transform-origin: center !important;
}

.ghwV5-live,
.ghw-live,
.ghw-card-live,
.ghw-live-badge,
.badge-live,
.live-badge,
[data-live="true"] {
  animation: ghw19LiveBadgePulse 1.05s infinite ease-in-out !important;
}

/* Top social icons: keep Facebook only. JS handles text nodes; CSS handles common class/link cases. */
.ghwV5-topLinks .ghwV5-social:nth-of-type(n+2),
.ghw5-topbar .ghwV5-social:nth-of-type(n+2),
.ghw-topbar .ghw-social:nth-of-type(n+2),
.site-topbar .social:nth-of-type(n+2) { display: none !important; }

/* HERO: leave image clean, no busy texture overlay. */
.ghw-hero,
.ghw5-hero,
.home-hero,
.hero-section {
  background-size: cover !important;
  background-position: center center !important;
  box-shadow:
    inset 0 22px 35px rgba(0,0,0,.54),
    inset 0 -30px 44px rgba(0,0,0,.76) !important;
}

/* Benefit strip: clean metal bar. */
.ghw-benefits,
.ghw-feature-bar,
.ghw-trust-row {
  background:
    linear-gradient(180deg, rgba(17,23,30,.98), rgba(7,9,12,.98)) !important;
  border-top: 1px solid rgba(255,157,0,.55) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

/* CATEGORIES: one clean carbon panel, not too tall. */
.ghw-category-section,
.ghw-categories,
.ghw-categories-section,
.categories-section,
#categories {
  padding-top: 31px !important;
  padding-bottom: 30px !important;
  background:
    radial-gradient(circle at 50% 40%, rgba(255,157,0,.10), transparent 26rem),
    linear-gradient(rgba(0,0,0,.76), rgba(0,0,0,.88)),
    var(--ghw19-carbon) center center repeat !important;
  background-size: auto, auto, 660px 413px !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

.ghw-category-section h2,
.ghw-categories h2,
.ghw-categories-section h2,
.categories-section h2,
#categories h2 {
  margin: 0 0 26px !important;
  line-height: 1 !important;
}

.ghw-category-list,
.ghw-category-strip,
.category-grid,
.categories-grid,
.ghw-cats-grid {
  gap: clamp(16px, 1.7vw, 27px) !important;
  align-items: start !important;
  justify-content: center !important;
}

.ghw-circle,
.ghw-category-orb,
.category-item .circle,
.ghw-cat-circle {
  width: 92px !important;
  height: 92px !important;
  margin-bottom: 8px !important;
}

.ghw-category-label,
.category-item .label,
.ghw-cat-label {
  font-size: 13px !important;
  line-height: 1.05 !important;
}

/* FEATURED AUCTIONS: reduce weird empty canvas; center the content inside a premium strip. */
.ghw-featured-section,
.ghw-auction-section,
.ghw-auctions-section,
.home-live-section,
.live-featured,
.featured-auctions {
  padding-top: 28px !important;
  padding-bottom: 30px !important;
  min-height: 0 !important;
  background:
    radial-gradient(circle at 44% 50%, rgba(237,17,28,.16), transparent 26rem),
    linear-gradient(90deg, rgba(0,0,0,.96), rgba(15,5,5,.92) 52%, rgba(0,0,0,.96)),
    var(--ghw19-carbon) center center repeat !important;
  background-size: auto, auto, 660px 413px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  border-bottom: 1px solid rgba(255,157,0,.25) !important;
}

.ghw-featured-section .ghw-wrap,
.ghw-auction-section .ghw-wrap,
.ghw-auctions-section .ghw-wrap,
.home-live-section .ghw-wrap,
.live-featured .ghw-wrap,
.featured-auctions .ghw-wrap {
  width: min(1180px, calc(100% - 44px)) !important;
}

.ghw-auction-heading,
.ghw-section-heading,
.ghw-featured-heading,
.live-featured h2,
.featured-auctions h2 {
  margin-bottom: 22px !important;
}

.ghw-auction-grid,
.ghw-listing-grid,
.ghw-featured-grid,
.auction-grid,
.listing-grid {
  gap: 18px !important;
  align-items: start !important;
  justify-content: flex-start !important;
}

.ghw-auction-card,
.ghw-listing-card,
.auction-card,
.listing-card {
  background:
    linear-gradient(180deg, rgba(11,16,23,.98), rgba(5,7,10,.98)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 20px 42px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.025) !important;
}

/* HOW IT WORKS: shorter, richer red panel. */
.ghw-how,
.ghw-how-section,
.how-it-works,
.how-it-works-section {
  padding-top: 28px !important;
  padding-bottom: 34px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,190,0,.16), transparent 24rem),
    linear-gradient(rgba(176,0,8,.88), rgba(132,0,5,.92)),
    var(--ghw19-grunge) center center cover !important;
  border-top: 1px solid rgba(255,157,0,.32) !important;
  border-bottom: 1px solid rgba(255,157,0,.24) !important;
}

.ghw-how h2,
.ghw-how-section h2,
.how-it-works h2,
.how-it-works-section h2 {
  margin: 0 0 25px !important;
  line-height: 1 !important;
}

.ghw-how-grid,
.how-step-grid,
.ghw-steps,
.how-steps {
  gap: 15px !important;
}

.ghw-how-grid article,
.ghw-step,
.how-step-card {
  min-height: 128px !important;
  padding: 16px 17px 15px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(22,8,5,.96), rgba(8,5,4,.97)) !important;
  border: 1px solid rgba(255,157,0,.82) !important;
  box-shadow: 0 15px 30px rgba(0,0,0,.28), inset 0 0 18px rgba(255,157,0,.045) !important;
}

.ghw-how-grid article h3,
.ghw-step h3,
.how-step-card h3 {
  margin-bottom: 7px !important;
  font-size: 14px !important;
}

.ghw-how-grid article p,
.ghw-step p,
.how-step-card p {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

/* Page shells: orders/messages/dashboard/content pages should look like finished panels. */
.ghw-page-shell,
.ghw-orders-page,
.ghw-messages-page,
.ghw-dashboard-page,
.ghw-search-page,
.ghw-content-page,
.ghw-sell-page,
.ghw-admin-page {
  padding: 22px 0 26px !important;
  min-height: 42vh !important;
  background:
    radial-gradient(circle at 72% 0%, rgba(237,17,28,.09), transparent 30rem),
    radial-gradient(circle at 25% 16%, rgba(255,157,0,.055), transparent 28rem),
    linear-gradient(rgba(0,0,0,.78), rgba(0,0,0,.90)),
    var(--ghw19-carbon) center top repeat !important;
  background-size: auto, auto, auto, 660px 413px !important;
}

.ghw-page-wrap,
.ghw-dashboard-wrap,
.ghw-orders-wrap,
.ghw-messages-wrap {
  width: min(1180px, calc(100% - 44px)) !important;
  margin-inline: auto !important;
}

.ghw-page-hero,
.ghw-orders-hero,
.ghw-messages-hero,
.ghw-dashboard-hero,
.ghw-checkout-hero {
  padding: 20px 22px !important;
  margin: 0 auto 16px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,157,0,.22) !important;
  background:
    linear-gradient(135deg, rgba(12,16,22,.96), rgba(4,5,8,.96)) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.34) !important;
}

.ghw-page-hero h1,
.ghw-orders-hero h1,
.ghw-messages-hero h1,
.ghw-dashboard-hero h1,
.ghw-checkout-hero h1 {
  margin: 4px 0 7px !important;
  font-size: clamp(34px, 3vw, 48px) !important;
  line-height: .96 !important;
}

.ghw-page-hero p,
.ghw-orders-hero p,
.ghw-messages-hero p,
.ghw-dashboard-hero p,
.ghw-checkout-hero p {
  margin: 0 !important;
  max-width: 760px !important;
  color: #dce4ee !important;
}

.ghw-page-actions { margin-top: 14px !important; }

.ghw-content-panel,
.ghw-orders-panel,
.ghw-messages-panel,
.ghw-dashboard-panel,
.ghw-checkout-card,
.ghw-empty-panel {
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background:
    linear-gradient(180deg, rgba(10,15,21,.96), rgba(4,6,9,.97)) !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.36) !important;
}

.ghw-content-panel { padding: 18px !important; }
.ghw-empty-panel { min-height: 155px !important; padding: 24px !important; }
.ghw-empty-panel h2 { font-size: 24px !important; margin-bottom: 8px !important; }
.ghw-empty-panel p { margin-bottom: 14px !important; }

/* Some pages still render simple text before their panel. Make it look intentional. */
.ghw-page-shell > .ghw-page-wrap > header + a,
.ghw-page-shell > .ghw-page-wrap > a {
  display: inline-flex !important;
  min-height: 40px !important;
  align-items: center !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255,157,0,.62) !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}

/* Footer: intentionally compact, no tall empty area. */
footer,
.ghw5-footer,
.ghw-footer,
.ghw-site-footer,
.site-footer {
  padding-top: 16px !important;
  padding-bottom: 8px !important;
  background:
    linear-gradient(rgba(0,0,0,.92), rgba(0,0,0,.96)),
    var(--ghw19-carbon) center center repeat !important;
  background-size: auto, 660px 413px !important;
  border-top: 1px solid rgba(255,255,255,.11) !important;
}

.ghw5-footer .ghw5-wrap,
.ghw-footer .ghw-wrap,
.site-footer .wrap,
footer > div {
  width: min(1160px, calc(100% - 44px)) !important;
}

.ghw5-footerMain,
.ghw-footer-grid,
.ghw-footer-main,
.site-footer .footer-main,
footer .footer-main {
  display: grid !important;
  grid-template-columns: 1.2fr .88fr .95fr .88fr 1.25fr !important;
  gap: 22px !important;
  align-items: start !important;
  padding-top: 0 !important;
  padding-bottom: 12px !important;
}

.ghw5-footerBrand img,
.ghw-footer-brand img,
.site-footer .footer-brand img,
footer img[alt*="Got"],
footer img[src*="logo"] {
  max-width: 152px !important;
  margin-bottom: 7px !important;
  filter: drop-shadow(0 0 10px rgba(255,157,0,.20)) drop-shadow(0 0 18px rgba(237,17,28,.16)) !important;
}

.ghw5-footerBrand p,
.ghw-footer-brand p,
.site-footer .footer-brand p,
footer p {
  margin: 0 0 5px !important;
  line-height: 1.25 !important;
  font-size: 13px !important;
}

.ghw5-footer h3,
.ghw5-footer h4,
.ghw-footer h3,
.ghw-footer h4,
.site-footer h3,
.site-footer h4,
footer h3,
footer h4 {
  margin: 0 0 7px !important;
  line-height: 1 !important;
  font-size: 16px !important;
}

.ghw5-footer ul,
.ghw-footer ul,
.site-footer ul,
footer ul { margin: 0 !important; padding: 0 !important; }

.ghw5-footer li,
.ghw-footer li,
.site-footer li,
footer li { margin-bottom: 3px !important; line-height: 1.12 !important; }

.ghw5-footer a,
.ghw-footer a,
.site-footer a,
footer a { line-height: 1.15 !important; }

.ghw5-socials,
.ghw-footer-social,
.footer-social,
.social-links {
  margin-top: 8px !important;
  display: flex !important;
  gap: 0 !important;
}

.ghw5-socials > *:not(:first-child),
.ghw-footer-social > *:not(:first-child),
.footer-social > *:not(:first-child),
.social-links > *:not(:first-child) { display: none !important; }

.ghw5-newsletter input,
.ghw-footer-newsletter input,
.site-footer input[type="email"],
footer input[type="email"] {
  height: 38px !important;
  min-height: 38px !important;
  margin-bottom: 8px !important;
  padding: 0 13px !important;
}

.ghw5-newsletter button,
.ghw-footer-newsletter button,
.site-footer button,
footer button[type="submit"] {
  height: 40px !important;
  min-height: 40px !important;
  margin-top: 0 !important;
}

.ghw5-footerBottom,
.ghw-footer-bottom,
.site-footer .footer-bottom,
footer .footer-bottom {
  margin-top: 10px !important;
  padding-top: 10px !important;
  min-height: 0 !important;
  font-size: 12px !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
}

.ghw5-footerBottom > *,
.ghw-footer-bottom > *,
.site-footer .footer-bottom > *,
footer .footer-bottom > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile: keep panels compact and readable. */
@media (max-width: 900px) {
  .ghw-category-section,
  .ghw-categories,
  .ghw-categories-section,
  .categories-section,
  #categories { padding: 24px 0 24px !important; }
  .ghw-featured-section,
  .ghw-auction-section,
  .ghw-auctions-section,
  .home-live-section,
  .live-featured,
  .featured-auctions { padding: 24px 0 !important; }
  .ghw-how,
  .ghw-how-section,
  .how-it-works,
  .how-it-works-section { padding: 25px 0 !important; }
  .ghw5-footerMain,
  .ghw-footer-grid,
  .ghw-footer-main,
  .site-footer .footer-main,
  footer .footer-main { grid-template-columns: 1fr 1fr !important; gap: 18px !important; }
}

@media (max-width: 620px) {
  .ghw5-footerMain,
  .ghw-footer-grid,
  .ghw-footer-main,
  .site-footer .footer-main,
  footer .footer-main { grid-template-columns: 1fr !important; }
  .ghw-page-wrap,
  .ghw-dashboard-wrap,
  .ghw-orders-wrap,
  .ghw-messages-wrap { width: min(100% - 26px, 100%) !important; }
}