/* Wedding Step 5 (Extras) only. Structural rules below are neutral so non-wedding
   journeys keep their existing appearance; all visual treatment is scoped to
   body.context-wedding .step[data-step="extras"]. */

/* --- Neutral structure: keeps the previous look for every other journey --- */
.extras-section { min-width: 0; }
.extras-section-head { position: relative; }
.extras-section-head label { display: block; margin-bottom: .48rem; color: var(--white); font-weight: 800; font-size: .84rem; }
.extras-section-copy { display: none; }
.wedding-extras-only { display: none; }
.step[data-step="extras"] .extras-wedding-copy { display: none; }

/* --- Wedding copy switching (mirrors the wedding vision / presentation pattern) --- */
body.context-wedding .step[data-step="extras"] .extras-default-copy { display: none; }
body.context-wedding .step[data-step="extras"] .extras-wedding-copy { display: inline; }
body.context-wedding .step[data-step="extras"] p.wedding-extras-only { display: block; }
body.context-wedding .step[data-step="extras"] span.extras-info.wedding-extras-only { display: inline-flex; }
body.context-wedding .step[data-step="extras"] .standard-microphone-extra { display:none; }
body.context-wedding .step[data-step="extras"] .extras-grid { grid-template-columns:1fr; }
.ceremony-only-enhancements { display:none; }
.extras-ceremony-copy { display:none; }
body.context-wedding.wedding-ceremony-only .step[data-step="extras"] .extras-grid { display:none; }
body.context-wedding.wedding-ceremony-only .step[data-step="extras"] .ceremony-only-enhancements { display:block; }
body.context-wedding.wedding-ceremony-only .step[data-step="extras"] .extras-reception-copy,
body.context-wedding.wedding-ceremony-only .step[data-step="extras"] .wedding-reception-inclusions-notice { display:none; }
body.context-wedding.wedding-ceremony-only .step[data-step="extras"] .extras-ceremony-copy { display:inline; }

/* --- Main heading accent: same plum-to-olive gradient used on the other wedding steps --- */
body.context-wedding .step[data-step="extras"] .wedding-extras-accent { display: inline-block; color: transparent; background: linear-gradient(100deg,#71445e,#70684f 52%,#52694e); background-clip: text; -webkit-background-clip: text; }

/* --- Two balanced cards --- */
body.context-wedding .step[data-step="extras"] .extras-grid { align-items: start; gap: 1.15rem; }
body.context-wedding .step[data-step="extras"] .extras-section { display: flex; flex-direction: column; padding: 1.15rem 1.2rem 1.25rem; border: 1px solid transparent; border-radius: 16px; background: linear-gradient(#f8f2e9,#f8f2e9) padding-box,var(--wedding-edge) border-box; }
body.context-wedding .step[data-step="extras"] .extras-section-head { display: flex; align-items: flex-start; gap: .45rem; }
body.context-wedding .step[data-step="extras"] .extras-section-head label { margin: 0; font-family: 'Arial Narrow','Helvetica Neue',Arial,sans-serif; font-size: 1.22rem; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: #513f49; }
body.context-wedding .step[data-step="extras"] .extras-section-copy { margin: .55rem 0 0; color: #6b5b62; font-size: .88rem; line-height: 1.5; }
body.context-wedding .step[data-step="extras"] .extras-section .field { margin-top: .9rem; }
body.context-wedding .step[data-step="extras"] .extras-section .field small { color: #6b5b62; }

/* Align heading row, description row and dropdown row across both cards on desktop. */
@media (min-width: 620px) {
  @supports (grid-template-rows: subgrid) {
    body.context-wedding .step[data-step="extras"] .extras-grid { grid-template-rows: auto auto auto; }
    body.context-wedding .step[data-step="extras"] .extras-section { display: grid; grid-row: span 3; grid-template-rows: subgrid; }
    body.context-wedding .step[data-step="extras"] .extras-section .field { align-self: start; }
  }
}

/* --- Information / tooltip icon --- */
body.context-wedding .step[data-step="extras"] .extras-info { position: static; flex: none; }
body.context-wedding .step[data-step="extras"] .extras-info-button { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; margin-top: .12rem; padding: 0; border: 1px solid rgba(113,68,94,.42); border-radius: 50%; background: rgba(127,154,120,.1); color: #71445e; font-family: inherit; font-size: .72rem; font-weight: 800; line-height: 1; cursor: pointer; }
body.context-wedding .step[data-step="extras"] .extras-info-button:hover { background: rgba(127,154,120,.2); }
body.context-wedding .step[data-step="extras"] .extras-info-button:focus-visible { outline: 2px solid #52694e; outline-offset: 2px; }
body.context-wedding .step[data-step="extras"] .extras-tooltip { position: absolute; top: calc(100% + .5rem); left: 0; z-index: 5; width: 100%; padding: .65rem .75rem; border: 1px solid rgba(113,68,94,.28); border-radius: 12px; background: #fffaf3; box-shadow: 0 10px 26px rgba(72,57,62,.16); color: #59454f; font-size: .8rem; line-height: 1.45; opacity: 0; visibility: hidden; transition: opacity .16s ease; }
body.context-wedding .step[data-step="extras"] .extras-info-button:hover + .extras-tooltip,
body.context-wedding .step[data-step="extras"] .extras-info-button:focus + .extras-tooltip,
body.context-wedding .step[data-step="extras"] .extras-info-button:focus-visible + .extras-tooltip { opacity: 1; visibility: visible; }

@media (prefers-reduced-motion: reduce) {
  body.context-wedding .step[data-step="extras"] .extras-tooltip { transition: none; }
}

/* Shared product copy and controls; journey colours continue to come from theme variables. */
.step[data-step="extras"] .extras-section-copy { display:block; margin:.55rem 0 0; color:var(--muted); font-size:.88rem; line-height:1.5; }
.step[data-step="extras"] .extras-section { display:flex; flex-direction:column; min-width:0; padding:1.15rem 1.2rem 1.25rem; border:1px solid var(--border); border-radius:16px; background:rgba(127,127,127,.06); }
.step[data-step="extras"] .extras-section-head label { margin:0; font-size:1.08rem; }
.step[data-step="extras"] .extras-section .field { margin-top:.9rem; }
.step[data-step="extras"] .extras-grid { align-items:stretch; }

.lighting-none-control { grid-column:1 / -1; min-height:auto; display:flex; flex-direction:row; align-items:center; }
.lighting-none-control small { margin-left:auto; }

/* Keep ordinary microphone add-ons out of the complete Wedding service. This
   intentionally follows the shared structural declarations above. */
body.context-wedding .step[data-step="extras"] .standard-microphone-extra { display:none; }