/*
 * PromoRequestPanel — internal panel styles. Same SecureTree tokens as the
 * public form (promo.css) in a plain admin layout. Bump the ?v= on the
 * <link> in _Layout.cshtml whenever this file changes.
 */
:root{
  color-scheme:light;
  --navy-deep:#0c2f55; --navy:#12406e;
  --surface:#fff; --raised:#f4f4f4; --page:#f7f8fa;
  --border:#ccc; --border-subtle:#e6e6e6; --rule:#dedede;
  --text:#2b2b2b; --text-secondary:#666; --text-muted:#707070;
  --action:#20718d; --action-hover:#1d6a84; --focus:#2584a3;
  --negative:#a02b38; --negative-bg:#fdf2f3; --negative-border:#e2b6bb;
  --nm-green:#529342; --nm-blue:#2584a3; --nm-yellow:#f7a749; --nm-orange:#e57244; --nm-red:#cb3a49;
  --radius:3px;
  --font:"Segoe UI",Roboto,-apple-system,Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;font-family:var(--font);font-size:1.5rem;line-height:1.5;color:var(--text);background:var(--page)}
a{color:var(--action)}
a:hover{color:var(--action-hover)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:.2rem solid var(--focus);outline-offset:.2rem}
code{font-size:1.3rem;background:var(--raised);padding:.2rem .5rem;border-radius:var(--radius)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.accent{display:grid;grid-template-columns:repeat(5,1fr);height:.5rem}
.accent span:nth-child(1){background:var(--nm-green)}
.accent span:nth-child(2){background:var(--nm-blue)}
.accent span:nth-child(3){background:var(--nm-yellow)}
.accent span:nth-child(4){background:var(--nm-orange)}
.accent span:nth-child(5){background:var(--nm-red)}

.wrap{width:100%;max-width:112rem;margin:0 auto;padding:0 2rem}
.topbar{background:var(--navy-deep);color:#fff}
.topbar__inner{display:flex;align-items:center;gap:2.4rem;min-height:5.6rem}
.brand{color:#fff;font-weight:600;font-size:1.7rem;text-decoration:none;letter-spacing:.01em}
.brand:hover{color:#fff}
.nav{display:flex;gap:1.6rem}
.nav a{color:rgba(255,255,255,.78);text-decoration:none;font-size:1.4rem;padding:.4rem 0;border-bottom:.2rem solid transparent}
.nav a:hover,.nav a.active{color:#fff;border-bottom-color:var(--nm-yellow)}
.user{margin-left:auto;display:flex;align-items:center;gap:1.4rem;font-size:1.3rem;color:rgba(255,255,255,.78)}
.user__out{color:#fff}

.main{flex:1;padding-top:2.8rem;padding-bottom:4rem}
.pagehead{margin-bottom:2rem}
.pagehead--split{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1.6rem}
h1{margin:0 0 .4rem;font-size:2.4rem;font-weight:600;line-height:1.25;color:var(--navy)}
h2{margin:0 0 1.2rem;font-size:1.3rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}
.muted{color:var(--text-muted)}
.small{font-size:1.3rem}
.note{font-size:1.3rem;color:var(--text-muted);margin:-.8rem 0 1.6rem}
.crumbs{margin:0 0 1.2rem;font-size:1.4rem}
.crumbs a{text-decoration:none}

/* filters */
.filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.2rem;margin-bottom:2rem;padding:1.6rem;background:var(--surface);border:.1rem solid var(--border-subtle);border-radius:var(--radius)}
.filters label{display:flex;flex-direction:column;gap:.5rem;font-size:1.3rem;font-weight:600;color:var(--text-secondary)}
.filters__search{flex:1 1 28rem}
.filters__date{flex:0 0 16rem}
.filters input{height:4rem;padding:0 1.2rem;font:inherit;font-size:1.5rem;color:var(--text);border:.1rem solid var(--border);border-radius:var(--radius);background:var(--surface)}
.filters input:focus{border-color:var(--focus)}

.btn{display:inline-flex;align-items:center;justify-content:center;height:4rem;padding:0 1.6rem;font:inherit;font-size:1.4rem;font-weight:600;color:#fff;background:var(--action);border:.1rem solid var(--action);border-radius:var(--radius);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--action-hover);border-color:var(--action-hover);color:#fff}
.btn--ghost{background:var(--surface);color:var(--action)}
.btn--ghost:hover{background:var(--raised);color:var(--action-hover)}
.btn--small{height:3.2rem;padding:0 1.2rem;font-size:1.3rem}

/* table */
.tablewrap{overflow-x:auto;background:var(--surface);border:.1rem solid var(--border-subtle);border-radius:var(--radius)}
.grid{width:100%;border-collapse:collapse;font-size:1.4rem}
.grid th,.grid td{padding:1.1rem 1.4rem;text-align:left;border-bottom:.1rem solid var(--border-subtle);vertical-align:top}
.grid thead th{font-size:1.2rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);background:var(--raised)}
.grid tbody tr:last-child td{border-bottom:0}
.grid tbody tr:hover{background:#fbfcfd}
.grid__actions{text-align:right;width:1%}
.nowrap{white-space:nowrap}
.empty{padding:4rem 2rem;text-align:center;color:var(--text-muted);background:var(--surface);border:.1rem dashed var(--border);border-radius:var(--radius)}
.pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.2rem;margin-top:1.6rem;font-size:1.4rem}
.pager > :last-child{justify-self:end}
.banner{padding:1.1rem 1.3rem;border-radius:var(--radius);font-size:1.4rem}
.banner--fail{background:var(--negative-bg);border:.1rem solid var(--negative-border);color:var(--negative)}

/* detail */
.card{background:var(--surface);border:.1rem solid var(--border-subtle);border-radius:var(--radius);padding:2rem 2.4rem;margin-bottom:2rem}
.card--meta{color:var(--text-secondary)}
.card--center{max-width:56rem;margin:4rem auto;text-align:center}
.details{margin:0}
.details__row{display:grid;grid-template-columns:18rem 1fr;gap:1.6rem;padding:1rem 0;border-bottom:.1rem solid var(--border-subtle)}
.details__row:last-child{border-bottom:0}
.details__row--legacy dt{color:var(--text-muted)}
.details dt{margin:0;font-weight:600;color:var(--text-secondary)}
.details dd{margin:0;min-width:0;overflow-wrap:anywhere}
.prewrap{white-space:pre-wrap}
.tag{display:inline-block;margin-left:.6rem;padding:.1rem .6rem;font-size:1.1rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:var(--raised);border-radius:1rem}
.actions{display:flex;gap:.8rem}

.foot{padding:1.6rem 2rem 2.4rem;display:flex;flex-wrap:wrap;gap:1rem;font-size:1.3rem;color:var(--text-muted);border-top:.1rem solid var(--border-subtle)}
.sep{color:var(--rule)}

@media (max-width:640px){
  .wrap{padding:0 1.4rem}
  .topbar__inner{gap:1.4rem}
  .nav{display:none}
  .details__row{grid-template-columns:1fr;gap:.3rem}
  .pager{grid-template-columns:1fr 1fr}
  .pager > :nth-child(2){grid-column:1 / -1;order:3;justify-self:center}
}