/* Critical styles - optimized for fast loading */
body{font-family:'Inter',sans-serif;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh}
.pos-container{width:100%;max-width:400px;margin:0 auto;box-sizing:border-box;min-height:100vh;display:flex;flex-direction:column}
.admin-container{max-width:1400px;width:100%}
.bet-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;margin-bottom:.5rem;background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);border-radius:.75rem;box-shadow:0 4px 6px rgba(0,0,0,.05),0 1px 3px rgba(0,0,0,.1);border:1px solid #e2e8f0;transition:all .2s ease}
.bet-item:hover{box-shadow:0 8px 15px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.1);transform:translateY(-1px)}
.bet-item span{font-weight:600}
.bet-item .bet-details{display:flex;flex-direction:column;text-align:right;font-size:.75rem;color:#4b5563}
.input-active{border:2px solid #10b981;box-shadow:0 0 0 3px rgba(16,185,129,.1)}
.glass-effect{background:rgba(255,255,255,.25);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}
.card-hover{transition:all .3s ease}
.card-hover:hover{transform:translateY(-5px);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}
.gradient-text{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.btn-gradient{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);transition:all .3s ease}
.btn-gradient:hover{background:linear-gradient(135deg,#5a6fd8 0%,#6a4190 100%);transform:translateY(-2px);box-shadow:0 10px 20px rgba(102,126,234,.4)}
.keypad-modern{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);box-shadow:0 4px 6px rgba(102,126,234,.2);transition:all .2s ease}
.keypad-modern:hover{background:linear-gradient(135deg,#5a6fd8 0%,#6a4190 100%);transform:translateY(-2px);box-shadow:0 6px 12px rgba(102,126,234,.3)}
.stats-card{background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);border:1px solid #e2e8f0;border-radius:1rem;transition:all .3s ease}
.stats-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px rgba(0,0,0,.1);border-color:#cbd5e0}
#ticketTemplate{position:absolute;left:-9999px;top:-9999px;background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);margin:0 auto;padding:12px;font-family:'Inter',sans-serif;color:#1a202c;font-size:14px;border-radius:12px;box-shadow:0 10px 25px rgba(0,0,0,.15);width:58mm!important;box-sizing:border-box}
@media (display-mode:standalone){#ticketTemplate{font-family:Arial,sans-serif!important;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#ticketTemplate *{font-family:Arial,sans-serif!important;box-sizing:border-box!important}#ticketTemplate img{max-width:100%!important;height:auto!important;display:block!important}#ticketTemplate div{box-sizing:border-box!important}}
#qrcode-container img{width:100%!important;height:100%!important}
.keypad-btn{padding:.875rem;font-size:1.25rem;font-weight:600;border-radius:.75rem;transition:all .2s ease}
.admin-tab,.summary-tab,.summary-tab-rambolito,.payout-tab,.history-tab{padding:12px 24px;cursor:pointer;border-bottom:3px solid transparent;font-weight:600;font-size:.95rem;transition:all .3s ease;border-radius:8px 8px 0 0;margin-right:4px;white-space:nowrap;flex-shrink:0}
@media (max-width:768px){.admin-tab,.summary-tab,.summary-tab-rambolito,.payout-tab,.history-tab{padding:8px 12px;font-size:.8rem;margin-right:2px;border-radius:6px}}
@media (max-width:480px){.admin-tab,.summary-tab,.summary-tab-rambolito,.payout-tab,.history-tab{padding:6px 8px;font-size:.75rem;margin-right:1px;border-radius:4px;min-width:auto}}
.admin-tab{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);color:#64748b}
.admin-tab.active{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;border-bottom-color:transparent;box-shadow:0 4px 6px rgba(102,126,234,.2)}
.admin-tab:hover:not(.active){background:linear-gradient(135deg,#e2e8f0 0%,#cbd5e0 100%);color:#4a5568}
.summary-tab.active,.summary-tab-rambolito.active,.payout-tab.active,.history-tab.active{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;box-shadow:0 4px 6px rgba(102,126,234,.2);border-radius:.5rem}
.summary-tab:not(.active),.summary-tab-rambolito:not(.active),.payout-tab:not(.active),.history-tab:not(.active){background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%);color:#64748b;border-radius:.5rem}
.summary-tab:hover:not(.active),.summary-tab-rambolito:hover:not(.active),.payout-tab:hover:not(.active),.history-tab:hover:not(.active){background:linear-gradient(135deg,#e2e8f0 0%,#cbd5e0 100%);color:#4a5568;transform:translateY(-1px)}
.bet-type-btn.selected{background:#1f2937!important;color:white!important;border-color:#1f2937!important}
.bet-type-btn:active{background:#1f2937!important;color:white!important;border-color:#1f2937!important}
.border-b.border-gray-200.overflow-x-auto{scrollbar-width:thin;scrollbar-color:#cbd5e0 #f1f5f9}
.border-b.border-gray-200.overflow-x-auto::-webkit-scrollbar{height:4px}
.border-b.border-gray-200.overflow-x-auto::-webkit-scrollbar-track{background:#f1f5f9;border-radius:2px}
.border-b.border-gray-200.overflow-x-auto::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}
.border-b.border-gray-200.overflow-x-auto::-webkit-scrollbar-thumb:hover{background:#9ca3af}
@media (max-width:640px){#payouts-tabs-container{justify-content:flex-start!important;gap:.5rem}.payout-tab{flex:0 0 auto;text-align:center}}
.tab-content{display:none}
.tab-content.active{display:block}
#agentList tr,#betLimitsTable tr{cursor:pointer}
#historyModal .tab-content.active{display:flex!important;flex-direction:column}
.keypad-btn{padding:.5rem;font-size:1.25rem}
.pwa-mode{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
@media (display-mode:standalone) and (max-device-width:428px){.pos-container{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.glass-effect{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}}
@media (display-mode:standalone){body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.keypad-btn,.btn-gradient,.admin-tab{-webkit-tap-highlight-color:transparent}.keypad-btn:active,.btn-gradient:active{transform:translateY(0px) scale(.98)}}
.offline-indicator{position:fixed;top:0;left:0;right:0;background:#f59e0b;color:white;text-align:center;padding:.5rem;font-size:.875rem;z-index:1000;transform:translateY(-100%);transition:transform .3s ease}
.offline-indicator.show{transform:translateY(0)}
.rotate-180{transform:rotate(180deg)}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:200ms}
.collapsible-header{cursor:pointer;user-select:none;position:relative}
.collapsible-header:hover{background-color:rgba(59,130,246,.05);border-radius:.5rem}
.collapsible-content{transition:all .3s ease-in-out;overflow:hidden}
.chevron-icon{transition:transform .3s ease-in-out;filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}
.expand-indicator{background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:50%;padding:4px;color:white;box-shadow:0 2px 4px rgba(0,0,0,.1)}
.tooltip{position:relative;display:inline-block}
.tooltip .tooltiptext{visibility:hidden;width:200px;background-color:#1f2937;color:white;text-align:center;border-radius:6px;padding:8px;font-size:12px;position:absolute;z-index:1000;bottom:125%;left:50%;margin-left:-100px;opacity:0;transition:opacity .3s;box-shadow:0 4px 6px rgba(0,0,0,.1)}
.tooltip .tooltiptext::after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#1f2937 transparent transparent transparent}
.tooltip:hover .tooltiptext{visibility:visible;opacity:1}