/*
 * ScooterGP stable child theme overrides.
 * Keep these rules narrow: the menu and category modules stay driven by PrestaShop/TVCMS.
 */

:root {
  --sgp-blue: #1454ff;
  --sgp-ink: #07102f;
  --sgp-line: #e8edf7;
}

/* Safety: ThemeVolty switches to the mobile/tablet header below 1200px. */
@media (max-width: 1199px) {
  #header .tvmobile-slidebar:not(.open) {
    left: -110vw !important;
    transform: translateX(-110%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  #header .tvmobile-slidebar.open {
    left: 0 !important;
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  #header .tvmobile-slidebar .tv-menu-horizontal ul li.level-1 > a,
  #header .tvmobile-slidebar .tv-menu-horizontal ul li.level-1 > a span {
    color: var(--sgp-ink) !important;
    text-shadow: none !important;
  }
}

/* Desktop polish without changing the menu structure. */
@media (min-width: 1200px) {
  #header .tvcmsdesktop-top-second > .container,
  #header .tvcms-header-menu-offer-wrapper {
    max-width: 1536px;
    margin-left: auto;
    margin-right: auto;
  }

  #header .tv-menu-horizontal ul li.level-1 > a {
    letter-spacing: 0;
    text-transform: uppercase;
  }

  #header .tv-menu-horizontal ul li.level-1:hover > a,
  #header .tv-menu-horizontal ul li.level-1:hover > a span {
    color: var(--sgp-blue) !important;
  }
}

/* Robust category cards: some module images are rendered with width/height="0". */
.tvcategory-chain-slider .tvcategory-chin-img-block {
  aspect-ratio: 1.18;
  overflow: hidden;
  background: #f5f7fb;
}

.tvcategory-chain-slider .tvcategory-chin-img-block img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.tvcategory-chain-slider .tvcategory-chain-title a,
.tvcategory-chain-slider .tvcategory-chain-slider-category {
  color: var(--sgp-ink);
  text-shadow: none !important;
}

.tvcategory-chain-slider .tvcategory-chain-slider-category:hover,
.tvcategory-chain-slider .tvcategory-chain-title a:hover {
  color: var(--sgp-blue);
}
