/* HayOrder v1.1.50 – kompakte Datum/Uhrzeit-Kachel + Desktop Summary links/rechts. */

/* HEADER: Datum und Uhrzeit bleiben in EINER Kachel, aber ohne unnötigen Freiraum dazwischen. */
.operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-chip{
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  justify-content:flex-start!important;
  gap:9px!important;
  padding:7px 12px!important;
}
.operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-date{
  flex:0 1 auto!important;
}
.operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-time{
  flex:0 0 auto!important;
}
.operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-divider{
  margin:0 2px!important;
}

/* Desktop: mittlere Summary-Kachel klar als Label links / Wert rechts. */
@media (min-width:761px){
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-card{
    padding:0!important;
    overflow:hidden!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row{
    display:grid!important;
    grid-template-columns:minmax(88px,.78fr) minmax(0,1.22fr)!important;
    align-items:center!important;
    gap:14px!important;
    width:100%!important;
    min-width:0!important;
    min-height:74px!important;
    padding:12px 15px!important;
    text-align:left!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row + .ho128-summary-row{
    border-top:1px solid var(--line)!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row > span{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    color:#9caab7!important;
    font-size:9px!important;
    line-height:1.2!important;
    font-weight:700!important;
    letter-spacing:.12em!important;
    text-align:left!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row > div{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-end!important;
    justify-content:center!important;
    gap:3px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    text-align:right!important;
    overflow:visible!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row strong,
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row .ho132-new-waiting{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    color:#f4f7fa!important;
    font-size:15px!important;
    line-height:1.18!important;
    font-weight:700!important;
    letter-spacing:-.015em!important;
    text-align:right!important;
    white-space:nowrap!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row small{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    color:#93a3b2!important;
    font-size:9px!important;
    line-height:1.32!important;
    font-weight:500!important;
    text-align:right!important;
    white-space:normal!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row .ho54-total{
    color:color-mix(in srgb,var(--detail-accent) 52%,white)!important;
    font-size:21px!important;
    line-height:1!important;
    font-weight:700!important;
    white-space:nowrap!important;
  }
  body #orders-ajax-root.ho-orders-150 .ho124-detail .ho128-summary-row .ho132-new-waiting{
    font-size:13px!important;
    white-space:normal!important;
  }
}

/* Smartphone: die gemeinsame Header-Kachel bleibt vollbreit, Inhalt aber kompakt links gruppiert. */
@media(max-width:700px){
  .operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-chip{
    width:100%!important;
    gap:8px!important;
    padding:8px 11px!important;
  }
  .operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-date{
    flex:0 1 auto!important;
  }
  .operator-premium-page .premium-topbar[data-ho-live-header] .premium-datetime-time{
    flex:0 0 auto!important;
  }
}