/**
 * Modal / overlay recipes: modal_dialog / modal_drawer / modal_form / modal_lightbox / modal_sheet.
 * apb-rx-* tokens only; brand derives from --apb-rx-brand + scheme. Every overlay is CSS-only `:target` —
 * closed by default (opacity 0, pointer-events none, zero paint — never traps the page), opened by an
 * in-flow trigger link, closed by a real anchor back to the empty fragment. Reduced-motion fallbacks
 * inline. Rendered by trait-apb-component-render-modals.php.
 */

/* ---------- shared trigger button ---------- */
.apb-rx-mdg-trigger,.apb-rx-mdr-trigger,.apb-rx-mf-trigger,.apb-rx-mds-trigger{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:650;font-size:15px;color:var(--apb-rx-accent-contrast,#fff);background:linear-gradient(135deg,var(--apb-rx-brand),var(--apb-rx-brand2,var(--apb-rx-brand)));border-radius:var(--apb-rx-radius-pill,999px);padding:12px 24px;box-shadow:0 8px 20px -8px var(--apb-rx-glow);transition:transform var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-mdg-trigger:hover,.apb-rx-mdr-trigger:hover,.apb-rx-mf-trigger:hover,.apb-rx-mds-trigger:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.apb-rx-mdg-trigger,.apb-rx-mdr-trigger,.apb-rx-mf-trigger,.apb-rx-mds-trigger{transition:none}}

/* ---------- shared overlay + scrim base (closed by default, never traps the page) ---------- */
.apb-rx-mdg-overlay,.apb-rx-mdr-overlay,.apb-rx-mf-overlay,.apb-rx-mds-overlay{position:fixed;inset:0;z-index:9000;opacity:0;pointer-events:none;transition:opacity var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-mdg-overlay:target,.apb-rx-mdr-overlay:target,.apb-rx-mf-overlay:target,.apb-rx-mds-overlay:target{opacity:1;pointer-events:auto}
.apb-rx-mdg-scrim,.apb-rx-mdr-scrim,.apb-rx-mf-scrim,.apb-rx-mds-scrim{position:absolute;inset:0;display:block;background:rgba(9,11,16,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);cursor:pointer}
@media(prefers-reduced-motion:reduce){.apb-rx-mdg-overlay,.apb-rx-mdr-overlay,.apb-rx-mf-overlay,.apb-rx-mds-overlay{transition:none}}

/* ---------- modal_dialog ---------- */
.apb-rx-mdg-dialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.94);width:min(400px,calc(100% - 40px));background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,18px);padding:26px;text-align:center;box-shadow:0 40px 90px -30px rgba(9,11,16,.6);transition:transform var(--apb-rx-t,.28s) cubic-bezier(.34,1.56,.64,1)}
.apb-rx-mdg-overlay:target .apb-rx-mdg-dialog{transform:translate(-50%,-50%) scale(1)}
.apb-rx-mdg-close{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--apb-rx-muted);background:var(--apb-rx-soft)}
.apb-rx-mdg-close:hover{color:var(--apb-rx-ink)}
.apb-rx-mdg-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;margin:0 auto 16px;color:var(--apb-rx-brand);background:color-mix(in srgb,var(--apb-rx-brand) 11%,var(--apb-rx-surface,#fff));border:1px solid color-mix(in srgb,var(--apb-rx-brand) 20%,transparent)}
.apb-rx-mdg--danger .apb-rx-mdg-ic{background:color-mix(in srgb,var(--apb-rx-brand) 18%,var(--apb-rx-surface,#fff));border-color:color-mix(in srgb,var(--apb-rx-brand) 32%,transparent)}
.apb-rx-mdg--success .apb-rx-mdg-ic{background:color-mix(in srgb,var(--apb-rx-brand) 18%,var(--apb-rx-surface,#fff));border-color:color-mix(in srgb,var(--apb-rx-brand) 32%,transparent)}
.apb-rx-mdg-dialog h3{font-size:19px;font-weight:770;letter-spacing:-.02em;color:var(--apb-rx-ink);margin:0 0 8px}
.apb-rx-mdg-dialog p{font-size:14.5px;line-height:1.6;color:var(--apb-rx-muted);margin:0 auto 22px;max-width:32ch}
.apb-rx-mdg-actions{display:flex;gap:10px}
.apb-rx-mdg-btn{flex:1;text-decoration:none;display:block;font-size:14.5px;font-weight:650;cursor:pointer;border-radius:var(--apb-rx-radius-pill,999px);padding:12px}
.apb-rx-mdg-btn.ghost{color:var(--apb-rx-ink);background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line)}
.apb-rx-mdg-btn.ghost:hover{background:var(--apb-rx-soft)}
.apb-rx-mdg-btn.primary{color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);border:1px solid var(--apb-rx-brand);box-shadow:0 8px 20px -8px var(--apb-rx-glow)}

/* ---------- modal_drawer ---------- */
.apb-rx-mdr-panel{position:absolute;top:0;right:0;bottom:0;width:min(380px,86%);display:flex;flex-direction:column;background:var(--apb-rx-surface,#fff);border-left:1px solid var(--apb-rx-line);box-shadow:-30px 0 70px -30px rgba(9,11,16,.5);transform:translateX(104%);transition:transform var(--apb-rx-t-slow,.55s) var(--apb-rx-ease)}
.apb-rx-mdr-overlay:target .apb-rx-mdr-panel{transform:translateX(0)}
.apb-rx-mdr-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid var(--apb-rx-line)}
.apb-rx-mdr-head h3{font-size:16px;font-weight:750;letter-spacing:-.01em;color:var(--apb-rx-ink);margin:0}
.apb-rx-mdr-close{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--apb-rx-muted);background:var(--apb-rx-soft)}
.apb-rx-mdr-close:hover{color:var(--apb-rx-ink)}
.apb-rx-mdr-body{flex:1;overflow-y:auto;padding:20px}
.apb-rx-mdr-empty{font-size:14px;color:var(--apb-rx-muted);margin:0}
.apb-rx-mdr-item{display:flex;gap:12px;align-items:center;padding:12px 0}
.apb-rx-mdr-item+.apb-rx-mdr-item{border-top:1px solid var(--apb-rx-line)}
.apb-rx-mdr-item img,.apb-rx-mdr-imgph{width:46px;height:46px;border-radius:10px;object-fit:cover;flex:0 0 auto;background:var(--apb-rx-soft);display:block}
.apb-rx-mdr-item .nm{font-size:13.5px;font-weight:600;color:var(--apb-rx-ink)}
.apb-rx-mdr-item .meta{font-size:12.5px;color:var(--apb-rx-muted)}
.apb-rx-mdr-item .pr{margin-left:auto;font-size:13.5px;font-weight:700;color:var(--apb-rx-ink);font-variant-numeric:tabular-nums}
.apb-rx-mdr-foot{padding:16px 20px;border-top:1px solid var(--apb-rx-line);background:var(--apb-rx-surface,#fff)}
.apb-rx-mdr-total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.apb-rx-mdr-total .l{font-size:14px;font-weight:600;color:var(--apb-rx-ink)}
.apb-rx-mdr-total .v{font-family:var(--apb-rx-font-display,var(--apb-rx-font));font-size:20px;font-weight:800;color:var(--apb-rx-ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.apb-rx-mdr-cta{display:block;width:100%;text-align:center;text-decoration:none;font-size:15px;font-weight:650;cursor:pointer;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);border:0;border-radius:var(--apb-rx-radius-pill,999px);padding:13px;box-shadow:0 8px 20px -8px var(--apb-rx-glow)}
@media(prefers-reduced-motion:reduce){.apb-rx-mdr-panel{transition:none}}

/* ---------- modal_form ---------- */
.apb-rx-mf-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.94);width:min(420px,calc(100% - 40px));max-height:calc(100% - 40px);display:flex;flex-direction:column;background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,18px);box-shadow:0 40px 90px -30px rgba(9,11,16,.6);overflow:hidden;transition:transform var(--apb-rx-t,.28s) cubic-bezier(.34,1.56,.64,1)}
.apb-rx-mf-overlay:target .apb-rx-mf-card{transform:translate(-50%,-50%) scale(1)}
.apb-rx-mf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid var(--apb-rx-line);background:var(--apb-rx-surface,#fff)}
.apb-rx-mf-head h3{font-size:17px;font-weight:770;letter-spacing:-.01em;color:var(--apb-rx-ink);margin:0}
.apb-rx-mf-close{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;cursor:pointer;color:var(--apb-rx-muted);background:var(--apb-rx-soft)}
.apb-rx-mf-close:hover{color:var(--apb-rx-ink)}
.apb-rx-mf-body{flex:1;overflow-y:auto;padding:22px}
.apb-rx-mf-lead{font-size:13.5px;line-height:1.6;color:var(--apb-rx-muted);margin:0 0 16px}
.apb-rx-mf-field{margin-bottom:12px}
.apb-rx-mf-field label{display:block;font-size:12.5px;font-weight:600;color:var(--apb-rx-ink);margin-bottom:6px}
.apb-rx-mf-field input{width:100%;font:inherit;font-size:14px;color:var(--apb-rx-ink);background:var(--apb-rx-soft);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,10px);padding:11px 13px}
.apb-rx-mf-submit{display:block;width:100%;text-align:center;font:inherit;font-size:15px;font-weight:650;color:var(--apb-rx-accent-contrast,#fff);background:var(--apb-rx-brand);border:0;border-radius:var(--apb-rx-radius-pill,999px);padding:13px;margin-top:6px;box-shadow:0 8px 20px -8px var(--apb-rx-glow)}
.apb-rx-mf-submit[disabled]{opacity:.75;cursor:default}
.apb-rx-mf-alt{text-align:center;font-size:12.5px;color:var(--apb-rx-muted);margin:14px 0 0}
.apb-rx-mf-altlink{color:var(--apb-rx-accent-text,var(--apb-rx-brand));text-decoration:none;font-weight:600}
.apb-rx-mf-formhost{margin-top:6px}
@media(prefers-reduced-motion:reduce){.apb-rx-mf-card{transition:none}}

/* ---------- modal_lightbox (trigger = a thumbnail grid; each thumb targets its own overlay) ---------- */
.apb-rx-mlb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}
.apb-rx-mlb-thumb{display:block;border-radius:var(--apb-rx-radius,10px);overflow:hidden;aspect-ratio:1;background:var(--apb-rx-soft)}
.apb-rx-mlb-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-mlb-thumb:hover img{transform:scale(1.05)}
.apb-rx-mlb-overlay{position:fixed;inset:0;z-index:9000;background:#0b0d12;opacity:0;pointer-events:none;transition:opacity var(--apb-rx-t,.28s) var(--apb-rx-ease)}
.apb-rx-mlb-overlay:target{opacity:1;pointer-events:auto}
.apb-rx-mlb-stage{position:absolute;inset:0;display:grid;place-items:center;padding:52px 64px}
.apb-rx-mlb-img{max-width:100%;max-height:100%;border-radius:var(--apb-rx-radius,10px);object-fit:contain;box-shadow:0 30px 70px -20px rgba(0,0,0,.6)}
.apb-rx-mlb-close{position:absolute;top:16px;right:16px;z-index:3;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#fff;background:rgba(255,255,255,.12)}
.apb-rx-mlb-close:hover{background:rgba(255,255,255,.22)}
.apb-rx-mlb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#fff;background:rgba(255,255,255,.12)}
.apb-rx-mlb-nav:hover{background:rgba(255,255,255,.22)}
.apb-rx-mlb-nav.prev{left:14px}.apb-rx-mlb-nav.next{right:14px}
.apb-rx-mlb-bar{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:linear-gradient(transparent,rgba(8,10,15,.72))}
.apb-rx-mlb-cap{min-width:0}
.apb-rx-mlb-cap .t{font-size:14.5px;font-weight:650;color:#fff}
.apb-rx-mlb-cap .s{font-size:12.5px;color:rgba(255,255,255,.6)}
.apb-rx-mlb-dots{display:flex;gap:6px;flex:0 0 auto}
.apb-rx-mlb-dots span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);display:block}
.apb-rx-mlb-dots span.on{background:var(--apb-rx-brand);width:18px;border-radius:4px}
@media(prefers-reduced-motion:reduce){.apb-rx-mlb-thumb img,.apb-rx-mlb-overlay{transition:none}}

/* ---------- modal_sheet ---------- */
.apb-rx-mds-sheet{position:absolute;left:0;right:0;bottom:0;background:var(--apb-rx-surface,#fff);border-top-left-radius:22px;border-top-right-radius:22px;box-shadow:0 -24px 60px -24px rgba(9,11,16,.45);padding:10px 20px 22px;transform:translateY(102%);transition:transform var(--apb-rx-t-slow,.55s) var(--apb-rx-ease)}
.apb-rx-mds-overlay:target .apb-rx-mds-sheet{transform:translateY(0)}
.apb-rx-mds-grab{display:block;width:40px;height:5px;border-radius:999px;background:var(--apb-rx-line);margin:0 auto 16px}
.apb-rx-mds-sheet h3{font-size:17px;font-weight:750;letter-spacing:-.01em;color:var(--apb-rx-ink);margin:0 0 3px;text-align:center}
.apb-rx-mds-sub{font-size:13px;color:var(--apb-rx-muted);margin:0 0 16px;text-align:center}
.apb-rx-mds-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.apb-rx-mds-act{display:flex;align-items:center;gap:14px;font-size:15px;font-weight:600;color:var(--apb-rx-ink);background:var(--apb-rx-surface,#fff);border:1px solid var(--apb-rx-line);border-radius:var(--apb-rx-radius,12px);padding:14px 16px}
.apb-rx-mds-act.danger{color:var(--apb-rx-brand)}
.apb-rx-mds-ic{width:34px;height:34px;border-radius:9px;flex:0 0 auto;display:grid;place-items:center;color:var(--apb-rx-ink);background:var(--apb-rx-soft)}
.apb-rx-mds-act.danger .apb-rx-mds-ic{color:var(--apb-rx-brand);background:color-mix(in srgb,var(--apb-rx-brand) 10%,transparent)}
.apb-rx-mds-cancel{display:block;width:100%;text-align:center;text-decoration:none;font-size:14.5px;font-weight:650;cursor:pointer;color:var(--apb-rx-muted);background:var(--apb-rx-soft);border:0;border-radius:var(--apb-rx-radius-pill,999px);padding:13px}
@media(max-width:520px){.apb-rx-mdr-panel{width:100%}}
@media(prefers-reduced-motion:reduce){.apb-rx-mds-sheet{transition:none}}