/* GAP Sharing Is Caring — component-width responsive layout.
   This stylesheet intentionally avoids viewport-only breakpoints because the
   share card sits inside a narrow Bootstrap content column on desktop pages. */
.gap-sharing-card{
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  flex-flow:row wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:24px 28px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:18px 0 0!important;
  padding:26px 28px 112px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:1px solid #f7b6d3!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 12px 28px rgba(220,35,115,.12)!important;
}
.gap-sharing-card>.gap-share-illustration{
  display:flex!important;
  flex:0 1 280px!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:180px!important;
  max-width:100%!important;
  margin:0!important;
  z-index:1!important;
  box-sizing:border-box!important;
}
.gap-sharing-card>.gap-share-illustration>svg{
  display:block!important;
  width:100%!important;
  max-width:280px!important;
  height:auto!important;
  max-height:none!important;
  margin:0 auto!important;
}
.gap-sharing-card>.gap-share-copy{
  display:block!important;
  flex:1 1 420px!important;
  width:auto!important;
  min-width:260px!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  z-index:1!important;
  text-align:left!important;
  box-sizing:border-box!important;
}
.gap-sharing-card .gap-share-title{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 18px!important;
  padding:0 0 12px!important;
  border:0!important;
  border-bottom:4px solid #ed287b!important;
  color:#102d55!important;
  font-family:Poppins,Arial,sans-serif!important;
  font-size:clamp(28px,3vw,54px)!important;
  font-weight:800!important;
  line-height:1.12!important;
  letter-spacing:-1px!important;
  white-space:normal!important;
  box-sizing:border-box!important;
}
.gap-sharing-card .gap-share-title-main{display:inline!important;white-space:normal!important}
.gap-sharing-card .gap-share-title-script{
  display:inline!important;
  color:#ed287b!important;
  font-family:"Dancing Script","Segoe Script",cursive!important;
  font-size:1.16em!important;
  font-weight:700!important;
  font-style:italic!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
.gap-sharing-card .gap-share-copy>p{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#3f4d63!important;
  font-family:Poppins,Arial,sans-serif!important;
  font-size:clamp(15px,1.45vw,23px)!important;
  font-weight:400!important;
  line-height:1.55!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
}
.gap-sharing-card>.gap-share-actions{
  display:flex!important;
  flex:1 1 100%!important;
  flex-flow:row wrap!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:18px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0 4px!important;
  z-index:2!important;
  box-sizing:border-box!important;
}
.gap-sharing-card>.gap-share-actions>.gap-share-btn{
  display:flex!important;
  flex:1 1 210px!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:104px!important;
  height:auto!important;
  margin:0!important;
  padding:14px 16px!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:22px!important;
  color:#fff!important;
  text-decoration:none!important;
  text-align:left!important;
  font-family:Poppins,Arial,sans-serif!important;
  font-size:clamp(16px,1.55vw,24px)!important;
  font-weight:500!important;
  line-height:1.25!important;
  box-shadow:0 7px 14px rgba(17,40,75,.12)!important;
  cursor:pointer!important;
  box-sizing:border-box!important;
}
.gap-sharing-card>.gap-share-actions>.gap-share-btn:hover{
  transform:translateY(-2px)!important;
  color:#fff!important;
  text-decoration:none!important;
}
.gap-sharing-card>.gap-share-actions>.gap-share-btn>svg{
  display:block!important;
  flex:0 0 58px!important;
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  height:58px!important;
  max-height:58px!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  color:#fff!important;
}
.gap-sharing-card>.gap-share-actions>.gap-share-btn>span{
  display:block!important;
  flex:0 1 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 74px)!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  text-align:left!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  font:inherit!important;
  line-height:1.25!important;
}
.gap-sharing-card>.gap-share-actions>.gap-share-btn strong{
  display:inline!important;
  color:#fff!important;
  font-weight:700!important;
}
.gap-sharing-card .gap-share-facebook{background:linear-gradient(135deg,#1877f2,#0751b9)!important}
.gap-sharing-card .gap-share-instagram{background:linear-gradient(115deg,#ff8a00 0%,#f02768 48%,#8d24bc 100%)!important}
.gap-sharing-card .gap-share-anywhere{background:linear-gradient(135deg,#22c936,#079c2d)!important}
.gap-sharing-card>.gap-share-waves{
  position:absolute!important;
  z-index:0!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  display:block!important;
  width:100%!important;
  height:96px!important;
  margin:0!important;
  padding:0!important;
  pointer-events:none!important;
}

/* Natural wrapping is based on the card's available width, not the browser
   viewport. This is the key fix for cards inside narrow desktop columns. */
@media(max-width:767px){
 .gap-sharing-card{padding:18px 16px 82px!important;gap:14px!important;border-radius:18px!important}
 .gap-sharing-card>.gap-share-illustration{flex:1 1 100%!important;min-width:0!important;width:100%!important}
 .gap-sharing-card>.gap-share-illustration>svg{max-width:155px!important}
 .gap-sharing-card>.gap-share-copy{flex:1 1 100%!important;min-width:0!important;width:100%!important;text-align:center!important}
 .gap-sharing-card .gap-share-title{width:max-content!important;max-width:100%!important;margin:0 auto 10px!important;padding-bottom:8px!important;border-bottom-width:3px!important;font-size:30px!important;letter-spacing:0!important}
 .gap-sharing-card .gap-share-copy>p{font-size:14px!important;line-height:1.5!important;text-align:center!important}
 .gap-sharing-card>.gap-share-actions{flex:1 1 100%!important;gap:10px!important;padding:0 2px!important}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn{flex:1 1 100%!important;min-height:62px!important;padding:10px 16px!important;border-radius:14px!important;font-size:16px!important}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn>svg{flex-basis:42px!important;width:42px!important;min-width:42px!important;max-width:42px!important;height:42px!important;max-height:42px!important}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn>span{max-width:calc(100% - 58px)!important}
 .gap-sharing-card>.gap-share-waves{height:68px!important}
}


/* FINAL BUTTON ROW REPAIR
   Grid prevents inherited Bootstrap/flex rules from shrinking each button
   to its text width. auto-fit also accommodates additional social services. */
.gap-sharing-card > .gap-share-actions{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr)) !important;
  align-items:stretch !important;
  justify-items:stretch !important;
  gap:16px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  flex:none !important;
  margin:8px 0 0 !important;
  padding:0 4px !important;
  box-sizing:border-box !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:104px !important;
  height:auto !important;
  margin:0 !important;
  padding:14px 12px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn > svg{
  display:block !important;
  flex:0 0 54px !important;
  width:54px !important;
  min-width:54px !important;
  max-width:54px !important;
  height:54px !important;
  max-height:54px !important;
  margin:0 !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn > span{
  display:block !important;
  flex:0 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:calc(100% - 68px) !important;
  margin:0 !important;
  padding:0 !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  font-size:clamp(15px,1.5vw,23px) !important;
  line-height:1.25 !important;
  text-align:left !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn strong{
  display:inline !important;
  white-space:normal !important;
}
@media(max-width:600px){
  .gap-sharing-card > .gap-share-actions{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .gap-sharing-card > .gap-share-actions > .gap-share-btn{
    min-height:64px !important;
    padding:10px 16px !important;
  }
  .gap-sharing-card > .gap-share-actions > .gap-share-btn > svg{
    flex-basis:42px !important;
    width:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    height:42px !important;
    max-height:42px !important;
  }
  .gap-sharing-card > .gap-share-actions > .gap-share-btn > span{
    max-width:calc(100% - 56px) !important;
    font-size:16px !important;
  }
}


/* APPROVED REFERENCE CARD — shared by cause, product and education details. */
.gap-sharing-card{
  container-type:inline-size!important;
  display:grid!important;
  grid-template-columns:minmax(150px,210px) minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  column-gap:24px!important;
  row-gap:20px!important;
  padding:24px 24px 92px!important;
  border:2px solid #f5a6cc!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 12px 26px rgba(220,35,115,.13)!important;
  text-align:left!important;
}
.gap-sharing-card>.gap-share-illustration{grid-column:1!important;grid-row:1!important;flex:none!important;width:100%!important;min-width:0!important;max-width:210px!important;margin:0 auto!important;padding-right:18px!important;border-right:2px solid #f5a6cc!important;}
.gap-sharing-card>.gap-share-illustration>svg{width:100%!important;max-width:190px!important;height:auto!important;}
.gap-sharing-card>.gap-share-copy{grid-column:2!important;grid-row:1!important;flex:none!important;width:100%!important;min-width:0!important;max-width:none!important;text-align:left!important;}
.gap-sharing-card .gap-share-title{position:relative!important;width:max-content!important;max-width:100%!important;margin:0 0 14px!important;padding:0 0 10px!important;border:0!important;color:#102d55!important;font-family:Poppins,Arial,sans-serif!important;font-size:clamp(27px,4.1cqw,48px)!important;font-weight:800!important;line-height:1.12!important;letter-spacing:-1px!important;}
.gap-sharing-card .gap-share-title:after{content:""!important;position:absolute!important;left:0!important;bottom:0!important;width:48%!important;height:4px!important;border-radius:9px!important;background:#ed287b!important;}
.gap-sharing-card .gap-share-title-script{color:#ed287b!important;font-family:"Dancing Script","Segoe Script",cursive!important;font-size:1.25em!important;font-style:italic!important;font-weight:700!important;}
.gap-sharing-card .gap-share-heart{display:inline-block!important;margin-left:3px!important;color:#ed287b!important;font-size:.9em!important;transform:rotate(15deg)!important;}
.gap-sharing-card .gap-share-copy>p{margin:0!important;color:#3f4d63!important;font-family:Poppins,Arial,sans-serif!important;font-size:clamp(13px,2cqw,19px)!important;line-height:1.55!important;}
.gap-sharing-card>.gap-share-actions{grid-column:1/-1!important;grid-row:2!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;width:100%!important;margin:0!important;padding:0!important;}
.gap-sharing-card>.gap-share-actions>.gap-share-btn{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:12px!important;min-width:0!important;min-height:76px!important;padding:10px 12px!important;border:0!important;border-radius:18px!important;color:#fff!important;text-decoration:none!important;font-family:Poppins,Arial,sans-serif!important;font-size:clamp(13px,1.9cqw,19px)!important;line-height:1.25!important;font-weight:500!important;box-shadow:0 7px 14px rgba(17,40,75,.13)!important;cursor:pointer!important;transition:transform .2s ease,filter .2s ease!important;}
.gap-sharing-card>.gap-share-actions>.gap-share-btn:hover{transform:translateY(-2px)!important;filter:brightness(1.04)!important;color:#fff!important;}
.gap-sharing-card>.gap-share-actions>.gap-share-btn>svg{display:block!important;flex:0 0 46px!important;width:46px!important;max-width:46px!important;height:46px!important;max-height:46px!important;margin:0!important;}
.gap-sharing-card>.gap-share-actions>.gap-share-btn>span{display:block!important;min-width:0!important;max-width:calc(100% - 58px)!important;color:#fff!important;font:inherit!important;text-align:left!important;white-space:normal!important;}
.gap-sharing-card>.gap-share-actions>.gap-share-btn strong{color:#fff!important;font-weight:800!important;}
.gap-sharing-card .gap-share-facebook{background:linear-gradient(135deg,#1877f2,#0751b9)!important;}
.gap-sharing-card .gap-share-link{background:linear-gradient(115deg,#ed287b 0%,#c52391 52%,#7628b8 100%)!important;}
.gap-sharing-card .gap-share-anywhere{background:linear-gradient(135deg,#22c936,#079c2d)!important;}
.gap-sharing-card>.gap-share-waves{height:76px!important;}
@container (max-width:620px){
 .gap-sharing-card{grid-template-columns:minmax(0,1fr)!important;row-gap:12px!important;padding:18px 16px 78px!important;border-radius:18px!important;}
 .gap-sharing-card>.gap-share-illustration{grid-column:1!important;grid-row:1!important;max-width:135px!important;padding:0!important;border:0!important;}
 .gap-sharing-card>.gap-share-copy{grid-column:1!important;grid-row:2!important;text-align:center!important;}
 .gap-sharing-card .gap-share-title{margin:0 auto 10px!important;font-size:30px!important;letter-spacing:0!important;}
 .gap-sharing-card .gap-share-title:after{left:50%!important;transform:translateX(-50%)!important;}
 .gap-sharing-card .gap-share-copy>p{font-size:14px!important;line-height:1.5!important;}
 .gap-sharing-card>.gap-share-actions{grid-column:1!important;grid-row:3!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn{min-height:58px!important;border-radius:13px!important;font-size:16px!important;}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn>svg{flex-basis:40px!important;width:40px!important;max-width:40px!important;height:40px!important;max-height:40px!important;}
 .gap-sharing-card>.gap-share-actions>.gap-share-btn>span{max-width:calc(100% - 52px)!important;}
 .gap-sharing-card>.gap-share-waves{height:62px!important;}
}


/* FINAL SPACING + EDUCATION DETAIL GRID PLACEMENT */
/* Keep a clear visual pause between campaign description and the sharing card. */
html body #tg-main.cause-detail-redesign .tg-themetabs,
html body #tg-main.product-detail-redesign .tg-themetabs,
html body #tg-main.education-detail-redesign .tg-themetabs {
  margin-bottom:24px!important;
}
html body #tg-main.cause-detail-redesign .gap-sharing-card,
html body #tg-main.product-detail-redesign .gap-sharing-card,
html body #tg-main.education-detail-redesign .gap-sharing-card {
  margin-top:24px!important;
}

/* Education: share card belongs below the main content, never below the sidebar. */
html body #tg-main.education-detail-redesign .education-main-column > .gap-sharing-card {
  display:grid!important;
  clear:both!important;
  float:none!important;
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:24px 0 0!important;
  box-sizing:border-box!important;
}
@media(max-width:767px){
  html body #tg-main.education-detail-redesign .education-main-column > .gap-sharing-card {
    margin-top:16px!important;
  }
}


/* COMPACT SOCIAL BUTTONS — single shared sizing for all three detail pages. */
.gap-sharing-card > .gap-share-actions > .gap-share-btn {
  height: 68px !important;
  min-height: 68px !important;
  padding: 8px 10px !important;
  gap: 10px !important;
  border-radius: 15px !important;
  font-size: 15px !important;
  line-height: 1.22 !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn > svg {
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 38px !important;
  max-height: 38px !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-btn > span {
  max-width: calc(100% - 48px) !important;
  font-size: 15px !important;
  line-height: 1.22 !important;
}
@container (max-width: 620px) {
  .gap-sharing-card > .gap-share-actions > .gap-share-btn {
    height: 56px !important;
    min-height: 56px !important;
    padding: 7px 12px !important;
    border-radius: 13px !important;
    font-size: 14px !important;
  }
  .gap-sharing-card > .gap-share-actions > .gap-share-btn > svg {
    flex-basis: 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    max-height: 34px !important;
  }
  .gap-sharing-card > .gap-share-actions > .gap-share-btn > span {
    max-width: calc(100% - 44px) !important;
    font-size: 14px !important;
  }
}


/* SHARE LINK BUTTON — GAP pink brand treatment, matching the sharing section. */
.gap-sharing-card > .gap-share-actions > .gap-share-link {
  background: linear-gradient(135deg, #ff4f9b 0%, #ed287b 52%, #d90068 100%) !important;
  color: #ffffff !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-link:hover {
  background: linear-gradient(135deg, #f83b8d 0%, #df176d 52%, #c6005d 100%) !important;
  filter: brightness(1.04) !important;
}
.gap-sharing-card > .gap-share-actions > .gap-share-link > svg {
  color: #ffffff !important;
}