:root{
 --bg:#06131f;--panel:#0b2134;--panel2:#0d2a43;--line:#173d5c;--text:#edf8ff;
 --muted:#88a8bd;--blue:#168cf0;--cyan:#28d7e6;--red:#ff5a67;--shadow:0 18px 50px rgba(0,0,0,.28);
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:
 radial-gradient(circle at top right,#0d3450 0,transparent 33%),
 linear-gradient(180deg,#071827,#04101a 65%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
body{min-height:100dvh}.hidden{display:none!important}
#app{max-width:720px;margin:0 auto;min-height:100dvh;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
.topbar{height:70px;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;position:sticky;top:0;z-index:20;background:rgba(6,19,31,.92);backdrop-filter:blur(15px);border-bottom:1px solid rgba(255,255,255,.05)}
.brand{height:38px;max-width:190px;object-fit:contain}.top-actions{display:flex;align-items:center;gap:8px}.pill{font-size:10px;padding:7px 9px;border-radius:999px;background:#102a3e;color:#91b3c9;border:1px solid #173c59}.pill.ok{color:#83f1bc;border-color:#1f7253;background:#0d3226}.pill.bad{color:#ff9ca6;border-color:#7e3440;background:#35151c}
.icon-btn,.ghost,.back{border:1px solid var(--line);background:#0a1d2d;color:var(--text);border-radius:12px;min-height:42px;padding:0 13px}
main{padding:16px}.view{animation:fade .18s ease}@keyframes fade{from{opacity:.2;transform:translateY(5px)}to{opacity:1;transform:none}}
.hero{min-height:220px;border:1px solid #144563;border-radius:26px;padding:25px;display:flex;align-items:flex-end;background:
 linear-gradient(180deg,rgba(2,12,20,.2),rgba(3,16,26,.92)),url('./assets/portal_hyperpos_bg.jpg') center/cover;box-shadow:var(--shadow);margin-bottom:14px}
.hero h1,.welcome h1{margin:6px 0 8px;font-size:30px;line-height:1.05}.hero p{color:#a8c5d8;line-height:1.55;margin:0}.eyebrow{font-size:10px;letter-spacing:.16em;color:#52c8ff;font-weight:800}
.panel{background:linear-gradient(180deg,#0c2336,#091b2a);border:1px solid #153d5a;border-radius:22px;padding:18px;box-shadow:var(--shadow)}
.panel h2{margin:8px 0 6px}.muted{color:var(--muted)}
label{display:block;font-size:12px;color:#a8c2d3;margin:15px 0 6px}input{width:100%;height:52px;border-radius:14px;border:1px solid #1a4665;background:#071824;color:white;padding:0 14px;font-size:16px;outline:none}input:focus{border-color:#168cf0;box-shadow:0 0 0 3px rgba(22,140,240,.16)}
button{cursor:pointer}.primary{width:100%;height:54px;margin-top:16px;border:0;border-radius:15px;background:linear-gradient(135deg,#0d7eea,#19b4f0);color:#fff;font-weight:900;letter-spacing:.03em}.danger{width:100%;height:50px;margin-top:18px;border-radius:14px;border:1px solid #833643;background:#30151b;color:#ff98a2;font-weight:800}.error{color:#ff9da7;font-size:13px;margin-top:10px;min-height:18px}
.stack{display:grid;gap:10px;margin-top:14px}.business-choice{width:100%;text-align:left;padding:14px;border-radius:15px;border:1px solid #174361;background:#0b2437;color:#fff}.business-choice b{display:block;font-size:15px}.business-choice span{display:block;color:#91afc3;font-size:12px;margin-top:4px}
.business-chip{display:flex;gap:12px;align-items:center;margin:8px 0 14px;padding:12px;border-radius:18px;background:#0b2031;border:1px solid #153e5c}.business-chip img{width:54px;height:54px;border-radius:14px;object-fit:cover}.business-chip strong,.business-chip span{display:block}.business-chip span{color:#8eacbf;font-size:12px;margin-top:3px}
.pin-panel{text-align:center}.pin-input{text-align:center;font-size:28px;letter-spacing:.35em}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}.keypad button{height:57px;border-radius:15px;border:1px solid #15445f;background:#09243a;color:white;font-size:20px;font-weight:700}
.welcome{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:5px 2px 18px}.welcome h1{font-size:24px}.portal-grid{display:grid;gap:13px}.portal-card{position:relative;overflow:hidden;display:flex;align-items:center;gap:13px;min-height:112px;padding:18px;text-align:left;border-radius:22px;border:1px solid #1b4b6b;color:white;background:#0d273b;box-shadow:var(--shadow)}
.portal-card:before{content:"";position:absolute;inset:0;opacity:.32;background-position:center;background-size:cover}.portal-card.hyperpos:before{background-image:url('./assets/portal_hyperpos_bg.jpg')}.portal-card.business:before{background-image:url('./assets/portal_business_bg.jpg')}.portal-card>*{position:relative;z-index:1}.portal-card img{width:52px;height:52px;object-fit:contain}.portal-card div{flex:1}.portal-card b{display:block;font-size:20px}.portal-card span{display:block;margin-top:5px;font-size:12px;color:#b8d3e3;line-height:1.4}.portal-card i{font-size:34px;font-style:normal}
.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.mini-stats div{padding:13px;border-radius:16px;background:#0a1d2c;border:1px solid #143950;text-align:center}.mini-stats b{display:block;font-size:22px}.mini-stats span{font-size:10px;color:#8cabbe;text-transform:uppercase;letter-spacing:.08em}
.notice{margin-top:14px;padding:14px;border-radius:16px;background:#0d2031;border:1px solid #193f59}.notice b,.notice span{display:block}.notice span{color:#8faec1;font-size:12px;margin-top:4px}
.settings-row{display:flex;justify-content:space-between;gap:10px;padding:14px 0;border-bottom:1px solid #17364b}.settings-row code{font-size:10px;color:#8fd8ff;word-break:break-all;text-align:right}
.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(30px);background:#0e2c41;border:1px solid #1e597c;color:white;border-radius:14px;padding:11px 15px;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:99;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(min-width:620px){main{padding:22px}.portal-grid{grid-template-columns:1fr 1fr}.portal-card{min-height:145px;align-items:flex-end}.hero{min-height:300px}}


/* V2.0.1 — Godot V1.9.64 mobile HYPERPOS web port */
.mobile-shell-head{display:flex;align-items:center;gap:10px;padding:2px 0 12px}
.mobile-shell-head .back{width:44px;min-width:44px;padding:0;font-size:20px}
.mobile-shell-title{flex:1;min-width:0}.mobile-shell-title h2{margin:2px 0 0;font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-shell-title small{color:var(--muted)}.live-dot{font-size:10px;color:#5ee4bf;font-weight:800}
.hp-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:12px;position:sticky;top:70px;z-index:12;background:#06131f;padding:5px 0 8px}
.hp-tabs button{height:38px;border-radius:11px;border:1px solid #153d59;background:#0a1d2c;color:#9eb8ca;font-size:10px;font-weight:800;padding:0 3px}
.hp-tabs button.active{background:#0f78cf;color:white;border-color:#1794f0}
.hp-section-head{display:flex;align-items:center;gap:8px;margin:5px 0 10px}.hp-section-head h3{margin:0;flex:1;font-size:16px}.hp-section-head small{color:var(--muted)}
.hp-refresh{width:36px;height:34px;border:1px solid #17415d;border-radius:10px;background:#0b2437;color:white}
.hp-area-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin-bottom:10px}
.hp-area-tabs button{min-height:34px;border:1px solid #173e58;background:#0a2031;color:#9cb7c9;border-radius:10px;padding:3px;font-size:9px;font-weight:800;overflow:hidden;text-overflow:ellipsis}
.hp-area-tabs button.active{background:#0e76c9;color:white;border-color:#1a9df8}
.hp-table-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hp-table-card{border:1px solid #175170;background:#0a2437;color:white;border-radius:15px;min-height:92px;text-align:left;padding:12px;display:flex;flex-direction:column;justify-content:space-between}
.hp-table-card.open{background:linear-gradient(145deg,#0d4f77,#11304a);border-color:#1c91d5}
.hp-table-card.empty{border-left:3px solid #1dc993}.hp-table-card b{font-size:15px}.hp-table-card .table-state{font-size:10px;font-weight:900;letter-spacing:.06em;color:#6be7c5}.hp-table-card.open .table-state{color:#7fd4ff}
.hp-table-card strong{font-size:17px}.hp-table-card small{color:#87a8bd;font-size:10px}
.hp-info{padding:10px 12px;border:1px solid #15435f;border-radius:13px;background:#092236;color:#94b4c9;font-size:11px;margin-top:10px}
.hp-order-head{display:flex;align-items:center;gap:8px;padding:9px;border-radius:14px;border:1px solid #183b55;background:#091f31;margin-bottom:9px}
.hp-order-head button{width:42px;height:40px;border:1px solid #17415b;background:#0c2b42;color:white;border-radius:11px}
.hp-order-title{flex:1;text-align:center}.hp-order-title b{display:block;font-size:18px}.hp-order-title small{color:#8faec1}
.hp-badge{padding:7px 9px;border-radius:9px;background:#0a3049;color:#4bd5ff;font-size:9px;font-weight:900}
.hp-order-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:8px}
.hp-order-actions button{height:35px;border-radius:10px;border:1px solid #17415d;background:#0b2436;color:#cfe9f8;font-size:9px;font-weight:800}
.hp-order-actions .danger-mini{border-color:#64343d;color:#ff9aa4}
.hp-target-row{display:grid;grid-template-columns:1fr 90px;gap:6px;margin:7px 0}.hp-target-row select{height:40px;border-radius:10px;border:1px solid #194763;background:#071925;color:white;padding:0 8px}.hp-target-row button{border:0;border-radius:10px;background:#1289e5;color:white;font-weight:800}
.hp-status-line{font-size:11px;color:#89aabe;min-height:18px;margin-bottom:8px}
.hp-menu-tools{display:grid;grid-template-columns:1fr auto;gap:6px;margin:8px 0}.hp-menu-tools input{height:42px}.hp-menu-tools button{border-radius:11px;border:1px solid #17415d;background:#0b2538;color:white;padding:0 12px}
.hp-cat-strip{display:flex;gap:6px;overflow:auto;padding-bottom:5px;scrollbar-width:none}.hp-cat-strip::-webkit-scrollbar{display:none}
.hp-cat-strip button{white-space:nowrap;height:33px;border-radius:999px;border:1px solid #17425c;background:#0a2132;color:#a6c2d3;padding:0 11px;font-size:10px}.hp-cat-strip button.active{background:#0f7ccc;color:white}
.hp-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
.hp-product{position:relative;overflow:hidden;border:1px solid #17425f;background:#0b2234;border-radius:14px;min-height:106px;text-align:left;color:white;padding:0}
.hp-product img{width:100%;height:70px;object-fit:cover;background:#0a1b29}.hp-product .pbody{padding:8px}.hp-product b{display:block;font-size:12px}.hp-product span{display:block;font-size:12px;color:#5fd1ff;margin-top:4px;font-weight:800}.hp-product em{position:absolute;right:7px;top:7px;background:#0d7fd4;color:white;border-radius:999px;min-width:25px;height:25px;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:10px;font-weight:900}
.hp-cart{margin-top:10px;border:1px solid #17435f;border-radius:15px;background:#081d2d;overflow:hidden}
.hp-cart h4{margin:0;padding:10px 12px;border-bottom:1px solid #173b55;font-size:12px}.hp-cart-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:9px 11px;border-bottom:1px solid #14344a}.hp-cart-row:last-child{border-bottom:0}.hp-cart-row b{font-size:12px}.hp-cart-row small{display:block;color:#8ba9bd;margin-top:2px}.hp-qty{display:flex;align-items:center;gap:6px}.hp-qty button{width:30px;height:30px;border:1px solid #1a4662;background:#0a2437;color:white;border-radius:9px}.hp-qty strong{min-width:18px;text-align:center}
.hp-totals{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}.hp-total-card{padding:10px;border:1px solid #17415a;border-radius:12px;background:#092235}.hp-total-card span{display:block;color:#82a4b8;font-size:9px}.hp-total-card b{font-size:17px}
.hp-save{width:100%;height:50px;border:0;border-radius:13px;background:linear-gradient(135deg,#0d7eea,#19b4f0);color:white;font-weight:900;margin-top:8px}
.hp-op-list{display:grid;gap:8px}.hp-op-card{padding:13px;border:1px solid #17435f;border-radius:14px;background:#092134}.hp-op-card b{display:block}.hp-op-card span{display:block;color:#91afc2;font-size:11px;margin-top:3px}.hp-op-card .row{display:flex;align-items:center;gap:8px}.hp-op-card .row>div{flex:1}.hp-op-card button{height:36px;border-radius:10px;border:1px solid #1a4a67;background:#0c2b41;color:white;font-weight:800}
.hp-quick-cartbar{position:sticky;bottom:0;margin-top:10px;padding:10px;border:1px solid #1b4965;border-radius:15px;background:rgba(7,25,38,.96);backdrop-filter:blur(10px)}
.hp-pay-row{display:grid;grid-template-columns:1fr 1fr;gap:7px}.hp-pay-row button{height:46px;border:0;border-radius:12px;color:white;font-weight:900}.hp-pay-row .cash{background:#127b60}.hp-pay-row .card{background:#126aa8}
@media(min-width:620px){.hp-table-grid,.hp-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hp-area-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* V2.1.0 — FULL MOBILE HYPERPOS / ACL / PAYMENT */
.hp-tabs-scroll{display:flex!important;overflow-x:auto;gap:6px;scrollbar-width:none}.hp-tabs-scroll::-webkit-scrollbar{display:none}
.hp-tabs-scroll button{flex:0 0 auto;min-width:86px;padding:0 10px}
.hp-paybox{margin-top:9px;padding:10px;border:1px solid #17435f;border-radius:14px;background:#081e2e}
.hp-paybox h4{margin:0 0 8px;font-size:11px;color:#91b4c8;letter-spacing:.08em}
.hp-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.hp-pay-grid button{height:47px;border:0;border-radius:12px;color:white;font-weight:900}
.hp-pay-grid .cash{background:#13825f}.hp-pay-grid .card{background:#126eae}
.hp-pay-grid button:disabled,.hp-order-actions button:disabled,.hp-save:disabled{opacity:.35;filter:grayscale(.6);cursor:not-allowed}
.hp-acl{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0 10px}.hp-acl span{font-size:9px;padding:5px 7px;border:1px solid #17425d;border-radius:999px;color:#8faec1;background:#081e2d}
.hp-acl span.on{color:#74e6bd;border-color:#1e6c50}.hp-acl span.off{color:#e98a94;border-color:#67313a}
.hp-line-tools{display:flex;gap:5px;margin-top:5px}.hp-line-tools button{height:25px!important;width:auto!important;padding:0 7px!important;font-size:8px!important}
.hp-line-tools button.active{background:#116da7!important;color:#fff}
.hp-note-input{height:34px!important;font-size:11px!important;margin-top:5px}
.hp-empty-lock{padding:18px;border:1px dashed #315269;border-radius:14px;color:#9bb5c7;text-align:center}

/* V42.0.2 */
.hp-qbadge{position:absolute;right:7px;top:7px;background:#0d7fd4;color:#fff;border-radius:999px;
 min-width:27px;height:27px;display:flex;align-items:center;justify-content:center;font-style:normal;
 font-size:11px;font-weight:900;box-shadow:0 3px 10px rgba(0,0,0,.25)}
.hp-qbadge[hidden]{display:none!important}
.hp-quick-lines{display:grid;gap:5px;margin:7px 0}
.hp-quick-line{display:grid;grid-template-columns:1fr auto;gap:7px;align-items:center;padding:6px 8px;
 border:1px solid #173e58;border-radius:9px;background:#071b29}
.hp-quick-line b{font-size:10px}.hp-quick-line span{font-size:10px;color:#6bd4ff}
.hp-quick-line .qctrl{display:flex;gap:4px;align-items:center}.hp-quick-line .qctrl button{
 width:27px;height:27px;border:1px solid #1a4762;border-radius:8px;background:#0a2639;color:white}
.hp-clean{height:34px;border-radius:10px;border:1px solid #6d3741;background:#35161d;color:#ff9da8;
 padding:0 10px;font-size:9px;font-weight:900}
.pin-input{-webkit-text-security:disc}

/* V42.1.0 — Mobile Business */
.biz-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 12px}
.biz-summary div{padding:12px 8px;border:1px solid #17415d;border-radius:14px;background:#092033;text-align:center}
.biz-summary b{display:block;font-size:21px}.biz-summary span{display:block;margin-top:3px;color:#8faec1;font-size:9px;text-transform:uppercase}
.biz-grid{display:grid;gap:8px}
.biz-card{display:flex;align-items:center;gap:11px;width:100%;min-height:72px;padding:12px;border-radius:16px;
 border:1px solid #17425e;background:linear-gradient(145deg,#0b2437,#081b2a);color:white;text-align:left}
.biz-card .biz-ico{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#0d314a;font-size:22px}
.biz-card div{flex:1}.biz-card b{display:block;font-size:14px}.biz-card small{display:block;color:#8eacbf;margin-top:3px}
.biz-card i{font-size:24px;font-style:normal}.biz-card[hidden]{display:none!important}
.biz-content{margin-top:10px;padding:12px;border:1px solid #17425f;border-radius:16px;background:#081d2c}
.biz-content-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}.biz-content-head h3{margin:0;flex:1;font-size:15px}
.biz-list{display:grid;gap:7px}.biz-row{padding:10px;border:1px solid #153b55;border-radius:12px;background:#0a2132}
.biz-row b{display:block;font-size:12px}.biz-row span{display:block;color:#8baabd;font-size:10px;margin-top:3px}
.biz-open-panel{width:100%;height:44px;border:0;border-radius:12px;background:#0f7ccc;color:#fff;font-weight:900;margin-top:10px}

/* V42.1.1 — BUSINESS LIVE DATA */
.biz-profile{display:grid;grid-template-columns:64px 1fr;gap:11px;align-items:center;padding:11px;
 border:1px solid #17425f;border-radius:15px;background:#091f30;margin-bottom:10px}
.biz-profile img{width:64px;height:64px;border-radius:14px;object-fit:cover;background:#0b2a40}
.biz-profile h3{margin:0;font-size:16px}.biz-profile p{margin:4px 0 0;color:#8eacbf;font-size:11px;line-height:1.4}
.biz-kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-bottom:10px}
.biz-kpi{padding:10px;border:1px solid #153c56;border-radius:12px;background:#081e2d}
.biz-kpi span{display:block;color:#82a5ba;font-size:9px;text-transform:uppercase}.biz-kpi b{display:block;margin-top:3px;font-size:15px}
.biz-row-grid{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.biz-row .tag{display:inline-block;margin-top:5px;padding:4px 7px;border-radius:999px;background:#0c314a;color:#69d6ff;font-size:8px;font-weight:900}
.biz-price{font-weight:900;color:#62d8ff}
.biz-bad{color:#ff9ca5}.biz-good{color:#75e3bc}
.biz-muted{color:#89aabd}

/* V42.1.2 — BUSINESS ACCORDION SUBMENUS */
.biz-menu-wrap{display:grid;gap:6px}
.biz-menu-group{display:grid;gap:6px}
.biz-menu-group>.biz-card{margin:0}
.biz-card.open{border-color:#1a8fd3;background:linear-gradient(145deg,#0c2c43,#092235)}
.biz-card.open i{transform:rotate(90deg)}
.biz-card i{transition:transform .18s ease}
.biz-submenu{display:none;padding:6px 0 2px 12px;margin-left:20px;border-left:2px solid #12415e;gap:6px}
.biz-submenu.open{display:grid}
.biz-subitem{width:100%;min-height:47px;display:flex;align-items:center;gap:9px;padding:8px 10px;
 border:1px solid #153d58;border-radius:12px;background:#081d2c;color:#dff5ff;text-align:left}
.biz-subitem:active{transform:scale(.99)}
.biz-subitem .sub-ico{width:30px;height:30px;display:flex;align-items:center;justify-content:center;
 border-radius:9px;background:#0c3149;font-size:15px}
.biz-subitem div{flex:1}.biz-subitem b{display:block;font-size:11px}.biz-subitem small{display:block;color:#7f9fb4;font-size:9px;margin-top:2px}
.biz-subitem em{font-style:normal;color:#5bcfff;font-size:16px}
.biz-subitem.panel-link{border-color:#23526d;background:#0b2638}
.biz-subitem.public-link{border-color:#315f4d;background:#0b2a22}
.biz-section-note{font-size:9px;color:#7597ad;margin:3px 0 1px 12px}

/* V42.1.3 — BUSINESS NESTED SUBMENUS */
.biz-subitem-wrap{display:grid;gap:5px}
.biz-subitem.has-children em{transition:transform .18s ease}
.biz-subitem.has-children.open{border-color:#1b77a8;background:#0a2940}
.biz-subitem.has-children.open em{transform:rotate(90deg)}
.biz-subsubmenu{display:none;margin-left:28px;padding-left:9px;border-left:1px solid #1c4b67;gap:5px}
.biz-subsubmenu.open{display:grid}
.biz-subsubitem{width:100%;min-height:42px;display:flex;align-items:center;gap:8px;padding:7px 9px;
 border:1px solid #15384f;border-radius:10px;background:#071a28;color:#d9f2ff;text-align:left}
.biz-subsubitem .sub2-ico{width:27px;height:27px;display:flex;align-items:center;justify-content:center;
 border-radius:8px;background:#0b2c42;font-size:13px}
.biz-subsubitem div{flex:1}.biz-subsubitem b{display:block;font-size:10px}.biz-subsubitem small{display:block;color:#7495aa;font-size:8px;margin-top:2px}
.biz-subsubitem em{font-style:normal;color:#4fc9ff;font-size:14px}
.biz-subsubitem.panel-link{border-color:#244d66;background:#0a2334}
.biz-subsubitem.public-link{border-color:#315f4d;background:#0a281f}

/* V42.2.0 — TABLE AGE COLORS + LONG PRESS ACTION MENU */
.hp-table-card{position:relative;overflow:hidden}
.hp-table-card.age-blue{border-color:#1f79c9;background:linear-gradient(145deg,#0d3152,#0a243b)}
.hp-table-card.age-green{border-color:#1b8b68;background:linear-gradient(145deg,#0c3f34,#092b25)}
.hp-table-card.age-yellow{border-color:#b59624;background:linear-gradient(145deg,#4b4314,#2c2a0d)}
.hp-table-card.age-red{border-color:#a93b46;background:linear-gradient(145deg,#4a1720,#2c1016)}
.hp-table-card.empty{border-left:3px solid #1dc993}
.hp-table-minutes{position:absolute;right:8px;bottom:7px;padding:4px 7px;border-radius:999px;
 background:rgba(0,0,0,.26);backdrop-filter:blur(4px);font-size:9px;font-weight:900;color:#fff}
.hp-table-card.empty .hp-table-minutes{display:none}
.hp-longpress-tip{font-size:9px;color:#7697ac;margin-top:6px;text-align:center}
.hp-action-sheet-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:150;display:flex;
 align-items:flex-end;justify-content:center;padding:12px}
.hp-action-sheet{width:min(100%,520px);background:#081c2a;border:1px solid #1d4a66;border-radius:20px 20px 14px 14px;
 box-shadow:0 -12px 40px rgba(0,0,0,.35);padding:12px;animation:sheetUp .16s ease}
@keyframes sheetUp{from{transform:translateY(30px);opacity:.2}to{transform:none;opacity:1}}
.hp-action-sheet h4{margin:2px 2px 9px;font-size:14px}.hp-action-sheet p{margin:0 2px 10px;color:#82a3b8;font-size:10px}
.hp-action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}
.hp-action-grid button{height:48px;border-radius:12px;border:1px solid #17425d;background:#0a2639;color:#fff;font-weight:900;font-size:11px}
.hp-action-grid button.warn{border-color:#6e5c23;background:#312a0d;color:#ffd86a}
.hp-action-grid button.danger{border-color:#743640;background:#34151c;color:#ff9aa5}
.hp-action-cancel{width:100%;height:44px;margin-top:8px;border-radius:12px;border:1px solid #23485e;background:#0a1f2d;color:#9cb8c9;font-weight:800}


/* =========================================================
   V42.3.0 — QRAVM PREMIUM MOBILE UI
   Visual-only skin. Existing IDs, API flow, ACL and operations stay intact.
   ========================================================= */
:root{
  --bg:#050b13;
  --panel:#0b1724;
  --panel2:#101f2f;
  --line:#1d3144;
  --text:#f7fbff;
  --muted:#8fa4b7;
  --blue:#1b8cff;
  --cyan:#35d6ff;
  --red:#ff3d67;
  --shadow:0 22px 60px rgba(0,0,0,.38);
  --premium-glow:0 0 0 1px rgba(255,255,255,.035),0 18px 48px rgba(0,0,0,.34);
}
html,body{
  background:
    radial-gradient(circle at 18% -5%,rgba(255,49,91,.16),transparent 28%),
    radial-gradient(circle at 92% 5%,rgba(25,121,255,.14),transparent 31%),
    linear-gradient(180deg,#07101b 0%,#040910 70%,#03070c 100%);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:26px 26px;
}
#app{max-width:760px}
.topbar{
  height:72px;padding:11px 16px;
  background:rgba(5,11,19,.82);
  border-bottom:1px solid rgba(255,255,255,.07);
  box-shadow:0 10px 35px rgba(0,0,0,.22);
}
.brand{height:40px;filter:drop-shadow(0 5px 14px rgba(0,0,0,.35))}
.pill{background:rgba(15,30,44,.88);border-color:#223b50;box-shadow:inset 0 1px rgba(255,255,255,.03)}
.pill.ok{background:rgba(10,48,36,.88);border-color:#216b50}
.icon-btn,.ghost,.back{
  background:linear-gradient(180deg,#111f2d,#0a141e);border-color:#263b4d;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 7px 18px rgba(0,0,0,.18)
}
main{padding:14px 14px 22px}
.view{animation:premiumFade .22s ease}
@keyframes premiumFade{from{opacity:.25;transform:translateY(7px) scale(.995)}to{opacity:1;transform:none}}

.hero{
  min-height:245px;border-radius:28px;padding:25px 22px;border:1px solid rgba(255,255,255,.09);
  background:
    linear-gradient(180deg,rgba(4,8,13,.08),rgba(4,10,16,.92)),
    linear-gradient(120deg,rgba(255,43,83,.22),transparent 46%),
    url('./assets/portal_hyperpos_bg.jpg') center/cover;
  box-shadow:0 25px 70px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.06);
}
.hero h1,.welcome h1{letter-spacing:-.035em}
.hero h1{font-size:32px;max-width:430px}
.hero p{color:#b4c3cf;font-size:13px;max-width:520px}
.eyebrow{color:#ff5c7d;font-weight:900;letter-spacing:.19em}
.panel{
  border-radius:24px;padding:19px;
  background:linear-gradient(180deg,rgba(15,29,43,.97),rgba(8,17,27,.98));
  border:1px solid rgba(255,255,255,.08);box-shadow:var(--premium-glow)
}
input{
  height:54px;border-radius:15px;border-color:#263b4d;background:#07111b;
  box-shadow:inset 0 2px 8px rgba(0,0,0,.2)
}
input:focus{border-color:#ff4f72;box-shadow:0 0 0 3px rgba(255,61,103,.12)}
.primary,.hp-save{
  background:linear-gradient(135deg,#ff315e,#ff526f 58%,#f82754);
  box-shadow:0 12px 28px rgba(255,49,94,.22),inset 0 1px rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.08)
}
.primary:active,.hp-save:active{transform:translateY(1px);filter:brightness(.96)}
.business-chip{
  background:linear-gradient(135deg,#111f2d,#0a151f);border-color:#273a4b;
  box-shadow:var(--premium-glow)
}
.business-chip img{border-radius:16px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.pin-panel{padding:22px 18px}
.pin-input{height:62px;background:#050d15;border-color:#2b4052}
.keypad{gap:10px}
.keypad button{
  height:60px;border-radius:18px;background:linear-gradient(180deg,#122333,#0b1722);
  border-color:#294155;box-shadow:inset 0 1px rgba(255,255,255,.04),0 7px 16px rgba(0,0,0,.16)
}
.keypad button:active{background:#ff3d67;border-color:#ff6684;transform:scale(.98)}

.welcome{
  align-items:center;margin:4px 2px 12px;padding:5px 2px 10px;
  border-bottom:1px solid rgba(255,255,255,.055)
}
.welcome h1{font-size:25px}
.premium-intro{
  margin:4px 1px 13px;padding:15px 16px;border-radius:18px;
  background:linear-gradient(135deg,rgba(255,47,91,.11),rgba(18,36,53,.86) 58%,rgba(25,118,255,.08));
  border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 1px rgba(255,255,255,.03)
}
.premium-intro span,.premium-intro strong,.premium-intro small{display:block}
.premium-kicker{font-size:8px;letter-spacing:.18em;color:#ff6481;font-weight:900}
.premium-intro strong{font-size:17px;margin-top:4px;letter-spacing:-.02em}
.premium-intro small{font-size:10px;color:#8ea5b8;margin-top:4px}

.portal-grid{gap:11px}
.portal-card{
  min-height:126px;padding:17px;border-radius:24px;border:1px solid rgba(255,255,255,.085);
  background:#0c1722;box-shadow:0 18px 42px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.045);
  transition:transform .15s ease,border-color .15s ease,filter .15s ease
}
.portal-card:active{transform:scale(.985);filter:brightness(1.08)}
.portal-card:before{opacity:.34;filter:saturate(.9) contrast(1.08)}
.portal-card:after{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(90deg,rgba(5,10,15,.9) 0%,rgba(5,10,15,.57) 58%,rgba(5,10,15,.14) 100%)
}
.portal-card.hyperpos{border-color:rgba(255,61,103,.28)}
.portal-card.business{border-color:rgba(42,154,255,.25)}
.portal-card img{
  width:58px;height:58px;padding:8px;border-radius:18px;background:rgba(4,10,16,.72);
  border:1px solid rgba(255,255,255,.09);box-shadow:0 10px 25px rgba(0,0,0,.28)
}
.portal-card b{font-size:21px;letter-spacing:-.02em}
.portal-card span{color:#b6c5d0;font-size:11px}
.portal-card i{opacity:.82}
.portal-badge{
  display:inline-block!important;margin-bottom:4px;padding:4px 7px;border-radius:999px;
  font-size:7px!important;line-height:1!important;letter-spacing:.14em;font-style:normal;font-weight:900;
  color:#fff!important;background:rgba(255,61,103,.86)!important;border:1px solid rgba(255,255,255,.12)
}
.portal-card.business .portal-badge{background:rgba(27,140,255,.82)!important}

.mini-stats{gap:8px;margin-top:11px}
.mini-stats div{
  padding:13px 7px;border-radius:17px;background:linear-gradient(180deg,#0d1a26,#08111a);
  border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 1px rgba(255,255,255,.025)
}
.mini-stats b{font-size:23px}.mini-stats span{font-size:8px;color:#8197a9}

.mobile-shell-head{
  position:relative;margin:-2px -2px 8px;padding:9px 4px 14px;
  border-bottom:1px solid rgba(255,255,255,.06)
}
.mobile-shell-title h2{font-size:21px;letter-spacing:-.025em}
.live-dot{
  padding:6px 8px;border-radius:999px;background:rgba(16,70,52,.42);
  border:1px solid #205d48;color:#70e5b9;font-size:8px
}
.hp-tabs{
  top:72px;margin:0 -14px 12px;padding:8px 14px 10px;
  background:linear-gradient(180deg,rgba(5,11,19,.98),rgba(5,11,19,.9));
  border-bottom:1px solid rgba(255,255,255,.055);backdrop-filter:blur(16px)
}
.hp-tabs-scroll{gap:7px!important}
.hp-tabs button{
  height:40px!important;min-width:88px!important;border-radius:13px!important;
  background:#0c1823!important;border-color:#22384b!important;color:#8ea4b5!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025)
}
.hp-tabs button.active{
  color:#fff!important;border-color:#ff5878!important;
  background:linear-gradient(135deg,#ff315e,#e72f58)!important;
  box-shadow:0 8px 20px rgba(255,49,94,.18)
}
.hp-section-head{margin:8px 1px 11px}
.hp-section-head h3{font-size:17px;letter-spacing:-.02em}
.hp-refresh{background:#101e2b;border-color:#293f52;border-radius:12px}
.hp-area-tabs{gap:6px}
.hp-area-tabs button{
  min-height:36px;border-radius:12px;background:#0c1823;border-color:#23394b;color:#8da3b4
}
.hp-area-tabs button.active{
  background:linear-gradient(135deg,#ff315e,#ec355d);border-color:#ff5a79;color:#fff
}

.hp-table-grid{gap:9px}
.hp-table-card{
  min-height:105px;border-radius:18px;padding:13px;
  box-shadow:0 12px 28px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.035);
  transition:transform .12s ease,filter .12s ease
}
.hp-table-card:active{transform:scale(.98);filter:brightness(1.07)}
.hp-table-card.empty{
  border:1px solid #1f493d;border-left:3px solid #25d497;
  background:linear-gradient(145deg,#0c201c,#091612)
}
.hp-table-card.age-blue{border-color:#286ca7;background:linear-gradient(145deg,#102c47,#0a1b2c)}
.hp-table-card.age-green{border-color:#24725c;background:linear-gradient(145deg,#0d3028,#091c18)}
.hp-table-card.age-yellow{border-color:#8c782c;background:linear-gradient(145deg,#373313,#201e0d)}
.hp-table-card.age-red{border-color:#a63a50;background:linear-gradient(145deg,#411722,#261019)}
.hp-table-card b{font-size:16px}
.hp-table-card strong{font-size:18px;letter-spacing:-.02em}
.hp-table-minutes{right:9px;bottom:8px;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.08)}
.hp-info{border-color:#263d4f;background:#0a1722;border-radius:15px}
.hp-longpress-tip{color:#6f8799}

.hp-order-head{
  padding:10px;border-radius:17px;border-color:#263c4f;background:linear-gradient(180deg,#0e1c29,#09141e);
  box-shadow:var(--premium-glow)
}
.hp-order-head button{border-radius:13px;background:#111f2d;border-color:#2b4255}
.hp-order-title b{font-size:19px}
.hp-badge{border-radius:999px;background:rgba(255,61,103,.13);color:#ff7892;border:1px solid rgba(255,61,103,.24)}
.hp-order-actions{gap:6px}
.hp-order-actions button{
  height:38px;border-radius:12px;background:#0d1b27;border-color:#273e51;color:#c8d5df
}
.hp-order-actions .danger-mini{background:#281219;border-color:#713141;color:#ff8fa4}
.hp-menu-tools input{height:44px}
.hp-menu-tools button{border-radius:13px;background:#101f2c;border-color:#294155}
.hp-cat-strip{gap:7px;padding:2px 0 7px}
.hp-cat-strip button{
  height:35px;border-radius:999px;background:#0d1a25;border-color:#263c4e;color:#91a7b8
}
.hp-cat-strip button.active{background:#ff3d67;border-color:#ff6684;color:#fff}

.hp-product-grid{gap:10px}
.hp-product{
  min-height:128px;border-radius:18px;background:linear-gradient(180deg,#101d29,#09131d);
  border-color:#263b4d;box-shadow:0 12px 26px rgba(0,0,0,.22)
}
.hp-product:active{transform:scale(.985)}
.hp-product img{height:82px;background:#071019}
.hp-product .pbody{padding:9px}
.hp-product b{font-size:12px;line-height:1.25}
.hp-product span{color:#ff6684;font-size:12px}
.hp-product em,.hp-qbadge{
  background:linear-gradient(135deg,#ff315e,#ff5c79);box-shadow:0 5px 14px rgba(255,49,94,.3)
}

.hp-cart,.hp-paybox,.hp-quick-cartbar{
  border-color:#263d50;background:rgba(8,17,26,.96);border-radius:18px;
  box-shadow:0 15px 34px rgba(0,0,0,.24)
}
.hp-cart h4{border-color:#223749;padding:11px 12px}
.hp-cart-row{border-color:#1e3141;padding:10px 11px}
.hp-qty button{border-color:#2a4255;background:#101f2d;border-radius:10px}
.hp-total-card{border-color:#263e51;background:#0d1b28;border-radius:14px}
.hp-pay-grid button,.hp-pay-row button{border-radius:14px;box-shadow:0 8px 18px rgba(0,0,0,.16)}
.hp-pay-grid .cash,.hp-pay-row .cash{background:linear-gradient(135deg,#16845f,#18a875)}
.hp-pay-grid .card,.hp-pay-row .card{background:linear-gradient(135deg,#126da9,#198ed5)}
.hp-op-card{
  border-color:#263d50;border-radius:17px;background:linear-gradient(180deg,#0e1d2a,#09151f);
  box-shadow:0 10px 24px rgba(0,0,0,.18)
}
.hp-op-card button{border-radius:12px;background:#102131;border-color:#2a4458}

.biz-summary{gap:8px}
.biz-summary div{
  padding:13px 7px;border-radius:17px;border-color:rgba(255,255,255,.07);
  background:linear-gradient(180deg,#0d1b28,#08121b);box-shadow:inset 0 1px rgba(255,255,255,.025)
}
.biz-summary b{font-size:22px}.biz-summary span{font-size:8px}
.biz-menu-wrap,.biz-grid{gap:8px}
.biz-card{
  min-height:76px;border-radius:18px;padding:12px;
  border-color:#263d4f;background:linear-gradient(145deg,#101f2d,#09151f);
  box-shadow:0 10px 25px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.03)
}
.biz-card:active{transform:scale(.99)}
.biz-card .biz-ico{
  width:44px;height:44px;border-radius:14px;background:linear-gradient(145deg,#182b3c,#0f1f2d);
  border:1px solid rgba(255,255,255,.055)
}
.biz-card.open{border-color:#ff5878;background:linear-gradient(145deg,#24131b,#101b28)}
.biz-submenu{border-left-color:#4a2a38}
.biz-subitem,.biz-subsubitem{
  border-color:#263c4e;background:#0b1823;border-radius:13px
}
.biz-subitem.has-children.open{border-color:#ff5878;background:#21131a}
.biz-subitem .sub-ico,.biz-subsubitem .sub2-ico{background:#132636}
.biz-content{
  border-color:#263d50;border-radius:18px;background:linear-gradient(180deg,#0d1b28,#08131d);
  box-shadow:var(--premium-glow)
}
.biz-row,.biz-kpi,.biz-profile{border-color:#243b4d;background:#0b1823;border-radius:14px}
.biz-open-panel{background:linear-gradient(135deg,#ff315e,#ef355d);border-radius:14px}

.hp-action-sheet-backdrop{background:rgba(0,0,0,.68);backdrop-filter:blur(4px)}
.hp-action-sheet{
  border-color:#2c4356;border-radius:26px 26px 18px 18px;padding:14px;
  background:linear-gradient(180deg,#101f2d,#07111a);box-shadow:0 -20px 60px rgba(0,0,0,.48)
}
.hp-action-grid{gap:8px}
.hp-action-grid button{height:52px;border-radius:15px;background:#10202e;border-color:#2b4357}
.hp-action-grid button.warn{background:#322910}
.hp-action-grid button.danger{background:#32131c}
.hp-action-cancel{height:47px;border-radius:15px;background:#0c1823;border-color:#2a4052}

.toast{
  background:rgba(14,28,41,.96);border-color:#30485b;border-radius:16px;
  box-shadow:0 14px 35px rgba(0,0,0,.34);backdrop-filter:blur(14px)
}

@media(max-width:380px){
  main{padding-left:11px;padding-right:11px}
  .hero{padding:21px 18px}.hero h1{font-size:28px}
  .portal-card{padding:14px;min-height:118px}
  .portal-card img{width:52px;height:52px}
  .portal-card b{font-size:19px}
}
@media(min-width:620px){
  main{padding:22px}
  .portal-card{min-height:158px}
  .hp-table-card{min-height:116px}
}


/* =========================================================
   V42.3.1 — PERFORMANCE PASS
   Ağır blur/shadow/animation katmanları azaltıldı.
   Premium renk dili korunur, düşük/orta Android cihazlarda daha akıcıdır.
   ========================================================= */
body:before{display:none!important}
.view{animation:none!important}
.topbar,.hp-tabs,.hp-table-minutes,.hp-quick-cartbar,.toast,.hp-action-sheet-backdrop{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.portal-card,.panel,.business-chip,.hp-table-card,.hp-product,.hp-cart,.hp-paybox,
.hp-quick-cartbar,.hp-op-card,.biz-card,.biz-content,.hp-action-sheet{
  box-shadow:0 5px 14px rgba(0,0,0,.18)!important;
}
.portal-card,.hp-table-card,.hp-product,.biz-card,.primary,.hp-save,.keypad button{
  transition:none!important;
}
.portal-card:active,.hp-table-card:active,.hp-product:active,.biz-card:active{
  transform:none!important;
}
.hero{
  box-shadow:0 8px 22px rgba(0,0,0,.22)!important;
}
.topbar{
  box-shadow:0 2px 8px rgba(0,0,0,.16)!important;
}
.hp-tabs{
  background:#050b13!important;
}
.hp-action-sheet-backdrop{
  background:rgba(0,0,0,.62)!important;
}
.hp-action-sheet{
  box-shadow:0 -8px 24px rgba(0,0,0,.28)!important;
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}


/* =========================================================
   V42.4.0 — QRAVM MOBILE MASTER UI
   Approved visual direction from the final mockup.
   Lightweight: no expensive backdrop blur / heavy animation.
   ========================================================= */

:root{
  --m-bg:#05101a;
  --m-bg2:#071723;
  --m-card:#0c1c29;
  --m-card2:#102434;
  --m-line:#1f3a4d;
  --m-text:#f7fbff;
  --m-muted:#8ba1b4;
  --m-red:#ff315d;
  --m-red2:#e8214e;
  --m-blue:#0b86ff;
  --m-green:#16a673;
  --m-yellow:#d99b19;
  --m-shadow:0 7px 18px rgba(0,0,0,.18);
}

html,body{
  background:linear-gradient(180deg,#06111b 0%,#040b12 65%,#03070c 100%)!important;
  color:var(--m-text)!important;
}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
#app{max-width:760px;margin:0 auto}
main{padding:12px 12px 24px!important}

/* header */
.topbar{
  height:66px!important;
  padding:9px 13px!important;
  background:#06111b!important;
  border-bottom:1px solid #132638!important;
  box-shadow:none!important;
}
.brand{height:36px!important}
.icon-btn,.ghost,.back{
  background:#0b1a27!important;
  border:1px solid #20384a!important;
  color:#fff!important;
  border-radius:13px!important;
  box-shadow:none!important;
}
.pill{
  background:#0b1a27!important;
  border:1px solid #20384a!important;
  color:#a9bdcb!important;
}
.pill.ok{
  background:#0b2c22!important;
  border-color:#1b674e!important;
  color:#73e0b5!important;
}

/* HOME / role select */
.master-home-hero{
  min-height:250px;
  padding:28px 20px 22px;
  border-radius:26px;
  border:1px solid #1d3447;
  background:
    linear-gradient(180deg,rgba(5,13,20,.18),rgba(5,13,20,.94)),
    linear-gradient(135deg,rgba(255,49,93,.16),transparent 46%),
    url('./assets/portal_hyperpos_bg.jpg') center/cover no-repeat;
  box-shadow:var(--m-shadow);
}
.master-logo-lockup{display:flex;align-items:center;gap:10px}
.master-mark{
  width:52px;height:52px;border-radius:17px;
  display:flex;align-items:center;justify-content:center;
  font-size:28px;font-weight:1000;
  background:linear-gradient(145deg,#ff315d,#d81746);
  box-shadow:0 7px 16px rgba(255,49,93,.20);
}
.master-logo-lockup strong{display:block;font-size:25px;letter-spacing:.02em}
.master-logo-lockup small{display:block;font-size:10px;color:#a8bac7;margin-top:2px}
.master-script{
  margin:24px 0 14px 6px;
  color:#fff3dc;font-family:"Segoe Print","Comic Sans MS",cursive;
  font-size:18px;line-height:1.25;transform:rotate(-4deg)
}
.master-home-hero h1{margin:0;font-size:33px;letter-spacing:-.035em}
.master-home-hero p{margin:5px 0 0;color:#bdc9d2;font-size:12px}

.master-portal-grid{margin-top:12px!important}
.portal-grid{display:grid!important;gap:10px!important}
.portal-card{
  min-height:112px!important;
  padding:14px!important;
  border-radius:20px!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.portal-card:after{background:linear-gradient(90deg,rgba(5,11,18,.93),rgba(5,11,18,.58) 62%,rgba(5,11,18,.10))!important}
.portal-card.hyperpos{
  border:1px solid #ff4268!important;
  background:#0b1722!important;
}
.portal-card.business{
  border:1px solid #198cff!important;
  background:#0b1722!important;
}
.portal-card img{
  width:52px!important;height:52px!important;border-radius:15px!important;
  background:#0b1620!important;padding:7px!important;border:1px solid #253849!important
}
.portal-card b{font-size:20px!important}
.portal-card span{font-size:10px!important;color:#afc0cc!important}
.portal-badge{
  margin-bottom:3px!important;padding:3px 6px!important;
  font-size:7px!important;background:#ff315d!important
}
.portal-card.business .portal-badge{background:#0b86ff!important}
.mini-stats{display:none!important}
.master-benefits{
  display:grid;grid-template-columns:repeat(3,1fr);gap:6px;
  margin:15px 0 4px;padding:11px 5px;border-top:1px solid #132638
}
.master-benefits span{text-align:center;font-size:10px;color:#9bb0bf}
.master-benefits b{display:block;margin-top:2px;color:#eaf4fb;font-size:10px}
.master-version{text-align:center;color:#556d80;font-size:8px;margin-top:4px}

/* PIN / login */
.panel,.pin-panel{
  background:#0b1a27!important;
  border:1px solid #1f394d!important;
  border-radius:21px!important;
  box-shadow:none!important;
}
input,.pin-input{
  background:#07131d!important;
  border:1px solid #294154!important;
  color:#fff!important;
  border-radius:14px!important;
  box-shadow:none!important;
}
.primary,.hp-save{
  background:linear-gradient(135deg,#ff315d,#e71f4e)!important;
  border:none!important;border-radius:14px!important;
  box-shadow:none!important
}
.keypad{gap:8px!important}
.keypad button{
  height:56px!important;border-radius:15px!important;
  background:#102333!important;border:1px solid #29465c!important;
  box-shadow:none!important;color:#fff!important
}

/* Generic mobile shell */
.mobile-shell-head{
  padding:8px 2px 12px!important;
  border-bottom:1px solid #132638!important;
}
.mobile-shell-title h2{font-size:20px!important}
.live-dot{
  background:#0a2c21!important;border:1px solid #1b614b!important;
  color:#69dbaa!important;border-radius:999px!important
}

/* bottom-style HYPERPOS nav */
.hp-tabs{
  position:sticky!important;top:66px!important;
  margin:0 -12px 10px!important;padding:7px 12px 8px!important;
  background:#06111b!important;border-bottom:1px solid #132638!important;
}
.hp-tabs-scroll{gap:6px!important}
.hp-tabs button{
  min-width:78px!important;height:37px!important;
  border-radius:12px!important;background:#0c1c29!important;
  border:1px solid #20394c!important;color:#839bad!important;
}
.hp-tabs button.active{
  background:#ff315d!important;border-color:#ff315d!important;color:#fff!important;
  box-shadow:none!important
}

/* Tables exactly like approved master */
.hp-area-tabs{gap:6px!important}
.hp-area-tabs button{
  min-height:34px!important;border-radius:11px!important;
  background:#0c1c29!important;border:1px solid #203a4d!important;color:#9db0be!important
}
.hp-area-tabs button.active{
  background:#ff315d!important;border-color:#ff315d!important;color:#fff!important
}
.hp-table-grid{gap:8px!important}
.hp-table-card{
  min-height:98px!important;border-radius:17px!important;
  padding:12px!important;box-shadow:none!important
}
.hp-table-card.empty{
  background:#0b1925!important;border:1px solid #20384a!important
}
.hp-table-card.age-blue{
  background:linear-gradient(145deg,#087ce9,#0a66be)!important;border:1px solid #2297ff!important
}
.hp-table-card.age-green{
  background:linear-gradient(145deg,#159469,#0b6f4f)!important;border:1px solid #23b987!important
}
.hp-table-card.age-yellow{
  background:linear-gradient(145deg,#bb7b13,#8d5f12)!important;border:1px solid #e0a632!important
}
.hp-table-card.age-red{
  background:linear-gradient(145deg,#d52d4a,#a51f38)!important;border:1px solid #ff526f!important
}
.hp-table-card b{font-size:17px!important}
.hp-table-card strong{font-size:15px!important}
.hp-table-card small{font-size:9px!important}
.hp-table-minutes{
  background:rgba(0,0,0,.20)!important;border:none!important;
  font-size:9px!important;padding:3px 6px!important
}

/* table editor / menu */
.hp-order-head{
  background:#0c1c29!important;border:1px solid #20394c!important;border-radius:15px!important;
  box-shadow:none!important
}
.hp-order-title b{font-size:18px!important}
.hp-badge{
  background:#301421!important;border:1px solid #6f2940!important;color:#ff7892!important
}
.hp-order-actions{gap:5px!important}
.hp-order-actions button{
  height:36px!important;border-radius:11px!important;background:#0c1c29!important;
  border:1px solid #203a4d!important;color:#c4d0d9!important
}
.hp-order-actions .danger-mini{background:#2b1119!important;border-color:#6f2d3c!important;color:#ff8da1!important}
.hp-menu-tools input{height:42px!important}
.hp-cat-strip button{
  height:32px!important;border-radius:999px!important;
  background:#0b1925!important;border:1px solid #20394c!important;color:#9db0bf!important
}
.hp-cat-strip button.active{background:#ff315d!important;border-color:#ff315d!important;color:#fff!important}
.hp-product-grid{gap:8px!important}
.hp-product{
  min-height:118px!important;border-radius:16px!important;background:#0c1c29!important;
  border:1px solid #20394c!important;box-shadow:none!important
}
.hp-product img{height:78px!important;background:#07121b!important}
.hp-product .pbody{padding:8px!important}
.hp-product b{font-size:11px!important}
.hp-product span{font-size:11px!important;color:#ff6b86!important}
.hp-qbadge,.hp-product em{background:#ff315d!important;box-shadow:none!important}

/* cart / payments */
.hp-cart,.hp-paybox,.hp-quick-cartbar{
  background:#0b1925!important;border:1px solid #20394c!important;
  border-radius:16px!important;box-shadow:none!important
}
.hp-cart-row{border-color:#193143!important}
.hp-qty button{background:#102333!important;border-color:#29465c!important}
.hp-total-card{background:#102333!important;border:1px solid #29465c!important}
.hp-pay-grid button,.hp-pay-row button{border-radius:12px!important;box-shadow:none!important}
.hp-pay-grid .cash,.hp-pay-row .cash{background:#16885f!important}
.hp-pay-grid .card,.hp-pay-row .card{background:#0b86d8!important}

/* quick sale */
.hp-section-head h3{font-size:18px!important}
.hp-refresh{background:#0c1c29!important;border:1px solid #20394c!important}
.hp-op-card{
  background:#0c1c29!important;border:1px solid #20394c!important;
  border-radius:15px!important;box-shadow:none!important
}

/* business */
.biz-summary div,.biz-card,.biz-content,.biz-row,.biz-kpi,.biz-profile{
  background:#0b1925!important;border:1px solid #20394c!important;box-shadow:none!important
}
.biz-card{border-radius:16px!important}
.biz-card .biz-ico{background:#102333!important;border:1px solid #29465c!important}
.biz-card.open{background:#20131a!important;border-color:#ff315d!important}
.biz-subitem,.biz-subsubitem{
  background:#0a1722!important;border:1px solid #20394c!important;border-radius:12px!important
}
.biz-open-panel{background:#ff315d!important;border-radius:12px!important}

/* action sheet */
.hp-action-sheet-backdrop{background:rgba(0,0,0,.64)!important}
.hp-action-sheet{
  background:#0a1722!important;border:1px solid #29465c!important;
  border-radius:22px 22px 14px 14px!important;box-shadow:none!important
}
.hp-action-grid button{
  background:#102333!important;border:1px solid #29465c!important;border-radius:13px!important
}
.hp-action-grid button.warn{background:#392b10!important}
.hp-action-grid button.danger{background:#34131c!important}
.hp-action-cancel{background:#0b1925!important;border:1px solid #20394c!important}

/* settings */
.settings-row{border-color:#193143!important}
.danger{
  background:#31131a!important;border:1px solid #743341!important;color:#ff9bad!important;border-radius:13px!important
}

/* light performance contract */
*,*:before,*:after{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.view,.portal-card,.hp-table-card,.hp-product,.biz-card{
  animation:none!important;transition:none!important
}
.toast{background:#0d1c29!important;box-shadow:none!important}

@media(max-width:380px){
  main{padding-left:9px!important;padding-right:9px!important}
  .master-home-hero{padding:22px 16px 18px}
  .master-home-hero h1{font-size:29px}
  .portal-card{min-height:105px!important}
  .hp-table-card{min-height:91px!important}
}


/* =========================================================
   V42.4.1 — HOME PRIORITY + LIVE COUNTERS
   ========================================================= */

/* V42.4.0'da gizlenen sayaçları geri aç */
.mini-stats{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:7px!important;
  margin:12px 0 7px!important;
}
.mini-stats div{
  min-height:64px!important;
  padding:9px 6px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:15px!important;
  background:#0b1925!important;
  border:1px solid #20394c!important;
  box-shadow:none!important;
}
.mini-stats b{
  font-size:22px!important;
  line-height:1!important;
  color:#f7fbff!important;
}
.mini-stats span{
  margin-top:5px!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  color:#8199aa!important;
}
.mini-stats div:nth-child(2){
  background:#20131a!important;
  border-color:#673044!important;
}
.mini-stats div:nth-child(2) b{color:#ff6482!important}
.mini-stats div:nth-child(3){
  background:#0b1b2a!important;
  border-color:#214e72!important;
}
.mini-stats div:nth-child(3) b{color:#52bcff!important}

/* HYPERPOS ana giriş kartı: büyük odak */
.portal-card.hyperpos{
  min-height:148px!important;
  padding:18px!important;
}
.portal-card.hyperpos img{
  width:64px!important;
  height:64px!important;
  border-radius:18px!important;
}
.portal-card.hyperpos b{
  font-size:25px!important;
}
.portal-card.hyperpos span{
  font-size:11px!important;
  line-height:1.35!important;
}
.portal-card.hyperpos i{
  font-size:31px!important;
}

/* İŞLETME daha küçük ama kullanışlı */
.portal-card.business{
  min-height:88px!important;
  padding:11px 14px!important;
}
.portal-card.business img{
  width:44px!important;
  height:44px!important;
  border-radius:13px!important;
}
.portal-card.business b{
  font-size:17px!important;
}
.portal-card.business span{
  font-size:9px!important;
}
.portal-card.business i{
  font-size:24px!important;
}

@media(max-width:380px){
  .portal-card.hyperpos{min-height:138px!important}
  .portal-card.hyperpos img{width:58px!important;height:58px!important}
  .portal-card.hyperpos b{font-size:23px!important}
  .portal-card.business{min-height:84px!important}
  .mini-stats div{min-height:59px!important}
  .mini-stats b{font-size:20px!important}
}


/* =========================================================
   V42.4.2 — ENTRY RESPONSIVE NO-SCROLL + VIVID TABLE COLORS
   ========================================================= */

html,body{
  min-height:100%;
  overscroll-behavior-y:none;
}

body,#app{
  min-height:100dvh;
}

main{
  min-height:calc(100dvh - 66px);
}

/* Giriş, işletme seçimi, PIN ve ana ekran tek viewport'a sığar */
#pairView,
#businessSelectView,
#pinView,
#homeView{
  min-height:calc(100dvh - 84px);
  max-height:calc(100dvh - 84px);
  overflow:hidden;
}

/* GİRİŞ */
#pairView{
  display:grid;
  align-content:center;
  gap:9px;
}

#pairView .hero{
  min-height:0!important;
  padding:14px 16px!important;
  border-radius:19px!important;
}

#pairView .hero h1{
  margin:2px 0 5px!important;
  font-size:25px!important;
}

#pairView .hero p{
  margin:0!important;
  font-size:10px!important;
  line-height:1.35!important;
}

#pairView .panel{
  padding:13px!important;
  border-radius:18px!important;
}

#pairView .panel h2{
  margin:0 0 8px!important;
  font-size:19px!important;
}

#pairView label{
  margin-bottom:6px!important;
  font-size:10px!important;
}

#pairView input{
  height:44px!important;
  margin-top:3px!important;
}

#pairView .primary{
  height:45px!important;
  margin-top:7px!important;
}

#pairView .muted,
#pairView small{
  font-size:8.5px!important;
  line-height:1.3!important;
}

/* PIN */
#pinView{
  display:grid;
  align-content:center;
  gap:8px;
}

#pinView .business-chip{
  margin-bottom:6px!important;
  padding:8px!important;
}

#pinView .pin-panel{
  padding:12px!important;
}

#pinView .pin-input{
  height:48px!important;
}

#pinView .keypad{
  gap:6px!important;
}

#pinView .keypad button{
  height:46px!important;
}

/* ANA SAYFA */
#homeView{
  display:flex;
  flex-direction:column;
}

#homeView .master-home-hero{
  min-height:0!important;
  padding:14px 15px 12px!important;
}

#homeView .master-script{
  margin:9px 0 7px 4px!important;
  font-size:14px!important;
}

#homeView .master-home-hero h1{
  font-size:26px!important;
}

#homeView .master-home-hero p{
  font-size:10px!important;
}

#homeView .portal-grid{
  gap:7px!important;
  margin-top:7px!important;
}

#homeView .portal-card.hyperpos{
  min-height:116px!important;
}

#homeView .portal-card.business{
  min-height:74px!important;
}

#homeView .mini-stats{
  margin:7px 0 3px!important;
}

#homeView .mini-stats div{
  min-height:50px!important;
}

#homeView .master-benefits{
  margin:5px 0 1px!important;
  padding:6px 4px!important;
}

/* KISA EKRANLAR */
@media (max-height:760px){
  .topbar{
    height:56px!important;
    padding:6px 10px!important;
  }
  .brand{height:30px!important}
  main{
    min-height:calc(100dvh - 56px);
    padding-top:6px!important;
    padding-bottom:6px!important;
  }
  #pairView,
  #businessSelectView,
  #pinView,
  #homeView{
    min-height:calc(100dvh - 68px);
    max-height:calc(100dvh - 68px);
  }

  #pairView .hero{
    padding:10px 13px!important;
  }
  #pairView .hero h1{font-size:21px!important}
  #pairView .panel{padding:10px!important}
  #pairView input{height:40px!important}
  #pairView .primary{height:41px!important}

  #pinView .business-chip{padding:6px!important}
  #pinView .pin-panel{padding:9px!important}
  #pinView .keypad button{height:42px!important}

  #homeView .master-home-hero{
    padding:10px 12px!important;
  }
  #homeView .master-logo-lockup .master-mark{
    width:40px!important;height:40px!important;font-size:21px!important;
  }
  #homeView .master-logo-lockup strong{font-size:20px!important}
  #homeView .master-script{display:none!important}
  #homeView .master-home-hero h1{font-size:22px!important}
  #homeView .portal-card.hyperpos{
    min-height:102px!important;
    padding:12px!important;
  }
  #homeView .portal-card.hyperpos img{
    width:50px!important;height:50px!important;
  }
  #homeView .portal-card.business{
    min-height:66px!important;
  }
  #homeView .mini-stats div{min-height:44px!important}
  #homeView .mini-stats b{font-size:17px!important}
  #homeView .master-benefits{display:none!important}
}

/* Çok kısa telefonlarda gereksiz görsel öğeleri gizle */
@media (max-height:650px){
  #pairView .hero p,
  #homeView .master-version{
    display:none!important;
  }
  #pairView .hero{
    padding:8px 12px!important;
  }
  #homeView .mini-stats div{
    min-height:40px!important;
  }
}

/* MASA RENKLERİ — daha canlı ve net */
.hp-table-card.age-blue{
  background:linear-gradient(145deg,#0b92ff,#0064d8)!important;
  border:1px solid #54b8ff!important;
  color:#fff!important;
}
.hp-table-card.age-green{
  background:linear-gradient(145deg,#1bc987,#07955e)!important;
  border:1px solid #59e6b0!important;
  color:#fff!important;
}
.hp-table-card.age-yellow{
  background:linear-gradient(145deg,#ffc52e,#e19000)!important;
  border:1px solid #ffe172!important;
  color:#171000!important;
}
.hp-table-card.age-red{
  background:linear-gradient(145deg,#ff3d5f,#d71338)!important;
  border:1px solid #ff7890!important;
  color:#fff!important;
}

/* Sarı masada okunabilirlik */
.hp-table-card.age-yellow .table-state,
.hp-table-card.age-yellow small,
.hp-table-card.age-yellow strong,
.hp-table-card.age-yellow b{
  color:#171000!important;
}

/* Mavi/yeşil/kırmızı masalarda beyaz metin */
.hp-table-card.age-blue .table-state,
.hp-table-card.age-blue small,
.hp-table-card.age-blue strong,
.hp-table-card.age-blue b,
.hp-table-card.age-green .table-state,
.hp-table-card.age-green small,
.hp-table-card.age-green strong,
.hp-table-card.age-green b,
.hp-table-card.age-red .table-state,
.hp-table-card.age-red small,
.hp-table-card.age-red strong,
.hp-table-card.age-red b{
  color:#fff!important;
}

/* dakika rozeti daha görünür */
.hp-table-minutes{
  background:rgba(0,0,0,.28)!important;
  color:#fff!important;
  font-weight:1000!important;
  border:1px solid rgba(255,255,255,.25)!important;
}
.hp-table-card.age-yellow .hp-table-minutes{
  background:rgba(255,255,255,.52)!important;
  color:#171000!important;
  border-color:rgba(23,16,0,.16)!important;
}


/* =========================================================
   V42.5.0 — PREMIUM TABLE MASTER
   Profesyonel masa planı; ağır blur/animasyon yok.
   ========================================================= */

.hp-table-master-head{
  display:grid;
  gap:9px;
  margin-bottom:10px;
}
.hp-table-master-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.hp-table-master-title h3{
  margin:2px 0 0;
  font-size:20px;
  letter-spacing:-.03em;
}
.hp-table-master-title small{
  display:block;
  margin-top:2px;
  font-size:9px;
  color:#7991a4;
}
.hp-master-kicker{
  display:block;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.16em;
  color:#ff5476;
}
.hp-master-refresh{
  width:42px!important;
  height:42px!important;
  font-size:18px!important;
  border-radius:13px!important;
}

/* alan sekmeleri */
.hp-master-area-tabs{
  display:flex!important;
  gap:6px!important;
  overflow-x:auto;
  padding:1px 0 2px;
  scrollbar-width:none;
}
.hp-master-area-tabs::-webkit-scrollbar{display:none}
.hp-master-area-tabs button{
  min-width:90px!important;
  height:42px!important;
  padding:0 11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  border-radius:13px!important;
  background:#0b1925!important;
  border:1px solid #20394c!important;
  color:#9eb1bf!important;
}
.hp-master-area-tabs button em{
  min-width:22px;
  height:22px;
  padding:0 5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#142838;
  font-size:9px;
  font-style:normal;
  color:#d9e4eb;
}
.hp-master-area-tabs button.active{
  background:#ff315d!important;
  border-color:#ff315d!important;
  color:#fff!important;
}
.hp-master-area-tabs button.active em{
  background:rgba(255,255,255,.17);
  color:#fff;
}

/* kpi */
.hp-table-kpis{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
}
.hp-table-kpis>div{
  min-height:58px;
  padding:8px 7px;
  border-radius:14px;
  border:1px solid #20394c;
  background:#0b1925;
}
.hp-table-kpis span{
  display:block;
  font-size:7px;
  font-weight:800;
  color:#7e96a7;
  white-space:nowrap;
}
.hp-table-kpis b{
  display:block;
  margin-top:4px;
  font-size:18px;
  letter-spacing:-.03em;
}
.hp-table-kpis .green{border-color:#1f624d;background:#0a211b}
.hp-table-kpis .green b{color:#44d99f}
.hp-table-kpis .amber{border-color:#725d23;background:#241d0b}
.hp-table-kpis .amber b{color:#f1bd42}
.hp-table-kpis .blue{border-color:#24577c;background:#0b1d2a}
.hp-table-kpis .blue b{color:#53b9ff}

/* legend */
.hp-table-legend{
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding:2px 1px 3px;
  font-size:8px;
  color:#8ca2b2;
  scrollbar-width:none;
}
.hp-table-legend::-webkit-scrollbar{display:none}
.hp-table-legend span{
  display:flex;
  align-items:center;
  gap:5px;
  white-space:nowrap;
}
.hp-table-legend .dot{
  width:9px;
  height:9px;
  border-radius:50%;
  display:inline-block;
}
.hp-table-legend .dot.blue{background:#0b92ff}
.hp-table-legend .dot.green{background:#1bc987}
.hp-table-legend .dot.yellow{background:#ffc52e}
.hp-table-legend .dot.red{background:#ff3d5f}
.hp-table-legend .dot.empty{background:#697684}

/* floor zones */
.hp-floor-wrap{
  display:grid;
  gap:10px;
}
.hp-floor-zone{
  position:relative;
  overflow:hidden;
  border-radius:18px;
  border:1px solid #263f52;
  background:
    linear-gradient(180deg,rgba(255,255,255,.015),rgba(0,0,0,.08)),
    linear-gradient(135deg,#0b1721,#081019);
}
.hp-floor-zone[data-area*="bah"]{
  background:
    linear-gradient(180deg,rgba(13,63,43,.12),rgba(0,0,0,.10)),
    linear-gradient(135deg,#0a1816,#081019);
  border-color:#245443;
}
.hp-floor-zone[data-area*="çim"],
.hp-floor-zone[data-area*="cim"]{
  background:
    linear-gradient(180deg,rgba(33,74,24,.14),rgba(0,0,0,.10)),
    linear-gradient(135deg,#0c1a12,#081019);
  border-color:#345b2d;
}
.hp-floor-zone-head{
  height:35px;
  padding:0 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.018);
}
.hp-floor-zone-head strong{
  font-size:12px;
  letter-spacing:.04em;
}
.hp-floor-zone-head span{
  font-size:8px;
  color:#7590a2;
}

.hp-floor-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  padding:10px;
}

/* professional table tile */
.hp-floor-table{
  position:relative;
  min-height:112px;
  padding:9px 7px 7px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  border-radius:16px;
  border:1px solid #243e51;
  background:#0c1b27;
  color:#fff;
  overflow:hidden;
}
.hp-floor-table.empty{
  background:linear-gradient(180deg,#111f2b,#0a151f);
  border-color:#354858;
}
.hp-floor-table.open.age-blue{
  background:linear-gradient(180deg,#0d3555,#09243b)!important;
  border-color:#0b92ff!important;
}
.hp-floor-table.open.age-green{
  background:linear-gradient(180deg,#123c31,#0b2721)!important;
  border-color:#1bc987!important;
}
.hp-floor-table.open.age-yellow{
  background:linear-gradient(180deg,#493d14,#2c250d)!important;
  border-color:#ffc52e!important;
  color:#fff!important;
}
.hp-floor-table.open.age-red{
  background:linear-gradient(180deg,#4a1721,#2d1017)!important;
  border-color:#ff3d5f!important;
}
.hp-floor-table.reserved{
  border-color:#ff315d!important;
  background:linear-gradient(180deg,#3a1220,#211018)!important;
}

/* abstract masa geometry - flat, professional */
.hp-table-furniture{
  position:relative;
  width:62px;
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hp-table-furniture:before{
  content:"";
  position:absolute;
  inset:8px 7px;
  border-radius:10px;
  background:linear-gradient(180deg,#263a4a,#182733);
  border:1px solid rgba(255,255,255,.13);
}
.hp-floor-table.age-blue .hp-table-furniture:before{background:linear-gradient(180deg,#0b92ff,#096fc2)}
.hp-floor-table.age-green .hp-table-furniture:before{background:linear-gradient(180deg,#1bc987,#0a9a64)}
.hp-floor-table.age-yellow .hp-table-furniture:before{background:linear-gradient(180deg,#ffc52e,#d78d00)}
.hp-floor-table.age-red .hp-table-furniture:before{background:linear-gradient(180deg,#ff3d5f,#c51538)}
.hp-floor-table.reserved .hp-table-furniture:before{background:linear-gradient(180deg,#ff315d,#b6193c)}
.hp-table-furniture strong{
  position:relative;
  z-index:2;
  font-size:20px;
  line-height:1;
  color:#fff;
}
.hp-table-furniture .chair{
  position:absolute;
  display:block;
  background:#344957;
  border-radius:3px;
  opacity:.95;
}
.hp-table-furniture .chair.top,
.hp-table-furniture .chair.bottom{
  width:24px;height:5px;left:19px;
}
.hp-table-furniture .chair.top{top:0}
.hp-table-furniture .chair.bottom{bottom:0}
.hp-table-furniture .chair.left,
.hp-table-furniture .chair.right{
  width:5px;height:22px;top:15px;
}
.hp-table-furniture .chair.left{left:0}
.hp-table-furniture .chair.right{right:0}
.hp-floor-table.age-blue .chair{background:#3ab0ff}
.hp-floor-table.age-green .chair{background:#46dba8}
.hp-floor-table.age-yellow .chair{background:#ffe06b}
.hp-floor-table.age-red .chair,
.hp-floor-table.reserved .chair{background:#ff7890}

.hp-floor-minutes{
  padding:3px 7px;
  border-radius:999px;
  font-size:8px;
  font-weight:900;
  color:#fff;
  background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.18);
}
.hp-reserved-badge{
  padding:3px 7px;
  border-radius:999px;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.06em;
  color:#fff;
  background:#ff315d;
}
.hp-floor-meta{
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:2px;
  text-align:center;
}
.hp-floor-meta small{
  font-size:8px;
  color:#a5b6c2;
}
.hp-floor-meta b{
  font-size:10px;
  color:#fff;
}
.hp-floor-table.empty .hp-floor-meta b{
  color:#758d9e;
  font-weight:700;
}

/* tablet / wide */
@media(min-width:520px){
  .hp-floor-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:700px){
  .hp-floor-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* phones */
@media(max-width:390px){
  .hp-table-kpis{grid-template-columns:repeat(2,1fr)}
  .hp-floor-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px}
  .hp-floor-table{min-height:103px;padding:7px 5px}
  .hp-table-furniture{width:56px;height:48px}
  .hp-table-furniture:before{inset:8px 7px}
  .hp-table-furniture strong{font-size:18px}
}
@media(max-width:340px){
  .hp-floor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* =========================================================
   V42.5.1 — CLEAN TABLE CARDS
   Masa kartlarında gereksiz metinler kaldırıldı.
   ========================================================= */

.hp-floor-table{
  min-height:104px!important;
  gap:4px!important;
  padding:8px 6px!important;
}

.hp-table-furniture{
  width:60px!important;
  height:50px!important;
}

.hp-table-furniture strong{
  font-size:22px!important;
  font-weight:900!important;
}

.hp-floor-minutes{
  position:absolute!important;
  right:7px!important;
  bottom:7px!important;
  padding:3px 6px!important;
  font-size:8px!important;
}

.hp-floor-meta.clean{
  position:absolute!important;
  left:7px!important;
  bottom:7px!important;
  width:auto!important;
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
  text-align:left!important;
}

.hp-floor-meta.clean small,
.hp-floor-meta.clean b{
  font-size:8px!important;
  line-height:1!important;
  color:#d9e5ec!important;
}

.hp-floor-table.empty .hp-floor-meta{
  display:none!important;
}

.hp-reserved-badge{
  position:absolute!important;
  top:7px!important;
  right:7px!important;
  font-size:7px!important;
  padding:3px 5px!important;
}

/* Üst tarafta da gereksiz cümleyi sadeleştir */
.hp-table-master-title small{
  display:none!important;
}

.hp-info{
  font-size:8px!important;
  line-height:1.35!important;
}

@media(max-width:390px){
  .hp-floor-table{min-height:98px!important}
  .hp-table-furniture{width:54px!important;height:46px!important}
  .hp-table-furniture strong{font-size:20px!important}
}


/* =========================================================
   V42.5.2 — COLORFUL LIGHT TABLES
   Masalar ekranı son onaylanan açık + canlı tasarıma göre.
   Diğer ekranlar mevcut dark master UI'da kalır.
   ========================================================= */

/* Sadece MASALAR görünümünü açık/premium yap */
#hyperposView:has([data-hp-tab="tables"].active) #hpContent{
  background:
    radial-gradient(circle at 12% 4%,rgba(255,53,93,.08),transparent 23%),
    radial-gradient(circle at 88% 8%,rgba(20,145,255,.10),transparent 27%),
    linear-gradient(180deg,#f7fbff 0%,#eef6fc 100%);
  border-radius:22px;
  padding:10px;
  color:#102033;
}

/* üst başlık */
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-master-head{
  background:transparent!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-master-title h3{
  color:#102033!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-kicker{
  color:#ff315d!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-refresh{
  background:#ffffff!important;
  border:1px solid #d9e7f2!important;
  color:#1b3347!important;
}

/* alan sekmeleri */
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-area-tabs button{
  background:#ffffff!important;
  border:1px solid #dbe7f0!important;
  color:#284256!important;
  box-shadow:0 4px 12px rgba(17,53,82,.06)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-area-tabs button em{
  background:#eef5fa!important;
  color:#365166!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-area-tabs button.active{
  background:linear-gradient(135deg,#ff315d,#ff4c72)!important;
  border-color:#ff315d!important;
  color:#fff!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-area-tabs button.active em{
  background:rgba(255,255,255,.20)!important;
  color:#fff!important;
}

/* KPI kartları */
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis>div{
  background:linear-gradient(135deg,#0d93ff,#0876db)!important;
  border:none!important;
  box-shadow:0 8px 18px rgba(0,119,218,.16)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis>div:nth-child(2){
  background:linear-gradient(135deg,#19c779,#0aa75f)!important;
  box-shadow:0 8px 18px rgba(10,167,95,.16)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis>div:nth-child(3){
  background:linear-gradient(135deg,#ffb02e,#ff8b14)!important;
  box-shadow:0 8px 18px rgba(255,139,20,.16)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis>div:nth-child(4){
  background:linear-gradient(135deg,#9b4dff,#7d2be8)!important;
  box-shadow:0 8px 18px rgba(125,43,232,.16)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis span,
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis b{
  color:#fff!important;
}

/* renk açıklamaları */
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-legend{
  color:#40596d!important;
}

/* floor zone açık ve sade */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-zone{
  background:transparent!important;
  border:none!important;
  border-radius:0!important;
  overflow:visible!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-zone-head{
  height:30px!important;
  padding:0 3px!important;
  background:transparent!important;
  border:none!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-zone-head strong{
  color:#193044!important;
  font-size:13px!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-zone-head span{
  color:#7f93a4!important;
}

/* grid */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  padding:5px 0 10px!important;
}

/* Masa kartları: sade, canlı, ikon minimum */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table{
  min-height:108px!important;
  padding:10px!important;
  border-radius:18px!important;
  box-shadow:0 8px 20px rgba(24,65,95,.10)!important;
  border:1px solid rgba(255,255,255,.65)!important;
  overflow:hidden!important;
}

/* boş */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.empty{
  background:linear-gradient(145deg,#ffffff,#edf3f7)!important;
  border-color:#e0e8ef!important;
  color:#122235!important;
}

/* canlı renkler */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.open.age-blue{
  background:linear-gradient(145deg,#16a5ff,#0077e8)!important;
  border-color:#62c7ff!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.open.age-green{
  background:linear-gradient(145deg,#21d980,#08aa58)!important;
  border-color:#69efaa!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.open.age-yellow{
  background:linear-gradient(145deg,#ffc735,#ff9c15)!important;
  border-color:#ffe178!important;
  color:#fff!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.open.age-red{
  background:linear-gradient(145deg,#ff4264,#ee1749)!important;
  border-color:#ff8ba0!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.reserved{
  background:linear-gradient(145deg,#ff315d,#c91948)!important;
  border-color:#ff7890!important;
}

/* masa ikon geometrisini sadeleştir */
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-furniture{
  width:auto!important;
  height:auto!important;
  margin:0!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-furniture:before,
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-furniture .chair{
  display:none!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-furniture strong{
  font-size:34px!important;
  font-weight:1000!important;
  line-height:1!important;
  color:#fff!important;
  text-shadow:none!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.empty .hp-table-furniture strong{
  color:#142437!important;
}

/* bilgi satırı */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-meta.clean{
  left:10px!important;
  bottom:10px!important;
  gap:8px!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-meta.clean small,
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-meta.clean b{
  font-size:10px!important;
  color:#fff!important;
  font-weight:900!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-minutes{
  right:10px!important;
  bottom:9px!important;
  padding:4px 8px!important;
  border:none!important;
  background:rgba(0,0,0,.18)!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:1000!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-reserved-badge{
  top:8px!important;
  right:8px!important;
  background:rgba(255,255,255,.22)!important;
  color:#fff!important;
}

/* boş kartta sadece Boş yazısı */
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table.empty:after{
  content:"Boş";
  position:absolute;
  left:0;right:0;bottom:12px;
  text-align:center;
  font-size:10px;
  font-weight:800;
  color:#6d8293;
}

/* yardım metni */
#hyperposView:has([data-hp-tab="tables"].active) .hp-info{
  background:#ffffff!important;
  border:1px solid #e0e9f0!important;
  color:#60798c!important;
}

/* Telefonda kartları tek ekran hissine yakın tut */
@media(max-width:390px){
  #hyperposView:has([data-hp-tab="tables"].active) #hpContent{
    padding:8px!important;
  }
  #hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis{
    grid-template-columns:repeat(2,1fr)!important;
  }
  #hyperposView:has([data-hp-tab="tables"].active) .hp-floor-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table{
    min-height:102px!important;
  }
}

/* Geniş telefon/tablet */
@media(min-width:520px){
  #hyperposView:has([data-hp-tab="tables"].active) .hp-floor-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}


/* =========================================================
   V42.6.0 — QRAVM iOS LIGHT MASTER
   Genel PWA iPhone / iOS esintili görünüm.
   Hafif CSS: ağır blur/animasyon yok.
   ========================================================= */

:root{
  --ios-bg:#f4f8fc;
  --ios-bg2:#eef5fb;
  --ios-card:#ffffff;
  --ios-card-soft:#f9fbfd;
  --ios-line:#dce7f0;
  --ios-text:#0f1d2b;
  --ios-muted:#71879a;
  --ios-red:#ff315d;
  --ios-red2:#f21f4d;
  --ios-blue:#0a84ff;
  --ios-green:#30d158;
  --ios-yellow:#ffb000;
  --ios-purple:#8b5cf6;
  --ios-shadow:0 8px 24px rgba(27,65,95,.10);
  --ios-shadow-soft:0 4px 14px rgba(27,65,95,.07);
  --ios-radius:22px;
}

/* Global canvas */
html,body{
  background:
    radial-gradient(circle at 12% 0%,rgba(255,49,93,.08),transparent 24%),
    radial-gradient(circle at 92% 3%,rgba(10,132,255,.09),transparent 26%),
    linear-gradient(180deg,var(--ios-bg) 0%,var(--ios-bg2) 100%)!important;
  color:var(--ios-text)!important;
}

body{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",sans-serif!important;
}

#app{
  max-width:760px!important;
  margin:0 auto!important;
  background:transparent!important;
}

main{
  background:transparent!important;
  color:var(--ios-text)!important;
}

/* Topbar */
.topbar{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--ios-line)!important;
  box-shadow:0 3px 12px rgba(31,67,95,.06)!important;
}
.brand{
  filter:none!important;
}
.pill,
.icon-btn,
.ghost,
.back{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  color:var(--ios-text)!important;
  box-shadow:var(--ios-shadow-soft)!important;
  border-radius:16px!important;
}
.pill.ok{
  background:#edf9f2!important;
  border-color:#bfe7cf!important;
  color:#17854f!important;
}

/* Generic text */
h1,h2,h3,h4,h5,h6,b,strong{
  color:var(--ios-text);
}
small,.muted,label,.eyebrow{
  color:var(--ios-muted)!important;
}

/* Generic cards / panels */
.panel,
.business-chip,
.pin-panel,
.biz-content,
.hp-cart,
.hp-paybox,
.hp-quick-cartbar,
.hp-op-card,
.hp-order-head,
.biz-card,
.biz-row,
.biz-kpi,
.biz-profile{
  background:var(--ios-card)!important;
  border:1px solid var(--ios-line)!important;
  box-shadow:var(--ios-shadow-soft)!important;
  color:var(--ios-text)!important;
}

/* Inputs */
input,textarea,select,.pin-input{
  background:#fff!important;
  color:var(--ios-text)!important;
  border:1px solid #d8e4ed!important;
  box-shadow:inset 0 1px 2px rgba(24,50,70,.03)!important;
  border-radius:16px!important;
}
input:focus,textarea:focus,select:focus,.pin-input:focus{
  border-color:#8fc9ff!important;
  box-shadow:0 0 0 3px rgba(10,132,255,.12)!important;
  outline:none!important;
}

/* Primary actions */
.primary,
.hp-save,
.biz-open-panel{
  background:linear-gradient(135deg,var(--ios-red),var(--ios-red2))!important;
  color:#fff!important;
  border:none!important;
  box-shadow:0 8px 18px rgba(255,49,93,.18)!important;
  border-radius:16px!important;
}
.danger{
  background:#fff0f3!important;
  color:#d91f49!important;
  border:1px solid #ffc2cf!important;
  border-radius:16px!important;
}

/* Pair/login hero */
#pairView .hero{
  background:
    linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.88)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover!important;
  border:1px solid rgba(255,255,255,.86)!important;
  box-shadow:var(--ios-shadow)!important;
  color:var(--ios-text)!important;
}
#pairView .hero h1{
  color:var(--ios-text)!important;
}
#pairView .hero p{
  color:#456277!important;
}
#pairView .panel{
  background:rgba(255,255,255,.96)!important;
}

/* PIN */
#pinView .business-chip{
  background:#fff!important;
}
#pinView .pin-panel{
  background:#fff!important;
}
#pinView .keypad button{
  background:#f7fafc!important;
  color:#13283a!important;
  border:1px solid #dbe6ee!important;
  box-shadow:var(--ios-shadow-soft)!important;
  border-radius:18px!important;
}
#pinView .keypad button:active{
  background:#eaf4ff!important;
  border-color:#bcdcff!important;
}

/* HOME */
#homeView .master-home-hero{
  background:
    linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.86)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover!important;
  border:1px solid rgba(255,255,255,.9)!important;
  box-shadow:var(--ios-shadow)!important;
}
#homeView .master-logo-lockup strong,
#homeView .master-home-hero h1{
  color:var(--ios-text)!important;
}
#homeView .master-logo-lockup small,
#homeView .master-home-hero p{
  color:#4f6a7e!important;
}
#homeView .master-script{
  color:#9f5f19!important;
}

.portal-card{
  background:#fff!important;
  box-shadow:var(--ios-shadow)!important;
}
.portal-card:after{
  background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.72) 66%,rgba(255,255,255,.26))!important;
}
.portal-card.hyperpos{
  border:1px solid #ffc0ce!important;
}
.portal-card.business{
  border:1px solid #b9dbff!important;
}
.portal-card b{
  color:var(--ios-text)!important;
}
.portal-card span{
  color:#61798c!important;
}
.portal-card img{
  background:#fff!important;
  border:1px solid #e2eaf0!important;
}
.portal-badge{
  color:#fff!important;
}

.mini-stats div,
.home-stat{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  box-shadow:var(--ios-shadow-soft)!important;
}
.mini-stats b,.home-stat b{
  color:var(--ios-text)!important;
}
.mini-stats span,.home-stat span{
  color:#7b91a2!important;
}
.mini-stats div:nth-child(2),
.home-stat:nth-child(2){
  background:#effbf4!important;
  border-color:#cbead7!important;
}
.mini-stats div:nth-child(2) b,
.home-stat:nth-child(2) b{
  color:#13a361!important;
}
.mini-stats div:nth-child(3),
.home-stat:nth-child(3){
  background:#eef7ff!important;
  border-color:#c8e1f7!important;
}
.mini-stats div:nth-child(3) b,
.home-stat:nth-child(3) b{
  color:#168be8!important;
}
.master-benefits{
  border-top:1px solid var(--ios-line)!important;
}
.master-benefits span{
  color:#6f8799!important;
}
.master-benefits b{
  color:#244156!important;
}
.master-version{
  color:#91a4b2!important;
}

/* HyperPOS shell */
.mobile-shell-head{
  border-bottom:1px solid var(--ios-line)!important;
}
.mobile-shell-title h2,
.mobile-shell-title small{
  color:var(--ios-text)!important;
}
.live-dot{
  background:#edf9f2!important;
  border:1px solid #bfe7cf!important;
  color:#188654!important;
}

/* HyperPOS top tabs */
.hp-tabs{
  background:rgba(244,248,252,.97)!important;
  border-bottom:1px solid var(--ios-line)!important;
}
.hp-tabs button{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  color:#6b8294!important;
  box-shadow:var(--ios-shadow-soft)!important;
}
.hp-tabs button.active{
  background:linear-gradient(135deg,var(--ios-red),#ff4f72)!important;
  border-color:var(--ios-red)!important;
  color:#fff!important;
}

/* HyperPOS generic headers/actions */
.hp-section-head h3,
.hp-order-title b{
  color:var(--ios-text)!important;
}
.hp-refresh,
.hp-order-head button,
.hp-order-actions button,
.hp-menu-tools button,
.hp-op-card button{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  color:#294559!important;
  box-shadow:var(--ios-shadow-soft)!important;
}
.hp-order-actions .danger-mini{
  background:#fff0f3!important;
  border-color:#ffc6d2!important;
  color:#d8224b!important;
}
.hp-badge{
  background:#fff0f4!important;
  color:#e62d55!important;
  border:1px solid #ffc7d3!important;
}

/* Categories */
.hp-cat-strip button,
.hp-area-tabs button{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  color:#60778a!important;
}
.hp-cat-strip button.active,
.hp-area-tabs button.active{
  background:linear-gradient(135deg,var(--ios-red),#ff5577)!important;
  border-color:var(--ios-red)!important;
  color:#fff!important;
}

/* Products */
.hp-product{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  box-shadow:var(--ios-shadow-soft)!important;
}
.hp-product img{
  background:#eef5fa!important;
}
.hp-product b{
  color:var(--ios-text)!important;
}
.hp-product span{
  color:#d92b55!important;
}
.hp-product em,.hp-qbadge{
  background:var(--ios-red)!important;
  color:#fff!important;
}

/* Cart / payments */
.hp-cart h4,
.hp-cart-row{
  border-color:#e0e9f0!important;
}
.hp-cart-row,
.hp-total-card{
  color:var(--ios-text)!important;
}
.hp-total-card{
  background:#f7fafc!important;
  border:1px solid var(--ios-line)!important;
}
.hp-qty button{
  background:#f4f8fb!important;
  border:1px solid var(--ios-line)!important;
  color:#233f53!important;
}
.hp-pay-grid .cash,.hp-pay-row .cash{
  background:#2cc879!important;
  color:#fff!important;
}
.hp-pay-grid .card,.hp-pay-row .card{
  background:#0a84ff!important;
  color:#fff!important;
}

/* Business */
.biz-summary div{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  box-shadow:var(--ios-shadow-soft)!important;
}
.biz-summary b{
  color:var(--ios-text)!important;
}
.biz-summary span{
  color:#8195a5!important;
}
.biz-card{
  background:#fff!important;
}
.biz-card .biz-ico{
  background:#f3f8fb!important;
  border:1px solid #e1eaf0!important;
}
.biz-card.open{
  background:#fff1f4!important;
  border-color:#ffb6c7!important;
}
.biz-submenu{
  border-left-color:#dbe6ee!important;
}
.biz-subitem,
.biz-subsubitem{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
  color:var(--ios-text)!important;
}
.biz-subitem.has-children.open{
  background:#fff1f4!important;
  border-color:#ffb9c8!important;
}
.biz-subitem .sub-ico,
.biz-subsubitem .sub2-ico{
  background:#f3f8fb!important;
}
.biz-row,.biz-kpi,.biz-profile{
  background:#fff!important;
  border:1px solid var(--ios-line)!important;
}

/* Settings */
.settings-row{
  border-color:#e0e8ef!important;
  color:var(--ios-text)!important;
}

/* Action sheet iOS bottom-sheet feel */
.hp-action-sheet-backdrop{
  background:rgba(15,31,44,.30)!important;
}
.hp-action-sheet{
  background:#fff!important;
  border:1px solid #e1e9ef!important;
  box-shadow:0 -10px 30px rgba(28,57,79,.14)!important;
  border-radius:28px 28px 18px 18px!important;
}
.hp-action-sheet h4{
  color:var(--ios-text)!important;
}
.hp-action-sheet p{
  color:#7b91a2!important;
}
.hp-action-grid button{
  background:#f7fafc!important;
  border:1px solid #dfe9f0!important;
  color:#173147!important;
}
.hp-action-grid button.warn{
  background:#fff8e7!important;
  border-color:#f3dda3!important;
  color:#9a6912!important;
}
.hp-action-grid button.danger{
  background:#fff0f3!important;
  border-color:#ffc2cf!important;
  color:#d91f49!important;
}
.hp-action-cancel{
  background:#f2f6f9!important;
  border:1px solid #dce7ef!important;
  color:#60798c!important;
}

/* Toast */
.toast{
  background:#17293a!important;
  color:#fff!important;
  border:none!important;
  box-shadow:0 8px 20px rgba(18,42,60,.18)!important;
}

/* iOS-like scrollbar minimal */
*{
  scrollbar-width:thin;
  scrollbar-color:#cfdce6 transparent;
}
::-webkit-scrollbar{
  width:4px;
  height:4px;
}
::-webkit-scrollbar-thumb{
  background:#cfdce6;
  border-radius:999px;
}
::-webkit-scrollbar-track{
  background:transparent;
}

/* Keep table screen colorful light design */
#hyperposView:has([data-hp-tab="tables"].active){
  color:var(--ios-text)!important;
}

/* Mobile bottom-safe spacing */
@supports(padding:max(0px)){
  body{
    padding-bottom:max(0px,env(safe-area-inset-bottom));
  }
  .hp-action-sheet{
    padding-bottom:max(14px,calc(env(safe-area-inset-bottom) + 8px))!important;
  }
}

/* Performance contract */
*,*:before,*:after{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.view,
.portal-card,
.hp-product,
.biz-card,
.hp-table-card{
  animation:none!important;
  transition:none!important;
}

/* Compact mobile */
@media(max-width:390px){
  main{
    padding-left:9px!important;
    padding-right:9px!important;
  }
  .panel,.pin-panel{
    border-radius:18px!important;
  }
  .hp-tabs button{
    min-width:74px!important;
  }
}


/* =========================================================
   V42.6.1 — iOS POLISH PASS
   Mevcut çalışan yapının üstüne daha güçlü iPhone/iOS görünümü.
   ========================================================= */

/* LOGO / HEADER */
.topbar{
  min-height:66px!important;
  padding:8px 10px!important;
  gap:8px!important;
}
.brand{
  height:34px!important;
  max-width:190px!important;
  object-fit:contain!important;
  padding:6px 10px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(219,230,239,.95)!important;
  box-shadow:0 5px 14px rgba(28,60,84,.08)!important;
}
.topbar .right,
.topbar .actions{
  gap:7px!important;
}
.icon-btn{
  width:42px!important;
  height:42px!important;
  border-radius:14px!important;
}

/* HOME — iOS app tiles */
.portal-grid{
  gap:10px!important;
}
.portal-card{
  min-height:94px!important;
  padding:13px 14px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#fff,#f8fbfd)!important;
  box-shadow:0 7px 20px rgba(27,65,95,.09)!important;
  overflow:hidden!important;
}
.portal-card:after{
  background:none!important;
}
.portal-card.hyperpos{
  border:1px solid #ffc2cf!important;
  box-shadow:0 8px 22px rgba(255,49,93,.10)!important;
}
.portal-card.business{
  border:1px solid #bfddff!important;
  box-shadow:0 8px 22px rgba(10,132,255,.09)!important;
}
.portal-card img{
  width:48px!important;
  height:48px!important;
  border-radius:15px!important;
  padding:7px!important;
  background:#fff!important;
}
.portal-card.hyperpos img{
  box-shadow:inset 0 0 0 1px #ffd0da,0 4px 12px rgba(255,49,93,.08)!important;
}
.portal-card.business img{
  box-shadow:inset 0 0 0 1px #d1e7ff,0 4px 12px rgba(10,132,255,.07)!important;
}
.portal-card b{
  font-size:19px!important;
  letter-spacing:-.02em!important;
}
.portal-card span{
  font-size:10px!important;
}
.portal-badge{
  padding:4px 7px!important;
  border-radius:999px!important;
  font-size:7px!important;
  box-shadow:none!important;
}

/* HOME stats as iOS widgets */
.mini-stats,
.home-live-stats{
  gap:8px!important;
}
.mini-stats div,
.home-stat{
  min-height:62px!important;
  border-radius:20px!important;
  box-shadow:0 5px 16px rgba(31,67,95,.07)!important;
}
.mini-stats div:nth-child(1),
.home-stat:nth-child(1){
  background:linear-gradient(145deg,#eef7ff,#ffffff)!important;
  border-color:#cfe4f6!important;
}
.mini-stats div:nth-child(2),
.home-stat:nth-child(2){
  background:linear-gradient(145deg,#effbf4,#ffffff)!important;
}
.mini-stats div:nth-child(3),
.home-stat:nth-child(3){
  background:linear-gradient(145deg,#fff7ea,#ffffff)!important;
  border-color:#f0ddbc!important;
}
.mini-stats div:nth-child(3) b,
.home-stat:nth-child(3) b{
  color:#d58d17!important;
}

/* HYPERPOS / MENÜ TOP TABS — iOS segmented control */
.hp-tabs{
  top:66px!important;
  margin:0 -9px 10px!important;
  padding:7px 9px!important;
  background:#f5f9fc!important;
  border-bottom:1px solid #dce7f0!important;
  box-shadow:none!important;
}
.hp-tabs-scroll{
  display:flex!important;
  gap:5px!important;
  padding:4px!important;
  background:#e9f1f7!important;
  border:1px solid #d8e4ed!important;
  border-radius:17px!important;
}
.hp-tabs button{
  height:36px!important;
  min-width:78px!important;
  padding:0 11px!important;
  border:none!important;
  border-radius:13px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#647b8e!important;
  font-size:9px!important;
  font-weight:900!important;
}
.hp-tabs button.active{
  background:#fff!important;
  color:#152b3f!important;
  box-shadow:0 2px 8px rgba(24,56,79,.09)!important;
}

/* MENU / PRODUCTS — iOS cards */
.hp-menu-tools{
  gap:7px!important;
}
.hp-menu-tools input{
  height:42px!important;
  border-radius:14px!important;
}
.hp-menu-tools button{
  height:42px!important;
  width:42px!important;
  border-radius:14px!important;
}
.hp-cat-strip{
  gap:6px!important;
  padding:4px 0 8px!important;
}
.hp-cat-strip button{
  height:34px!important;
  padding:0 12px!important;
  border-radius:999px!important;
  background:#fff!important;
  border:1px solid #dbe6ee!important;
  box-shadow:0 3px 10px rgba(25,57,79,.05)!important;
}
.hp-cat-strip button.active{
  background:#0a84ff!important;
  border-color:#0a84ff!important;
  color:#fff!important;
}
.hp-product-grid{
  gap:9px!important;
}
.hp-product{
  border-radius:20px!important;
  overflow:hidden!important;
  box-shadow:0 6px 18px rgba(27,65,95,.08)!important;
}
.hp-product img{
  height:84px!important;
  object-fit:cover!important;
}
.hp-product .pbody{
  padding:9px 10px!important;
}
.hp-product b{
  font-size:12px!important;
  line-height:1.25!important;
}
.hp-product span{
  font-size:12px!important;
  font-weight:900!important;
}
.hp-product em,
.hp-qbadge{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  border-radius:10px!important;
  background:#ff315d!important;
}

/* ORDER HEADER / ACTIONS */
.hp-order-head{
  border-radius:20px!important;
  padding:10px 11px!important;
}
.hp-order-head button{
  width:38px!important;
  height:38px!important;
  border-radius:13px!important;
}
.hp-order-actions{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
}
.hp-order-actions button{
  min-width:0!important;
  height:38px!important;
  padding:0 6px!important;
  border-radius:12px!important;
  font-size:8px!important;
}

/* CART / PAYMENT — iOS grouped sections */
.hp-cart,
.hp-paybox,
.hp-quick-cartbar{
  border-radius:22px!important;
  box-shadow:0 7px 20px rgba(28,62,87,.08)!important;
}
.hp-cart h4{
  padding:12px 13px!important;
}
.hp-cart-row{
  padding:10px 12px!important;
}
.hp-total-card{
  border-radius:16px!important;
  background:#f5f9fc!important;
}
.hp-pay-grid,
.hp-pay-row{
  gap:8px!important;
}
.hp-pay-grid button,
.hp-pay-row button{
  min-height:46px!important;
  border-radius:15px!important;
}

/* QUICK SALE / PACKAGE / KITCHEN / ONLINE / HISTORY */
.hp-op-card{
  border-radius:19px!important;
  box-shadow:0 6px 18px rgba(27,65,95,.07)!important;
}
.hp-op-card button{
  border-radius:13px!important;
}
.hp-section-head{
  padding:2px 1px 4px!important;
}
.hp-section-head h3{
  font-size:19px!important;
}
.hp-info{
  border-radius:16px!important;
  background:#fff!important;
  color:#677f91!important;
  border:1px solid #dfe9f0!important;
}

/* BUSINESS — iOS Settings style grouped list */
.biz-summary{
  gap:8px!important;
}
.biz-summary div{
  border-radius:20px!important;
}
.biz-menu-wrap{
  gap:8px!important;
}
.biz-card{
  min-height:72px!important;
  padding:10px 12px!important;
  border-radius:20px!important;
  box-shadow:0 5px 16px rgba(27,65,95,.07)!important;
}
.biz-card .biz-ico{
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  background:#eef6fc!important;
}
.biz-card.open{
  background:#fff7f9!important;
  border-color:#ffc4d0!important;
}
.biz-submenu,
.biz-subsubmenu{
  gap:6px!important;
  padding-left:8px!important;
  margin-left:12px!important;
}
.biz-subitem,
.biz-subsubitem{
  min-height:48px!important;
  border-radius:15px!important;
  box-shadow:0 3px 10px rgba(27,65,95,.05)!important;
}
.biz-subitem .sub-ico,
.biz-subsubitem .sub2-ico{
  width:34px!important;
  height:34px!important;
  border-radius:11px!important;
}
.biz-content{
  border-radius:22px!important;
  padding:12px!important;
}
.biz-row,
.biz-kpi,
.biz-profile{
  border-radius:16px!important;
}

/* SETTINGS — native iOS feel */
#settingsView .panel{
  border-radius:24px!important;
}
.settings-row{
  min-height:54px!important;
  padding:11px 4px!important;
  border-bottom:1px solid #e4ebf1!important;
}
.settings-row:last-child{
  border-bottom:none!important;
}

/* iOS bottom-sheet */
.hp-action-sheet{
  border-radius:30px 30px 20px 20px!important;
  padding:16px!important;
}
.hp-action-grid{
  gap:8px!important;
}
.hp-action-grid button{
  min-height:50px!important;
  border-radius:16px!important;
}
.hp-action-cancel{
  min-height:46px!important;
  border-radius:16px!important;
}

/* MASALAR — existing colorful iOS cards, polish */
#hyperposView:has([data-hp-tab="tables"].active) #hpContent{
  border-radius:24px!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-table-kpis>div{
  border-radius:20px!important;
  box-shadow:0 7px 18px rgba(24,65,95,.10)!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-master-area-tabs button{
  border-radius:999px!important;
  min-width:82px!important;
}
#hyperposView:has([data-hp-tab="tables"].active) .hp-floor-table{
  border-radius:22px!important;
  box-shadow:0 7px 18px rgba(24,65,95,.10)!important;
}

/* Mobile fit */
@media(max-width:390px){
  .brand{
    max-width:156px!important;
    padding:5px 8px!important;
  }
  .portal-card{
    min-height:88px!important;
  }
  .hp-order-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .biz-card{
    min-height:66px!important;
  }
}


/* =========================================================
   V42.6.2 — TABLE EDITOR MENU-FIRST
   Ürüne hızlı erişim için Menü en üstte; adisyon ve operasyonlar aşağıda.
   ========================================================= */

.hp-menu-first{
  margin-top:8px;
  padding:9px;
  border-radius:20px;
  background:#ffffff;
  border:1px solid #dce7f0;
  box-shadow:0 6px 18px rgba(27,65,95,.07);
}

.hp-menu-first .hp-menu-tools{
  position:sticky;
  top:118px;
  z-index:8;
  padding:2px 0 6px;
  background:#fff;
}

.hp-menu-first .hp-cat-strip{
  position:sticky;
  top:166px;
  z-index:7;
  margin:0 -2px;
  padding:2px 2px 7px!important;
  background:#fff;
}

.hp-menu-first .hp-product-grid{
  margin-top:2px;
}

/* ürünler daha hızlı taransın */
.hp-menu-first .hp-product{
  min-height:108px!important;
}
.hp-menu-first .hp-product img{
  height:74px!important;
}
.hp-menu-first .hp-product .pbody{
  padding:7px 8px!important;
}

/* Adisyon artık menüden sonra, kompakt grouped-card */
.hp-cart{
  margin-top:10px!important;
}
.hp-cart h4{
  font-size:12px!important;
  letter-spacing:.05em;
  color:#6f8596!important;
}

/* Yetki/iskonto/iade/masa işlemleri alt ve ikincil */
.hp-secondary-ops{
  margin-top:10px;
  padding:9px;
  border-radius:19px;
  background:#f8fbfd;
  border:1px solid #dfe8ef;
}
.hp-secondary-ops .hp-acl{
  margin-bottom:7px;
  opacity:.90;
}
.hp-secondary-ops .hp-order-actions{
  margin-top:0!important;
}

/* Küçük telefonlarda menü alanına daha fazla yer */
@media(max-width:390px){
  .hp-menu-first{
    margin-left:-2px;
    margin-right:-2px;
    padding:7px;
    border-radius:17px;
  }
  .hp-menu-first .hp-menu-tools{
    top:110px;
  }
  .hp-menu-first .hp-cat-strip{
    top:158px;
  }
  .hp-menu-first .hp-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
}


/* =========================================================
   V42.6.3 — EPIC iOS LOGIN
   Menü-first düzen korunur, giriş ekranı premiumlaştırılır.
   ========================================================= */

#pairView{
  position:relative;
  display:grid!important;
  grid-template-rows:auto auto;
  align-content:center!important;
  gap:10px!important;
  min-height:calc(100dvh - 82px)!important;
  max-height:calc(100dvh - 82px)!important;
  overflow:hidden!important;
}

#pairView:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 10% 10%,rgba(255,49,93,.16),transparent 26%),
    radial-gradient(circle at 90% 4%,rgba(10,132,255,.15),transparent 30%);
  z-index:0;
}

#pairView > *{
  position:relative;
  z-index:1;
}

/* hero — iPhone launch-screen hissi */
#pairView .hero{
  min-height:190px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  padding:20px!important;
  border-radius:28px!important;
  background:
    linear-gradient(180deg,rgba(10,22,34,.05),rgba(8,17,27,.74)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 14px 34px rgba(28,60,84,.16)!important;
  overflow:hidden!important;
}

#pairView .hero:after{
  content:"QRAVM";
  position:absolute;
  top:16px;
  left:18px;
  padding:7px 11px;
  border-radius:14px;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.08em;
  color:#fff;
  background:linear-gradient(135deg,#ff315d,#e91f4d);
  box-shadow:0 6px 16px rgba(255,49,93,.20);
}

#pairView .hero h1{
  margin:0!important;
  color:#fff!important;
  font-size:30px!important;
  letter-spacing:-.04em!important;
  text-shadow:0 2px 12px rgba(0,0,0,.28)!important;
}

#pairView .hero p{
  margin:5px 0 0!important;
  max-width:92%!important;
  color:rgba(255,255,255,.86)!important;
  font-size:11px!important;
  line-height:1.4!important;
}

/* login card */
#pairView .panel{
  padding:16px!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.97)!important;
  border:1px solid rgba(219,231,240,.95)!important;
  box-shadow:0 12px 30px rgba(27,65,95,.12)!important;
}

#pairView .panel h2{
  margin:0 0 10px!important;
  font-size:20px!important;
  letter-spacing:-.025em!important;
  color:#102033!important;
}

#pairView label{
  display:block!important;
  margin-bottom:7px!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
  color:#6d8597!important;
}

#pairView input{
  height:48px!important;
  border-radius:16px!important;
  background:#f7fafc!important;
  border:1px solid #dce7ef!important;
  box-shadow:none!important;
  font-size:14px!important;
}

#pairView input:focus{
  background:#fff!important;
  border-color:#8fc9ff!important;
  box-shadow:0 0 0 4px rgba(10,132,255,.10)!important;
}

#pairView .primary{
  height:50px!important;
  margin-top:9px!important;
  border-radius:16px!important;
  font-size:13px!important;
  font-weight:1000!important;
  letter-spacing:.02em!important;
  background:linear-gradient(135deg,#ff315d,#f21f4d)!important;
  box-shadow:0 10px 20px rgba(255,49,93,.18)!important;
}

#pairView .primary:after{
  content:"  →";
}

#pairView .muted,
#pairView small{
  color:#8aa0b1!important;
}

/* compact short-screen mode */
@media(max-height:760px){
  #pairView{
    min-height:calc(100dvh - 64px)!important;
    max-height:calc(100dvh - 64px)!important;
    gap:7px!important;
  }
  #pairView .hero{
    min-height:132px!important;
    padding:14px!important;
    border-radius:22px!important;
  }
  #pairView .hero:after{
    top:10px;left:12px;font-size:10px;padding:5px 8px;
  }
  #pairView .hero h1{font-size:24px!important}
  #pairView .hero p{font-size:9px!important}
  #pairView .panel{
    padding:11px!important;
    border-radius:20px!important;
  }
  #pairView input{height:41px!important}
  #pairView .primary{height:43px!important}
}

@media(max-width:390px){
  #pairView .hero{
    min-height:160px!important;
    padding:16px!important;
  }
  #pairView .panel{
    padding:13px!important;
  }
}


/* =========================================================
   V42.6.4 — BUSINESS ENTRY INTERACTION FIX
   ========================================================= */
#businessCard{
  position:relative!important;
  z-index:2!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  pointer-events:auto!important;
}
#businessCard:before,
#businessCard:after,
#businessCard *{
  pointer-events:none!important;
}
#businessCard:active{
  transform:scale(.985)!important;
}


/* =========================================================
   V42.7.0 — SPLASH + DIRECT POS FLOW + SITE LOGO
   ========================================================= */

/* Site logo */
.site-logo{
  height:34px!important;
  width:auto!important;
  max-width:172px!important;
  object-fit:contain!important;
  background:#fff!important;
  border:1px solid #dfe8ef!important;
  padding:7px 10px!important;
  border-radius:16px!important;
  box-shadow:0 5px 14px rgba(27,65,95,.08)!important;
}
.site-home-logo{
  width:min(210px,66vw)!important;
  height:auto!important;
  padding:9px 12px!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(255,255,255,.92)!important;
  box-shadow:0 7px 20px rgba(27,65,95,.10)!important;
}
.site-home-logo img{
  display:block!important;
  width:100%!important;
  max-height:48px!important;
  object-fit:contain!important;
}

/* Splash */
.q-splash{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#eef6fc;
  color:#0d1d2b;
  transition:opacity .30s ease;
}
.q-splash.out{opacity:0;pointer-events:none}
.q-splash-bg{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(248,252,255,.36),rgba(244,249,253,.93)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover no-repeat;
}
.q-splash-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(1px);
  opacity:.68;
}
.q-splash .qg1{
  width:260px;height:260px;
  top:-100px;left:-90px;
  background:radial-gradient(circle,rgba(255,49,93,.30),transparent 70%);
}
.q-splash .qg2{
  width:300px;height:300px;
  right:-120px;bottom:-120px;
  background:radial-gradient(circle,rgba(10,132,255,.28),transparent 70%);
}
.q-splash-content{
  position:relative;
  z-index:2;
  width:min(86vw,420px);
  text-align:center;
}
.q-splash-logo-wrap{
  margin:0 auto 18px;
  padding:18px 20px;
  border-radius:28px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 20px 55px rgba(23,58,84,.17);
}
.q-splash-logo{
  display:block;
  width:100%;
  max-height:64px;
  object-fit:contain;
}
.q-splash-kicker{
  display:block;
  margin-bottom:8px;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.18em;
  color:#ff315d;
}
.q-splash h1{
  margin:0;
  font-size:29px;
  letter-spacing:-.045em;
  color:#102033;
}
.q-splash p{
  margin:7px 0 18px;
  font-size:11px;
  font-weight:800;
  color:#678094;
}
.q-splash-loader{
  display:flex;
  justify-content:center;
  gap:6px;
}
.q-splash-loader i{
  width:7px;height:7px;
  border-radius:50%;
  background:#cbd9e3;
  animation:qSplashPulse 1s infinite ease-in-out;
}
.q-splash-loader i:nth-child(2){animation-delay:.14s;background:#ff315d}
.q-splash-loader i:nth-child(3){animation-delay:.28s;background:#0a84ff}
@keyframes qSplashPulse{
  0%,100%{transform:translateY(0);opacity:.48}
  50%{transform:translateY(-5px);opacity:1}
}
.q-splash>small{
  position:absolute;
  z-index:2;
  left:0;right:0;
  bottom:max(18px,env(safe-area-inset-bottom));
  text-align:center;
  color:#8196a6!important;
  font-size:8px;
  letter-spacing:.08em;
}

/* Pair page now explicitly step 2 */
#pairView .panel:before{
  content:"1";
  width:28px;height:28px;
  margin-bottom:9px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#ff315d;
  color:#fff;
  font-size:12px;
  font-weight:1000;
  box-shadow:0 5px 12px rgba(255,49,93,.18);
}
#pairView .panel h2{
  margin-top:0!important;
}
#pairView .panel .muted:first-of-type{
  max-width:440px;
}

/* Table editor: menu is primary, added items below, operations last */
.hp-menu-first{
  order:1;
}
.hp-cart{
  order:2;
}
.hp-totals{
  order:3;
}
.hp-secondary-ops{
  order:4;
}
.hp-save{
  order:5;
}
.hp-paybox{
  order:6;
}
#hpSaveStatus{
  order:7;
}

/* Product menu stays immediately reachable */
.hp-menu-first{
  margin-top:7px!important;
  padding:8px!important;
  background:#fff!important;
  border:1px solid #dce7ef!important;
  border-radius:20px!important;
  box-shadow:0 6px 18px rgba(27,65,95,.07)!important;
}
.hp-menu-first .hp-menu-tools{
  margin-bottom:5px!important;
}
.hp-menu-first .hp-cat-strip{
  margin-bottom:2px!important;
}
.hp-cart{
  margin-top:9px!important;
  border-radius:19px!important;
}
.hp-secondary-ops{
  margin-top:9px!important;
  background:#f7fafc!important;
  border:1px solid #e0e9f0!important;
  border-radius:18px!important;
}
.hp-secondary-ops .hp-acl{
  opacity:.78;
  margin-bottom:7px;
}

/* Short phones */
@media(max-height:700px){
  .q-splash-logo-wrap{margin-bottom:12px;padding:13px 16px}
  .q-splash-logo{max-height:50px}
  .q-splash h1{font-size:24px}
  .q-splash p{margin-bottom:12px}
}


/* =========================================================
   V42.7.1 — AUTH FLOW CLARITY
   Ana giriş sadece e-posta/parola; PIN yalnız ikinci adım.
   ========================================================= */

#pairView .panel:before{
  content:"1. ADIM"!important;
  width:auto!important;
  height:28px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  font-size:8px!important;
  letter-spacing:.08em!important;
}

#pairView .panel h2{
  font-size:21px!important;
}

#pinView .pin-help{
  margin:0 0 9px!important;
  font-size:9px!important;
  line-height:1.35!important;
  color:#7d93a4!important;
}

#pinView .eyebrow{
  color:#ff315d!important;
}


/* =========================================================
   V42.7.2 — LOGIN ACTIVE + DARK LOGO + SINGLE SPLASH
   ========================================================= */

/* New splash: dark, site white logo stays visible */
.q-splash{
  background:#06111b!important;
  color:#fff!important;
}
.q-splash-bg{
  background:
    linear-gradient(180deg,rgba(4,11,18,.28),rgba(4,11,18,.94)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover no-repeat!important;
}
.q-splash-logo-wrap{
  background:rgba(5,16,26,.90)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.30)!important;
}
.q-splash h1{color:#fff!important}
.q-splash p{color:#b8cad6!important}
.q-splash>small{color:#8297a7!important}

/* Top site logo: white logo on dark tile */
.site-logo{
  background:#071827!important;
  border:1px solid #183248!important;
  box-shadow:0 5px 14px rgba(0,0,0,.16)!important;
}

/* Pair is now ONE clean screen; old hero removed */
#pairView{
  grid-template-rows:auto!important;
  align-content:center!important;
}
#pairView .panel{
  max-width:520px;
  width:100%;
  margin:0 auto;
  padding:18px!important;
}
.pair-site-logo{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:64px;
  margin-bottom:14px;
  padding:11px 16px;
  border-radius:18px;
  background:#071827;
  border:1px solid #173148;
  box-shadow:0 8px 20px rgba(20,51,74,.12);
}
.pair-site-logo img{
  display:block;
  width:min(230px,72vw);
  max-height:48px;
  object-fit:contain;
}

/* Login button must visibly be active */
#pairBtn{
  opacity:1!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
}
#pairBtn:disabled{
  opacity:.70!important;
  cursor:wait!important;
}
#pairBtn:not(:disabled){
  background:linear-gradient(135deg,#ff315d,#e91f4d)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(255,49,93,.20)!important;
}

/* Remove old pair hero completely even if cached markup remains */
#pairView>.hero{
  display:none!important;
}


/* =========================================================
   V42.7.4 — VIEW HIDE FIX + PREMIUM iOS HOME
   ========================================================= */

/* KRİTİK: hidden view'lar ID display kurallarına yenilmesin */
#pairView.hidden,
#businessSelectView.hidden,
#pinView.hidden,
#homeView.hidden,
#hyperposView.hidden,
#businessView.hidden,
#settingsView.hidden{
  display:none!important;
}

/* Home screen */
#homeView{
  min-height:calc(100dvh - 84px)!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:max(12px,env(safe-area-inset-bottom));
}

.ios-home-welcome{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 10px!important;
  padding:2px 2px 8px!important;
  border-bottom:1px solid #dde7ef!important;
}
.ios-home-welcome-copy h1{
  margin:2px 0 0!important;
  font-size:22px!important;
  letter-spacing:-.03em!important;
  color:#112437!important;
}
.ios-home-welcome-copy p{
  margin:2px 0 0!important;
  font-size:9px!important;
  color:#758c9d!important;
}
.ios-logout{
  height:38px!important;
  padding:0 13px!important;
  border-radius:14px!important;
  background:#fff!important;
  border:1px solid #dce7ef!important;
  color:#d7264d!important;
  box-shadow:0 4px 12px rgba(31,67,95,.05)!important;
}

.ios-home-hero{
  position:relative;
  overflow:hidden;
  min-height:150px;
  display:flex;
  align-items:flex-end;
  padding:17px;
  border-radius:28px;
  background:
    linear-gradient(135deg,rgba(6,17,27,.24),rgba(6,17,27,.82)),
    url('./assets/portal_hyperpos_bg.jpg') center/cover;
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 12px 30px rgba(28,60,84,.13);
}
.ios-home-hero:after{
  content:"";
  position:absolute;
  width:180px;height:180px;
  right:-70px;top:-85px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,49,93,.34),transparent 68%);
}
.ios-home-logo{
  position:absolute;
  top:14px;left:14px;
  z-index:2;
  padding:8px 11px;
  border-radius:15px;
  background:#071827;
  border:1px solid rgba(255,255,255,.15);
}
.ios-home-logo img{
  display:block;
  width:min(165px,46vw);
  max-height:32px;
  object-fit:contain;
}
.ios-home-hero-copy{
  position:relative;
  z-index:2;
}
.ios-home-hero-copy>span{
  display:block;
  margin-bottom:4px;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.17em;
  color:#ff6c8a;
}
.ios-home-hero-copy h2{
  margin:0;
  font-size:24px;
  letter-spacing:-.04em;
  color:#fff!important;
}
.ios-home-hero-copy p{
  margin:4px 0 0;
  font-size:10px;
  color:rgba(255,255,255,.78)!important;
}

.ios-launch-grid{
  display:grid;
  gap:10px;
  margin-top:11px;
}
.ios-launch-card{
  position:relative;
  width:100%;
  min-height:106px;
  display:grid;
  grid-template-columns:54px 1fr 28px;
  align-items:center;
  gap:11px;
  padding:13px 14px;
  border-radius:24px;
  text-align:left;
  border:1px solid #dfe8ef;
  background:#fff;
  box-shadow:0 8px 22px rgba(27,65,95,.08);
}
.ios-launch-card.hyperpos{
  background:linear-gradient(135deg,#fff 0%,#fff6f8 100%);
  border-color:#ffc6d3;
}
.ios-launch-card.business{
  background:linear-gradient(135deg,#fff 0%,#f2f8ff 100%);
  border-color:#c8e1fa;
}
.ios-launch-icon{
  width:54px;height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:17px;
  background:#fff;
  border:1px solid #e1e9ef;
  box-shadow:0 5px 14px rgba(28,60,84,.06);
}
.ios-launch-card.hyperpos .ios-launch-icon{
  background:#fff1f4;
  border-color:#ffcbd6;
}
.ios-launch-card.business .ios-launch-icon{
  background:#eef7ff;
  border-color:#cce4fb;
}
.ios-launch-icon img{
  width:36px;height:36px;
  object-fit:contain;
}
.ios-launch-copy{
  min-width:0;
}
.ios-launch-kicker{
  display:block;
  margin-bottom:3px;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.14em;
  color:#ff315d;
}
.ios-launch-card.business .ios-launch-kicker{
  color:#0a84ff;
}
.ios-launch-copy strong{
  display:block;
  margin-bottom:3px;
  font-size:19px;
  letter-spacing:-.025em;
  color:#102033!important;
}
.ios-launch-copy small{
  display:block;
  font-size:9px;
  line-height:1.35;
  color:#71889a!important;
}
.ios-launch-arrow{
  font-size:30px;
  line-height:1;
  color:#a0b2bf;
  text-align:right;
}
.ios-launch-card:active{
  transform:scale(.992);
}

.ios-home-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:10px;
}
.ios-home-stats>div{
  min-height:66px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border-radius:19px;
  background:#fff;
  border:1px solid #dfe8ef;
  box-shadow:0 5px 15px rgba(27,65,95,.06);
}
.ios-home-stats>div:nth-child(1){
  background:linear-gradient(145deg,#eef7ff,#fff);
  border-color:#cfe4f7;
}
.ios-home-stats>div:nth-child(2){
  background:linear-gradient(145deg,#effbf4,#fff);
  border-color:#cce8d8;
}
.ios-home-stats>div:nth-child(3){
  background:linear-gradient(145deg,#fff7eb,#fff);
  border-color:#f0dfbf;
}
.ios-home-stats span{
  font-size:8px;
  font-weight:900;
  color:#7a91a2;
}
.ios-home-stats b{
  margin-top:4px;
  font-size:22px;
  line-height:1;
  color:#132639!important;
}
.ios-home-stats>div:nth-child(2) b{color:#16a365!important}
.ios-home-stats>div:nth-child(3) b{color:#d58a12!important}

.ios-home-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  padding:9px 11px;
  border-radius:15px;
  background:#f8fbfd;
  border:1px solid #e1e9ef;
}
.ios-home-foot span{
  font-size:8px;
  font-weight:1000;
  letter-spacing:.06em;
  color:#23a66b;
}
.ios-home-foot small{
  font-size:7px;
  color:#8397a6!important;
  text-align:right;
}

@media(max-width:390px){
  .ios-home-hero{min-height:138px;padding:14px}
  .ios-home-hero-copy h2{font-size:21px}
  .ios-launch-card{min-height:96px;grid-template-columns:48px 1fr 22px;padding:11px 12px}
  .ios-launch-icon{width:48px;height:48px;border-radius:15px}
  .ios-launch-icon img{width:32px;height:32px}
  .ios-launch-copy strong{font-size:17px}
  .ios-home-stats>div{min-height:59px}
  .ios-home-stats b{font-size:20px}
}

/* V42.7.8 — SAFE HOME SCREEN SHORTCUT MODE */
.shortcut-note{
  margin:10px 0;padding:11px 12px;border:1px solid #17415d;border-radius:12px;
  background:#081f30;color:#91b1c5;font-size:11px;line-height:1.45
}
.shortcut-note b{color:#e8f7ff}
#shortcutHelpBtn{width:100%;margin-top:8px}
.shortcut-help{
  position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.62);display:flex;align-items:flex-end;justify-content:center;padding:12px
}
.shortcut-help-card{
  width:min(100%,520px);background:#081b29;border:1px solid #1b4966;border-radius:20px;padding:16px;color:white
}
.shortcut-help-card h3{margin:0 0 10px}.shortcut-help-card ol{margin:0;padding-left:20px;color:#a6c1d2;line-height:1.65}
.shortcut-help-card button{width:100%;height:44px;margin-top:12px;border:0;border-radius:12px;background:#0f84d9;color:#fff;font-weight:900}