/* Optional care stays in the same quiet material as the purpose cards. */
.cp-gift-options, .cp-gift-options * { box-sizing: border-box; }
.cp-gift-options { display: grid; gap: 12px; min-width: 0; width: 100%; }
[data-gift-toggle-state], .cp-gift-preview-print [hidden],
.cp-gift-options [hidden], .cp-gift-standard [hidden] { display: none !important; }
.cp-gift-standard {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) 20px; align-items: center;
  gap: 4px 12px; min-width: 0; padding: 12px 14px;
  border: 1px solid #ffffff17; border-radius: 16px; background: #ffffff03;
}
.cp-gift-standard > svg { width: 48px; height: 56px; color: #d7e0e4; }
.cp-gift-standard > span:not(.cp-gift-standard-check) { min-width: 0; grid-column: 2; }
.cp-gift-standard-check { color: #e3c68e; grid-column: 3; }
.cp-gift-standard > :is(strong, small, div) { grid-column: 2; min-width: 0; }
.cp-gift-standard strong { display: block; color: #e7e5df; font-size: .9375rem; line-height: 1.3; }
.cp-gift-standard small { display: block; color: #b7b1be; font-size: .75rem; line-height: 1.45; }
.cp-gift-option {
  min-width: 0; overflow: hidden; border: 1px solid #ffffff20;
  border-radius: 20px; background: linear-gradient(125deg, #242129, #17171d);
  transition: border-color 180ms ease, background 180ms ease;
}
.cp-gift-option.is-active, .cp-gift-option:has(> button[aria-pressed="true"]) {
  border-color: #e8bf6c69; background: linear-gradient(125deg, #2b251f, #1b191f);
}
.cp-gift-option > button, .cp-gift-option-toggle {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) 44px;
  align-items: center; gap: 14px; width: 100%; min-width: 0; min-height: 88px;
  padding: 16px; border: 0; border-radius: inherit;
  background: transparent; color: #f7f5ef; font: inherit; text-align: left; cursor: pointer;
}
.cp-gift-option-icon {
  display: grid; place-items: center; width: 48px; height: 52px; border-radius: 14px;
  color: #e9d1a3; background: linear-gradient(145deg, #f4dcae12, #f4dcae04);
}
.cp-gift-option-icon > svg, .cp-gift-option > button > svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.cp-gift-option-copy { display: grid; gap: 5px; min-width: 0; color: inherit; }
.cp-gift-option-copy strong { font-size: 1.0625rem; line-height: 1.25; letter-spacing: -.02em; font-weight: 700; }
.cp-gift-option-copy small { color: #e5c58e; font-size: .75rem; line-height: 1.4; }
.cp-gift-option-copy > span { color: #bfb9c5; font-size: .8125rem; line-height: 1.45; }
.cp-gift-option-switch {
  position: relative; display: block; flex-shrink: 0; width: 44px; height: 26px;
  border: 1px solid #ffffff27; border-radius: 20px; background: #08080c66;
  font-size: 0; color: transparent; pointer-events: none;
  transition: background 180ms ease, border-color 180ms ease;
}
.cp-gift-option-switch::after {
  content: ""; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px;
  border-radius: 50%; background: #a19ca9; box-shadow: 0 2px 4px #0004;
  transition: transform 200ms ease, background 180ms ease;
}
.cp-gift-option.is-active .cp-gift-option-switch,
.cp-gift-option > button[aria-pressed="true"] .cp-gift-option-switch { background: #c89b50; border-color: #e9c483; }
.cp-gift-option.is-active .cp-gift-option-switch::after,
.cp-gift-option > button[aria-pressed="true"] .cp-gift-option-switch::after { transform: translateX(18px); background: #fff0cc; }
.cp-gift-option-panel { display: grid; gap: 16px; min-width: 0; padding: 16px; border-top: 1px solid #ffffff12; }
.cp-gift-option-panel[hidden], .cp-gift-preview[hidden] { display: none !important; }
.cp-gift-option-panel > p { margin: 0; color: #beb8c5; font-size: .8125rem; line-height: 1.5; }
.cp-gift-option-panel .cp-field { display: grid; gap: 7px; min-width: 0; margin: 0; }
.cp-gift-option-panel .cp-field > span { color: #ded7e2; font-size: .8125rem; line-height: 1.4; }
.cp-gift-option-panel :is(input:not([type="file"]), textarea, select) {
  width: 100%; max-width: 100%; min-width: 0; min-height: 44px;
  padding: 11px 12px; border: 1px solid #ffffff25; border-radius: 13px;
  color: #f7f5ef; background: #0c0b1199; font: inherit; font-size: 1rem; line-height: 1.45;
}
.cp-gift-option-panel textarea { resize: vertical; min-height: 96px; }
.cp-gift-option-panel :is(input, textarea)::placeholder { color: #958e9f; }
.cp-gift-content-switch, .cp-gift-delivery-methods, .cp-gift-certificate-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; }
.cp-gift-content-switch button, .cp-gift-delivery-methods button, .cp-gift-certificate-tabs button {
  min-width: 0; min-height: 44px; padding: 9px 10px;
  border: 1px solid #ffffff24; border-radius: 12px; color: #cec6d5;
  background: #ffffff04; font: inherit; font-size: .8125rem; line-height: 1.4; cursor: pointer;
}
.cp-gift-content-switch button:is(.is-active, [aria-pressed="true"]),
.cp-gift-delivery-methods button:is(.is-active, [aria-pressed="true"]),
.cp-gift-certificate-tabs button:is(.is-active, [aria-pressed="true"]) {
  border-color: #e8bf6c80; color: #f2d7a3; background: #e8bf6c10;
}
.cp-gift-upload {
  position: relative; display: grid; justify-items: start; gap: 6px;
  min-width: 0; min-height: 76px; padding: 14px;
  border: 1px dashed #e8bf6c55; border-radius: 14px; background: #e8bf6c05;
  color: #e9d1a3; font-size: .875rem; line-height: 1.45; cursor: pointer;
}
.cp-gift-upload input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.cp-gift-upload :is(small, .cp-gift-upload-name, .cp-gift-upload-filename) { max-width: 100%; color: #bbb3c2; font-size: .75rem; line-height: 1.45; overflow-wrap: anywhere; }
.cp-gift-upload:focus-within { outline: 2px solid #f3d798; outline-offset: 3px; }
.cp-gift-preview-trigger, .cp-gift-option-panel > button {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 0; min-height: 44px; padding: 10px 12px;
  border: 1px solid #ffffff28; border-radius: 12px; background: #ffffff03;
  color: #e8dcc6; font: inherit; font-size: .8125rem; line-height: 1.4; text-align: center; cursor: pointer;
}
.cp-gift-options button:focus-visible, .cp-gift-option-panel :is(input, textarea, select):focus-visible { outline: 2px solid #f3d798; outline-offset: 3px; }
.cp-gift-paper-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; min-width: 0; }
.cp-gift-paper-choices [data-gift-paper="brand"] { grid-column: 1 / -1; }
.cp-gift-paper-choices button {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px;
  min-width: 0; min-height: 44px; padding: 7px 6px;
  border: 1px solid #ffffff24; border-radius: 12px; color: #d9d1de; background: #ffffff04;
  font: inherit; font-size: .75rem; line-height: 1.35; cursor: pointer;
}
.cp-gift-paper-choices button:is(.is-active, [aria-pressed="true"]) { border-color: #e8bf6c80; color: #f0d29b; background: #e8bf6c0a; }
.cp-gift-paper-swatch { flex: 0 0 auto; display: inline-block; width: 14px; height: 14px; border: 1px solid #ffffff35; border-radius: 50%; background: #eae3d3; }
.cp-gift-paper-swatch--ivory { background: #eae3d3; }
.cp-gift-paper-swatch--kraft { background: #b89466; }
.cp-gift-paper-swatch--black { background: #252830; }
.cp-gift-paper-swatch--red { background: #973d45; }
textarea[data-gift-wrap-preference] { min-height: 80px; }
[data-gift-wrap-counter].is-over-limit, [data-gift-card-counter].is-over-limit { color: #eea29b; }
[data-gift-paper="ivory"] .cp-gift-paper-swatch { background: #eae3d3; }
[data-gift-paper="kraft"] .cp-gift-paper-swatch { background: #b89466; }
[data-gift-paper="black"] .cp-gift-paper-swatch { background: #252830; }
.cp-gift-certificate-counter { margin: -8px 0 0; color: #a9a0b3; font-size: .75rem; line-height: 1.4; text-align: right; }
/* One physical card: the same black and gold material on both sides. */
.cp-gift-certificate-preview { width: 100%; max-width: 294px; aspect-ratio: 7 / 5; margin: 2px auto; min-width: 0; perspective: 900px; }
.cp-gift-certificate-turn { position: relative; width: 100%; height: 100%; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; transition: transform 480ms cubic-bezier(.22,.75,.25,1); }
.cp-gift-certificate-preview.is-back .cp-gift-certificate-turn { transform: rotateY(180deg); }
.cp-gift-certificate-face {
  position: absolute; inset: 0; display: grid; min-width: 0; overflow: hidden;
  padding: 18px; border: 1px solid #cda96b; border-radius: 12px;
  color: #eee5d5; background: radial-gradient(ellipse at 5% 0%, #5e482327, transparent 75%), linear-gradient(135deg, #202126, #0b0c10);
  box-shadow: inset 0 0 0 5px #0f1014, inset 0 0 0 6px #c5a16630, 0 7px 18px #0004;
  -webkit-backface-visibility: hidden; backface-visibility: hidden;
  /* Safari can paint children through the opposite face. Swap their paint
     halfway through the turn as well as hiding their backfaces. */
  transition: opacity 0s linear 240ms;
}
.cp-gift-certificate-face[aria-hidden="true"] { opacity: 0; }
.cp-gift-certificate-face[aria-hidden="false"] { opacity: 1; }
.cp-gift-certificate-front { align-content: space-between; gap: 12px; transform: translateZ(1px); }
.cp-gift-certificate-front > small { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; color: #e5c88e; font-size: .75rem; letter-spacing: .08em; }
.cp-gift-certificate-front > small > span { color: #c7beaf; font-size: .6875rem; letter-spacing: 0; }
.cp-gift-certificate-front > strong { position: relative; z-index: 1; font-size: clamp(2.625rem, 11vw, 3.625rem); line-height: .95; letter-spacing: -.06em; font-weight: 600; color: #e6c587; }
.cp-gift-certificate-front > span { position: relative; z-index: 1; max-width: 24ch; font-size: .75rem; line-height: 1.45; color: #d4ccbe; }
.cp-gift-certificate-front > i { position: absolute; right: 21px; top: 66px; color: #cfaa653d; font: normal 70px/1 Georgia,serif; transform: rotate(12deg); }
.cp-gift-certificate-back { grid-template-rows: auto minmax(0, 1fr) auto; gap: 8px; transform: rotateY(180deg) translateZ(1px); }
.cp-gift-certificate-back > small { color: #e1c38c; font-size: .75rem; line-height: 1.3; }
.cp-gift-certificate-back > span { color: #a99a7e; font-size: .6875rem; line-height: 1.3; }
.cp-gift-certificate-lines { min-height: 0; min-width: 0; background: repeating-linear-gradient(transparent 0 21px, #d7b77829 21px 22px); }
.cp-gift-certificate-lines p { height: 100%; margin: 0; padding: 0 2px 0 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #b79a5c66 transparent; color: #eee6d9; font-size: .8125rem; line-height: 22px; white-space: pre-wrap; overflow-wrap: anywhere; }
.cp-gift-certificate-lines p:focus-visible { outline: 1px solid #d9b879; outline-offset: 2px; }

/* Contents sit behind the front rim. Folded tissue has an overlap, not an envelope flap. */
.cp-gift-preview { display: grid; gap: 10px; min-width: 0; padding: 10px 0 0; }
.cp-gift-box-preview {
  position: relative; width: 100%; max-width: 320px; height: 282px; margin: 0 auto;
  isolation: isolate; perspective: 700px; border-radius: 18px;
  background: radial-gradient(ellipse at 50% 68%, #b5bdca13, #ffffff02 66%);
  --preview-box-width: 230px;
  --gift-paper-light: #f1eee4; --gift-paper: #e4decd; --gift-paper-fold: #bfb6a0;
}
.cp-gift-box-preview[data-wrapping="kraft"] { --gift-paper-light: #c7aa84; --gift-paper: #b99c75; --gift-paper-fold: #8d7150; }
.cp-gift-box-preview[data-wrapping="black"] { --gift-paper-light: #454851; --gift-paper: #2d3038; --gift-paper-fold: #171a21; }
.cp-gift-box-preview::after { content: ""; position: absolute; z-index: -1; left: 16%; right: 16%; bottom: 9px; height: 26px; border-radius: 50%; background: #0006; filter: blur(9px); }
.cp-gift-preview-lid {
  position: absolute; z-index: 1; top: 19px; left: calc(50% - var(--preview-box-width) / 2);
  width: var(--preview-box-width); height: 112px; border: 1px solid #555860; border-radius: 7px;
  background: linear-gradient(140deg, #292b32, #0b0c10);
  box-shadow: inset 0 0 0 3px #111217, 0 4px 10px #0005;
  transform-origin: center bottom; transform: rotateX(-16deg);
}
.cp-gift-preview-lid::after { content: ""; position: absolute; bottom: -19px; left: 12%; right: 12%; height: 18px; background: linear-gradient(#101115, #20222a 80%, #30323b); border-inline: 1px solid #393c4470; }
.cp-gift-preview-print { position: absolute; inset: 10px; display: grid; place-items: center; padding: 9px; min-width: 0; overflow: hidden; border-radius: 3px; color: #fffaf0; background: linear-gradient(145deg, #16171c, #0b0c10); }
.cp-gift-preview-print::after { content: ""; position: absolute; bottom: 6px; left: calc(50% - 14px); width: 28px; height: 1px; background: #c7a266; }
.cp-gift-preview-print img { position: absolute; inset: 8px; display: block; width: calc(100% - 16px); height: calc(100% - 16px); min-height: 0; object-fit: contain; }
.cp-gift-preview-print strong { display: block; width: 100%; max-height: 100%; margin: 0; overflow: hidden; font-size: .9375rem; font-weight: 600; line-height: 1.35; text-align: center; white-space: pre-line; overflow-wrap: anywhere; }
.cp-gift-preview-base {
  position: absolute; z-index: 2; left: calc(50% - var(--preview-box-width) / 2); bottom: 25px;
  width: var(--preview-box-width); height: 112px; overflow: hidden;
  border: 1px solid #4c505a; border-radius: 5px 5px 8px 8px;
  background: linear-gradient(155deg, #252831, #0c0d12 58%);
  box-shadow: inset 0 0 0 7px #191b22, inset 0 7px 13px #0007, 0 8px 15px #0005;
}
.cp-gift-preview-base::before { content: ""; position: absolute; z-index: 0; top: 0; left: 6px; right: 6px; height: 10px; border-bottom: 1px solid #343842; background: linear-gradient(#393c45, #161820); }
.cp-gift-preview-base::after { content: ""; position: absolute; z-index: 8; left: -1px; right: -1px; bottom: -1px; height: 19px; border-top: 1px solid #484c55; border-radius: 0 0 7px 7px; background: linear-gradient(120deg, #2b2e37, #171920 65%, #0d0e12); box-shadow: 0 -2px 5px #0003; }
.cp-gift-box-preview[data-outer-paper="ivory"] { --gift-outer-light: #dfd7c4; --gift-outer-dark: #b3a98f; }
.cp-gift-box-preview[data-outer-paper="black"] { --gift-outer-light: #444751; --gift-outer-dark: #171a20; }
.cp-gift-box-preview[data-outer-paper="red"] { --gift-outer-light: #9f4a51; --gift-outer-dark: #61242b; }
.cp-gift-box-preview[data-outer-paper="kraft"] { --gift-outer-light: #b2946d; --gift-outer-dark: #79603f; }
.cp-gift-parcel { position: absolute; z-index: 2; top: 4px; left: 5%; width: 90%; height: 105px; overflow: visible; }
.cp-paper-light { stop-color: var(--gift-paper-light); }
.cp-paper-base { stop-color: var(--gift-paper); }
.cp-paper-shadow { stop-color: var(--gift-paper-fold); }
.cp-gift-parcel-zip { opacity: .85; transition: opacity 430ms ease; }
.cp-gift-paper-under { transition: opacity 430ms ease; }
.cp-gift-paper-left, .cp-gift-paper-right { transform-box: fill-box; transition: transform 430ms cubic-bezier(.22,.8,.24,1), opacity 430ms ease; }
.cp-gift-paper-left { transform-origin: left center; }
.cp-gift-paper-right { transform-origin: right center; }
.cp-gift-paper-seal { transform-box: fill-box; transform-origin: center; transition: transform 230ms ease, opacity 180ms ease; }
.cp-gift-seal-control { position: absolute; z-index: 4; top: calc(50% - 14px); left: calc(50% - 22px); width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.cp-gift-seal-control:focus-visible { outline-offset: -3px; }
.is-unwrapped .cp-gift-paper-left { transform: translateX(-23px) rotate(-12deg); opacity: .14; }
.is-unwrapped .cp-gift-paper-right { transform: translateX(23px) rotate(12deg); opacity: .14; }
.is-unwrapped .cp-gift-paper-under { opacity: .06; }
.is-unwrapped .cp-gift-paper-seal { transform: translate(-7px, -12px) rotate(-20deg); opacity: 0; }
.is-unwrapped .cp-gift-parcel-zip { opacity: 1; }
.cp-gift-preview-card {
  position: absolute; z-index: 5; top: 20px; right: 14px; display: grid; align-content: center; justify-items: center; gap: 3px;
  width: 84px; aspect-ratio: 7 / 5; padding: 7px 5px;
  border: 1px solid #cda96b; border-radius: 5px;
  background: radial-gradient(ellipse at 5% 0%, #76603726, transparent 80%), linear-gradient(135deg, #26272c, #0b0c10);
  color: #e2c38b; transform: rotate(-4deg); box-shadow: inset 0 0 0 3px #101115, inset 0 0 0 4px #c5a16638, 0 4px 7px #0006;
  transition: transform 430ms ease;
}
.cp-gift-preview-card small { color: #e4c992; font-size: 7px; line-height: 1; letter-spacing: .05em; }
.cp-gift-preview-card strong { font-size: 23px; font-weight: 600; line-height: 1; letter-spacing: -.05em; }
.cp-gift-preview-card > span { color: #b8ae9c; font-size: 6px; line-height: 1; }
.is-unwrapped .cp-gift-preview-card { transform: translate(3px, -7px) rotate(2deg); }
.cp-gift-preview-control, .cp-gift-option-panel > .cp-gift-preview-control {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 44px;
  padding: 9px 12px; border: 1px solid #cba6664a; border-radius: 12px;
  color: #e7cf9f; background: #ddba7507; font: inherit; font-size: .8125rem; line-height: 1.4; cursor: pointer;
}
.cp-gift-preview-control svg { flex: 0 0 auto; width: 20px; height: 20px; }
.cp-gift-preview-control[aria-pressed="true"] { border-color: #cba6667a; background: #ddba7510; }
.cp-gift-preview-caption { margin: 0; color: #bdb4c4; font-size: .75rem; line-height: 1.5; text-align: center; }
.cp-gift-preview-note { color: #9f95ab; font-size: .6875rem; line-height: 1.4; text-align: center; }

@media (max-width: 991.98px) {
  #cp-step-gift { border: 0; border-radius: 0; background: none; box-shadow: none; }
  #cp-step-gift .cp-step-body { gap: 14px; padding: 0; }
  #cp-step-gift .cp-step-head { gap: 6px; padding-bottom: 12px; }
  #cp-step-gift .cp-step-head h2 { font-size: 1.5rem; line-height: 1.15; }
  #cp-step-gift .cp-step-head p { margin: 0; font-size: .8125rem; line-height: 1.45; }
  .cp-gift-option > button, .cp-gift-option-toggle { grid-template-columns: 42px minmax(0, 1fr) 44px; gap: 11px; padding: 14px 12px; }
  .cp-gift-option-icon { width: 42px; height: 48px; border-radius: 13px; }
  .cp-gift-option-panel { padding: 14px 12px; gap: 14px; }
}
@media (max-width: 359px) {
  #cp-step-gift .cp-step-body { padding: 0; }
  .cp-gift-option > button, .cp-gift-option-toggle { grid-template-columns: 36px minmax(0, 1fr) 40px; gap: 9px; padding-inline: 10px; }
  .cp-gift-option-icon { width: 36px; height: 44px; }
  .cp-gift-option-icon > svg { width: 28px; height: 28px; }
  .cp-gift-option-switch { width: 40px; }
  .cp-gift-option.is-active .cp-gift-option-switch::after,
  .cp-gift-option > button[aria-pressed="true"] .cp-gift-option-switch::after { transform: translateX(14px); }
  .cp-gift-box-preview { --preview-box-width: 190px; height: 256px; }
  .cp-gift-preview-lid { top: 16px; height: 94px; }
  .cp-gift-preview-base { height: 104px; bottom: 22px; }
  .cp-gift-parcel { top: 3px; height: 98px; }
  .cp-gift-preview-card { top: 20px; right: 12px; width: 76px; }
  .cp-gift-preview-card strong { font-size: 21px; }
  .cp-gift-certificate-face { padding: 16px; }
  .cp-gift-certificate-front { gap: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .cp-gift-option, .cp-gift-option-switch, .cp-gift-option-switch::after,
  .cp-gift-certificate-turn, .cp-gift-certificate-face, .cp-gift-preview-card, .cp-gift-parcel-zip,
  .cp-gift-paper-under, .cp-gift-paper-left, .cp-gift-paper-right, .cp-gift-paper-seal { transition: none !important; }
}

.cp-addon-card--included { display: grid; grid-template-columns: 38px minmax(0, 1fr) 20px; align-items: center; gap: 12px; min-height: 76px; padding: 12px; border: 1px solid #ffffff20; border-radius: 16px; background: #ffffff03; }
.cp-addon-card--included .cp-addon-card-icon { width: 38px; height: 42px; }
.cp-addon-card--included .cp-addon-card-body { min-width: 0; gap: 5px; }
.cp-addon-card--included strong { color: #ebe4d8; font-size: .875rem; line-height: 1.35; }
.cp-addon-card--included small { color: #bcb3c4; font-size: .75rem; line-height: 1.4; }
.cp-addon-included-check { color: #e3c68e; font-size: 18px; }