/*
 * Greedy Pigs Neon — Single Product Modern Layout
 *
 * Intent: remove the "WordPress blocks" feel and provide a clean,
 * premium product layout (desktop + mobile) while keeping the neon identity.
 */

:root{
  --gp-neon:#ff97cd;
  --gp-neon-soft:rgba(255,151,205,.35);
  --gp-glass:rgba(255,255,255,.04);
  --gp-stroke:rgba(255,151,205,.18);
  --gp-black:#0b0b0d;
}

/* -------- Page shell -------- */
.single-product .gp-sp-modern{
  padding: 10px 0 34px;
}
.single-product .gp-sp-modern__wrap{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px 0;
}

/* Reduce global Woo "boxed" styling impact on this page */
.single-product .gp-sp-modern .woocommerce-tabs{display:none !important;}

/* -------- Hero layout -------- */
.single-product .gp-sp-modern__hero{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 24px;
  align-items: start;
}

.single-product .gp-sp-modern__media{
  border-radius: 22px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border: 1px solid var(--gp-stroke);
  box-shadow: 0 0 24px rgba(255,151,205,.08), inset 0 0 0 1px rgba(255,255,255,.02);
}

.single-product .gp-sp-modern__img,
.single-product .gp-sp-modern__img-ph{
  display:block;
  width: 100%;
  aspect-ratio: 16 / 10;
  height: auto;
}
.single-product .gp-sp-modern__img{
  object-fit: cover;
}
.single-product .gp-sp-modern__img-ph{
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.78);
  font-weight: 800;
  letter-spacing: .3px;
  background: radial-gradient(circle at 20% 20%, rgba(255,151,205,.10), rgba(0,0,0,0) 55%),
              radial-gradient(circle at 80% 40%, rgba(255,151,205,.08), rgba(0,0,0,0) 60%),
              rgba(255,255,255,.02);
}
.single-product .gp-sp-modern__img-ph span{
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,151,205,.28);
  background: rgba(0,0,0,.35);
}

/* -------- Buy panel -------- */
.single-product .gp-sp-modern__buy-inner{
  position: sticky;
  top: 96px; /* clears sticky header */
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  border: 1px solid rgba(255,151,205,.22);
  box-shadow: 0 0 24px rgba(255,151,205,.08), inset 0 0 0 1px rgba(255,255,255,.02);
  padding: 18px 18px 16px;
}

.single-product .gp-sp-modern__header{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  gap: 16px;
  margin: 2px 0 12px;
}

.single-product .gp-sp-modern__title{
  margin: 0;
  color: #fff;
  font-weight: 900;
  font-size: 28px;
  line-height: 1.15;
  text-shadow: 0 0 12px var(--gp-neon-soft);
}

.single-product .gp-sp-modern__price{
  white-space: nowrap;
  font-weight: 900;
}
.single-product .gp-sp-modern__price .price,
.single-product .gp-sp-modern__price .woocommerce-Price-amount{
  color: var(--gp-neon) !important;
  text-shadow: 0 0 12px var(--gp-neon-soft);
  font-size: 20px;
}

.single-product .gp-sp-modern__short{
  color: rgba(236,236,241,.86);
  line-height: 1.55;
  font-size: 14px;
  margin: 0 0 14px;
}

/* Make the form feel like part of the panel (no extra "boxes") */
.single-product .gp-sp-modern__form{margin-top: 6px;}

/* Tone down any legacy APF/Woo "panel" backgrounds inside */
.single-product .gp-sp-modern__buy-inner .wapf-wrapper,
.single-product .gp-sp-modern__buy-inner .wapf-field-group{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Give option groups a clean rhythm (always open) */
.single-product .gp-sp-modern__buy-inner .wapf-field-group{
  margin: 14px 0 0 !important;
  padding: 0 !important;
}
.single-product .gp-sp-modern__buy-inner .wapf-field-group .wapf-group-title,
.single-product .gp-sp-modern__buy-inner .wapf-field-group h3,
.single-product .gp-sp-modern__buy-inner .wapf-field-group h4{
  margin: 0 0 8px !important;
  color: rgba(255,255,255,.92) !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  letter-spacing: .2px;
}

.single-product .gp-sp-modern__meta{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,151,205,.18);
  opacity: .75;
}
.single-product .gp-sp-modern__meta,
.single-product .gp-sp-modern__meta *{
  color: rgba(236,236,241,.75) !important;
  font-size: 12px !important;
}

/* -------- Details -------- */
.single-product .gp-sp-modern__details{
  margin-top: 26px;
  padding-top: 10px;
}
.single-product .gp-sp-modern__section{
  margin: 18px 0 0;
  padding: 16px 16px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,151,205,.14);
}
.single-product .gp-sp-modern__h2{
  margin: 0 0 10px;
  color: #fff;
  font-weight: 900;
  font-size: 16px;
  letter-spacing: .2px;
  text-shadow: 0 0 10px rgba(255,151,205,.20);
}
.single-product .gp-sp-modern__rich{
  color: rgba(236,236,241,.88);
  line-height: 1.7;
}

/* Attributes table cleanup */
.ofirst{
}
.single-product .gp-sp-modern__attrs table{
  width: 100%;
  border-collapse: collapse;
}
.single-product .gp-sp-modern__attrs th,
.single-product .gp-sp-modern__attrs td{
  padding: 10px 10px;
  border-bottom: 1px solid rgba(255,151,205,.14);
  vertical-align: top;
}
.single-product .gp-sp-modern__attrs th{
  width: 42%;
  color: rgba(255,255,255,.88);
  font-weight: 900;
}
.single-product .gp-sp-modern__attrs td{
  color: rgba(236,236,241,.86);
}

/* Reviews: keep it clean */
.single-product .gp-sp-modern__details #reviews .commentlist,
.single-product .gp-sp-modern__details #reviews .woocommerce-Reviews-title{
  margin-top: 0;
}

/* Reviews: no avatars + remove left offset that Woo adds */
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist li img.avatar,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist li .avatar{
  display: none !important;
}
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist li .comment-text{
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Reviews: prevent overflow outside the container (Woo sometimes sets weird widths) */
.single-product .gp-sp-modern__details #reviews,
.single-product .gp-sp-modern__details #reviews #comments,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment_container,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist{
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li{
  margin: 0 0 12px 0 !important;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment_container{
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(255,151,205,.16);
  background: rgba(10,10,12,.55);
  padding: 14px 14px 12px;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text{
  border: 0 !important;
  padding: 0 !important;
}

/* Review meta row: keep author/badge/date tidy and stop the badge splitting */
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text .meta{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px 0;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text .meta .star-rating{
  margin-left: auto;
}

.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text .meta time,
.single-product .gp-sp-modern__details #reviews #comments ol.commentlist > li .comment-text .meta .woocommerce-review__published-date{
  white-space: nowrap;
}

/* Verified owner label -> our theme's wording (template override outputs this) */
.single-product .gp-sp-modern__details #reviews .woocommerce-review__verified{
  margin-left: 8px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255,151,205,.10);
  border: 1px solid rgba(255,151,205,.20);
  color: rgba(255,151,205,.95);
  font-style: normal;
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .2px;
}

/* -------- Extras (upsells/related) -------- */
.single-product .gp-sp-modern__extras{
  margin-top: 22px;
}
.single-product .gp-sp-modern__extras .related > h2,
.single-product .gp-sp-modern__extras .up-sells > h2{
  color:#fff;
  font-weight: 900;
  text-shadow: 0 0 12px rgba(255,151,205,.20);
}

/* -------- Mobile -------- */
@media (max-width: 899px){
  .single-product .gp-sp-modern__wrap{padding: 12px 14px 0;}

  .single-product .gp-sp-modern__hero{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .single-product .gp-sp-modern__img,
  .single-product .gp-sp-modern__img-ph{
    aspect-ratio: 16 / 11;
  }

  .single-product .gp-sp-modern__buy-inner{
    position: relative;
    top: auto;
    padding: 16px 16px 14px;
  }

  .single-product .gp-sp-modern__header{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .single-product .gp-sp-modern__title{font-size: 22px;}

  /* Keep the CTA row comfortable on small screens */
  .single-product form.cart{
    gap: 10px;
  }
  .single-product form.cart .gp-qty-select{flex: 0 0 110px;}
}

@media (max-width: 560px){
  .single-product .gp-sp-modern__section{padding: 14px 14px 12px;}
}


/* ================================
   MOBILE – FIX DOUBLE LINE SPACING
   ================================ */
@media (max-width: 768px) {

  .single-product .gp-sp-modern__buy p {
    margin: 0 0 8px !important;
    line-height: 1.35 !important;
  }

  .single-product .gp-sp-modern__buy h1,
  .single-product .gp-sp-modern__buy h2,
  .single-product .gp-sp-modern__buy h3,
  .single-product .gp-sp-modern__buy label {
    margin: 0 0 6px !important;
    line-height: 1.25 !important;
  }

  .single-product .gp-sp-modern__buy .wapf-field,
  .single-product .gp-sp-modern__buy .wapf-field-container,
  .single-product .gp-sp-modern__buy .wapf-field-input {
    margin: 0 !important;
    padding: 0 !important;
  }

  .single-product .gp-sp-modern__buy input,
  .single-product .gp-sp-modern__buy select,
  .single-product .gp-sp-modern__buy textarea {
    margin-top: 4px !important;
    line-height: 1.2 !important;
  }

  .single-product .gp-sp-modern__buy .wapf-field-group {
    margin-bottom: 14px !important;
  }
}
