/* ODJAH Lord reference: make the selected-order pane the dominant work area. */
@media(min-width:1281px){
  .workspace{grid-template-columns:minmax(360px,.68fr) minmax(760px,1.32fr)!important}
}

.detail-pane{background:#fff;box-shadow:inset 1px 0 0 #eef1f4}
.detail{padding:18px 22px 26px!important}
.detail-top{padding:2px 2px 12px!important;gap:18px}
.detail-title{font-size:31px!important;line-height:1.05!important;font-weight:950!important;letter-spacing:-.035em!important;margin:3px 0 9px!important}
.detail-top .eyebrow{font-size:10px!important;font-weight:850!important;letter-spacing:.07em!important}
.detail-top>div:last-child strong{font-size:22px!important;font-weight:950!important}
.detail-badges{gap:7px!important}
.detail-badges .source-badge{width:54px!important;height:54px!important;min-width:54px!important;font-size:27px!important;line-height:54px!important;border-radius:14px!important}
.detail-badges .fulfill-badge{width:26px!important;height:26px!important;min-width:26px!important;font-size:10px!important;line-height:26px!important;padding:0!important}
.detail-badges .status-pill{font-size:11px!important;padding:7px 10px!important}

.ref-detail-timer-card{margin:2px 0 13px!important;padding:14px 16px!important;border-radius:13px!important}
.ref-detail-timer-card .ref-timer-label{font-size:11px!important}
.ref-detail-timer-card strong{font-size:31px!important}
.ref-detail-timer-card small{font-size:11px!important}

.section{border-top:1px solid #e7ebef!important}
.section-head{padding:14px 2px 9px!important;font-size:13px!important;font-weight:900!important}
.section-body{padding:5px 2px 14px!important}
.info-grid{gap:12px 18px!important}
.info-label{font-size:10px!important;letter-spacing:.03em}
.info-value{font-size:14px!important;line-height:1.35!important;font-weight:800!important}
/* Address/fulfilment is the key field in the right pane. */
.info-grid>div:nth-child(3){padding:15px 16px!important;border-radius:12px!important;background:#f4f7fa!important;border:1px solid #e4e9ee!important}
.info-grid>div:nth-child(3) .info-value{font-size:20px!important;line-height:1.35!important;font-weight:950!important;color:#111a22!important}
.quick-actions{margin-top:10px!important;gap:8px!important}
.mini-btn{min-height:38px!important;padding:9px 12px!important;font-size:11px!important;font-weight:850!important}
.comment-box{margin-top:10px!important;padding:12px 14px!important;font-size:12px!important;line-height:1.4!important}

/* Dishes should be readable at a glance from the operator position. */
.item{padding:13px 2px!important;gap:14px!important}
.item-name{font-size:17px!important;line-height:1.25!important;font-weight:900!important}
.item-sub{font-size:11px!important;margin-top:3px!important}
.item-price{font-size:15px!important;font-weight:900!important;white-space:nowrap}
.item-qty{font-size:12px!important;margin-top:3px!important;font-weight:850!important}
.kitchen-comment{font-size:11px!important;padding:4px 7px!important;margin-top:5px!important}

.sum-row{font-size:13px!important;padding:6px 1px!important}
.sum-row.total{font-size:22px!important;padding-top:11px!important;font-weight:950!important}

/* Primary status action remains visible while the details scroll. */
.actions-card{position:sticky!important;bottom:0!important;margin:0 -6px!important;padding:20px 6px 6px!important;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 20%,#fff 100%)!important;z-index:5!important}
.action-main{gap:9px!important}
.action-main .primary,.action-main .success{min-height:58px!important;font-size:18px!important;font-weight:950!important;border-radius:11px!important}
.action-main .danger,.action-main .secondary{min-height:52px!important;font-size:13px!important;border-radius:11px!important}
.lord-print-action{margin-top:9px!important}
.lord-print-action .secondary{min-height:44px!important}
.sync-note{font-size:10px!important;margin-top:7px!important}

@media(max-width:1280px) and (min-width:901px){
  .workspace{grid-template-columns:minmax(360px,.76fr) minmax(560px,1.24fr)!important}
  .detail{padding:16px 18px 24px!important}
  .detail-title{font-size:28px!important}
  .info-grid>div:nth-child(3) .info-value{font-size:18px!important}
  .item-name{font-size:15px!important}
}

@media(max-width:900px){
  .detail{padding:14px 14px 22px!important}
  .detail-title{font-size:26px!important}
  .info-grid>div:nth-child(3) .info-value{font-size:17px!important}
  .item-name{font-size:15px!important}
  .action-main .primary,.action-main .success{min-height:54px!important;font-size:16px!important}
}