/* v776 · Customer Gift Card experience redesign
   Purpose: real mobile composition, premium readable artwork, and consistent final-card preview.
   Colors remain entirely driven by existing Restaurant Branding / template variables. */

body.gift-store-v705{overflow-x:hidden}

/* Design gallery: artwork should read like a gift card, not a compressed admin tile. */
.gift-store-v705 .gc-design-option-v705{position:relative;min-width:0;isolation:isolate}
.gift-store-v705 .gc-design-card-v705{
  min-height:0;
  aspect-ratio:1.586/1;
  padding:clamp(18px,2.3vw,24px);
  border-radius:22px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  align-content:stretch;
  gap:12px;
  overflow:hidden;
  box-shadow:0 14px 32px color-mix(in srgb,var(--tt-body-text-safe) 14%,transparent);
}
.gift-store-v705 .gc-design-card-v705::before{
  content:"";
  position:absolute;
  inset:11px;
  width:auto;
  height:auto;
  border-radius:15px;
  border:1px solid color-mix(in srgb,var(--gift-accent) 72%,transparent);
  background:none;
  pointer-events:none;
}
.gift-store-v705 .gc-design-card-v705::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  border-radius:999px;
  right:-78px;
  top:-88px;
  background:var(--gift-accent);
  opacity:.10;
  filter:blur(34px);
  pointer-events:none;
}
.gift-store-v705 .gc-design-card-v705>small{
  position:relative;
  z-index:1;
  padding:0;
  align-self:start;
  font-size:clamp(10px,1.5vw,12px);
  line-height:1.15;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
  opacity:.90;
}
.gift-store-v705 .gc-design-card-v705>small::after{
  content:"";
  display:block;
  width:46px;
  height:3px;
  margin-top:10px;
  border-radius:999px;
  background:var(--gift-accent);
}
.gift-store-v705 .gc-design-card-v705>strong{
  position:relative;
  z-index:1;
  align-self:center;
  max-width:94%;
  font-size:clamp(23px,3.1vw,32px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:950;
  text-wrap:balance;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
}
.gift-store-v705 .gc-design-footer-v776{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}
.gift-store-v705 .gc-design-footer-v776 em{
  font-style:normal;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.78;
  white-space:nowrap;
}
.gift-store-v705 .gc-design-value-v776{
  font-size:clamp(24px,3vw,34px);
  line-height:1;
  font-weight:950;
  letter-spacing:-.04em;
}
.gift-store-v705 .gc-design-option-v705>b{
  display:block;
  padding:0 4px;
  font-size:13px;
  line-height:1.3;
  color:var(--tt-card-heading-safe);
}
.gift-store-v705 .gc-design-option-v705::before{
  content:"✓ Selected";
  position:absolute;
  right:10px;
  top:10px;
  z-index:4;
  opacity:0;
  transform:translateY(-4px);
  padding:6px 8px;
  border-radius:999px;
  background:var(--tt-primary);
  color:var(--tt-on-primary-safe);
  font-size:10px;
  line-height:1;
  font-weight:950;
  letter-spacing:.04em;
  transition:.16s ease;
  pointer-events:none;
}
.gift-store-v705 .gc-design-option-v705.selected::before,
.gift-store-v705 .gc-design-option-v705:has(input:checked)::before{opacity:1;transform:none}
.gift-store-v705 .gc-design-option-v705.selected .gc-design-card-v705,
.gift-store-v705 .gc-design-option-v705:has(input:checked) .gc-design-card-v705{
  outline:3px solid color-mix(in srgb,var(--tt-primary) 48%,transparent);
  outline-offset:3px;
  transform:none;
}

/* Final purchase card: same artwork contract the customer selected. */
.gift-store-v705 .gc-final-card-v705{
  position:relative;
  isolation:isolate;
  width:100%;
  min-height:0;
  aspect-ratio:1.586/1;
  padding:clamp(22px,4vw,34px);
  border-radius:26px;
  display:block;
  box-shadow:0 22px 52px color-mix(in srgb,var(--tt-body-text-safe) 16%,transparent);
}
.gift-store-v705 .gc-final-card-v705::before{
  content:"";
  position:absolute;
  inset:12px;
  width:auto;
  height:auto;
  margin:0;
  border:1px solid color-mix(in srgb,var(--gift-accent) 72%,transparent);
  border-radius:18px;
  background:none;
  pointer-events:none;
}
.gift-store-v705 .gc-final-card-v705>*{position:relative;z-index:1}
.gift-store-v705 .gc-final-logo-v770{max-width:128px;max-height:44px;margin:0 0 8px}
.gift-store-v705 .gc-final-card-v705>small{
  display:block;
  font-size:10px;
  letter-spacing:.12em;
  line-height:1.2;
  margin-bottom:8px;
}
.gift-store-v705 .gc-final-card-v705>strong{
  display:block;
  margin:4px 0 10px;
  font-size:clamp(38px,7vw,58px);
  line-height:.92;
  letter-spacing:-.055em;
}
.gift-store-v705 .gc-final-card-v705 h2{
  max-width:85%;
  margin:0 0 8px;
  font-size:clamp(24px,4vw,36px);
  line-height:1;
  letter-spacing:-.035em;
  word-break:normal;
}
.gift-store-v705 .gc-final-card-v705 p{
  max-width:82%;
  margin:0 0 14px;
  font-size:13px;
  line-height:1.35;
  opacity:.9;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.gift-store-v705 .gc-final-card-v705>div{
  display:inline-grid;
  width:calc(50% - 7px);
  margin:4px 10px 0 0;
  vertical-align:top;
  gap:2px;
  overflow:hidden;
}
.gift-store-v705 .gc-final-card-v705>div:last-child{margin-right:0}
.gift-store-v705 .gc-final-card-v705>div b{font-size:9px;letter-spacing:.12em}
.gift-store-v705 .gc-final-card-v705>div span{font-size:12px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gift-store-v705 .gc-redeem-panel-v705{align-self:stretch;display:grid;align-content:center}

/* Mobile is deliberately recomposed instead of stacking a desktop grid. */
@media(max-width:720px){
  .gift-store-v705 .gc-store-header-v705{
    align-items:center;
    gap:10px;
    padding:10px 12px;
  }
  .gift-store-v705 .gc-brand-v705{min-width:0;flex:1 1 auto}
  .gift-store-v705 .gc-brand-v705 img{width:40px;height:40px;flex:0 0 40px}
  .gift-store-v705 .gc-brand-v705 span{min-width:0}
  .gift-store-v705 .gc-brand-v705 strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gift-store-v705 .gc-brand-v705 small{font-size:12px}
  .gift-store-v705 .gc-store-header-v705 nav{flex:0 0 auto;gap:5px}
  .gift-store-v705 .gc-store-header-v705 nav a{padding:8px 9px;font-size:11px;white-space:nowrap}
  .gift-store-v705 .gc-store-shell-v705{width:100%;padding:12px 10px 54px}
  .gift-store-v705 .gc-hero-v705{gap:10px;margin-bottom:12px}
  .gift-store-v705 .gc-hero-v705>div{padding:22px 18px}
  .gift-store-v705 .gc-hero-v705 h1{font-size:clamp(34px,11vw,48px);line-height:.96}
  .gift-store-v705 .gc-hero-v705 p{font-size:15px;line-height:1.5}
  .gift-store-v705 .gc-hero-v705 aside{padding:16px 18px}
  .gift-store-v705 .gc-step-v705{padding:18px 14px;border-radius:20px;overflow:hidden}
  .gift-store-v705 .gc-step-heading-v705{margin-bottom:14px}
  .gift-store-v705 .gc-step-heading-v705 h2{font-size:20px}
  .gift-store-v705 .gc-step-heading-v705 p{font-size:13px;line-height:1.35}
  .gift-store-v705 .gc-design-grid-v705{
    display:flex;
    grid-template-columns:none;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:14px;
    padding:5px 14px 12px;
    margin:0 -14px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .gift-store-v705 .gc-design-grid-v705::-webkit-scrollbar{display:none}
  .gift-store-v705 .gc-design-option-v705{
    flex:0 0 min(82vw,340px);
    width:min(82vw,340px);
    scroll-snap-align:center;
    gap:9px;
  }
  .gift-store-v705 .gc-design-card-v705{padding:20px;aspect-ratio:1.586/1;border-radius:22px}
  .gift-store-v705 .gc-design-card-v705>strong{font-size:clamp(24px,7.5vw,31px);max-width:92%}
  .gift-store-v705 .gc-design-value-v776{font-size:30px}
  .gift-store-v705 .gc-amount-grid-v705{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .gift-store-v705 .gc-amount-grid-v705 span{min-height:54px}
  .gift-store-v705 .gc-check-v705{align-items:flex-start}
  .gift-store-v705 .gc-delivery-grid-v705{gap:8px}
  .gift-store-v705 .gc-delivery-grid-v705 span{min-height:60px;grid-template-rows:auto auto;gap:2px}
  .gift-store-v705 .gc-checkout-card-v705{padding:18px;border-radius:20px}
  .gift-store-v705 .gc-buy-button-v705,.gift-store-v705 .gc-secondary-button-v705{min-height:52px}
  .gift-store-v705 .gc-purchase-success-v705{text-align:left;padding:8px 4px}
  .gift-store-v705 .gc-purchase-success-v705 h1{font-size:34px;line-height:1}
  .gift-store-v705 .gc-final-card-v705{aspect-ratio:auto;min-height:300px;padding:24px 22px;border-radius:22px}
  .gift-store-v705 .gc-final-card-v705 h2{max-width:92%;font-size:28px}
  .gift-store-v705 .gc-final-card-v705 p{max-width:92%}
}

@media(max-width:390px){
  .gift-store-v705 .gc-store-header-v705 nav a:first-child{display:none}
  .gift-store-v705 .gc-design-option-v705{flex-basis:86vw;width:86vw}
}
