<style>
  .cassa-sb-wrapper {
    --sb-page-bg: var(--bs-body-bg);
    --sb-surface: var(--bs-body-bg);
    --sb-surface-soft: var(--bs-tertiary-bg);
    --sb-border: var(--bs-border-color);
    --sb-text: var(--bs-heading-color);
    --sb-text-muted: var(--bs-secondary-color);
    --sb-primary: var(--bs-primary);
    --sb-primary-soft: var(--bs-primary-bg-subtle);
    --sb-primary-border: var(--bs-primary-border-subtle);
    --sb-product-border: color-mix(in srgb, var(--sb-primary) 22%, var(--sb-border) 78%);
    --sb-product-bg: color-mix(in srgb, var(--sb-primary-soft) 20%, var(--sb-surface) 80%);
    --sb-product-bg-hover: color-mix(in srgb, var(--sb-primary-soft) 38%, var(--sb-surface) 62%);
    --sb-product-shadow: 0 6px 16px rgba(var(--bs-primary-rgb), .20);
    --sb-product-title: color-mix(in srgb, var(--sb-primary) 40%, var(--sb-text) 60%);
    --sb-radius: 12px;
    --sb-touch: 44px;

    font-family: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    height: 100dvh;
    padding: .65rem;
    background: var(--sb-page-bg);
    overflow: hidden;
  }

  /* Tema chiaro: contrasto card piatti piu deciso */
  :root[data-bs-theme="light"] .cassa-sb-wrapper,
  .light-style .cassa-sb-wrapper {
    --sb-product-border: color-mix(in srgb, var(--sb-primary) 38%, var(--sb-border) 62%);
    --sb-product-bg: color-mix(in srgb, var(--sb-primary-soft) 34%, var(--sb-surface) 66%);
    --sb-product-bg-hover: color-mix(in srgb, var(--sb-primary-soft) 52%, var(--sb-surface) 48%);
    --sb-product-shadow: 0 8px 18px rgba(var(--bs-primary-rgb), .24);
    --sb-product-title: color-mix(in srgb, var(--sb-primary) 52%, var(--sb-text) 48%);
  }

  .cassa-sb-topbar {
    min-height: 54px;
    border: 1px solid var(--sb-border);
    border-radius: var(--sb-radius);
    background: var(--sb-surface);
    padding: .45rem .65rem;
    margin-bottom: .55rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
  }

  .cassa-sb-topbar-main {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .55rem;
  }

  .cassa-sb-topbar-main h5 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cassa-sb-order-meta {
    display: inline-grid;
    grid-template-columns: minmax(148px, 1.45fr) minmax(132px, 1fr) minmax(124px, .95fr);
    gap: .35rem;
    align-items: center;
    justify-content: start;
    min-width: 0;
    max-width: 540px;
  }

  .cassa-sb-order-field {
    display: flex;
    align-items: stretch;
    min-width: 0;
    height: 2rem;
    border: 1px solid var(--sb-border);
    border-radius: 8px;
    background: var(--sb-surface-soft);
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
  }

  .cassa-sb-order-field:focus-within {
    border-color: rgba(var(--bs-primary-rgb), .55);
    box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), .14);
  }

  .cassa-sb-order-label {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 0 .38rem;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--sb-text-muted);
    white-space: nowrap;
    line-height: 1;
    user-select: none;
    border-right: 1px solid var(--sb-border);
    background: color-mix(in srgb, var(--sb-border) 18%, var(--sb-surface-soft) 82%);
  }

  .cassa-sb-order-input {
    flex: 1 1 auto;
    width: auto;
    min-width: 2.4rem;
    min-height: 0;
    height: 100%;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--sb-primary);
    font-weight: 700;
    font-size: .78rem;
    padding: 0 .45rem;
    box-shadow: none !important;
  }

  .cassa-sb-order-input:focus,
  .cassa-sb-order-input:focus-visible {
    outline: none;
    box-shadow: none !important;
  }

  .cassa-sb-order-input::placeholder {
    color: var(--sb-text-muted);
  }

  .cassa-sb-order-input:-webkit-autofill,
  .cassa-sb-order-input:-webkit-autofill:hover,
  .cassa-sb-order-input:-webkit-autofill:focus,
  .cassa-sb-order-input:-webkit-autofill:active {
    -webkit-text-fill-color: var(--sb-primary);
    caret-color: var(--sb-primary);
    -webkit-box-shadow: 0 0 0 1000px var(--sb-surface-soft) inset;
    box-shadow: 0 0 0 1000px var(--sb-surface-soft) inset;
    transition: background-color 9999s ease-out 0s;
  }

  .cassa-sb-order-input--sm,
  .cassa-sb-order-input--xs {
    text-align: left;
    min-width: 2.75rem;
  }

  .cassa-sb-layout {
    height: calc(100dvh - 4.8rem);
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) 360px;
    gap: .65rem;
  }

  .cassa-sb-panel {
    min-height: 0;
    border: 1px solid var(--sb-border);
    border-radius: var(--sb-radius);
    background: var(--sb-surface);
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(17, 24, 39, .06);
  }

  .cassa-sb-catalog {
    display: grid;
    grid-template-columns: 176px minmax(0, 1fr);
    min-height: 0;
  }

  .cassa-sb-sidebar {
    min-height: 0;
    border-right: 1px solid var(--sb-border);
    padding: .45rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: .35rem;
  }

  .cassa-sb-side-title {
    margin: 0;
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 800;
    color: var(--sb-text-muted);
  }

  .cassa-sb-kitchens {
    min-height: 0;
    display: grid;
    grid-template-rows: repeat(10, minmax(0, 1fr));
    gap: .3rem;
  }

  .cassa-sb-kitchen-btn {
    min-height: 0;
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    padding: .4rem .5rem;
    text-align: left;
    display: grid;
    align-content: center;
    line-height: 1.05;
    font-size: .92rem;
    font-weight: 700;
    position: relative;
    transition: transform .12s ease, box-shadow .16s ease, border-color .16s ease;
  }

  .cassa-sb-kitchen-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cassa-sb-kitchen-count {
    margin-top: .08rem;
    font-size: .66rem;
    font-weight: 600;
    opacity: .92;
  }

  .cassa-sb-kitchen-btn.is-active {
    border-color: var(--sb-primary) !important;
    box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), .22);
    transform: translateY(-1px);
  }

  .cassa-sb-kitchen-btn--preordine {
    background: color-mix(in srgb, var(--sb-primary-soft) 55%, var(--sb-surface) 45%) !important;
    color: var(--sb-primary) !important;
    border-color: color-mix(in srgb, var(--sb-primary) 35%, var(--sb-border) 65%) !important;
  }

  .cassa-sb-kitchen-btn--preordine .cassa-sb-kitchen-count {
    opacity: .85;
  }

  .cassa-sb-main-content {
    min-height: 0;
    overflow: hidden;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
  }

  .cassa-sb-preordine {
    min-height: 0;
    overflow-y: auto;
    padding: .75rem;
  }

  .cassa-sb-preordine-inner {
    max-width: 520px;
    margin: 0 auto;
    display: grid;
    gap: .55rem;
  }

  .cassa-sb-preordine-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: var(--sb-primary);
  }

  .cassa-sb-preordine-hint {
    margin: 0;
    font-size: .78rem;
    color: var(--sb-text-muted);
  }

  .cassa-sb-preordine-input {
    min-height: var(--sb-touch);
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface-soft);
    color: var(--sb-text);
    font-size: .95rem;
    font-weight: 700;
    padding: 0 .75rem;
  }

  .cassa-sb-preordine-input:focus-visible {
    outline: 2px solid rgba(var(--bs-primary-rgb), .45);
    outline-offset: 1px;
  }

  .cassa-sb-preordine-result {
    min-height: 0;
  }

  .cassa-sb-preordine-loading {
    font-size: .82rem;
    color: var(--sb-text-muted);
    padding: .35rem 0;
  }

  .cassa-sb-preordine-result .card {
    border-color: var(--sb-border) !important;
    background: var(--sb-surface-soft);
  }

  .cassa-sb-preordine-result .table th {
    color: var(--sb-text-muted);
    font-size: .78rem;
  }

  .cassa-sb-preordine-result .table td {
    color: var(--sb-text);
    font-size: .88rem;
  }

  .cassa-sb-kitchen-btn:focus-visible,
  .cassa-sb-product:focus-visible,
  .cassa-sb-side-pager button:focus-visible,
  .cassa-sb-main-pager button:focus-visible,
  .cassa-sb-cart-stepper button:focus-visible,
  .cassa-sb-cart-note-btn:focus-visible,
  .cassa-sb-cart-note-view:focus-visible,
  .cassa-sb-cart-variant-btn:focus-visible,
  .cassa-sb-pay-grid button:focus-visible {
    outline: 2px solid rgba(var(--bs-primary-rgb), .5);
    outline-offset: 1px;
  }

  .cassa-sb-side-pager {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: .3rem;
    align-items: center;
  }

  .cassa-sb-side-pager button,
  .cassa-sb-main-pager button {
    min-height: var(--sb-touch);
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface-soft);
    color: var(--sb-text);
    font-weight: 700;
  }

  .cassa-sb-side-pager span,
  .cassa-sb-main-pager span {
    min-width: 48px;
    text-align: center;
    font-size: .76rem;
    color: var(--sb-text-muted);
    font-weight: 700;
  }

  .cassa-sb-main {
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .cassa-sb-main-head {
    border-bottom: 1px solid var(--sb-border);
    padding: .45rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: .4rem;
    align-items: center;
    background: color-mix(in srgb, var(--sb-surface) 94%, #fff 6%);
    position: sticky;
    top: 0;
    z-index: 2;
  }

  .cassa-sb-search {
    min-height: var(--sb-touch);
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface-soft);
    color: var(--sb-text);
    padding: 0 .7rem;
    font-size: .92rem;
  }

  .cassa-sb-selected-kitchen {
    min-height: var(--sb-touch);
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface-soft);
    color: var(--sb-text-muted);
    font-size: .8rem;
    font-weight: 700;
    padding: 0 .6rem;
    white-space: nowrap;
  }

  .cassa-sb-main-pager {
    display: inline-flex;
    gap: .35rem;
    align-items: center;
  }

  .cassa-sb-products-wrap {
    min-height: 0;
    padding: .45rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }

  .cassa-sb-products-wrap::-webkit-scrollbar {
    width: 10px;
  }

  .cassa-sb-products-wrap::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--sb-border) 65%, transparent);
    border-radius: 999px;
  }

  .cassa-sb-products {
    min-height: 100%;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(var(--product-cols, 5), minmax(0, 1fr));
    grid-template-rows: repeat(var(--product-rows, 1), minmax(55px, auto));
    align-content: start;
    gap: .55rem;
  }

  .cassa-sb-product {
    min-height: 0;
    height: 100%;
    border: 1px solid var(--sb-product-border);
    border-radius: 10px;
    background: var(--sb-product-bg);
    padding: .28rem .34rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    z-index: 1;
    transition: border-color .14s ease, box-shadow .14s ease, transform .12s ease;
  }

  .cassa-sb-product[data-allergen-open="1"] {
    z-index: 40;
  }

  .cassa-sb-letter-divider {
    align-self: center;
    min-height: 0;
    height: auto;
    margin-top: .62rem;
    margin-bottom: -.38rem;
    padding: 0 .14rem 0;
    pointer-events: none;
  }

  .cassa-sb-products > .cassa-sb-letter-divider:first-child {
    margin-top: 0;
  }

  .cassa-sb-letter-divider-label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .4rem;
    width: 100%;
    font-size: .9rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--sb-primary);
    line-height: 1;
  }

  .cassa-sb-letter-divider-label::after {
    content: "";
    flex: 1 1 auto;
    border-top: 1px solid color-mix(in srgb, var(--sb-primary) 24%, var(--sb-border) 76%);
  }

  .cassa-sb-product:hover {
    border-color: color-mix(in srgb, var(--sb-primary) 55%, var(--sb-product-border) 45%);
    background: var(--sb-product-bg-hover);
    box-shadow: var(--sb-product-shadow);
    transform: translateY(-1px);
  }

  .cassa-sb-product:active {
    transform: scale(.985);
  }

  .cassa-sb-product-title {
    font-size: clamp(.82rem, 1.02vw, .96rem);
    font-weight: 700;
    line-height: 1.15;
    color: var(--sb-product-title);
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-wrap: balance;
  }

  .cassa-sb-product-title.is-long {
    font-size: clamp(.76rem, .96vw, .88rem);
  }

  .cassa-sb-product-title.is-xlong {
    font-size: clamp(.72rem, .9vw, .82rem);
  }

  .cassa-sb-allergen-trigger {
    position: absolute;
    top: .38rem;
    right: .38rem;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 1px solid var(--sb-primary-border);
    background: var(--sb-primary);
    color: #fff;
    font-size: .74rem;
    font-weight: 800;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
  }

  .cassa-sb-allergen-tooltip {
    position: absolute;
    top: 1.8rem;
    right: .4rem;
    width: min(220px, 80vw);
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface);
    color: var(--sb-text);
    box-shadow: 0 .45rem .95rem rgba(0, 0, 0, .18);
    padding: .5rem .58rem;
    font-size: .74rem;
    line-height: 1.3;
    display: none;
    z-index: 2;
    pointer-events: auto;
  }

  .cassa-sb-allergen-tooltip.is-open {
    display: block;
  }

  .cassa-sb-allergen-tooltip-title {
    margin-bottom: .2rem;
    font-weight: 800;
  }

  .cassa-sb-placeholder {
    border-radius: 10px;
    opacity: .45;
  }

  .cassa-sb-cart {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 0;
  }

  .cassa-sb-cart-head {
    border-bottom: 1px solid var(--sb-border);
    padding: .5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
  }

  .cassa-sb-cart-list {
    min-height: 0;
    padding: .4rem;
    display: grid;
    grid-template-rows: repeat(6, minmax(0, 1fr));
    gap: .3rem;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    position: relative;
  }

  .cassa-sb-cart-list .dataTables_wrapper,
  .cassa-sb-cart-list .dataTables_scrollBody {
    height: 100% !important;
  }

  .cassa-sb-cart-list .dataTables_wrapper {
    position: relative;
    overflow: hidden;
  }

  .cassa-sb-cart-list table.dataTable {
    margin: 0 !important;
  }

  .cassa-sb-cart-list table.dataTable > thead,
  .cassa-sb-cart-list .dataTables_info,
  .cassa-sb-cart-list .dataTables_paginate {
    display: none !important;
  }

  .cassa-sb-cart-list table.dataTable tbody td {
    border: 0 !important;
    padding: .2rem 0 !important;
    vertical-align: top;
    min-width: 0;
  }

  .cassa-sb-cart-list.is-updating {
    animation: cassa-sb-cart-pulse .9s ease-in-out infinite;
    box-shadow: inset 0 0 0 1px var(--sb-primary-border);
    border-radius: 10px;
    transition: box-shadow .18s ease, background-color .18s ease;
  }

  .cassa-sb-cart-list.is-updating .cassa-sb-cart-item {
    opacity: .75;
  }

  .cassa-sb-cart-list .dataTables_processing,
  .cassa-sb-cart-list .dt-processing {
    display: none !important;
  }

  .cassa-sb-cart-item {
    border: 1px solid var(--sb-border);
    border-radius: 10px;
    background: var(--sb-surface-soft);
    padding: .42rem .46rem;
    display: grid;
    gap: .4rem;
    min-width: 0;
  }

  .cassa-sb-cart-item-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .55rem;
  }

  .cassa-sb-cart-item-name-wrap {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
  }

  .cassa-sb-kitchen-mark {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
  }

  .cassa-sb-kitchen-mark-icon {
    font-size: .86rem;
    line-height: 1;
    opacity: .95;
  }

  .cassa-sb-cart-item-name {
    font-size: .86rem;
    font-weight: 700;
    color: var(--sb-text);
    line-height: 1.15;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .cassa-sb-cart-item-total {
    font-size: .82rem;
    font-weight: 800;
    color: var(--sb-primary);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }

  .cassa-sb-cart-item-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .4rem;
    flex-wrap: nowrap;
    min-width: 0;
  }

  .cassa-sb-cart-stepper {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--sb-border);
    border-radius: 9px;
    overflow: hidden;
    min-height: 38px;
    background: var(--sb-surface);
  }

  .cassa-sb-cart-stepper button {
    min-width: 34px;
    min-height: 38px;
    border: 0;
    background: var(--sb-surface);
    color: var(--sb-text);
    font-size: 1rem;
    font-weight: 800;
    cursor: pointer;
  }

  .cassa-sb-cart-stepper span {
    min-width: 28px;
    text-align: center;
    font-size: .8rem;
    font-weight: 800;
    color: var(--sb-primary);
  }

  .cassa-sb-cart-note-btn {
    min-height: 34px;
    border: 1px solid var(--sb-border);
    border-radius: 9px;
    background: var(--sb-surface);
    color: var(--sb-text-muted);
    font-size: .7rem;
    font-weight: 700;
    padding: 0 .5rem;
    max-width: 100%;
    flex: 0 1 auto;
    min-width: 0;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
  }

  .cassa-sb-cart-tools {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    min-width: 0;
    flex: 1 1 auto;
  }

  .cassa-sb-cart-delete-btn {
    margin-left: auto;
    flex: 0 0 auto;
    min-width: 38px;
    min-height: 34px;
    border: 1px solid color-mix(in srgb, var(--bs-danger) 35%, var(--sb-border) 65%);
    border-radius: 9px;
    background: color-mix(in srgb, var(--bs-danger-bg-subtle) 70%, var(--sb-surface) 30%);
    color: var(--bs-danger);
    font-size: 1rem;
    line-height: 1;
    padding: 0 .45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
  }

  .cassa-sb-cart-delete-btn:hover {
    background: var(--bs-danger-bg-subtle);
    border-color: color-mix(in srgb, var(--bs-danger) 55%, var(--sb-border) 45%);
    color: var(--bs-danger-text-emphasis, var(--bs-danger));
  }

  .cassa-sb-cart-note-view {
    min-height: 34px;
    border: 1px solid var(--sb-border);
    border-radius: 9px;
    background: var(--sb-surface);
    color: var(--sb-text-muted);
    font-size: .72rem;
    font-weight: 700;
    padding: .24rem .45rem;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    text-align: left;
    width: 100%;
    min-width: 0;
  }

  .cassa-sb-cart-note-view.is-filled {
    border-color: var(--sb-primary-border);
    color: var(--sb-text);
    background: color-mix(in srgb, var(--sb-primary-soft) 35%, var(--sb-surface) 65%);
  }

  .cassa-sb-cart-note-view span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cassa-sb-cart-variants {
    display: grid;
    gap: .25rem;
  }

  .cassa-sb-cart-variant-btn {
    min-height: 34px;
    border: 1px solid var(--bs-success-border-subtle);
    border-radius: 9px;
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
    font-size: .72rem;
    font-weight: 700;
    padding: .24rem .45rem;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    text-align: left;
    width: 100%;
    min-width: 0;
    cursor: pointer;
  }

  .cassa-sb-cart-variant-btn i {
    font-size: .9rem;
  }

  .cassa-sb-cart-variant-btn span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  @keyframes cassa-sb-cart-pulse {
    0%, 100% { background-color: transparent; }
    50% { background-color: color-mix(in srgb, var(--sb-primary-soft) 30%, transparent); }
  }

  .cassa-sb-footer {
    border-top: 1px solid var(--sb-border);
    padding: .4rem;
    display: grid;
    gap: .3rem;
  }

  .cassa-sb-total {
    border: 1px solid var(--sb-primary-border);
    border-radius: 10px;
    background: var(--sb-primary-soft);
    padding: .4rem .5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .cassa-sb-total-value {
    font-size: 1rem;
    font-weight: 800;
    color: var(--sb-primary);
  }

  .cassa-sb-pay-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .26rem;
  }

  .cassa-sb-pay-grid button {
    min-height: var(--sb-touch);
    border-radius: 10px;
    border: 1px solid var(--sb-border);
    font-weight: 800;
  }

  .cassa-sb-main-btn {
    background: var(--sb-primary);
    border-color: var(--sb-primary) !important;
    color: #fff;
  }

  .cassa-sb-cash-btn {
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
  }

  .cassa-sb-card-btn {
    background: var(--sb-primary-soft);
    color: var(--sb-primary);
  }

  .cassa-sb-clear-btn {
    background: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text-emphasis);
  }

  @media (max-width: 1400px) {
    .cassa-sb-layout { grid-template-columns: minmax(0, 1fr) 332px; }
    .cassa-sb-catalog { grid-template-columns: 160px minmax(0, 1fr); }
    .cassa-sb-products { grid-template-rows: repeat(var(--product-rows, 1), minmax(55px, auto)); }
  }

  @media (max-width: 1200px) {
    .cassa-sb-wrapper {
      height: auto;
      min-height: 100dvh;
      overflow: auto;
      padding: .5rem;
    }
    .cassa-sb-layout {
      height: auto;
      grid-template-columns: minmax(0, 1fr);
      gap: .5rem;
    }
    .cassa-sb-catalog {
      min-height: 64dvh;
      grid-template-columns: 148px minmax(0, 1fr);
    }
    .cassa-sb-cart {
      min-height: 38dvh;
    }
    .cassa-sb-products { grid-template-rows: repeat(var(--product-rows, 1), minmax(55px, auto)); }
  }

  @media (max-width: 768px) {
    .cassa-sb-topbar {
      flex-wrap: wrap;
      align-items: stretch;
    }
    .cassa-sb-topbar-main {
      width: 100%;
      flex: 0 0 auto;
      flex-wrap: wrap;
      gap: .4rem;
    }
    .cassa-sb-order-meta {
      width: 100%;
      max-width: none;
      grid-template-columns: minmax(136px, 1.35fr) minmax(118px, 1fr) minmax(112px, .95fr);
    }
    .cassa-sb-catalog {
      grid-template-columns: 118px minmax(0, 1fr);
      min-height: 66dvh;
    }
    .cassa-sb-main-head {
      grid-template-columns: 1fr;
    }
    .cassa-sb-selected-kitchen {
      width: 100%;
      justify-content: center;
    }
    .cassa-sb-main-pager {
      width: 100%;
      justify-content: space-between;
    }
    .cassa-sb-products {
      grid-template-rows: repeat(var(--product-rows, 1), minmax(46px, auto));
      gap: .42rem;
    }
    .cassa-sb-product {
      min-height: 46px;
      padding: .22rem .26rem;
    }
    .cassa-sb-product-title {
      -webkit-line-clamp: 2;
    }
    .cassa-sb-cart-item-actions {
      flex-wrap: wrap;
    }
  }

  @media (max-width: 480px) {
    .cassa-sb-wrapper {
      padding: .36rem;
    }
    .cassa-sb-catalog {
      grid-template-columns: 102px minmax(0, 1fr);
      min-height: 64dvh;
    }
    .cassa-sb-order-meta {
      grid-template-columns: minmax(128px, 1.2fr) minmax(108px, 1fr) minmax(104px, .95fr);
      gap: .28rem;
    }
    .cassa-sb-order-field {
      height: 1.9rem;
    }
    .cassa-sb-order-input {
      font-size: .74rem;
      padding: 0 .4rem;
    }
    .cassa-sb-order-label {
      font-size: .6rem;
      padding: 0 .34rem;
    }
    .cassa-sb-side-pager button,
    .cassa-sb-main-pager button {
      min-height: 38px;
      font-size: .76rem;
    }
    .cassa-sb-products {
      grid-template-rows: repeat(var(--product-rows, 1), minmax(42px, auto));
      gap: .36rem;
    }
    .cassa-sb-product {
      min-height: 42px;
      border-radius: 8px;
      padding: .2rem .24rem;
    }
    .cassa-sb-product-title {
      font-size: .8rem;
    }
    .cassa-sb-cart-list {
      padding: .3rem;
      gap: .22rem;
    }
    .cassa-sb-cart-item {
      padding: .34rem .36rem;
      gap: .3rem;
    }
    .cassa-sb-cart-item-main {
      gap: .35rem;
    }
    .cassa-sb-cart-item-name {
      font-size: .78rem;
      line-height: 1.12;
    }
    .cassa-sb-cart-item-total {
      font-size: .76rem;
    }
    .cassa-sb-cart-item-actions {
      align-items: stretch;
      gap: .28rem;
    }
    .cassa-sb-cart-stepper {
      min-height: 34px;
    }
    .cassa-sb-cart-stepper button {
      min-width: 30px;
      min-height: 34px;
      font-size: .92rem;
    }
    .cassa-sb-cart-stepper span {
      min-width: 24px;
      font-size: .74rem;
    }
    .cassa-sb-cart-tools {
      width: 100%;
      justify-content: flex-start;
      gap: .25rem;
    }
    .cassa-sb-cart-note-btn {
      min-height: 32px;
      padding: 0 .42rem;
      font-size: .66rem;
      flex: 0 1 auto;
    }
    .cassa-sb-cart-delete-btn {
      min-width: 34px;
      min-height: 32px;
      margin-left: auto;
    }
    .cassa-sb-cart-note-view {
      min-height: 32px;
      font-size: .68rem;
      padding: .2rem .38rem;
    }
    .cassa-sb-cart-variant-btn {
      min-height: 30px;
      font-size: .66rem;
      padding: .2rem .38rem;
    }
    .cassa-sb-pay-grid {
      grid-template-columns: 1fr;
    }
  }
</style>
