/* ===============================================================
   MOB365 V15 FUNCTIONAL UI
   Clarity for laptop + stable operational layouts.
   =============================================================== */

/* Personalization scaling actually affects all module roots. */
.mob365-customizable{
  font-size:calc(1rem * var(--mob365-font-scale,1))!important;
}
.mob365-customizable button,
.mob365-customizable input,
.mob365-customizable select{
  font-size:inherit;
}

/* ---------------- RETAIL ---------------- */
@media (min-width:1100px){
  /* Sidebar starts OPEN; V15 JS collapses only after real search starts. */
  .pos-app-shell:not(.sidebar-collapsed) .pos-layout.pos-layout-premium{
    grid-template-columns:166px minmax(0,1fr) 500px 104px!important;
  }
  .pos-app-shell.sidebar-collapsed .pos-layout.pos-layout-premium{
    grid-template-columns:48px minmax(0,1fr) 500px 104px!important;
  }

  /* Buyer area: make operator-critical information readable. */
  .pos-layout-premium .customer-box{
    max-height:132px!important;
    padding:8px 9px!important;
  }
  .pos-layout-premium .customer-box>label{
    font-size:9px!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
  }
  .pos-layout-premium .customer-box>input{
    height:39px!important;
    min-height:39px!important;
    font-size:12px!important;
    font-weight:800!important;
  }
  .pos-layout-premium .selected-customer{
    min-height:22px!important;
    line-height:21px!important;
    font-size:10.5px!important;
    font-weight:850!important;
    color:#0c684f!important;
  }
  .pos-layout-premium .loyalty-summary{
    height:39px!important;
    min-height:39px!important;
    padding:5px 9px!important;
    border:1px solid #e3b33f!important;
    background:linear-gradient(90deg,#fff7d9,#fffbed)!important;
  }
  .pos-layout-premium .loyalty-summary strong{
    font-size:10.5px!important;
  }
  .pos-layout-premium .loyalty-summary small{
    font-size:7.5px!important;
  }

  /* Payment area: four distinct equal controls. */
  .pos-layout-premium .checkout-buttons{
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:50px 50px!important;
    gap:6px!important;
  }
  .pos-layout-premium .checkout-buttons>button{
    width:100%!important;
    height:50px!important;
    min-height:50px!important;
    border-radius:9px!important;
    margin:0!important;
  }
  .pos-layout-premium .checkout-buttons .btn-title{
    font-size:11.5px!important;
    line-height:13px!important;
  }

  /* Cart rows: slightly more legible on laptop. */
  .pos-layout-premium .cart-list.cart-items-panel .cart-line{
    flex-basis:114px!important;
    height:114px!important;
    min-height:114px!important;
    max-height:114px!important;
    grid-template-rows:34px 34px 32px!important;
  }
  .pos-layout-premium .cart-info strong{
    font-size:12px!important;
    line-height:14px!important;
  }
  .pos-layout-premium .cart-detail-cell strong{
    font-size:9.5px!important;
  }
}

@media (min-width:1100px) and (max-width:1500px){
  .pos-app-shell:not(.sidebar-collapsed) .pos-layout.pos-layout-premium{
    grid-template-columns:154px minmax(0,1fr) 465px 98px!important;
  }
  .pos-app-shell.sidebar-collapsed .pos-layout.pos-layout-premium{
    grid-template-columns:46px minmax(0,1fr) 465px 98px!important;
  }
}

/* ---------------- CAFE HEADER ---------------- */
@media (min-width:1200px){
  .cafe-pos-shell .cafe-commandbar{
    display:grid!important;
    grid-template-columns:250px minmax(390px,510px) minmax(0,1fr)!important;
    align-items:center!important;
    gap:10px!important;
    min-height:72px!important;
    height:72px!important;
    padding:7px 10px!important;
    overflow:hidden!important;
  }

  .cafe-pos-shell .cafe-brand{
    min-width:0!important;
  }

  .cafe-pos-shell .cafe-command-center{
    display:grid!important;
    grid-template-columns:120px minmax(0,1fr)!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    min-width:0!important;
  }

  .cafe-pos-shell .cafe-order-context{
    min-width:0!important;
    padding:0 8px!important;
    border-right:1px solid rgba(255,255,255,.18)!important;
  }
  .cafe-pos-shell .cafe-order-context strong{
    font-size:12px!important;
  }

  .cafe-pos-shell .cafe-kpi-compact{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(58px,1fr))!important;
    gap:4px!important;
    min-width:0!important;
  }
  .cafe-pos-shell .cafe-mini-stat{
    min-width:0!important;
    width:100%!important;
    height:34px!important;
    padding:3px 6px!important;
  }

  .cafe-pos-shell .cafe-command-status{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
  }

  /* Online/operator consume space without adding useful action value. */
  .cafe-pos-shell .cafe-command-status>.cafe-status-badge{
    display:none!important;
  }

  .cafe-pos-shell .cafe-command-btn{
    min-width:76px!important;
    width:auto!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 9px!important;
    border-radius:10px!important;
    font-size:9px!important;
    white-space:nowrap!important;
  }
  .cafe-pos-shell .cafe-command-btn.personalize{
    border-color:#8ecfc7!important;
  }

  /* Cafe categories: same principle as Restaurant, slightly larger. */
  .cafe-pos-shell .cafe-category-strip{
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    grid-auto-rows:36px!important;
    gap:5px!important;
    padding:6px!important;
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
  }
  .cafe-pos-shell .cafe-category-chip{
    width:100%!important;
    min-width:0!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 7px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    font-size:9.5px!important;
    font-weight:850!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .cafe-pos-shell .cafe-category-chip small{
    flex:0 0 auto!important;
    font-size:8px!important;
  }
}

/* ---------------- RESTAURANT CATEGORIES ---------------- */
@media (min-width:1200px){
  .m3-shell .m3-tabs.category-tabs{
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    grid-auto-rows:34px!important;
    gap:5px!important;
    padding:6px!important;
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
  }
  .m3-shell .m3-tabs.category-tabs button{
    width:100%!important;
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 6px!important;
    font-size:9px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .m3-shell .m3-actions .m3-btn{
    min-height:38px!important;
    height:38px!important;
    padding:0 10px!important;
    font-size:9.5px!important;
  }
}

/* ---------------- LAPTOP LEGIBILITY ---------------- */
@media (min-width:1100px){
  .m3-shell,
  .cafe-pos-shell,
  .pharmacy-v2,
  .warehouse-v2{
    --mob365-laptop-scale:1.035;
  }

  .m3-shell .m3-panel-head h2,
  .cafe-pos-shell .cafe-panel-header h2{
    font-size:17px!important;
  }

  .m3-shell .m3-product strong,
  .cafe-pos-shell .cafe-product-tile strong{
    font-size:11.5px!important;
  }

  .m3-shell .m3-product b,
  .cafe-pos-shell .cafe-product-price{
    font-size:16px!important;
  }
}

/* 1366 laptop: 6 category columns keeps labels readable without eating all height. */
@media (min-width:1100px) and (max-width:1500px){
  .cafe-pos-shell .cafe-category-strip,
  .m3-shell .m3-tabs.category-tabs{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  .cafe-pos-shell .cafe-commandbar{
    grid-template-columns:210px 390px minmax(0,1fr)!important;
  }
  .cafe-pos-shell .cafe-command-btn{
    min-width:64px!important;
    padding:0 6px!important;
    font-size:8.3px!important;
  }
}

/* Touch/tablet remains usable. */
@media (max-width:1099px){
  .cafe-pos-shell .cafe-category-strip,
  .m3-shell .m3-tabs.category-tabs{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
}