/* TEMVIO v0.9.4 — Commerce Readiness
   Additive only. Theme and mobile scroll behavior remain unchanged. */

.commerce-readiness-strip{
  display:flex;
  align-items:center;
  gap:8px;
  margin:12px 0 4px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--paper);
  overflow-x:auto;
}
.commerce-readiness-strip>div{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:max-content;
}
.commerce-readiness-strip b{
  width:24px;height:24px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--accent-soft);
  color:var(--accent-strong);
  font-size:10px;
}
.commerce-readiness-strip span{font-size:10px;font-weight:800}
.commerce-readiness-strip i{font-style:normal;color:var(--muted);opacity:.7}

.commerce-request{align-items:flex-start}
.commerce-request-main{min-width:0;flex:1}
.commerce-request-main small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:9px;
  overflow-wrap:anywhere;
}
.commerce-request-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}
.tag.red{
  color:#a72b42;
  border-color:rgba(210,54,83,.25);
  background:rgba(210,54,83,.06);
}
.commerce-event-list{display:grid;gap:8px;margin-top:10px}
.commerce-event{
  display:grid;
  grid-template-columns:8px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:11px;
}
.commerce-event>i{
  width:7px;height:7px;border-radius:50%;
  background:var(--teal);
}
.commerce-event b,.commerce-event small{display:block}
.commerce-event small,.commerce-event>span{
  color:var(--muted);
  font-size:9px;
  margin-top:2px;
}
@media(max-width:620px){
  .commerce-request{display:grid}
  .commerce-request-actions{justify-content:flex-start}
}