:root { font-family: "Segoe UI", system-ui, sans-serif; color: #20303a; background: #edf2f5; font-size: 16px; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: linear-gradient(135deg, #eef4f6 0%, #f8fafb 55%, #e5eef2 100%); }
button { border: 0; border-radius: .45rem; padding: .75rem 1rem; background: #248eae; color: #fff; font: inherit; font-weight: 700; cursor: pointer; transition: transform .12s ease, filter .12s ease; }
button:hover { filter: brightness(.94); } button:active { transform: translateY(1px); } button:disabled, input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: .58; } .synchronizing button:disabled, .synchronizing input:disabled, .synchronizing select:disabled, .synchronizing textarea:disabled { cursor: wait; }
button.is-working:disabled { cursor: progress; } html.is-processing, html.is-processing * { cursor: progress !important; }
.secondary { background: #667680; } .danger { background: #d9343d; }
input, select { width: 100%; border: 1px solid #b8c5cc; border-radius: .35rem; background: #fff; padding: .65rem .7rem; color: #25343d; font: inherit; }
input:focus, select:focus { outline: 3px solid #66bed533; border-color: #2495b6; }
label { display: grid; gap: .35rem; color: #41535e; font-size: .9rem; font-weight: 700; }
h1, h2, p { margin-top: 0; }
.app-shell { height: 100vh; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.app-header { min-height: 3.65rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .7rem; padding: .35rem clamp(.8rem, 2vw, 1.5rem); background: #35a1c0; color: #fff; border-bottom: 2px solid #176b85; box-shadow: 0 2px 10px #1234443b; }
.brand { display: flex; align-items: center; gap: .55rem; } .brand-mark { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: .32rem; background: linear-gradient(135deg, #795de7, #55bed9); color: #fff; font-size: 1.35rem; font-style: italic; font-weight: 900; }
.brand h1 { margin: 0; color: #07324d; font-size: 1.3rem; letter-spacing: -.06rem; } .brand h1 span { color: #fff; font-weight: 400; }
.header-status { display: flex; align-items: center; gap: .8rem; color: #effaff; font-size: .84rem; } .header-status p { margin: 0; } #session-status { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; } .session-user-icon { width: 1.45rem; height: 1.45rem; object-fit: contain; }
.header-actions { justify-self: end; display: flex; gap: .5rem; } .header-actions button { padding: .55rem .9rem; background: #ffffff1c; border: 1px solid #ffffff80; } .header-actions .danger { background: #c92f38; border-color: #c92f38; }
.kiosk-layout { display: grid; grid-template-columns: 12.5rem minmax(0, 1fr); gap: 0; max-width: 1500px; min-height: calc(100vh - 6.15rem); margin: 0 auto; padding: 0; background: #102229; }
.sales { min-height: calc(100vh - 6.15rem); display: grid; grid-template-columns: minmax(17rem, .9fr) minmax(21rem, 1.1fr); grid-template-rows: auto auto 1fr auto; background: #18292f; border: 0; border-radius: 0; overflow: hidden; box-shadow: none; }
.section-heading { grid-column: 1 / -1; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .65rem .85rem; background: #074955; border-bottom: 1px solid #278193; } .section-heading h2 { flex: 1 1 20rem; margin: 0; color: #fff; font-size: 1.05rem; } .section-heading strong { color: #b9e8ef; font-size: .86rem; }
.section-heading button { padding: .48rem .7rem; font-size: .86rem; }
.quick-product-form { grid-column: 1; display: grid; grid-template-columns: minmax(0, 1fr) 4.6rem 3rem; gap: .4rem; align-items: center; padding: .65rem; background: #102229; border: 0; } .quick-product-form input { min-height: 2.7rem; } .quick-product-form button { min-height: 2.7rem; padding: 0; font-size: 1.55rem; background: #e9f4f6; color: #11606e; }.quick-quantity { color: #cce4e8; font-size: .7rem; }.quick-quantity input { padding: .45rem; }.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.sales-keypad { grid-column: 1; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(3.4rem, 1fr); gap: .4rem; padding: .65rem; background: #102229; }.sales-keypad button { border-radius: .25rem; padding: .3rem; background: #33444c; color: #fff; font-size: 1.45rem; font-weight: 400; }.sales-keypad .key-enter { grid-row: span 2; background: #09a759; font-size: .92rem; font-weight: 800; }
.basket { grid-column: 2; grid-row: 2 / 4; min-height: 19rem; overflow: auto; background: #f8fbfc; }
.basket-line { display: flex; gap: .35rem; padding: .23rem .45rem; border-bottom: 1px solid #dfe6e9; } .basket-line .basket-row { flex: 1; }
.basket-row, .product-list > button { display: block; width: 100%; border-radius: .3rem; background: transparent; color: #30424d; text-align: left; font-weight: 600; } .basket-line button { padding: .5rem .65rem; }
.basket::before { content: 'CESTO'; display: block; padding: .38rem .65rem; background: #e2e8ea; color: #233740; font-size: .9rem; font-weight: 900; }
#save-basket, #suspend-basket, #clear-basket { padding: .58rem .4rem; font-size: .8rem; } #clear-basket { background: #d9363d; }
.operations-panel.sales-navigation { display: flex; flex-direction: column; gap: 0; padding: .65rem .35rem; background: #064b57; }.sales-navigation h2 { margin: 0 0 .55rem; padding: 0 .45rem; color: #fff; font-size: 1.1rem; }.sales-navigation > button { min-height: 4.45rem; display: grid; justify-items: center; align-content: center; gap: .2rem; border-radius: 0; padding: .4rem; background: transparent; border-bottom: 1px solid #ffffff24; color: #fff; font-size: .77rem; text-transform: uppercase; }.sales-navigation > button span { font-size: 1.7rem; }.sales-navigation > button:hover { background: #0b6573; }.sales-utility[hidden] { display: none; }
.eyebrow { margin-bottom: .35rem; color: #1984a4; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; } #day-status { margin-bottom: .75rem; padding: .7rem; border-left: 4px solid #55adc8; background: #f0f8fa; font-weight: 700; } #sync-result { margin: .7rem 0 0; color: #50636d; font-size: .85rem; line-height: 1.35; }
#day-status.status-closed { color: #c6252d; border-left-color: #d9343d; background: #fff0f1; } #footer-day.status-closed { color: #ff8d93; font-weight: 800; }
.backoffice { max-width: 1440px; margin: 1rem auto; padding: 1.15rem clamp(1rem, 2.5vw, 2rem); background: #fff; border: 1px solid #c4d0d6; border-radius: .55rem; box-shadow: 0 5px 18px #1d405412; } .backoffice .section-heading { margin: -1.15rem -2rem 1rem; padding: .9rem 2rem; }
.customers-list { display: grid; gap: .35rem; margin: 1rem 0; } .customer-row { background: #edf4f6; color: #2a424e; text-align: left; }
.fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .85rem; margin: 1rem 0; } .checkbox { display: flex; align-items: center; gap: .5rem; } .checkbox input { width: auto; } fieldset.fields { border: 1px solid #bed0d7; border-radius: .4rem; padding: 1rem; } legend { padding: 0 .35rem; color: #227c99; font-weight: 900; }
dialog { width: min(92vw, 34rem); max-width: 34rem; border: 0; border-radius: .65rem; padding: 0; box-shadow: 0 12px 45px #0008; } dialog::backdrop { background: #062331b8; } .day-form, .payment-form { display: grid; padding: 1.35rem; background: #fff; } .day-form { background: #2d94b4; color: #fff; } .day-form label { color: #fff; margin-top: 12px} .day-form h2, .payment-form h2 { margin: 0; } .actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 18px}
.password-field { position: relative; display: block; }.password-field input { padding-right: 3rem; }.toggle-password { position: absolute; top: .18rem; right: .18rem; display: grid; place-items: center; width: 2.35rem; height: calc(100% - .36rem); padding: 0; border: 0; border-radius: .28rem; background: transparent; color: #28738c; font-size: 1.1rem; }.toggle-password:hover { background: #d9eef4; }
.product-browser { min-width: min(92vw, 50rem); padding: 1.2rem; background: #fff; } .product-browser input { margin: .7rem 0; } .product-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .65rem; margin: .8rem 0; } .product-groups button { min-height: 5.25rem; background: #42a6c5; } .product-list { max-height: 50vh; overflow: auto; border: 1px solid #d1dde2; } .product-list button { border-radius: 0; border-bottom: 1px solid #d8e1e5; }
.product-groups[hidden], .product-list[hidden], .product-browser input[hidden] { display: none !important; }
.order-history-list { display: grid; grid-auto-rows: 7.5rem; align-content: start; gap: .5rem; padding: .65rem; background: #f2f5f6; }.order-history-row { display: flex; align-items: center; gap: .75rem; height: 7.5rem; padding: .65rem; border: 1px solid #c4d0d5; border-left: .35rem solid #3d9fbd; background: #fff; overflow: hidden; }.order-history-row.status-cancelado { border-left-color: #d9343d; }.order-history-row.status-concluído { border-left-color: #35a966; }.order-history-details { display: grid; flex: 1; gap: .15rem; }.order-history-details > span:last-child { color: #5a6870; font-size: .84rem; }.order-status { font-size: .78rem; font-weight: 800; }.order-history-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: .4rem; }.order-history-actions button { padding: .45rem .6rem; font-size: .78rem; }
#products-dialog { width: 800px; max-width: 96vw; height: 600px; max-height: 90vh; overflow: hidden; }.product-browser { width: 100%; min-width: 0; height: 100%; overflow: hidden; }.product-browser .product-groups { max-height: none; overflow: visible; }.product-browser .product-list { max-height: calc(90vh - 12rem); }
#sale-customer-dialog { width: 800px; max-width: 96vw; height: 600px; max-height: 90vh; overflow: hidden; } #sale-customer-dialog .product-browser { display: flex; flex-direction: column; } #sale-customer-dialog .product-list { flex: 1; max-height: none; }
#saved-sales-dialog { width: 800px; max-width: 96vw; height: 600px; max-height: 90vh; overflow: hidden; } #saved-sales-dialog .product-browser { display: flex; flex-direction: column; } #saved-sales-dialog .order-history-list { flex: 1; max-height: none; overflow: auto; }
.saved-sales-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .65rem; margin: 0; }.saved-sales-search button { min-height: 2.5rem; margin: .7rem 0;}
#sale-customer-search-form { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .65rem; align-items: end; margin: 0; } #sale-customer-search-form button { min-height: 2.5rem; margin-bottom: .7rem;} #sale-customers-list { margin-top: .25rem; }.sale-customer-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; align-items: center; border-bottom: 1px solid #d8e1e5; }.sale-customer-row .sale-customer-select { width: auto; min-width: 0; border-radius: 0; background: transparent; color: #30424d; text-align: left; font-weight: 400; }.sale-customer-row .sale-customer-edit { width: auto; min-width: 0; margin-right: .45rem; padding: .4rem .6rem; font-size: .78rem; white-space: nowrap; }
#customer-editor-dialog { width: 800px; max-width: 96vw; height: 600px; max-height: 90vh; overflow: hidden; } .customer-editor-content { height: 100%; padding: .9rem; background: #fff; }.customer-editor-content .section-heading { margin: -.9rem -.9rem .75rem; padding: .6rem .9rem; }.customer-editor-content .section-heading h2 { font-size: 1.03rem; }.customer-editor-content .fields { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem .7rem; margin: .7rem 0; }.customer-editor-content label { gap: .25rem; font-size: .82rem; }.customer-editor-content input, .customer-editor-content select { min-height: 2.2rem; padding: .46rem .58rem; font-size: .92rem; }.customer-editor-content fieldset.fields { padding: .65rem .75rem .75rem; }.customer-editor-content legend { font-size: .86rem; }.customer-editor-content .checkbox { align-self: end; min-height: 2.2rem; }.customer-editor-content form > button { margin-top: .2rem; padding: .6rem .9rem; }
#payment-dialog { height: 600px; max-height: 90vh; overflow: auto; } .payment-form { min-width: min(92vw, 32rem); min-height: 100%; } .payment-lines { display: grid; grid-auto-rows: 2.75rem; align-content: start; gap: .35rem; min-height: 5.85rem; overflow-y: auto; } .payment-line { display: flex; justify-content: space-between; gap: .5rem; align-items: center; min-height: 2.75rem; padding: .55rem; background: #edf4f6; } .initialization-dialog progress { width: 100%; height: 1.2rem; }
#session-report-dialog { width: 800px; max-width: 96vw; height: 600px; max-height: 90vh; overflow: hidden; } .session-report-panel { display: flex; flex-direction: column; height: 100%; background: #fff; } .session-report-panel .section-heading { flex: 0 0 auto; } #session-report-content { flex: 1; min-height: 0; margin: 0; padding: 1rem 1.2rem; overflow: auto; color: #263b45; font: .86rem/1.42 Consolas, "Courier New", monospace; white-space: pre; } .session-report-panel .actions { flex: 0 0 auto; justify-content: end; margin: 0; padding: .75rem 1rem; border-top: 1px solid #d1dde2; background: #f3f6f7; }
#confirmation-dialog, #notice-dialog { width: min(92vw, 27rem); } .confirmation-panel { padding: 1.2rem; background: #fff; } .confirmation-panel h2 { margin-bottom: .7rem; color: #31505d; font-size: 1.05rem; } .confirmation-panel p { margin: 0; color: #4e626c; line-height: 1.45; } .confirmation-panel .actions { justify-content: end; margin-top: 1.2rem; }
.submenu-dialog { width: min(92vw, 32rem); } .submenu-panel { padding: .85rem; background: #fff; } .submenu-panel .section-heading { margin: -.85rem -.85rem .9rem; } .submenu-actions { display: grid; grid-template-columns: 1fr; gap: .75rem; } .submenu-actions button { min-height: 5rem; padding: .8rem; } #change-fund-dialog, #cash-withdrawal-dialog { width: min(92vw, 29rem); } #change-fund-dialog .payment-form, #cash-withdrawal-dialog .payment-form { min-width: 0; } #change-fund-dialog .section-heading, #cash-withdrawal-dialog .section-heading { flex-wrap: nowrap; } #change-fund-dialog .section-heading h2, #cash-withdrawal-dialog .section-heading h2 { flex: 1 1 auto; } #change-fund-dialog .section-heading button, #cash-withdrawal-dialog .section-heading button { margin-left: auto; white-space: nowrap; } #change-fund-dialog .actions, #cash-withdrawal-dialog .actions { justify-content: end; }
.home-view { flex: 1; min-height: 0; display: grid; place-items: center; overflow: auto; padding: 1rem; }
.home-view[hidden], #work-area[hidden] { display: none !important; }
.home-menu { width: min(100%, 48rem); padding: 1.6rem; background: #ffffffed; border: 1px solid #aebfc7; border-radius: .7rem; box-shadow: 0 12px 34px #17374428; }
.home-menu h2 { height: 25px; margin-bottom: .8rem; color: #1f657d; font-size: 1.15rem; line-height: 25px; }
.menu-grid { display: grid; grid-template-columns: repeat(2, minmax(12rem, 1fr)); gap: 1rem; }
.menu-grid button { min-height: 8.7rem; display: grid; place-items: center; align-content: center; gap: .6rem; background: #45a5c2; font-size: 1.05rem; box-shadow: 0 3px 8px #11374732; }
.menu-grid button span { font-size: 2.25rem; line-height: 1; }
.menu-grid button img { width: 3.25rem; height: 3.25rem; object-fit: contain; }
.home-message { min-height: 1.2rem; margin: 1rem 0 0; color: #47616c; text-align: center; }
#work-area { flex: 1; display: flex; min-height: 0; overflow: hidden; } #work-area > .backoffice { display: none; }
.app-footer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); align-items: center; gap: .7rem; min-height: 2.35rem; margin-top: auto; padding: .3rem clamp(.8rem, 2vw, 1.5rem); background: #082d49; color: #fff; font-size: .78rem; }
.footer-state { grid-column: 1; display: flex; gap: .85rem; flex-wrap: nowrap; min-width: 0; white-space: nowrap; }.footer-state span + span { padding-left: .85rem; border-left: 1px solid #ffffff45; }
.footer-right { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: .85rem; white-space: nowrap; }.footer-right #footer-clock { padding-left: .85rem; border-left: 1px solid #ffffff45; }
.startup-progress { grid-column: 2; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .55rem; width: 100%; min-width: 0; }
.startup-progress[hidden] { display: none !important; }
.startup-progress progress { width: 100%; height: .8rem; accent-color: #54c4dd; }
.app-footer:has(.startup-progress[hidden]) { grid-template-columns: minmax(0, 1fr) auto; }.app-footer:has(.startup-progress[hidden]) .footer-right { grid-column: 2; }
@media (max-width: 1100px) { .app-footer { grid-template-columns: minmax(14rem, 1fr) minmax(0, 2fr) auto; gap: .45rem; padding-inline: .65rem; font-size: .72rem; } .footer-state { display: grid; grid-template-columns: max-content max-content minmax(0, 1fr); align-items: center; gap: .45rem; overflow: hidden; } .footer-state span + span { padding-left: .45rem; } #footer-terminal { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .footer-right { gap: .5rem; } .footer-right #footer-clock { padding-left: .5rem; } .startup-progress { gap: .35rem; } .startup-progress span { max-width: 8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } }
.about-panel { padding: 1.2rem; background: #fff; }.about-panel .section-heading { margin: -1.2rem -1.2rem 1rem; }
@media (max-width: 900px) { .app-header { grid-template-columns: 1fr auto; } .header-status { grid-column: 1 / -1; grid-row: 2; } .kiosk-layout { grid-template-columns: 1fr; } .operations-panel { grid-template-columns: 1fr 1fr; } .sales { min-height: 0; } }
@media (max-width: 620px) { .app-header { grid-template-columns: 1fr; } .header-actions { justify-self: start; } .quick-product-form { grid-template-columns: 1fr 7rem; } .quick-product-form button { grid-column: 1 / -1; } .operations-panel { grid-template-columns: 1fr; } .basket-summary, .basket-actions { flex-wrap: wrap; } .basket-actions button { flex: 1 1 42%; } .section-heading { align-items: stretch; } .section-heading h2 { flex-basis: 100%; } .backoffice .section-heading { margin: -1.15rem -1rem 1rem; padding: .9rem 1rem; } .menu-grid { grid-template-columns: 1fr; } .app-footer { grid-template-columns: 1fr; gap: .45rem; } .footer-right { grid-column: 1; justify-self: start; } .footer-state { grid-column: 1; }.footer-state span + span { padding-left: 0; border-left: 0; } .startup-progress { grid-column: 1; grid-template-columns: 1fr; } }

/* Ecrã de vendas inspirado na disposição clássica do PINS Kiosk. */
.kiosk-layout { width: 100%; max-width: none; height: 100%; min-height: 0; margin: 0; grid-template-columns: minmax(0, 1fr) 500px; background: #e9eef0; }
.sales { height: 100%; min-height: 0; display: flex; flex-direction: column; background: #fff; border-right: 1px solid #7d929b; }
.sales .section-heading { display: flex; min-height: 3.25rem; padding: .65rem 1rem; background: #dbe2e5; border-bottom: 1px solid #aebdc4; }.sales .section-heading h2 { color: #344750; }.sales .section-heading strong { color: #3e525d; }
.basket { flex: 1; min-height: 0; grid-column: auto; grid-row: auto; overflow: auto; background: repeating-linear-gradient(0deg, #fff, #fff 2.9rem, #f7f9fa 2.9rem, #f7f9fa 5.8rem); }.basket::before { content: none; }
.basket-summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .48rem 1rem; background: #dfe6e8; border-top: 1px solid #afc0c7; }.basket-summary #basket-count { color: #354b57; font-weight: 800; }.basket-summary #basket-value { color: #13272f; font-size: 1.28rem; text-align: right; }.basket-actions { display: flex; justify-content: center; gap: .5rem; padding: .7rem 1rem; background: #dfe6e8; border-top: 1px solid #c2d0d5; }.basket-actions #save-basket { display: none; }.basket-actions button { min-width: 6.7rem; padding: .62rem .55rem; }.basket-actions #suspend-basket { background: #70757a; }.basket-actions #checkout-button { background: #47a7c4; }
.operations-panel.kiosk-sales-menu { display: grid; grid-template-rows: 14.8rem minmax(0, 1fr); gap: .45rem; padding: .25rem; background: #fff; }
.kiosk-menu-actions { padding: .55rem; background: #3fa2c0; }.kiosk-menu-actions > p { margin: 0 0 .45rem; color: #fff; font-size: .84rem; }.kiosk-menu-actions > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }.kiosk-menu-actions button { min-height: 5.05rem; display: grid; justify-items: center; align-content: center; gap: .25rem; padding: .35rem; border: 1px solid #b2c0c5; border-radius: .65rem; background: #fff; color: #37a0c0; font-size: .78rem; font-weight: 500; }.kiosk-menu-actions button span { font-size: 1.8rem; line-height: 1; }.kiosk-menu-actions button img { width: 2rem; height: 2rem; object-fit: contain; }.kiosk-menu-actions button:hover { background: #eef9fc; }
.kiosk-keypad-panel { display: flex; flex-direction: column; padding: .7rem; border: 1px solid #a5b4bb; background: #f5f6f6; }.kiosk-keypad-panel .quick-product-form { display: grid; grid-template-columns: minmax(0, 1fr) 4.25rem 2.5rem; gap: .35rem; align-items: end; padding: 0 0 .5rem; background: transparent; }.kiosk-keypad-panel .quick-product-form label { display: grid; gap: .2rem; color: #384d57; font-weight: 500; }.kiosk-keypad-panel .quick-product-form input { height: 2.15rem; min-height: 2.15rem; margin: 0; padding: .35rem .45rem; }.kiosk-keypad-panel .quick-product-form button { align-self: end; height: 2.15rem; min-height: 2.15rem; padding: 0; background: #fff; color: #277c95; font-size: 1.25rem; }.kiosk-keypad-panel .quick-quantity { font-size: .68rem; }
.kiosk-keypad-panel .sales-keypad { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(2.7rem, 1fr); gap: .42rem; padding: .05rem 0 0; background: transparent; }.kiosk-keypad-panel .sales-keypad button { border: 1px solid #9fa9ae; border-radius: .45rem; background: #fff; color: #384b54; font-size: 1rem; }.kiosk-keypad-panel .sales-keypad .key-clear { background: #cc2229; color: #fff; font-weight: 800; }.kiosk-keypad-panel .sales-keypad .key-enter { grid-row: auto; background: #48a8c5; color: #fff; font-size: .88rem; font-weight: 800; }
@media (max-width: 900px) { .kiosk-layout { grid-template-columns: minmax(0, 1fr) 19rem; }.operations-panel.kiosk-sales-menu { grid-template-rows: auto minmax(0, 1fr); }.kiosk-menu-actions > div { gap: .3rem; }.kiosk-menu-actions button { min-height: 4.3rem; font-size: .68rem; } }
@media (max-width: 700px) { .kiosk-layout { grid-template-columns: 1fr; }.operations-panel.kiosk-sales-menu { min-height: 31rem; }.sales { min-height: 32rem; }.kiosk-keypad-panel .sales-keypad { min-height: 18rem; } }