/**
 * Gallery page v2 — dark Feedback-style header + themed grid/CTAs.
 * Revert: set MAXTRAC_GALLERY_V2 to false in includes/redesign.php
 * Variables: colors + font-family only.
 */

body.gallery-v2 {
  --gallery-orange: #ff641f;
  --gallery-dark: #414042;
  --gallery-darker: #231f20;
  --gallery-white: #ffffff;
  --gallery-muted: #58595b;
  --gallery-border: #e6e7e8;
  --gallery-font: 'BebasNeue-Regular', 'Bebas Neue', 'agency_fb', sans-serif;
  --gallery-body-font: Montserrat, Arial, Helvetica, sans-serif;
}

body.gallery-v2 header.page--header {
  display: none !important;
}

/* ------------------------------------------------------------------
   Dark header (title + breadcrumbs only — no vehicle form / compat)
   ------------------------------------------------------------------ */
body.gallery-v2 .gallery-page__top,
body.gallery-v2 .gallery-page__top .plp-page-header {
  background: var(--gallery-dark) !important;
}

body.gallery-v2 .site-nav--v2__sub {
  background: var(--gallery-dark);
}

body.gallery-v2:not(.sticky-header) .site-nav--v2.plp-v2 .site-nav--v2__utility-menu a {
  color: var(--gallery-white);
}

body.gallery-v2:not(.sticky-header) .site-nav--v2.plp-v2 .site-nav--v2__utility-menu a:hover {
  color: var(--gallery-orange);
}

body.gallery-v2 .gallery-page__top .plp-page-header__inner {
  width: 100%;
  max-width: 1620px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 50px 24px;
  box-sizing: border-box;
}

body.gallery-v2 .gallery-page__top .plp-page-header__title {
  margin: 0 0 15px;
  color: var(--gallery-white);
  font-family: var(--gallery-font);
  font-size: 37px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1px;
  text-transform: uppercase;
}

body.gallery-v2 .gallery-page__top .plp-page-header__compat {
  display: none !important;
}

body.gallery-v2 .gallery-page__top .plp-page-header .mt-breadcrumbs,
body.gallery-v2 .gallery-page__top .plp-page-header .breadcrumbs {
  font-family: var(--gallery-font);
  font-size: 14px;
}

body.gallery-v2 .gallery-page__top .plp-page-header .mt-breadcrumbs a {
  color: var(--gallery-orange) !important;
  text-decoration: none;
}

body.gallery-v2 .gallery-page__top .plp-page-header .mt-breadcrumbs a:hover {
  color: var(--gallery-white) !important;
}

body.gallery-v2 .gallery-page__top .plp-page-header .mt-breadcrumbs__sep,
body.gallery-v2 .gallery-page__top .plp-page-header .mt-breadcrumbs__current {
  color: var(--gallery-white);
}

/* ------------------------------------------------------------------
   Gallery content block
   ------------------------------------------------------------------ */
body.gallery-v2 .block--gallery {
  background: var(--gallery-white);
  padding: 40px 0 80px;
  position: relative;
}

body.gallery-v2 .block--gallery .bottom-rough-2,
body.gallery-v2 .block--gallery .rough-edge-bottom {
  display: none !important;
}

body.gallery-v2 .block--gallery > .container {
  width: 100%;
  max-width: 1620px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
  box-sizing: border-box;
}

body.gallery-v2 .custom-gallery .breadcrumbs {
  display: none !important;
}

body.gallery-v2 .custom-gallery ul {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0;
  padding: 0 0 40px;
  border-bottom: 1px solid var(--gallery-border);
  list-style: none;
}

body.gallery-v2 .custom-gallery ul li {
  width: calc(25% - 12px);
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}

body.gallery-v2 .custom-gallery ul li a {
  display: block;
  color: var(--gallery-darker);
  text-decoration: none;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

body.gallery-v2 .custom-gallery ul li a:hover {
  color: var(--gallery-orange);
}

body.gallery-v2 .custom-gallery ul li img {
  display: block;
  width: 100%;
  height: 280px;
  object-fit: cover;
}

body.gallery-v2 .custom-gallery ul li span {
  display: block;
  padding-top: 12px;
  font-family: var(--gallery-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gallery-muted);
}

body.gallery-v2 .custom-gallery ul li a:hover span {
  color: var(--gallery-orange);
}

/* Make tiles (first step) */
body.gallery-v2 .custom-gallery ul.first-step {
  row-gap: 16px;
}

body.gallery-v2 .custom-gallery ul.first-step li {
  min-height: 205px;
  border: 1px solid var(--gallery-border);
  border-radius: 0;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: var(--gallery-white);
  transition: border-color 0.2s ease;
}

body.gallery-v2 .custom-gallery ul.first-step li:hover {
  border-color: var(--gallery-orange);
}

body.gallery-v2 .custom-gallery ul.first-step img {
  max-width: 190px;
  height: auto;
  margin-top: -28px;
  padding-bottom: 10px;
  object-fit: contain;
}

body.gallery-v2 .custom-gallery ul.first-step li span.first-label {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 8px;
  background: var(--gallery-darker);
  color: var(--gallery-white);
  font-family: var(--gallery-font);
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 0;
  transition: background-color 0.2s ease;
}

body.gallery-v2 .custom-gallery ul.first-step li a:hover span.first-label,
body.gallery-v2 .custom-gallery ul.first-step li span.first-label:hover {
  background: var(--gallery-orange);
  color: var(--gallery-white);
}

body.gallery-v2 .custom-gallery .not-found {
  margin: 24px 0;
  font-family: var(--gallery-font);
  font-size: 22px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gallery-muted);
}

/* ------------------------------------------------------------------
   CTAs — Submit photos / View products (solid hover, no legacy ::before slide)
   ------------------------------------------------------------------ */
body.gallery-v2 .block--gallery button[data-toggle='submit-photo'],
body.gallery-v2 .custom-gallery button[data-toggle='submit-photo'],
body.gallery-v2 .custom-gallery .button-section .btn,
body.gallery-v2 .custom-gallery .button-section .btn--secondary,
body.gallery-v2 .custom-gallery .button-section .btn--primary,
body.gallery-v2 .gallery-productinfo-page .button-section .btn,
body.gallery-v2 .gallery-productinfo-page .button-section .btn--secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 0;
  width: auto;
  min-width: 280px;
  max-width: 100%;
  height: 48px;
  margin: 0;
  padding: 0 28px;
  border: 0;
  border-radius: 0;
  background: var(--gallery-orange) !important;
  background-color: var(--gallery-orange) !important;
  color: var(--gallery-white) !important;
  font-family: var(--gallery-font);
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  box-shadow: none;
  overflow: hidden;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Submit photos — centered */
body.gallery-v2 .block--gallery button[data-toggle='submit-photo'],
body.gallery-v2 .custom-gallery button[data-toggle='submit-photo'] {
  margin: 40px auto 0;
}

body.gallery-v2 .block--gallery button[data-toggle='submit-photo']::before,
body.gallery-v2 .custom-gallery button[data-toggle='submit-photo']::before,
body.gallery-v2 .custom-gallery .button-section .btn::before,
body.gallery-v2 .custom-gallery .button-section .btn--secondary::before,
body.gallery-v2 .custom-gallery .button-section .btn--primary::before,
body.gallery-v2 .gallery-productinfo-page .button-section .btn::before,
body.gallery-v2 .gallery-productinfo-page .button-section .btn--secondary::before {
  content: none !important;
  display: none !important;
}

body.gallery-v2 .block--gallery button[data-toggle='submit-photo']:hover,
body.gallery-v2 .block--gallery button[data-toggle='submit-photo']:focus,
body.gallery-v2 .custom-gallery button[data-toggle='submit-photo']:hover,
body.gallery-v2 .custom-gallery button[data-toggle='submit-photo']:focus,
body.gallery-v2 .custom-gallery .button-section .btn:hover,
body.gallery-v2 .custom-gallery .button-section .btn:focus,
body.gallery-v2 .custom-gallery .button-section .btn--secondary:hover,
body.gallery-v2 .custom-gallery .button-section .btn--secondary:focus,
body.gallery-v2 .gallery-productinfo-page .button-section .btn:hover,
body.gallery-v2 .gallery-productinfo-page .button-section .btn:focus {
  background: var(--gallery-darker) !important;
  background-color: var(--gallery-darker) !important;
  color: var(--gallery-white) !important;
  outline: 0;
}

body.gallery-v2 .custom-gallery .button-section .btn a,
body.gallery-v2 .custom-gallery .button-section .btn--secondary a,
body.gallery-v2 .gallery-productinfo-page .button-section .btn a {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit !important;
  text-decoration: none;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

/* ------------------------------------------------------------------
   Gallery detail — product info (title, DESCRIPTION, specs, CTA)
   ------------------------------------------------------------------ */
body.gallery-v2 .gallery-productinfo-page {
  margin: 0 0 8px;
}

body.gallery-v2 .gallery-productinfo-page .gallery-productinfo,
body.gallery-v2 .gallery-productinfo {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: flex-start;
  font-family: var(--gallery-body-font);
  color: var(--gallery-muted);
}

body.gallery-v2 .gallery-productinfo-page .gallery-productinfo .leftsection,
body.gallery-v2 .gallery-productinfo .leftsection {
  flex: 1 1 48%;
  width: auto;
  min-width: 280px;
  max-width: 100%;
}

body.gallery-v2 .gallery-productinfo-page .gallery-productinfo .rightsection,
body.gallery-v2 .gallery-productinfo .rightsection {
  flex: 1 1 48%;
  width: auto;
  min-width: 280px;
  max-width: 100%;
}

body.gallery-v2 .gallery-productinfo .product-detailsections {
  text-align: left;
}

body.gallery-v2 .gallery-productinfo .product-detailsections h1.product-title {
  margin: 0 0 16px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--gallery-border);
  color: var(--gallery-darker) !important;
  font-family: var(--gallery-font) !important;
  font-size: 32px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 1.1 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}

body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-tabs.wc-tabs-wrapper {
  margin-top: 8px;
}

body.gallery-v2 .gallery-productinfo .product-detailsections ul.tabs.wc-tabs {
  display: block;
  gap: 0;
  margin: 0 0 16px;
  padding: 0;
  border: 0;
  list-style: none;
}

body.gallery-v2 .gallery-productinfo .product-detailsections ul.tabs.wc-tabs li {
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  text-align: left;
  background: transparent;
}

body.gallery-v2 .gallery-productinfo .product-detailsections ul.tabs.wc-tabs li label {
  display: block;
  margin: 0;
  padding: 0;
  color: var(--gallery-orange);
  font-family: var(--gallery-font);
  font-size: 26px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: default;
}

body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel {
  margin: 0;
  padding: 0;
}

body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 32px;
  row-gap: 16px;
  margin: 0;
  padding: 0 0 8px;
  border: 0;
  list-style: none;
}

body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel ul li {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  text-align: left;
  font-family: var(--gallery-font);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--gallery-muted);
}

body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel ul li strong {
  display: inline;
  margin: 0;
  padding: 0;
  margin-right: 6px;
  color: var(--gallery-darker);
  font-family: var(--gallery-font);
  font-size: inherit;
  font-weight: 400;
  letter-spacing: inherit;
  text-transform: uppercase;
}

body.gallery-v2 .gallery-productinfo .additional-notes {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--gallery-border);
}

body.gallery-v2 .gallery-productinfo .additional-notes label {
  display: block;
  margin: 0 0 8px;
  color: var(--gallery-orange);
  font-family: var(--gallery-font);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.gallery-v2 .gallery-productinfo .additional-notes p {
  margin: 0;
  color: var(--gallery-muted);
  font-family: var(--gallery-body-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
  text-transform: none;
  letter-spacing: 0;
}

/* View Products — left aligned (hover handled above; no ::before slide) */
body.gallery-v2 .gallery-productinfo-page .button-section,
body.gallery-v2 .gallery-productinfo .button-section,
body.gallery-v2 .product-detailsections + .button-section,
body.gallery-v2 .custom-gallery .gallery-productinfo-page .button-section {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  text-align: left;
}

body.gallery-v2 .gallery-productinfo-page .button-section .btn,
body.gallery-v2 .gallery-productinfo-page .button-section .btn--secondary {
  margin: 0;
  min-width: 200px;
}

/* Image slider accents */
body.gallery-v2 .product-gallery .slider-thumbs .slick-current img {
  border-color: var(--gallery-orange);
}

body.gallery-v2 .product-gallery .slick-prev,
body.gallery-v2 .product-gallery .slick-next {
  background: var(--gallery-darker);
}

body.gallery-v2 .product-gallery .slick-prev:hover,
body.gallery-v2 .product-gallery .slick-next:hover {
  background: var(--gallery-orange);
}

/* ------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------ */
@media (max-width: 1200px) {
  body.gallery-v2 .custom-gallery ul li {
    width: calc(33.333% - 11px);
  }

  body.gallery-v2 .custom-gallery ul.first-step li {
    min-height: 190px;
  }

  body.gallery-v2 .custom-gallery ul li span {
    font-size: 16px;
  }

  body.gallery-v2 .gallery-productinfo .product-detailsections h1.product-title {
    font-size: 28px !important;
  }
}

@media (max-width: 991px) {
  body.gallery-v2 .custom-gallery ul li {
    width: calc(50% - 8px);
  }

  body.gallery-v2 .custom-gallery ul.first-step li img {
    padding: 10px;
    margin-top: 0;
  }

  body.gallery-v2 .gallery-productinfo-page .gallery-productinfo,
  body.gallery-v2 .gallery-productinfo {
    flex-direction: column;
    gap: 28px;
  }

  body.gallery-v2 .gallery-productinfo-page .gallery-productinfo .leftsection,
  body.gallery-v2 .gallery-productinfo-page .gallery-productinfo .rightsection,
  body.gallery-v2 .gallery-productinfo .leftsection,
  body.gallery-v2 .gallery-productinfo .rightsection {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 767px) {
  body.gallery-v2 .gallery-page__top .plp-page-header__inner,
  body.gallery-v2 .block--gallery > .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  body.gallery-v2 .gallery-page__top .plp-page-header__title {
    font-size: 30px;
  }

  body.gallery-v2 .block--gallery {
    padding: 28px 0 56px;
  }

  body.gallery-v2 .custom-gallery ul li {
    width: 100%;
  }

  body.gallery-v2 .gallery-productinfo .product-detailsections h1.product-title {
    font-size: 24px !important;
  }

  body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel ul {
    grid-template-columns: 1fr;
    row-gap: 10px;
  }

  body.gallery-v2 .gallery-productinfo .product-detailsections .woocommerce-Tabs-panel ul li {
    font-size: 18px;
  }

  body.gallery-v2 .block--gallery button[data-toggle='submit-photo'],
  body.gallery-v2 .custom-gallery .button-section .btn,
  body.gallery-v2 .gallery-productinfo-page .button-section .btn {
    width: 100%;
    min-width: 0;
  }
}