.promo-box { margin-top: 1rem; padding: 1rem; border: 1px solid #b8c9df; border-radius: 12px; background: #f6f9ff; color: #17324d; text-align: left; min-width: 0; }
.promo-box label { display: block; font-size: .9rem; font-weight: 650; margin-bottom: .5rem; }
.promo-controls { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.promo-controls input { flex: 1 1 100px; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; min-height: 44px; border: 1px solid #738ba7; border-radius: 8px; background: #fff; color: #17324d; padding: .65rem .75rem; font: inherit; text-transform: uppercase; }
.promo-controls button { flex: 0 0 auto; min-height: 44px; padding: .6rem .8rem; border: 1px solid #58799d; border-radius: 8px; background: #173e6b; color: #fff; font: inherit; font-size: .85rem; cursor: pointer; }
.promo-controls button[data-promo-remove] { background: transparent; color: #173e6b; }
.promo-box :focus-visible { outline: 3px solid #2965c7; outline-offset: 3px; }
.promo-controls button:disabled { opacity: .65; cursor: wait; }
.promo-note, .promo-status { margin: .6rem 0 0; font-size: .8rem; line-height: 1.5; overflow-wrap: anywhere; }
.promo-status[data-error="true"] { color: #9b2531; }
.promo-breakdown { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem .75rem; margin: .85rem 0 0; font-size: .8rem; }
.promo-breakdown dt, .promo-breakdown dd { margin: 0; }
.promo-breakdown dd { text-align: right; font-variant-numeric: tabular-nums; }
.promo-total { font-weight: 750; padding-top: .5rem; border-top: 1px solid #bccbdd; }
.promo-box [hidden] { display: none !important; }
.payment-actions > .promo-box { grid-column: 1 / -1; flex-basis: 100%; width: 100%; box-sizing: border-box; }
.cs-plans .promo-box p { color: #17324d; font-size: .8rem; min-height: 0; margin: .6rem 0 0; }
.cs-plans .promo-box .promo-status[data-error="true"] { color: #9b2531; }
.promo-controls button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }