/* Desktop POS layout optimized for large 30-60 line orders. */
.pos-screen .ticket-tools{min-height:60px;padding:8px 10px;gap:10px}
.pos-screen .ticket-tools>button{font-size:15px;padding:11px 14px;white-space:nowrap}
.pos-screen .ticket-tools>label{font-size:15px;gap:9px;white-space:nowrap}
.pos-screen .customer-picker>input{font-size:17px;font-weight:700;padding:10px 12px}
.pos-screen .checkin-link{font-size:15px;padding:8px 2px;white-space:nowrap}
.pos-screen .ticket-tools>.customer-detail-trigger{border:1px solid #c0064d;background:#fff;color:#c0064d;font-size:14px;padding:10px 12px}
.pos-screen .ticket-tools>.customer-detail-trigger:hover{background:#fff0f6}
.quick-customer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}
.quick-customer-card{border:1px solid #ead8df;border-radius:10px;padding:12px;background:#fffafd}
.quick-customer-card.full{grid-column:1/-1}
.quick-customer-card small{display:block;color:#7b7180;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:5px}
.quick-customer-card strong{font-size:16px;line-height:1.4;overflow-wrap:anywhere}
.quick-customer-address{font-size:17px;line-height:1.45}
.history-customer-link{font-size:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.quick-customer-grid{grid-template-columns:1fr}.quick-customer-card.full{grid-column:auto}}
@media (min-width:1101px){
  .pos-screen{
    height:calc(100vh - 58px);
    min-height:620px;
    display:grid;
    grid-template-columns:minmax(500px,42%) minmax(340px,29%) minmax(340px,29%);
    grid-template-rows:minmax(390px,56%) minmax(230px,44%);
    overflow:hidden;
    background:#fff;
  }
  .pos-screen>.sale-top{display:contents}
  .pos-screen .ticket-panel{
    grid-column:1;
    grid-row:1 / 3;
    min-height:0;
    height:auto;
    border-right:2px solid var(--line);
    background:#fff9fb;
  }
  .pos-screen .ticket-tools,.pos-screen .delivery-tools,.pos-screen .ticket-summary{flex:0 0 auto}
  .pos-screen .ticket-items{
    min-height:0;
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding-bottom:24px;
  }
  .pos-screen .ticket-row{padding:13px 14px;min-height:66px}
  .pos-screen .ticket-row h4{font-size:15px;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
  .pos-screen .ticket-row .row-total{min-width:82px;font-size:15px}
  .pos-screen .empty-ticket{min-height:260px}
  .pos-screen .keypad-panel{
    grid-column:2;
    grid-row:1;
    min-width:0;
    min-height:0;
    height:auto;
    border-bottom:1px solid var(--line);
    background:#fff9fb;
  }
  .pos-screen .quick-actions{
    grid-column:3;
    grid-row:1;
    min-width:0;
    min-height:0;
    height:auto;
    overflow-y:auto;
    grid-auto-rows:minmax(82px,1fr);
    align-content:start;
    border-bottom:1px solid var(--line);
    background:#fff9fb;
  }
  .pos-screen>.catalog-area{
    grid-column:2 / 4;
    grid-row:2;
    min-height:0;
    height:auto;
    display:grid;
    grid-template-columns:160px minmax(0,1fr);
    overflow:hidden;
    border-top:0;
  }
  .pos-screen .catalog-pane{min-height:0;display:flex;flex-direction:column;overflow:hidden}
  .pos-screen .catalog-head{flex:0 0 42px;padding:0 10px}
  .pos-screen .category-grid{
    flex:1;
    min-height:0;
    display:grid;
    grid-template-columns:1fr;
    grid-auto-rows:54px;
    overflow-y:auto;
    overflow-x:hidden;
    align-content:start;
  }
  .pos-screen .category-grid .catalog-tile{min-height:54px}
  .pos-screen .category-grid .tile-art{display:none}
  .pos-screen .category-grid .tile-label{height:100%;padding:7px;font-size:13px}
  .pos-screen .products-pane .tile-grid{
    flex:1;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    grid-template-columns:repeat(5,minmax(118px,1fr));
    grid-auto-rows:132px;
    align-content:start;
  }
}

@media (min-width:1101px) and (max-width:1450px){
  .pos-screen{grid-template-columns:minmax(460px,40%) minmax(320px,30%) minmax(320px,30%)}
  .pos-screen>.catalog-area{grid-template-columns:145px minmax(0,1fr)}
  .pos-screen .products-pane .tile-grid{grid-template-columns:repeat(4,minmax(110px,1fr))}
}
