/* Core styles */
.rei-sc{border:1px solid #e5e7eb;padding:16px;border-radius:8px;max-width:1000px}
.rei-togglebar{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.rei-togglebar .toggle{border:1px solid #94a3b8;background:#0ea5e9;color:#fff;padding:8px 12px;border-radius:22px;cursor:pointer;opacity:.9}
.rei-togglebar .toggle.active{opacity:1}
.rei-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rei-field label{display:flex;align-items:center;gap:6px;font-size:12px;color:#555;margin-bottom:4px}
.rei-field input,.rei-field select{width:100%;padding:8px;border:1px solid #cbd5e1;border-radius:6px}
.rei-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.rei-tiles .tile{background:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;padding:10px}
.rei-actions{display:block;margin-top:12px}
.rei-actions button{padding:10px 14px;border-radius:8px;border:1px solid #0ea5e9;background:#0ea5e9;color:#fff;cursor:pointer}
.rei-inline-form{display:none;margin-top:10px;padding:12px;border:1px dashed #cbd5e1;border-radius:8px;background:#f8fafc;max-width:640px}
.rei-inline-form .row{display:flex;gap:10px;flex-wrap:wrap}
.rei-inline-form input{flex:1 1 260px;padding:10px;border:1px solid #cbd5e1;border-radius:6px}
.rei-inline-form .send{margin-top:8px;border:1px solid #10b981;background:#10b981;color:#fff;padding:10px 14px;border-radius:8px;cursor:pointer}
.rei-expander{grid-column:1/-1;background:#f8fafc;border:1px dashed #cbd5e1;padding:10px;border-radius:8px}
.rei-expander h4{display:flex;align-items:center;margin:0 0 6px}
.rei-expander h4 .expander-toggle{margin-left:auto;font-size:12px;padding:4px 10px;border-radius:8px;background:#e2e8f0;border:1px solid #cbd5e1;cursor:pointer}
.rei-expander .body{display:none;margin-top:8px}
.rei-expander.open .body{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rei-tip-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1px solid #94a3b8;background:#fff;font-size:12px;font-weight:700;line-height:18px;cursor:pointer;padding:0!important}
.rei-tip-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);display:none;align-items:center;justify-content:center;z-index:9999}
.rei-tip-card{background:#fff;border-radius:10px;padding:16px;max-width:520px;width:92%;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.rei-tip-close{float:right;border:none;background:#e5e7eb;border-radius:6px;padding:4px 8px;cursor:pointer}
.rei-hp-wrap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.rei-hp{display:none}
@media(max-width:980px){.rei-row{grid-template-columns:repeat(2,minmax(0,1fr));}.rei-tiles{grid-template-columns:repeat(2,minmax(0,1fr));}}
/* v1.3.9 form validation */
.rei-inline-form .field-error{border-color:#dc2626;background:#fef2f2}
.rei-inline-form .form-errors{margin-top:8px;color:#b91c1c}
.rei-inline-form .form-ok{margin-top:8px;color:#065f46}

/* v1.5.8 modebar + hide legacy toggles */
.rei-sc .rei-togglebar{display:none !important}
.rei-sc .rei-modebar{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.rei-sc .rei-modebar .mode{border:1px solid #94a3b8;background:#fff;color:#111;padding:8px 12px;border-radius:22px;cursor:pointer}
.rei-sc .rei-modebar .mode.active{background:#0ea5e9;color:#fff;border-color:#0ea5e9}

/* MAO Tile */
.rei-tiles .mao-tile .mao-ctl { margin-top: 6px; display: flex; align-items: center; gap: 6px; }
.rei-tiles .mao-tile .mini-label { font-size: 12px; color: #666; }
.rei-tiles .mao-tile input[name="maoPct"] { width: 72px; text-align: right; }

/* MAO tile controls */
.rei-tiles .mao-tile .mao-ctl{
  display:flex; align-items:center; gap:8px; margin-top:6px; flex-wrap:wrap;
}
.rei-tiles .mao-tile .mini-label{
  font-size:11px; color:#6b7280; letter-spacing:.02em;
}
.rei-tiles .mao-tile .pct-input{ position:relative; }
.rei-tiles .mao-tile input[name="maoPct"]{
  width:72px; height:32px; padding:6px 22px 6px 10px;
  border:1px solid #cbd5e1; border-radius:6px; background:#fff;
  font:inherit; text-align:right;
}
.rei-tiles .mao-tile .pct-input::after{
  content:'%'; position:absolute; right:8px; top:50%; transform:translateY(-50%);
  color:#6b7280; font-size:12px; pointer-events:none;
}
.rei-tiles .mao-tile .btn-sm{
  width:32px; height:32px; border:1px solid #cbd5e1; border-radius:6px;
  background:#fff; line-height:30px; text-align:center; font-size:18px;
  cursor:pointer;
}
.rei-tiles .mao-tile .btn-sm:active{ transform:translateY(1px); }

/* MAO tile – inline header control */
.rei-tiles .mao-tile .head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.rei-tiles .mao-tile .mao-inline{
  display:flex; align-items:center; gap:6px;
}
.rei-tiles .mao-tile .mini-label{
  font-size:11px; color:#6b7280; letter-spacing:.02em;
}
.rei-tiles .mao-tile .pct-input{ position:relative; }
.rei-tiles .mao-tile input[name="maoPct"]{
  width:70px; height:30px; padding:6px 18px 6px 10px;
  border:1px solid #cbd5e1; border-radius:6px; background:#fff;
  font:inherit; text-align:right;
}
.rei-tiles .mao-tile .pct-input::after{
  content:'%'; position:absolute; right:6px; top:50%; transform:translateY(-50%);
  color:#6b7280; font-size:12px; pointer-events:none;
}
/* Place the checkbox row on its own line under the input */
.rei-field .rei-hold-auto{
  display: block;
  margin-top: 6px;        /* tweak as you like */
}

/* Keep "Auto Holding" on a single line next to the checkbox */
.rei-field .rei-hold-auto label{
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;     /* don't wrap at spaces */
  word-break: normal;      /* undo any break-all */
  overflow-wrap: normal;   /* don't break inside words */
  hyphens: none;           /* Safari/Firefox: no hyphenation */
}

/* Optional: remove default checkbox margin for tighter alignment */
.rei-field .rei-hold-auto input[type="checkbox"]{
  margin: 0;
}
/* Target the MAO % number input */
.rei-tiles .mao-tile input[name="maoPct"],
.mao-inline .pct-input input[type="number"]{
  box-sizing: border-box;
  text-align: center !important;
  padding-right: .25rem;     /* remove extra right padding */
}

/* Chromium/WebKit: remove default spinner margin so it hugs the edge */
.rei-tiles .mao-tile input[name="maoPct"]::-webkit-inner-spin-button,
.rei-tiles .mao-tile input[name="maoPct"]::-webkit-outer-spin-button,
.mao-inline .pct-input input[type="number"]::-webkit-inner-spin_button,
.mao-inline .pct-input input[type="number"]::-webkit-outer-spin_button{
  margin: 0;
}

/* (optional) keep the value right-aligned */
.rei-tiles .mao-tile input[name="maoPct"]{
  text-align: right;
}

