/*
 * SaloCart V4.3.4 — Order status badge rendering fix
 * Loaded after all UI layers. It owns the rich subtitle in Order updates.
 */
.status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  max-width:100%;
  padding:4px 8px;
  border:1px solid transparent;
  border-radius:999px;
  font-family:var(--font-ui,Manrope,system-ui,sans-serif);
  font-size:.61rem;
  font-weight:800;
  letter-spacing:.01em;
  line-height:1.18;
  text-align:center;
  white-space:nowrap;
  vertical-align:middle;
}
.status-pill.waiting{background:#f3f5f4;border-color:#dfe8e2;color:#52645a}
.status-pill.active{background:var(--sc-blue-soft,#eaf4ff);border-color:color-mix(in srgb,var(--sc-blue,#2d72bf) 26%,var(--sc-line,#e5ece7));color:var(--sc-blue,#2d72bf)}
.status-pill.ready{background:color-mix(in srgb,var(--sc-orange,#f7bf42) 19%,var(--sc-surface,#fff));border-color:color-mix(in srgb,var(--sc-orange,#f7bf42) 42%,var(--sc-line,#e5ece7));color:#8c5c00}
.status-pill.done{background:var(--sc-mint,#eaf9f1);border-color:color-mix(in srgb,var(--sc-green,#087a57) 28%,var(--sc-line,#e5ece7));color:var(--sc-green-deep,#07533c)}
.status-pill.problem{background:#fff0f1;border-color:#f0c7cd;color:#a13c49}

/* The modal subtitle must render the controlled status markup, not escape it. */
.order-updates-sheet .sheet-head .sheet-subtitle-rich{
  display:flex!important;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
  margin:5px 0 0;
  color:var(--sc-muted,#65736c);
  font-size:.72rem;
  line-height:1.45;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:unset!important;
  overflow:visible!important;
}
.order-updates-sheet .sheet-head .order-sheet-deal-title{
  overflow:hidden;
  min-width:0;
  max-width:100%;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.order-updates-sheet .sheet-head .order-sheet-divider{
  flex:0 0 auto;
  color:var(--sc-line-strong,#9eafa5);
}
.order-updates-sheet .sheet-head .order-sheet-status{
  flex:0 0 auto;
  max-width:100%;
}

html[data-theme="dark"] .status-pill.waiting{background:#25352c;border-color:#3c5145;color:#c0d1c7}
html[data-theme="dark"] .status-pill.active{background:#183c50;border-color:#2d6584;color:#a4d6ef}
html[data-theme="dark"] .status-pill.ready{background:#4a3815;border-color:#85611e;color:#ffe19a}
html[data-theme="dark"] .status-pill.done{background:#173b2d;border-color:#2f7756;color:#a8e9c5}
html[data-theme="dark"] .status-pill.problem{background:#4a242b;border-color:#7d3b46;color:#ffc4cd}

@media(max-width:480px){
  .order-updates-sheet .sheet-head .sheet-subtitle-rich{gap:5px;font-size:.66rem}
  .order-updates-sheet .sheet-head .order-sheet-deal-title{flex:1 1 100%;max-width:100%}
  .order-updates-sheet .sheet-head .order-sheet-divider{display:none}
  .order-updates-sheet .sheet-head .order-sheet-status{max-width:100%;font-size:.56rem}
  .status-pill{padding:4px 7px;font-size:.56rem}
}