/*
 * pm.newsletter-modal.css
 *
 * Styles the newsletter signup modal (_NewsletterModal.cshtml) and defends it from this site's
 * ambient cascade. Ported from forums.stardock.com's wwwroot/css/shared/newsletter-modal.css.
 *
 * WHY THIS IS NOT A COPY OF THE FORUMS SHEET
 * ------------------------------------------
 * That sheet resolves every colour through forums' theme variables (--background, --accent-color,
 * --border-color, --error-text-color ...) and puts `.sd-btn sd-btn-cta` on the submit button. None
 * of those exist on this host, so a straight copy renders an unstyled dialog with invisible text:
 * every var() falls back to nothing and the button loses its only styling. Colours here are this
 * site's own literals, taken from politicalmachine2024.css.
 *
 * THE FOUR THINGS THIS SITE DOES TO ANY DIALOG DROPPED INTO IT
 * -----------------------------------------------------------
 * The modal renders in the same cascade as politicalmachine2024.css and reset.css, exactly like the
 * shared header does, so it needs the same class of defence pm.header-isolation.css provides. Each
 * rule below marked (D) is defensive rather than decorative:
 *
 *   1. text-align. politicalmachine2024.css:30 sets `body { text-align: center }`, which inherits
 *      into everything. Left unhandled, the label, body copy and error messages all centre.
 *   2. The title is an <h2>, and politicalmachine2024.css:6 sets bare `h2 { font: 48px
 *      "cooper-black-std" }` via the `font:` SHORTHAND, which also resets font-weight and
 *      line-height. A 48px display face in a 420px dialog header overflows it outright. The class
 *      selector (0,1,0) beats the bare element (0,0,1), so an explicit `font` shorthand wins
 *      cleanly - it must be the shorthand, or the untouched shorthand components leak through.
 *   3. No box-sizing reset exists anywhere on this site (verified: reset.css declares none), so
 *      the input's padding and border would add to its flex basis and overflow the row.
 *   4. This site declares no color-scheme, so UA system colours resolve in LIGHT mode - the same
 *      defect pm.header-isolation.css documents for the header's search box. The input is given
 *      explicit colours anyway; `color-scheme: dark` covers the caret, scrollbars and any control
 *      added later.
 *
 * Z-INDEX IS 2100 AND THAT NUMBER IS LOAD-BEARING
 * -----------------------------------------------
 * The forums sheet uses 1100, chosen to clear ITS categories drawer at 1060. Copying it here would
 * put the dialog UNDERNEATH this site's own fixed chrome: politicalmachine2024.css:92 declares
 * z-index 2000, and :70 declares 1002. 2100 clears both with room, and clears the shared header
 * (position: fixed, see pm.header-offset.css) which is what opens the modal in the first place.
 *
 * PALETTE
 * -------
 * Panel/red bar from the site nav (#cd0404 -> #a60000 gradient, politicalmachine2024.css:115), body
 * copy on the site's near-black (#000209 at :19). The submit button deliberately reuses the FOOTER
 * subscribe button's colours (#272727 / #f2f2f2, :382) rather than the green Purchase gradient
 * (:153) - green means "buy" on this site, and this control does not.
 */
.sd-newsletter-modal[hidden]{display:none}
.sd-newsletter-modal{position:fixed;inset:0;z-index:2100;display:flex;align-items:center;justify-content:center;padding:1rem;text-align:start;color-scheme:dark}
.sd-newsletter-modal,.sd-newsletter-modal *{box-sizing:border-box}
.sd-newsletter-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.65)}
.sd-newsletter-modal__content{position:relative;z-index:1;width:100%;max-width:420px;background:#0b1016;color:#fff;border:1px solid #2a2f36;border-radius:6px;box-shadow:0 8px 30px rgba(0,0,0,.55);overflow:hidden}
.sd-newsletter-modal__header{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,#cd0404,#a60000);color:#fff;padding:.5em .75em}
.sd-newsletter-modal__title{margin:0;font:600 1rem/1.3 'Segoe UI',Arial,Tahoma,sans-serif}
.sd-newsletter-modal__close{background:none;border:0;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;padding:0 .25rem}
.sd-newsletter-modal__close:hover{opacity:.8}
.sd-newsletter-modal__body{padding:1rem}
.sd-newsletter-modal__text{margin:0 0 .75rem;font-size:.9rem;line-height:1.4}
.sd-newsletter-modal__label{display:block;font-size:.8rem;font-weight:600;margin-bottom:.35rem}
.sd-newsletter-modal__row{display:flex;flex-wrap:wrap;align-items:stretch;gap:.5rem}
.sd-newsletter-modal__input{flex:1 1 12rem;min-width:0;padding:.5em .65em;border:1px solid #7f7f7f;background:#fff;color:#333;font-size:.9rem;border-radius:3px}
.sd-newsletter-modal__btn{flex:0 0 auto;white-space:nowrap;background-color:#272727;border:1px solid #f2f2f2;color:#f2f2f2;font-size:.85rem;padding:.5em 1.1em;border-radius:3px;cursor:pointer}
.sd-newsletter-modal__btn:hover{background-color:#353535}
.sd-newsletter-modal__btn[disabled]{opacity:.6;cursor:default}
.sd-newsletter-modal__msg{margin-top:.6rem;font-size:.85rem;min-height:1.2em}
.sd-newsletter-modal__msg--error{color:#ff8a8a}
.sd-newsletter-modal__msg--success{color:#8ce99a}
body.sd-newsletter-modal-open{overflow:hidden}
.pm-newsletter-result__actions{margin-top:1rem;text-align:end}
