/* HayOrder v1.1.48 – status border + timeline typography */

/* Bestellkacheln: keine linke Akzentleiste mehr, sondern feine Statuslinie rundum. */
body #orders-ajax-root.ho-orders-148 .ho122-order-card .ho122-order-link{
  border:1px solid color-mix(in srgb,var(--status) 58%,#34475a)!important;
  border-left-width:1px!important;
  box-shadow:0 12px 28px rgba(1,8,16,.17)!important;
}
body #orders-ajax-root.ho-orders-148 .ho122-order-card .ho122-order-link:hover{
  border-color:color-mix(in srgb,var(--status) 72%,#435b71)!important;
  box-shadow:0 16px 34px rgba(1,8,16,.24)!important;
}
body #orders-ajax-root.ho-orders-148 .ho122-order-card.is-selected .ho122-order-link{
  border-color:color-mix(in srgb,var(--status) 82%,#49647d)!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--status) 18%,transparent),0 16px 34px rgba(1,8,16,.25)!important;
}

/* Bestellverlauf: Statusname, Datum und Uhrzeit klar getrennt und gut lesbar. */
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho-timeline-event>div{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  min-width:0!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho-timeline-event strong{
  margin:0!important;
  font-weight:700!important;
  line-height:1.22!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-meta{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:2px!important;
  width:100%!important;
  margin:7px 0 0!important;
  line-height:1.2!important;
  white-space:normal!important;
  overflow:visible!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-date,
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-time{
  display:block!important;
  width:100%!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-variant-numeric:tabular-nums!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-date{
  color:var(--muted)!important;
  font-size:11px!important;
  font-weight:500!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-time{
  color:color-mix(in srgb,var(--text) 88%,var(--muted))!important;
  font-size:12px!important;
  font-weight:650!important;
}
body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-pending{
  display:block!important;
  margin-top:7px!important;
  color:var(--muted)!important;
  font-size:11px!important;
  line-height:1.25!important;
  font-weight:500!important;
}

@media(max-width:760px){
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho-timeline-event{
    min-height:78px!important;
    padding:10px!important;
    align-content:center!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho-timeline-event strong{
    font-size:12.5px!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-meta{
    margin-top:5px!important;
    gap:1px!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-date{
    font-size:9.5px!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-time{
    font-size:10px!important;
    font-weight:650!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-pending{
    margin-top:5px!important;
    font-size:9.5px!important;
  }
}

@media(max-width:430px){
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho-timeline-event{
    min-height:76px!important;
    padding:9px!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-date{
    font-size:9px!important;
  }
  body #orders-ajax-root.ho-orders-148 .ho124-detail .ho55-timeline-frame .ho148-timeline-time{
    font-size:9.5px!important;
  }
}