/* App.xaml raised template; TillWindow.cs action colours and dimensions. */
:root{--header:linear-gradient(#41668d,#1d3655)}
button{--face:#f7fafe;--bottom:var(--face);background:linear-gradient(#ffffff60 0%,#ffffff10 48%,#00000008 50%,#00000025 100%),linear-gradient(var(--face),var(--bottom));border-color:#c2d0df;box-shadow:inset 0 1px 0 #ffffff70,inset 1px 0 0 #ffffff70,inset -1px 0 0 #ffffff70,0 2px 0 #426080;border-radius:7px}
button.blue,button.green,button.teal,button.red,button.purple,button.amber,button.cyan,button.pink,button.slate,button.orange{background:linear-gradient(#ffffff60 0%,#ffffff10 48%,#00000008 50%,#00000025 100%),linear-gradient(var(--face),var(--bottom));border-color:var(--face)}
button.blue{--face:#348dfa;--bottom:#286dc3}button.green{--face:#39c829;--bottom:#2c9c1f}button.teal{--face:#21866b;--bottom:#196853}button.red{--face:#ed2536;--bottom:#b81c2a}button.purple{--face:#874bea;--bottom:#693ab6}button.amber{--face:#ffa500;--bottom:#c68000}button.cyan{--face:#00a6b9;--bottom:#008190}button.pink{--face:#dd2692;--bottom:#ac1d71}button.slate{--face:#61768b;--bottom:#4b5c6c}button.orange{--face:#ec702a;--bottom:#b85720}
button:hover{filter:none;border-color:#4085dd}button:active{transform:translateY(2px);opacity:.82}button:disabled{opacity:.45}
.desktop-button{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.desktop-icon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.line-actions{gap:1px;padding:0 3px 4px}.line-actions button{height:44px;min-height:44px;flex:none;padding:3px;font-size:12px}
.tenders button{font-size:18px}.tenders .desktop-icon{width:28px;height:28px}
.tenders button.green{--face:#2fc824;--bottom:#249c1c}.tenders button.blue{--face:#087fff;--bottom:#0663c6}.tenders button.purple{--face:#7430df;--bottom:#5a25ad}
.payment>button.cyan{--face:#187e92;--bottom:#126272;font-size:13px}
.keypad button.slate{--face:#536c83;--bottom:#405466}.keypad button[data-key="Enter"]{font-size:14px}.keypad .desktop-icon{width:28px;height:28px}
.till-footer button{flex-direction:column;gap:5px;font-size:13px;padding:2px}.till-footer button:first-child{font-size:12px}.till-footer .desktop-icon{width:26px;height:26px}
.till-header button.slate{--face:#37577a;--bottom:#2a435f}.till-header [data-action="fullscreen"]{--face:#4779aa;--bottom:#375e84}
.searchrow button{--face:#607d9d;--bottom:#4a617a;color:white;width:48px;flex:none}.searchrow .desktop-icon{width:28px;height:28px}
.modal-head .desktop-icon{width:30px;height:30px}.modal-head button{min-height:55px}
.payment>button{padding:4px;white-space:nowrap}
/* AdminTheme.cs uses a plain face and subtle raised edge, without till gloss. */
.admin button,dialog.people-dialog button{background:var(--face);border-radius:6px;box-shadow:0 2px 0 #39547024;padding:8px 12px}
/* TillButtonStyles / ProductTileAppearance: default 107px tile, 65px art row.
   The gloss belongs behind the content, not as a solid grey lower half. */
.tiles{grid-template-columns:repeat(var(--tile-columns,5),minmax(0,1fr));grid-auto-rows:107px;gap:4px;padding:2px 4px 4px;scrollbar-gutter:stable}
button.tile{background:linear-gradient(#ffffff60 0%,#ffffff10 48%,#00000008 50%,#00000025 100%),#f7fafe;padding:3px;display:grid;grid-template-rows:65px 1fr;align-items:center;justify-items:center;gap:0;min-width:0;font-weight:600;font-size:12px}
.tile img{grid-row:1;width:82px;height:66px;max-width:100%;object-fit:contain;mix-blend-mode:normal}
.tile .price{top:3px;right:3px;background:#dae7fc;padding:2px 4px;line-height:normal;font-size:12px;font-weight:600;z-index:1}
.tile>span:last-child{grid-row:2;max-width:100%;padding:0 2px;text-align:center;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* AdminWindow.cs and HeldFlowWindow.Action shared administration controls. */
.admin button{min-height:52px;font-size:15px;padding:8px 14px;color:#4b6c8d;background:#fff}
.admin button.blue{background:#287fcc;color:#fff}.admin button.teal{background:#248c76;color:#fff}.admin button.red{background:#ed2536;color:#fff}
.sidebar{padding:0 8px 8px}.sidebar .brand{height:96px;flex:none;margin:0;padding:20px 12px;font-size:18px;line-height:1.4;overflow:hidden}
.sidebar .brand small{font-size:18px;font-weight:600}
.admin-page-search{display:flex;gap:3px;margin-bottom:10px;flex:none}.admin-page-search input{min-width:0;min-height:48px;font-size:13px;padding:10px}.admin-page-search button{width:44px;min-width:44px;min-height:48px;padding:4px}
.sections{padding-top:0}.sections button{min-height:62px;font-size:16px;justify-content:flex-start;gap:9px;margin-bottom:6px;background:linear-gradient(#ffffff60,#ffffff10 48%,#00000008 50%,#00000025),#294d6b;color:#fff;box-shadow:0 2px 0 #426080}
.sections .desktop-icon{width:23px;height:23px;margin-right:7px}.sections button.active{background:linear-gradient(#ffffff60,#ffffff10 48%,#00000008 50%,#00000025),#34769f}
.sidebar>button{flex:none;min-height:56px}.sidebar>button.slate{background:#3c627f;color:white;min-height:60px}
.tabs{padding:8px 16px;gap:6px}.tabs button{min-height:52px;font-size:15px}.tabs .desktop-icon{width:20px;height:20px}
.admin-top button{min-height:48px}.admin-top{padding:8px 22px}.no-pages{color:#d5e4f0;margin:12px;font-size:14px}
.admin [hidden]{display:none!important}
@media(max-width:1199px){.sidebar .brand,.sidebar .brand small{font-size:15px}}
/* Keep branding, search, scrolling navigation and footer in separate rows. */
.sidebar{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:10px;padding:16px 10px 12px;overflow:hidden}
.sidebar .brand{height:auto;min-height:0;margin:0;padding:0 6px 4px;line-height:1.35;font-size:17px;overflow-wrap:anywhere}
.sidebar .brand small{display:block;margin-top:8px;padding:0;font-size:11px;line-height:1.3;letter-spacing:1.2px;color:#c6d8e9}
.admin-page-search{margin:0;gap:5px;min-width:0}.admin-page-search input{width:0;flex:1}.admin-page-search button{width:38px;min-width:38px}
.sections{min-height:0;overflow-y:auto;overflow-x:hidden;padding:2px 4px 3px 0;scrollbar-width:thin;scrollbar-color:#809bb1 #203d58;scrollbar-gutter:stable}
.sections button{width:100%;display:grid;grid-template-columns:25px minmax(0,1fr);gap:10px;min-height:60px;padding:10px;margin:0 0 7px;text-align:left;font-size:15px;line-height:1.35}
.sections .desktop-icon{margin:0;width:23px;height:23px}.sections button>span{min-width:0;overflow-wrap:normal;text-align:left}
.sidebar>button{margin:0;min-height:50px;font-size:14px;padding:8px}.sidebar>button.slate{min-height:50px}
@media(max-width:1199px){.sidebar{padding:12px 8px 10px;gap:8px}.sidebar .brand{font-size:15px}.sidebar .brand small{font-size:10px}.sections button{font-size:14px;gap:8px;padding:8px}}