.hrc{--hrc-accent:#ED1B24;--hrc-border:#E7EBF2;--hrc-text:#0F172A;--hrc-muted:#6B7280;--hrc-shadow:0 2px 10px rgba(2,6,23,.06);--hrc-radius:14px;--in-border:#D7DBE5;--in-bg:#F9FAFF}
.hrc,.hrc *{box-sizing:border-box}
.hrc{font:500 14px/1.45 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;color:var(--hrc-text)}
.hrc-lead{margin:0 0 10px;color:var(--hrc-muted)}
.hrc-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px}
@media(max-width:980px){.hrc-grid{grid-template-columns:1fr}}
.hrc-card{background:#fff;border:1px solid var(--hrc-border);border-radius:var(--hrc-radius);box-shadow:var(--hrc-shadow)}
.hrc-card__hd{display:flex;align-items:center;gap:10px;padding:14px 16px 6px}
.hrc-card__hd h3{margin:0;font-size:16px;font-weight:800}
.hrc-card__bd{padding:0 16px 16px;display:grid;gap:14px}
.hrc-fields{display:grid;gap:14px;align-items:start}
.hrc-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hrc-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:780px){.hrc-cols-3,.hrc-cols-2{grid-template-columns:1fr}}
.hrc-fld{display:grid;gap:6px}
.hrc-lbl{font-weight:600}
.hrc-hint{color:var(--hrc-muted);font-size:12px;word-break:break-word;max-width:100%}
.hrc-ctrl{display:grid;grid-template-columns:auto 1fr;gap:8px}
.hrc-input,.hrc-select,.hrc-currency{border:1px solid var(--in-border);background:#fff;border-radius:12px;height:44px;padding:0 12px;width:100%;font:inherit;color:var(--hrc-text)}
.hrc-input:disabled,.hrc-select:disabled{background:#F3F4F6;color:#9CA3AF}
.hrc-input:focus,.hrc-select:focus,.hrc-currency:focus{outline:none;box-shadow:0 0 0 3px rgba(237,27,36,.18);border-color:var(--hrc-accent)}
.hrc-currency{width:110px}
.hrc-inline{display:flex;align-items:center;gap:10px}
.hrc-check{width:18px;height:18px;accent-color:var(--hrc-accent)}

/* Full-width CTA row */
.hrc-ctas{
  display:grid;
  grid-template-columns: 1fr 1fr; /* two buttons share the full width */
  gap:12px;
  padding:10px 0 0;
}
@media (max-width:560px){
  .hrc-ctas{ grid-template-columns:1fr; } /* stack on mobile, still 100% width */
}
/* Allow buttons to fill grid column width */
.hrc-btn {
  display:flex;              /* was inline-flex */
  justify-content:center;    /* center label inside */
  width:100%;                /* stretch to full column width */
}

.hrc-btn--primary{background:var(--hrc-accent);border-color:var(--hrc-accent);color:#fff}
.hrc-aside{position:sticky;top:12px;height:fit-content}
.hrc-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hrc-list li{background:#FCFDFF;border:1px dashed var(--hrc-border);border-radius:12px;padding:10px 12px}
.hrc-note{margin:6px 0 0;color:var(--hrc-muted);font-size:12px}

/* ---------- Supplier section tidy layout ---------- */
.hrc-fields--supplier{
  grid-template-columns: 1.2fr 1fr 1fr;  /* room for price block */
  gap: 12px 14px;                        /* (row gap) (column gap) */
  align-items: start;
}
.hrc-span-full{ grid-column: 1 / -1; }   /* full row */
.hrc-span2{ grid-column: 1 / span 2; }   /* 2 columns */

@media (max-width:780px){
  .hrc-fields--supplier{ grid-template-columns: 1fr; }
  .hrc-span2,.hrc-span-full{ grid-column: 1 / -1; }
}

/* Price row (fixed for mobile) */
.hrc-ctrl--price {
  display: flex;
  flex-wrap: wrap;          /* allow wrapping on smaller screens */
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.hrc-ctrl--price > *{ min-width:0; }

.hrc-ctrl--price .hrc-select,
.hrc-ctrl--price .hrc-pricewrap {
  flex: 1 1 120px;          /* flexible but with sensible min */
  min-width: 120px;
}

.hrc-pricewrap {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: center;
  border: 1px solid var(--in-border);
  border-radius: 12px;
  height: 44px;
  background: #fff;
  overflow: hidden;
  width: auto;              /* flex nicely */
}

.hrc-price-symbol {
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid var(--in-border);
  height: 100%;
  width: 100%;
  font-weight: 700;
}

.hrc-input--price {
  border: none;
  height: 100%;
  padding: 0 12px;
}
.hrc-input--price:focus {
  box-shadow: none;
  outline: none;
}

/* Responsive stacking on very narrow screens */
@media (max-width: 600px) {
  .hrc-ctrl--price {
    flex-direction: column;
    align-items: stretch;
  }
  .hrc-ctrl--price .hrc-select,
  .hrc-ctrl--price .hrc-pricewrap {
    width: 100%;
  }
  .hrc-fld .hrc-hint {
    margin-top: 6px; /* extra breathing room under stacked controls */
  }
}

/* Keep hints readable and separated */
.hrc-fld .hrc-hint{ margin-top: 2px; line-height: 1.35; }

/* Visual harmony with the rest of the form */
.hrc-currency{ width: 115px; }

/* Slab section tidy layout */
.hrc-fields--slab{align-items:start}
.hrc-span-full{grid-column:1/-1}

/* --- CTA row: full width + tidy spacing --- */
.hrc-ctas{
  display:grid;
  grid-template-columns: 1fr 1fr;  /* two equal buttons */
  gap:12px;
  margin-top:12px;
}
@media (max-width:560px){
  .hrc-ctas{ grid-template-columns:1fr; }
}

/* --- Buttons: upgrade look & make them stretch --- */
.hrc-btn{
  display:flex;                /* override inline-flex */
  width:100%;                  /* fill grid column */
  height:48px;                 /* a bit taller feels nicer */
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:12px;
  border:1px solid var(--hrc-border);
  background:#FFFFFF;          /* neutral secondary base */
  color:#0F172A;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .05s ease;
}
.hrc-btn:hover{ background:#F6F8FD; border-color:#C9D3E7; }
.hrc-btn:active{ transform:translateY(1px); }
.hrc-btn:focus-visible{ outline:3px solid rgba(237,27,36,.28); outline-offset:2px; }

/* --- Primary brand CTA (#ED1B24) --- */
.hrc-btn--primary{
  background:#ED1B24;
  border-color:#ED1B24;
  color:#fff;
  box-shadow:0 2px 0 rgba(0,0,0,.04), 0 8px 16px rgba(237,27,36,.16);
}
.hrc-btn--primary:hover{ background:#D81A22; border-color:#D81A22; }
.hrc-btn--primary:active{ background:#C2161D; border-color:#C2161D; box-shadow:0 1px 0 rgba(0,0,0,.05); }

/* Optional: make secondary look deliberately secondary */
.hrc-btn--ghost{ background:#F4F6FB; }
.hrc-btn--ghost:hover{ background:#EEF2FA; }