/* ════════════════════════════════════════════════════════════
   IJLMH MPC Payments — frontend styles
   Matches the site design system (Newsreader / Source Serif 4 /
   IBM Plex, brick accent, warm paper, 4px corners, hairline rules).
   All rules are scoped under #ijlmh-mpc to avoid theme bleed.
═══════════════════════════════════════════════════════════════ */
#ijlmh-mpc{
  --paper:oklch(0.985 0.004 80);
  --paper-s:oklch(0.968 0.005 80);
  --paper-d:oklch(0.948 0.007 80);
  --ink:oklch(0.18 0.01 80);
  --ink-m:oklch(0.32 0.009 80);
  --ink-mu:oklch(0.46 0.008 80);
  --ink-f:oklch(0.63 0.006 80);
  --acc:oklch(0.42 0.15 25);
  --acc-m:oklch(0.50 0.13 25);
  --acc-d:oklch(0.34 0.14 25);
  --acc-ss:oklch(0.97 0.02 25);
  --acc-b:oklch(0.80 0.08 25);
  --rule:oklch(0.87 0.005 80);
  --ok:oklch(0.52 0.13 150);
  --warn:oklch(0.55 0.12 70);
  --fd:"Newsreader",Georgia,serif;
  --fb:"Source Serif 4",Georgia,serif;
  --fs:"IBM Plex Sans",system-ui,sans-serif;
  --fm:"IBM Plex Mono",monospace;
  --r:4px;
}
#ijlmh-mpc,#ijlmh-mpc *,#ijlmh-mpc *::before,#ijlmh-mpc *::after{box-sizing:border-box;}
#ijlmh-mpc{
  font-family:var(--fb);color:var(--ink);
  -webkit-font-smoothing:antialiased;line-height:1.6;
  display:block;padding:24px 0;
}
/* Two-column band: info column + payment card (left-aligned) */
#ijlmh-mpc .ijmpc-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,560px);
  gap:40px;max-width:1140px;margin:0;align-items:start;
}
#ijlmh-mpc .ijmpc-aside{grid-column:1;grid-row:1;}
#ijlmh-mpc .ijmpc-layout > .ijmpc-card{grid-column:2;grid-row:1;}
@media(max-width:880px){
  #ijlmh-mpc .ijmpc-layout{grid-template-columns:1fr;max-width:560px;gap:24px;}
  #ijlmh-mpc .ijmpc-aside,#ijlmh-mpc .ijmpc-layout > .ijmpc-card{grid-column:auto;grid-row:auto;}
}

/* ── Card ── */
.ijmpc-card{
  width:100%;max-width:560px;background:var(--paper);
  border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;
}
.ijmpc-card::before{content:'';display:block;height:3px;background:var(--acc);}

/* ── Header ── */
.ijmpc-head{padding:30px 32px 22px;border-bottom:1px solid var(--rule);position:relative;}
.ijmpc-kk{
  font-family:var(--fm);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--acc);display:flex;align-items:center;gap:8px;margin-bottom:12px;
}
.ijmpc-kk::after{content:'';width:26px;height:1px;background:var(--acc-b);}
.ijmpc-title{font-family:var(--fd);font-size:1.6rem;font-weight:400;line-height:1.25;margin:0 0 10px;color:var(--ink);}
.ijmpc-title em{font-style:italic;color:var(--acc);}
.ijmpc-sub{font-family:var(--fb);font-size:.92rem;color:var(--ink-mu);margin:0;line-height:1.7;text-align:justify;}
.ijmpc-badge{
  position:absolute;top:26px;right:30px;
  font-family:var(--fm);font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--warn);border:1px solid var(--warn);border-radius:2px;padding:3px 8px;
}

/* ── Steps ── */
.ijmpc-step{padding:26px 32px 30px;}
.ijmpc-label{
  display:block;font-family:var(--fs);font-size:12px;font-weight:500;
  color:var(--ink-m);margin-bottom:7px;letter-spacing:.01em;
}
.ijmpc-row{display:flex;gap:10px;}
#ijlmh-mpc .ijmpc-input,
#ijlmh-mpc input.ijmpc-input,
#ijlmh-mpc input[type="text"].ijmpc-input,
#ijlmh-mpc input[type="email"].ijmpc-input{
  width:100% !important;
  font-family:var(--fs) !important;
  font-size:15px !important;
  font-weight:400 !important;
  line-height:1.4 !important;
  color:var(--ink) !important;
  background:var(--paper-s) !important;
  border:1px solid var(--rule) !important;
  border-radius:4px !important;
  padding:11px 13px !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  box-shadow:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  transition:border-color .15s,background .15s;
}
#ijlmh-mpc .ijmpc-input:focus{outline:none !important;border-color:var(--acc) !important;background:var(--paper) !important;box-shadow:none !important;}
#ijlmh-mpc .ijmpc-input::placeholder{color:var(--ink-f) !important;opacity:1;}
#ijlmh-mpc .ijmpc-input[readonly]{background:var(--paper-d) !important;color:var(--ink-mu) !important;}
.ijmpc-hint{font-family:var(--fs);font-size:11.5px;color:var(--ink-f);margin-top:8px;}

/* ── Buttons ── */
.ijmpc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  font-family:var(--fs);font-size:14px;font-weight:500;cursor:pointer;
  padding:11px 22px;border-radius:2px;line-height:1.2;white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s,opacity .15s;border:1px solid transparent;
}
.ijmpc-btn-p{background:var(--acc);color:#fff;border-color:var(--acc);width:100%;margin-top:22px;padding:13px 22px;font-size:15px;}
.ijmpc-btn-p:hover{background:var(--acc-d);}
.ijmpc-btn-s{background:transparent;color:var(--ink-m);border-color:var(--rule);}
.ijmpc-btn-s:hover{background:var(--paper-d);border-color:var(--ink-f);}
.ijmpc-btn[disabled]{opacity:.55;cursor:not-allowed;}
.ijmpc-btn.is-loading{position:relative;color:transparent;}
.ijmpc-btn.is-loading::after{
  content:'';position:absolute;width:16px;height:16px;border-radius:50%;
  border:2px solid rgba(255,255,255,.5);border-top-color:#fff;animation:ijmpc-spin .7s linear infinite;
}
.ijmpc-btn-s.is-loading::after{border:2px solid var(--rule);border-top-color:var(--acc);}
@keyframes ijmpc-spin{to{transform:rotate(360deg);}}

.ijmpc-link{
  background:none;border:none;cursor:pointer;font-family:var(--fs);font-size:12.5px;
  color:var(--ink-mu);padding:0;margin-top:18px;display:inline-block;
}
.ijmpc-link:hover{color:var(--acc);}

/* ── Summary block ── */
.ijmpc-summary{
  background:var(--paper-s);border:1px solid var(--rule);border-radius:var(--r);
  padding:6px 18px;margin-bottom:22px;
}
.ijmpc-sumrow{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  padding:11px 0;border-bottom:1px solid var(--rule);font-size:13.5px;
}
.ijmpc-sumrow:last-child{border-bottom:none;}
.ijmpc-k{font-family:var(--fs);color:var(--ink-mu);flex-shrink:0;}
.ijmpc-v{font-family:var(--fb);color:var(--ink);text-align:right;font-weight:500;}
.ijmpc-amt .ijmpc-k{color:var(--ink-m);font-weight:500;}
.ijmpc-amt .ijmpc-v{font-family:var(--fd);font-size:1.45rem;color:var(--acc);font-weight:400;}

/* ── Fields ── */
.ijmpc-fields{display:flex;flex-direction:column;gap:16px;}
.ijmpc-field{display:flex;flex-direction:column;}

/* ── Secure note ── */
.ijmpc-secure{
  display:flex;align-items:flex-start;gap:8px;margin-top:14px;
  font-family:var(--fs);font-size:11.5px;line-height:1.6;color:var(--ink-f);
}
.ijmpc-secure svg{flex-shrink:0;margin-top:2px;color:var(--acc);}

/* ── Messages ── */
.ijmpc-msg{font-family:var(--fs);font-size:12.5px;line-height:1.6;border-radius:2px;padding:11px 14px;margin-top:16px;}
.ijmpc-msg a{color:inherit;text-decoration:underline;}
.ijmpc-msg-err{background:var(--acc-ss);border:1px solid var(--acc-b);color:var(--acc-d);}
.ijmpc-msg-warn{background:oklch(0.97 0.03 70);border:1px solid oklch(0.85 0.07 70);color:oklch(0.42 0.1 70);}

/* ── Receipt ── */
.ijmpc-receipt{text-align:center;}
.ijmpc-tick{color:var(--ok);display:flex;justify-content:center;margin-bottom:14px;}
.ijmpc-rtitle{font-family:var(--fd);font-size:1.5rem;font-weight:400;color:var(--ink);margin:0 0 6px;}
.ijmpc-rsub{font-family:var(--fb);font-size:.92rem;color:var(--ink-mu);margin:0 0 22px;}
.ijmpc-receipt .ijmpc-summary{text-align:left;}
.ijmpc-rnote{font-family:var(--fs);font-size:12px;color:var(--ink-f);margin:18px 0 0;}

/* ── Responsive ── */
@media(max-width:560px){
  .ijmpc-head{padding:24px 20px 18px;}
  .ijmpc-step{padding:22px 20px 26px;}
  .ijmpc-badge{position:static;display:inline-block;margin-top:10px;}
  .ijmpc-row{flex-direction:column;}
  .ijmpc-btn-s{width:100%;}
}

/* ── Urgent processing (optional add-on, inline summary row) ── */

/* The hidden attribute must win over flex/grid display rules (fixes empty rows) */
#ijlmh-mpc [hidden]{display:none !important;}

/* Row: label on the left, Add / Added pill on the right (where amounts sit) */
#ijlmh-mpc .ijmpc-urgent-opt{justify-content:space-between;align-items:center;gap:14px;}
#ijlmh-mpc .ijmpc-urgent-txt{display:flex;flex-direction:column;gap:2px;font-family:var(--fs);min-width:0;}
#ijlmh-mpc .ijmpc-urgent-h{font-size:13.5px;color:var(--ink);}
#ijlmh-mpc .ijmpc-urgent-h strong{font-weight:600;}
#ijlmh-mpc .ijmpc-urgent-d{font-size:12px;color:var(--ink-mu);line-height:1.45;}

/* Add / Added toggle pill */
#ijlmh-mpc .ijmpc-add-btn{
  display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;cursor:pointer;
  font-family:var(--fm);font-size:13px;line-height:1;white-space:nowrap;
  color:var(--acc);background:var(--paper);
  border:1px solid var(--acc-b);border-radius:999px;padding:8px 15px;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;
}
#ijlmh-mpc .ijmpc-add-btn:hover{background:var(--acc-ss);border-color:var(--acc);}
#ijlmh-mpc .ijmpc-add-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--acc-ss);}
#ijlmh-mpc .ijmpc-add-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:14px;font-size:15px;font-weight:600;
}
#ijlmh-mpc .ijmpc-add-ico::before{content:'+';}
#ijlmh-mpc .ijmpc-add-amt{font-weight:500;letter-spacing:.01em;}
/* Added state: filled */
#ijlmh-mpc .ijmpc-add-btn.is-added{color:#fff;background:var(--acc);border-color:var(--acc);}
#ijlmh-mpc .ijmpc-add-btn.is-added:hover{background:var(--acc-d);border-color:var(--acc-d);}
#ijlmh-mpc .ijmpc-add-btn.is-added .ijmpc-add-ico{font-size:12px;}
#ijlmh-mpc .ijmpc-add-btn.is-added .ijmpc-add-ico::before{content:'\2713';}

/* ── Waiver / discount code ── */
#ijlmh-mpc .ijmpc-waiver-row .ijmpc-waiver-code{font-family:var(--fm);font-size:11px;color:var(--ink-f);}
#ijlmh-mpc .ijmpc-waiver-amt{color:var(--ok);font-family:var(--fm);font-size:13px;}

#ijlmh-mpc .ijmpc-code{margin:0 0 20px;}
#ijlmh-mpc .ijmpc-code-toggle{
  background:none;border:none;padding:0;cursor:pointer;
  font-family:var(--fs);font-size:12.5px;color:var(--acc);
  display:inline-flex;align-items:center;gap:7px;
}
#ijlmh-mpc .ijmpc-code-toggle::before{content:'+';font-family:var(--fm);font-size:13px;line-height:1;width:11px;text-align:center;}
#ijlmh-mpc .ijmpc-code-toggle[aria-expanded="true"]::before{content:'\2212';}
#ijlmh-mpc .ijmpc-code-toggle:hover{color:var(--acc-d);}
#ijlmh-mpc .ijmpc-code-box{margin-top:12px;}
#ijlmh-mpc .ijmpc-input[disabled]{background:var(--paper-d) !important;color:var(--ink-mu) !important;cursor:not-allowed;}
#ijlmh-mpc .ijmpc-code-ok{
  font-family:var(--fs);font-size:12.5px;color:var(--ok);
  margin-top:11px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
#ijlmh-mpc .ijmpc-code-ok strong{font-family:var(--fm);font-weight:600;color:var(--ink-m);}
#ijlmh-mpc .ijmpc-code-ok .ijmpc-code-remove{margin:0;font-size:12px;color:var(--ink-mu);}
#ijlmh-mpc .ijmpc-code-ok .ijmpc-code-remove:hover{color:var(--acc);}
#ijlmh-mpc .ijmpc-code-ok .ijmpc-saved{font-weight:600;}

/* ── Info column (aside) ── */
#ijlmh-mpc .ijmpc-aside{font-family:var(--fb);padding-top:33px;text-align:left;}
#ijlmh-mpc .ijmpc-ablock{margin-bottom:30px;}
#ijlmh-mpc .ijmpc-ablock:last-child{margin-bottom:0;}
#ijlmh-mpc .ijmpc-akk{
  font-family:var(--fm);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--acc);display:flex;align-items:center;gap:8px;margin-bottom:13px;
}
#ijlmh-mpc .ijmpc-akk::after{content:'';flex:1;height:1px;background:var(--rule);}
#ijlmh-mpc .ijmpc-ap{font-family:var(--fb);font-size:.92rem;color:var(--ink-mu);margin:0 0 12px;line-height:1.75;text-align:justify;}
#ijlmh-mpc .ijmpc-ap:last-child{margin-bottom:0;}
#ijlmh-mpc .ijmpc-aside a{color:var(--acc);text-decoration:none;border-bottom:1px solid var(--acc-b);}
#ijlmh-mpc .ijmpc-aside a:hover{color:var(--acc-d);border-color:var(--acc);}

/* Fee table */
#ijlmh-mpc .ijmpc-feebox{
  background:var(--paper-s);border:1px solid var(--rule);border-radius:var(--r);
  padding:6px 16px 14px;
}
#ijlmh-mpc .ijmpc-fees{width:100%;border-collapse:collapse;font-family:var(--fs);font-size:13.5px;}
#ijlmh-mpc .ijmpc-fees th,#ijlmh-mpc .ijmpc-fees td{padding:10px 4px;border-bottom:1px solid var(--rule);text-align:left;}
#ijlmh-mpc .ijmpc-fees thead th{
  font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-mu);font-weight:600;
}
#ijlmh-mpc .ijmpc-fees th.amt,#ijlmh-mpc .ijmpc-fees td.amt{text-align:right;}
#ijlmh-mpc .ijmpc-fees td{color:var(--ink-m);}
#ijlmh-mpc .ijmpc-fees td.amt{font-family:var(--fb);font-weight:600;color:var(--ink);white-space:nowrap;}
#ijlmh-mpc .ijmpc-fees tbody tr:last-child td{border-bottom:none;}
#ijlmh-mpc .ijmpc-fees-note{font-family:var(--fs);font-size:11.5px;color:var(--ink-f);line-height:1.6;margin-top:10px;}

/* How-it-works steps */
#ijlmh-mpc .ijmpc-steps{list-style:none;counter-reset:ijs;margin:0;padding:0;}
#ijlmh-mpc .ijmpc-steps li{
  position:relative;padding:0 0 15px 40px;font-family:var(--fb);font-size:.92rem;
  color:var(--ink-mu);line-height:1.65;text-align:left;
}
#ijlmh-mpc .ijmpc-steps li:last-child{padding-bottom:0;}
#ijlmh-mpc .ijmpc-steps li::before{
  counter-increment:ijs;content:counter(ijs);position:absolute;left:0;top:-1px;
  width:27px;height:27px;border-radius:50%;border:1px solid var(--acc-b);color:var(--acc);
  font-family:var(--fm);font-size:12px;display:flex;align-items:center;justify-content:center;
}
#ijlmh-mpc .ijmpc-steps li strong{color:var(--ink);font-weight:600;font-family:var(--fb);}

@media(max-width:880px){
  #ijlmh-mpc .ijmpc-aside{padding-top:0;}
}