/* LULYGraphics 3.19.1 — checkout typography/bonus distinction + Home wireframe cleanup.
   Intentionally presentation-only: bonus availability and application remain backend-driven. */

/* Checkout summary: long names/prices stay inside the narrow left column. */
body.checkout-page .luly-checkout-grid{min-width:0;}
body.checkout-page .luly-checkout-summary{
  min-width:0;
  padding:clamp(1.05rem,2.25vw,1.55rem);
  overflow:hidden;
}
body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total){
  display:grid;
  grid-template-columns:minmax(0,.76fr) minmax(0,1.24fr);
  column-gap:.85rem;
  align-items:start;
}
body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total) > span,
body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total) > strong{
  min-width:0;
  margin:0;
  line-height:1.48;
  overflow-wrap:anywhere;
}
body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total) > strong{
  text-align:right;
  font-size:clamp(.84rem,1.05vw,.98rem);
  letter-spacing:-.015em;
}
body.checkout-page .luly-checkout-summary-total,
body.checkout-page .luly-bonus-summary{min-width:0;box-sizing:border-box;}
body.checkout-page .luly-checkout-summary-total > span,
body.checkout-page .luly-checkout-summary-total > strong{min-width:0;}
body.checkout-page .luly-checkout-summary-total > strong{text-align:right;overflow-wrap:anywhere;}
body.checkout-page .luly-bonus-summary{
  display:block;
  width:100%;
  padding:clamp(.8rem,1.55vw,1rem);
  background:linear-gradient(150deg,rgba(255,116,26,.055),rgba(255,255,255,.012));
}
body.checkout-page .luly-bonus-summary[hidden]{display:none!important;}
body.checkout-page .luly-bonus-summary .luly-bonus-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  column-gap:.7rem;
  align-items:center;
  margin:0;
  padding:.42rem 0;
  border:0;
  background:none;
  min-width:0;
}
body.checkout-page .luly-bonus-summary .luly-bonus-row span{
  min-width:0;
  font-size:clamp(.65rem,.8vw,.72rem);
  line-height:1.5;
  letter-spacing:.035em;
  overflow-wrap:normal;
}
body.checkout-page .luly-bonus-summary .luly-bonus-row strong{
  min-width:0;
  white-space:nowrap;
  margin:0;
  text-align:right;
  font-size:clamp(.81rem,1vw,.95rem);
}
body.checkout-page .luly-bonus-summary .luly-bonus-row:last-child{
  padding-top:.8rem;
  margin-top:.42rem;
  border-top:1px solid rgba(255,139,42,.24);
}
body.checkout-page .luly-bonus-summary .luly-bonus-row:last-child strong{color:#ffac5b;font-size:1.13rem;}

/* Bonus is an independent creator perk, not the fourth payment method. */
body.checkout-page .luly-bonus-section{
  margin:1rem 0 1.35rem;
  padding:clamp(.8rem,1.5vw,1rem);
  border:1px solid rgba(255,139,42,.38);
  border-radius:23px;
  background:linear-gradient(110deg,rgba(255,115,21,.09),rgba(36,18,10,.3) 62%,rgba(255,115,21,.027));
  box-shadow:0 16px 40px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,192,112,.05);
}
body.checkout-page .luly-bonus-section[hidden],
body.checkout-page .luly-bonus-choice[hidden],
body.checkout-page .luly-other-methods-label[hidden]{display:none!important;}
body.checkout-page .luly-bonus-section-heading{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.4rem .8rem;
  margin:0 0 .8rem;padding:0 .2rem;
}
body.checkout-page .luly-bonus-section-heading > span{
  color:#ffb875;font-size:.69rem;letter-spacing:.13em;font-weight:850;
}
body.checkout-page .luly-bonus-section-heading > small{color:rgba(255,240,220,.55);font-size:.7rem;}
body.checkout-page .luly-bonus-choice{
  min-width:0;
  min-height:114px;
  padding:clamp(.85rem,1.7vw,1.2rem);
  display:grid;
  grid-template-columns:58px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  column-gap:clamp(.7rem,1.3vw,1.1rem);
  row-gap:.45rem;
  align-items:center;
  border-radius:18px;
  border:1px solid rgba(255,158,58,.33);
  background:linear-gradient(110deg,rgba(255,122,24,.105),rgba(255,146,61,.025) 72%);
  box-shadow:inset 0 1px 0 rgba(255,165,87,.065);
}
body.checkout-page .luly-bonus-choice:hover:not(.is-disabled){
  border-color:rgba(255,163,67,.7);
  background:linear-gradient(110deg,rgba(255,122,24,.17),rgba(255,146,61,.05) 72%);
  box-shadow:0 12px 30px rgba(255,106,0,.065),inset 0 1px 0 rgba(255,165,87,.09);
}
body.checkout-page .luly-bonus-choice.is-selected{
  border-color:#ff983f;
  background:linear-gradient(105deg,rgba(255,129,31,.20),rgba(255,132,28,.06));
  box-shadow:0 0 0 1px rgba(255,139,42,.16),0 12px 32px rgba(255,106,0,.08);
}
body.checkout-page .luly-bonus-icon{
  grid-column:1;grid-row:1 / 3;
  display:grid;place-items:center;
  width:58px;height:58px;
  border:1px solid rgba(255,153,66,.35);
  border-radius:17px;
  color:#ff922d;
  background:rgba(255,111,13,.115);
  box-shadow:0 0 24px rgba(255,106,0,.07);
}
body.checkout-page .luly-bonus-icon svg{display:block;width:27px;height:27px;color:inherit;stroke:none;}
body.checkout-page .luly-bonus-choice .luly-payment-option-copy{grid-column:2;grid-row:1 / 3;min-width:0;}
body.checkout-page .luly-bonus-choice .luly-payment-option-copy strong{font-size:clamp(1rem,1.2vw,1.15rem);color:#fff5e7;}
body.checkout-page .luly-bonus-choice .luly-payment-option-copy small{font-size:.8rem;color:#cdb7a4;line-height:1.6;}
body.checkout-page .luly-bonus-choice .luly-method-badge{
  grid-column:3;grid-row:1;
  justify-self:end;
  text-transform:none;
  font-size:.7rem;letter-spacing:0;
  color:#ffbd80;
  background:rgba(255,140,31,.1);
  border:1px solid rgba(255,157,63,.24);
  white-space:nowrap;
}
body.checkout-page .luly-bonus-prompt{
  grid-column:3;grid-row:2;
  justify-self:end;
  white-space:nowrap;
  color:#ffab62;
  font-size:.74rem;
  font-weight:850;
}
body.checkout-page .luly-bonus-choice.is-selected .luly-bonus-prompt{color:#ffd1a2;}
body.checkout-page .luly-other-methods-label{
  font-size:.83rem;
  color:#d7c6b7;
  letter-spacing:.025em;
  font-weight:750;
  margin:1.1rem 0 .65rem;
}
body.checkout-page .luly-payment-options{margin-top:0;}

/* Home / Request → final: keep the lower wireframe bar fully to the right
   of the left placeholder. Its right edge now aligns with the two rows above. */
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(4){
  width:44%!important;
  right:8%!important;
  left:auto!important;
}

@media(max-width:680px){
  body.checkout-page .luly-bonus-choice{
    grid-template-columns:50px minmax(0,1fr);
    grid-template-rows:auto auto;
    min-height:105px;
  }
  body.checkout-page .luly-bonus-icon{width:50px;height:50px;grid-row:1 / 3;}
  body.checkout-page .luly-bonus-choice .luly-payment-option-copy{grid-column:2;grid-row:1;}
  body.checkout-page .luly-bonus-choice .luly-method-badge{grid-column:2;grid-row:2;justify-self:start;}
  body.checkout-page .luly-bonus-prompt{display:none;}
}
@media(max-width:370px){
  body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total){
    grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);
    column-gap:.5rem;
  }
  body.checkout-page .luly-checkout-summary > div:not(.luly-bonus-summary):not(.luly-checkout-summary-total) > strong{font-size:.83rem;}
}
@media(prefers-reduced-motion:reduce){
  body.checkout-page .luly-bonus-choice{transition:none!important;}
}

/* Follow-up polish — quieter idle bonus state, clean summary bottom and aligned Home wireframe. */
body.checkout-page .luly-checkout-summary{
  overflow:visible;
  padding-bottom:clamp(1.15rem,2.4vw,1.65rem);
}
body.checkout-page .luly-bonus-summary{
  margin:.35rem 0 .15rem;
  padding:clamp(.82rem,1.55vw,1rem);
  border:1px solid rgba(255,139,42,.26);
  border-radius:16px;
  background:linear-gradient(150deg,rgba(255,116,26,.042),rgba(255,255,255,.010));
  overflow:hidden;
}
body.checkout-page .luly-bonus-summary .luly-bonus-row:last-child{
  padding-bottom:.28rem;
}

/* Idle creator perk should read as available, not already selected. */
body.checkout-page .luly-bonus-section{
  border-color:rgba(255,139,42,.23);
  background:linear-gradient(110deg,rgba(255,115,21,.045),rgba(22,13,9,.20) 62%,rgba(255,115,21,.012));
  box-shadow:inset 0 1px 0 rgba(255,192,112,.025);
}
body.checkout-page .luly-bonus-choice{
  border-color:rgba(255,158,58,.20);
  background:linear-gradient(110deg,rgba(255,122,24,.050),rgba(255,146,61,.010) 72%);
  box-shadow:inset 0 1px 0 rgba(255,165,87,.035);
}
body.checkout-page .luly-bonus-icon{
  border-color:rgba(255,153,66,.26);
  background:rgba(255,111,13,.075);
  box-shadow:none;
}
body.checkout-page .luly-bonus-choice .luly-method-badge{
  background:rgba(255,140,31,.065);
  border-color:rgba(255,157,63,.18);
}
body.checkout-page .luly-bonus-choice:hover:not(.is-disabled){
  border-color:rgba(255,163,67,.46);
  background:linear-gradient(110deg,rgba(255,122,24,.09),rgba(255,146,61,.025) 72%);
  box-shadow:0 10px 24px rgba(255,106,0,.035),inset 0 1px 0 rgba(255,165,87,.055);
}
body.checkout-page .luly-bonus-choice.is-selected{
  border-color:#ff983f;
  background:linear-gradient(105deg,rgba(255,129,31,.20),rgba(255,132,28,.06));
  box-shadow:0 0 0 1px rgba(255,139,42,.16),0 12px 32px rgba(255,106,0,.08);
}

/* Request → Final / Layout plan: exact geometry for the three right-hand rows.
   112px preview height = 22px top + 14px row + 13px gap + 14px row
   + 13px gap + 14px row + 22px bottom. */
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(2),
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(3),
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(4){
  left:50%!important;
  right:8%!important;
  width:auto!important;
  height:14px!important;
  box-sizing:border-box!important;
  border-width:1px!important;
  border-radius:999px!important;
  bottom:auto!important;
}
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(2){top:22px!important;}
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(3){top:49px!important;}
body.luly-home-page #request-to-final .wireframe-preview b:nth-child(4){top:76px!important;}