/* Hidden input for HID card reader — offscreen but focusable */
.sr-only-pin-input[data-v-40398bfd] {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.casino-badge[data-v-40398bfd] {
display: inline-block;
margin: 0.25rem auto 0.5rem;
padding: 0.35rem 1rem;
background: rgba(255, 215, 0, 0.08);
border: 1px solid rgba(255, 215, 0, 0.25);
border-radius: 8px;
color: var(--neon-gold);
font-size: 0.9rem;
font-weight: 600;
letter-spacing: 0.03em;
text-align: center;
}
.pin-auth-header[data-v-40398bfd] {
text-align: center;
margin-bottom: 2rem;
}
.pin-auth-header h2[data-v-40398bfd] {
font-size: 1.8rem;
margin-bottom: 0.5rem;
}
.pin-display[data-v-40398bfd] {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 2rem;
}
.pin-dots[data-v-40398bfd] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
}
.pin-dot[data-v-40398bfd] {
width: 20px;
height: 20px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
border: 2px solid rgba(255, 255, 255, 0.3);
transition: all 0.3s ease;
}
.pin-dot.filled[data-v-40398bfd] {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 10px var(--neon-blue);
}
.pin-dots.card-mode[data-v-40398bfd] {
gap: 0.5rem;
}
.pin-dots.card-mode .pin-dot[data-v-40398bfd] {
width: 14px;
height: 14px;
}
.pin-dot.error[data-v-40398bfd] {
background: var(--neon-red);
border-color: var(--neon-red);
box-shadow: 0 0 10px var(--neon-red);
animation: shake-40398bfd 0.5s ease-in-out;
}
@keyframes shake-40398bfd {
0%,
100% {
transform: translateX(0);
}
25% {
transform: translateX(-5px);
}
75% {
transform: translateX(5px);
}
}
.error-message[data-v-40398bfd] {
color: var(--neon-red);
font-size: 0.9rem;
text-align: center;
}
.keypad[data-v-40398bfd] {
margin-bottom: 2rem;
}
.keypad-grid[data-v-40398bfd] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
max-width: 300px;
margin: 0 auto;
}
.key-button[data-v-40398bfd] {
width: 80px;
height: 80px;
background: var(--glass-bg);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid var(--glass-border);
border-radius: 16px;
color: var(--text-primary);
font-size: 1.5rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.key-button[data-v-40398bfd]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}
.key-button[data-v-40398bfd]:active:not(:disabled) {
transform: translateY(0);
}
.key-button[data-v-40398bfd]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.key-clear[data-v-40398bfd] {
background: rgba(255, 7, 58, 0.1);
border-color: var(--neon-red);
color: var(--neon-red);
font-size: 0.9rem;
}
.key-clear[data-v-40398bfd]:hover:not(:disabled) {
background: rgba(255, 7, 58, 0.2);
box-shadow: 0 8px 25px rgba(255, 7, 58, 0.3);
}
.key-backspace[data-v-40398bfd] {
background: rgba(255, 102, 0, 0.1);
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.key-backspace[data-v-40398bfd]:hover:not(:disabled) {
background: rgba(255, 102, 0, 0.2);
box-shadow: 0 8px 25px rgba(255, 102, 0, 0.3);
}
.auth-actions[data-v-40398bfd] {
display: flex;
justify-content: center;
margin-bottom: 1.5rem;
}
.btn-authenticate[data-v-40398bfd] {
padding: 16px 32px;
font-size: 1.1rem;
min-width: 160px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.btn-authenticate.neon-blue[data-v-40398bfd] {
border-color: var(--neon-blue);
color: var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
}
.btn-authenticate:hover:not(:disabled).neon-blue[data-v-40398bfd] {
background: rgba(0, 245, 255, 0.1);
box-shadow: 0 0 30px rgba(0, 245, 255, 0.5);
}
.loading-spinner[data-v-40398bfd] {
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-left: 2px solid var(--neon-blue);
border-radius: 50%;
animation: spin 1s linear infinite;
}
.auth-footer[data-v-40398bfd] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 1rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.75rem;
}
.btn-change-casino[data-v-40398bfd] {
background: rgba(255, 215, 0, 0.08);
border: 1px solid rgba(255, 215, 0, 0.25);
color: var(--neon-gold);
cursor: pointer;
font-size: 1rem;
font-weight: 600;
padding: 0.75rem 1.5rem;
border-radius: 10px;
transition: all 0.3s ease;
letter-spacing: 0.02em;
}
.btn-change-casino[data-v-40398bfd]:hover {
background: rgba(255, 215, 0, 0.15);
border-color: var(--neon-gold);
color: #fff8dc;
transform: translateY(-1px);
box-shadow: 0 4px 15px rgba(255, 215, 0, 0.15);
}
.modal-content[data-v-40398bfd] {
width: 500px;
max-width: 95vw;
padding: 2.5rem;
}
/* Touch-screen optimizations */
@media (max-width: 768px) {
.modal-content[data-v-40398bfd] {
width: 95vw;
padding: 2rem 1.5rem;
}
.key-button[data-v-40398bfd] {
width: 70px;
height: 70px;
font-size: 1.3rem;
}
.keypad-grid[data-v-40398bfd] {
gap: 0.8rem;
max-width: 250px;
}
}
/* Large touch screens */
@media (min-width: 1200px) {
.key-button[data-v-40398bfd] {
width: 100px;
height: 100px;
font-size: 1.8rem;
}
.keypad-grid[data-v-40398bfd] {
gap: 1.5rem;
max-width: 380px;
}
}
.toast-container[data-v-36ee4fb5] {
position: fixed;
top: 20px;
right: 20px;
z-index: 10000;
display: flex;
flex-direction: column;
gap: 12px;
pointer-events: none;
}
.toast-notification[data-v-36ee4fb5] {
display: flex;
align-items: flex-start;
gap: 12px;
min-width: 320px;
max-width: 500px;
padding: 16px;
border-radius: 16px;
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.3),
0 0 0 1px rgba(255, 255, 255, 0.05);
cursor: pointer;
pointer-events: auto;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.toast-notification[data-v-36ee4fb5]:hover {
transform: translateY(-2px);
box-shadow:
0 12px 40px rgba(0, 0, 0, 0.4),
0 0 0 1px rgba(255, 255, 255, 0.1);
}
/* Toast Types */
.toast-success[data-v-36ee4fb5] {
background: rgba(34, 197, 94, 0.15);
border-color: rgba(34, 197, 94, 0.3);
}
.toast-error[data-v-36ee4fb5] {
background: rgba(239, 68, 68, 0.15);
border-color: rgba(239, 68, 68, 0.3);
}
.toast-warning[data-v-36ee4fb5] {
background: rgba(245, 158, 11, 0.15);
border-color: rgba(245, 158, 11, 0.3);
}
.toast-info[data-v-36ee4fb5] {
background: rgba(59, 130, 246, 0.15);
border-color: rgba(59, 130, 246, 0.3);
}
.toast-icon[data-v-36ee4fb5] {
flex-shrink: 0;
font-size: 20px;
line-height: 1;
margin-top: 2px;
}
.toast-content[data-v-36ee4fb5] {
flex: 1;
min-width: 0;
}
.toast-title[data-v-36ee4fb5] {
font-weight: 600;
font-size: 14px;
color: var(--text-primary);
margin-bottom: 4px;
line-height: 1.4;
}
.toast-message[data-v-36ee4fb5] {
font-size: 13px;
color: var(--text-secondary);
line-height: 1.4;
word-wrap: break-word;
}
.toast-close[data-v-36ee4fb5] {
flex-shrink: 0;
background: none;
border: none;
color: var(--text-muted);
cursor: pointer;
font-size: 18px;
line-height: 1;
padding: 0;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.2s ease;
}
.toast-action[data-v-36ee4fb5] {
flex-shrink: 0;
margin-left: 8px;
background: rgba(255, 255, 255, 0.12);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--text-primary);
font-size: 12px;
padding: 6px 10px;
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease;
}
.toast-action[data-v-36ee4fb5]:hover {
background: rgba(255, 255, 255, 0.18);
}
.toast-close[data-v-36ee4fb5]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
/* Transitions */
.toast-enter-active[data-v-36ee4fb5],
.toast-leave-active[data-v-36ee4fb5] {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.toast-enter-from[data-v-36ee4fb5] {
opacity: 0;
transform: translateX(100%) scale(0.95);
}
.toast-leave-to[data-v-36ee4fb5] {
opacity: 0;
transform: translateX(100%) scale(0.95);
}
.toast-closing[data-v-36ee4fb5] {
opacity: 0.5;
transform: scale(0.95);
}
/* Responsive */
@media (max-width: 640px) {
.toast-container[data-v-36ee4fb5] {
top: 10px;
right: 10px;
left: 10px;
}
.toast-notification[data-v-36ee4fb5] {
min-width: auto;
max-width: none;
width: 100%;
}
}
/* Dark mode enhancements */
@media (prefers-color-scheme: dark) {
.toast-notification[data-v-36ee4fb5] {
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.6),
0 0 0 1px rgba(255, 255, 255, 0.1);
}
.toast-notification[data-v-36ee4fb5]:hover {
box-shadow:
0 12px 40px rgba(0, 0, 0, 0.7),
0 0 0 1px rgba(255, 255, 255, 0.15);
}
}
.update-notification[data-v-0249a426] {
position: fixed;
bottom: 20px;
left: 20px;
z-index: 9999;
min-width: 320px;
max-width: 420px;
padding: 20px;
border-radius: 16px;
background: rgba(34, 197, 94, 0.12);
backdrop-filter: blur(20px);
border: 1px solid rgba(34, 197, 94, 0.3);
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.3),
0 0 0 1px rgba(255, 255, 255, 0.05),
0 0 20px rgba(34, 197, 94, 0.1);
pointer-events: auto;
}
.update-header[data-v-0249a426] {
font-weight: 700;
font-size: 15px;
color: #22c55e;
margin-bottom: 12px;
letter-spacing: 0.3px;
}
.update-changes[data-v-0249a426] {
list-style: none;
padding: 0;
margin: 0 0 12px;
}
.update-changes li[data-v-0249a426] {
font-size: 12px;
color: rgba(255, 255, 255, 0.7);
padding: 3px 0;
line-height: 1.4;
}
.update-changes li[data-v-0249a426]::before {
content: '\2022';
color: rgba(34, 197, 94, 0.6);
margin-right: 8px;
}
.update-time[data-v-0249a426] {
font-size: 11px;
color: rgba(255, 255, 255, 0.4);
margin-bottom: 14px;
}
.update-btn[data-v-0249a426] {
width: 100%;
padding: 10px 16px;
background: linear-gradient(135deg, #22c55e, #16a34a);
border: none;
border-radius: 10px;
color: white;
font-size: 14px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
animation: pulse-glow-0249a426 2s infinite;
}
.update-btn[data-v-0249a426]:hover {
transform: translateY(-1px);
box-shadow: 0 4px 16px rgba(34, 197, 94, 0.4);
}
.update-btn[data-v-0249a426]:active {
transform: translateY(0);
}
@keyframes pulse-glow-0249a426 {
0%, 100% {
box-shadow: 0 0 8px rgba(34, 197, 94, 0.3);
}
50% {
box-shadow: 0 0 16px rgba(34, 197, 94, 0.5);
}
}
/* Slide in from left */
.update-slide-enter-active[data-v-0249a426] {
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.update-slide-leave-active[data-v-0249a426] {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.update-slide-enter-from[data-v-0249a426] {
opacity: 0;
transform: translateX(-100%);
}
.update-slide-leave-to[data-v-0249a426] {
opacity: 0;
transform: translateX(-100%);
}
@media (max-width: 640px) {
.update-notification[data-v-0249a426] {
left: 10px;
right: 10px;
bottom: 10px;
min-width: auto;
max-width: none;
}
}
.modal-overlay[data-v-ccc94b16] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(8px);
}
.confirmation-modal[data-v-ccc94b16] {
width: 90%;
max-width: 480px;
max-height: 90vh;
}
.modal-container[data-v-ccc94b16] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6);
overflow: hidden;
}
.modal-header[data-v-ccc94b16] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.icon-container[data-v-ccc94b16] {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
flex-shrink: 0;
}
.icon-danger[data-v-ccc94b16] {
background: rgba(239, 68, 68, 0.2);
border: 2px solid rgba(239, 68, 68, 0.5);
}
.icon-warning[data-v-ccc94b16] {
background: rgba(245, 158, 11, 0.2);
border: 2px solid rgba(245, 158, 11, 0.5);
}
.icon-info[data-v-ccc94b16] {
background: rgba(59, 130, 246, 0.2);
border: 2px solid rgba(59, 130, 246, 0.5);
}
.icon-question[data-v-ccc94b16] {
background: rgba(168, 85, 247, 0.2);
border: 2px solid rgba(168, 85, 247, 0.5);
}
.modal-header h3[data-v-ccc94b16] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
font-weight: 600;
}
.modal-body[data-v-ccc94b16] {
padding: 1.5rem;
}
.confirmation-message[data-v-ccc94b16] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
line-height: 1.5;
}
.confirmation-details[data-v-ccc94b16] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-secondary);
font-size: 0.9rem;
line-height: 1.4;
font-family: 'JetBrains Mono', 'Courier New', monospace;
white-space: pre-line;
}
.modal-footer[data-v-ccc94b16] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
}
.cancel-btn[data-v-ccc94b16] {
padding: 0.75rem 1.5rem;
font-weight: 500;
}
.confirm-btn[data-v-ccc94b16] {
padding: 0.75rem 1.5rem;
font-weight: 600;
}
.neon-red[data-v-ccc94b16] {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
border: 1px solid #ef4444;
}
.neon-red[data-v-ccc94b16]:hover {
background: #ef4444;
color: #000;
box-shadow: 0 0 20px rgba(239, 68, 68, 0.5);
transform: translateY(-2px);
}
.neon-orange[data-v-ccc94b16] {
background: rgba(245, 158, 11, 0.2);
color: #f59e0b;
border: 1px solid #f59e0b;
}
.neon-orange[data-v-ccc94b16]:hover {
background: #f59e0b;
color: #000;
box-shadow: 0 0 20px rgba(245, 158, 11, 0.5);
transform: translateY(-2px);
}
.neon-blue[data-v-ccc94b16] {
background: rgba(59, 130, 246, 0.2);
color: #3b82f6;
border: 1px solid #3b82f6;
}
.neon-blue[data-v-ccc94b16]:hover {
background: #3b82f6;
color: #000;
box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);
transform: translateY(-2px);
}
.neon-green[data-v-ccc94b16] {
background: rgba(34, 197, 94, 0.2);
color: #22c55e;
border: 1px solid #22c55e;
}
.neon-green[data-v-ccc94b16]:hover {
background: #22c55e;
color: #000;
box-shadow: 0 0 20px rgba(34, 197, 94, 0.5);
transform: translateY(-2px);
}
/* Animations */
.animate-fade-in[data-v-ccc94b16] {
animation: fadeIn-ccc94b16 0.2s ease-out;
}
.animate-scale-in[data-v-ccc94b16] {
animation: scaleIn-ccc94b16 0.2s ease-out;
}
@keyframes fadeIn-ccc94b16 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-ccc94b16 {
from {
opacity: 0;
transform: scale(0.9) translateY(20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
/* Responsive */
@media (max-width: 640px) {
.confirmation-modal[data-v-ccc94b16] {
width: 95%;
max-width: none;
}
.modal-header[data-v-ccc94b16] {
padding: 1rem;
}
.modal-body[data-v-ccc94b16] {
padding: 1rem;
}
.modal-footer[data-v-ccc94b16] {
padding: 1rem;
flex-direction: column;
}
.cancel-btn[data-v-ccc94b16],
.confirm-btn[data-v-ccc94b16] {
width: 100%;
}
}
.casino-switcher[data-v-065777f3] {
position: relative;
display: inline-flex;
flex-direction: column;
margin-right: 1rem;
}
.casino-switcher.disabled .switcher-trigger[data-v-065777f3] {
cursor: default;
}
.switcher-trigger[data-v-065777f3] {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
min-width: 180px;
}
.switcher-trigger[data-v-065777f3]:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.switcher-label[data-v-065777f3] {
font-weight: 600;
color: var(--text-primary);
}
.switcher-meta[data-v-065777f3] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.switcher-icon[data-v-065777f3] {
margin-left: auto;
color: var(--text-secondary);
font-size: 0.75rem;
}
.switcher-menu[data-v-065777f3] {
position: absolute;
background: rgba(20, 26, 35, 0.9);
backdrop-filter: blur(12px);
border-radius: 12px;
box-shadow: 0 14px 32px rgba(0, 0, 0, 0.35);
min-width: 240px;
padding: 0.5rem;
z-index: 9999;
}
.switcher-option[data-v-065777f3] {
width: 100%;
text-align: left;
padding: 0.5rem 0.75rem;
border-radius: 10px;
display: flex;
flex-direction: column;
gap: 0.25rem;
color: var(--text-primary);
background: transparent;
border: none;
cursor: pointer;
transition: background 0.2s ease, transform 0.2s ease;
}
.switcher-option[data-v-065777f3]:hover {
background: rgba(255, 255, 255, 0.08);
transform: translateY(-1px);
}
.switcher-option.active[data-v-065777f3] {
background: rgba(90, 196, 255, 0.12);
box-shadow: inset 0 0 0 1px rgba(90, 196, 255, 0.4);
}
.switcher-option[data-v-065777f3]:disabled {
opacity: 0.7;
cursor: wait;
}
.option-name[data-v-065777f3] {
font-weight: 600;
}
.option-meta[data-v-065777f3] {
font-size: 0.8rem;
color: var(--text-secondary);
display: flex;
gap: 0.35rem;
align-items: center;
}
.current-tag[data-v-065777f3] {
background: rgba(90, 196, 255, 0.2);
color: var(--text-primary);
padding: 0.05rem 0.45rem;
border-radius: 999px;
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
@media (max-width: 900px) {
.casino-switcher[data-v-065777f3] {
width: 100%;
margin-right: 0;
}
.switcher-trigger[data-v-065777f3] {
width: 100%;
justify-content: space-between;
}
.switcher-menu[data-v-065777f3] {
left: 0;
right: auto;
}
}
.loading-spinner-wrapper[data-v-bdc06b6b] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1rem;
}
.loading-spinner[data-v-bdc06b6b] {
position: relative;
display: inline-block;
}
/* Size variants */
.spinner-sm[data-v-bdc06b6b] {
width: 24px;
height: 24px;
}
.spinner-md[data-v-bdc06b6b] {
width: 40px;
height: 40px;
}
.spinner-lg[data-v-bdc06b6b] {
width: 60px;
height: 60px;
}
.spinner-ring[data-v-bdc06b6b] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 3px solid transparent;
border-radius: 50%;
animation: spin-bdc06b6b 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
}
.spinner-sm .spinner-ring[data-v-bdc06b6b] {
border-width: 2px;
}
.spinner-lg .spinner-ring[data-v-bdc06b6b] {
border-width: 4px;
}
.spinner-ring[data-v-bdc06b6b]:nth-child(1) {
border-top-color: var(--neon-blue);
animation-delay: 0s;
}
.spinner-ring[data-v-bdc06b6b]:nth-child(2) {
border-right-color: var(--neon-purple);
animation-delay: 0.15s;
}
.spinner-ring[data-v-bdc06b6b]:nth-child(3) {
border-bottom-color: var(--neon-green);
animation-delay: 0.3s;
}
@keyframes spin-bdc06b6b {
0% {
transform: rotate(0deg);
opacity: 1;
}
50% {
opacity: 0.6;
}
100% {
transform: rotate(360deg);
opacity: 1;
}
}
.loading-text[data-v-bdc06b6b] {
margin: 0;
font-size: 0.875rem;
color: rgba(255, 255, 255, 0.7);
font-weight: 500;
letter-spacing: 0.025em;
animation: pulse-bdc06b6b 2s ease-in-out infinite;
}
@keyframes pulse-bdc06b6b {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.5;
}
}
/* Glassmorphic variant */
.loading-spinner-wrapper.glass[data-v-bdc06b6b] {
padding: 2rem;
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(10px);
border-radius: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
#app[data-v-32a6c3f7] {
min-height: 100vh;
position: relative;
}
/* Loading State */
.app-loading[data-v-32a6c3f7] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: var(--bg-primary);
}
.loading-container[data-v-32a6c3f7] {
text-align: center;
}
.loading-spinner.large[data-v-32a6c3f7] {
width: 60px;
height: 60px;
border: 4px solid rgba(255, 255, 255, 0.1);
border-left: 4px solid var(--neon-blue);
border-radius: 50%;
animation: spin-32a6c3f7 1s linear infinite;
margin: 0 auto 2rem;
}
/* Header */
.app-header[data-v-32a6c3f7] {
position: sticky;
top: 0;
z-index: 100;
padding: 1rem;
}
.nav-brand[data-v-32a6c3f7] {
display: flex;
flex-direction: column;
}
.brand-logo[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 1rem;
}
.logo-image[data-v-32a6c3f7] {
width: 50px;
height: 50px;
border-radius: 50%;
object-fit: cover;
border: 2px solid var(--neon-gold);
box-shadow: 0 0 15px rgba(255, 215, 0, 0.3);
transition: all 0.3s ease;
}
.logo-image[data-v-32a6c3f7]:hover {
box-shadow: 0 0 25px rgba(255, 215, 0, 0.5);
transform: scale(1.05);
}
.brand-text[data-v-32a6c3f7] {
display: flex;
flex-direction: column;
}
.brand-title-row[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
}
.nav-brand h1[data-v-32a6c3f7] {
font-size: 2rem;
margin: 0;
}
.subtitle[data-v-32a6c3f7] {
font-size: 0.875rem;
color: var(--text-muted);
margin-top: 0.2rem;
}
.nav-user[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 1.5rem;
flex-wrap: wrap;
}
.user-info[data-v-32a6c3f7] {
display: flex;
flex-direction: column;
text-align: right;
}
.user-name[data-v-32a6c3f7] {
font-weight: 600;
color: var(--text-primary);
}
.user-role[data-v-32a6c3f7] {
font-size: 0.875rem;
color: var(--text-secondary);
}
.session-info[data-v-32a6c3f7] {
font-size: 0.875rem;
color: var(--text-muted);
}
.logout-btn[data-v-32a6c3f7] {
padding: 8px 16px;
font-size: 0.875rem;
}
/* Main Content */
.app-main[data-v-32a6c3f7] {
padding: 1rem;
min-height: calc(100vh - 120px);
}
/* Welcome Screen */
.app-welcome[data-v-32a6c3f7] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
background: radial-gradient(ellipse at 30% 20%, rgba(0, 100, 180, 0.12) 0%, transparent 50%),
radial-gradient(ellipse at 70% 80%, rgba(100, 0, 180, 0.08) 0%, transparent 50%);
}
.welcome-container[data-v-32a6c3f7] {
width: 100%;
max-width: 1200px;
}
.welcome-content[data-v-32a6c3f7] {
padding: 3rem;
text-align: center;
border-color: rgba(0, 200, 255, 0.15);
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.4), 0 0 80px rgba(0, 150, 255, 0.06);
}
.casino-logo[data-v-32a6c3f7] {
margin-bottom: 3rem;
display: flex;
flex-direction: column;
align-items: center;
}
.welcome-logo-image[data-v-32a6c3f7] {
width: 120px;
height: 120px;
border-radius: 50%;
object-fit: cover;
border: 3px solid var(--neon-gold);
box-shadow: 0 0 30px rgba(255, 215, 0, 0.4);
margin-bottom: 2rem;
transition: all 0.3s ease;
animation: glow-pulse-32a6c3f7 3s ease-in-out infinite alternate;
}
.welcome-logo-image[data-v-32a6c3f7]:hover {
box-shadow: 0 0 50px rgba(255, 215, 0, 0.6);
transform: scale(1.1);
}
@keyframes glow-pulse-32a6c3f7 {
0% {
box-shadow: 0 0 30px rgba(255, 215, 0, 0.4);
}
100% {
box-shadow: 0 0 40px rgba(255, 215, 0, 0.6);
}
}
.casino-title[data-v-32a6c3f7] {
font-size: 3.5rem;
margin-bottom: 0.5rem;
background: linear-gradient(45deg, #00f5ff, #7c3aed);
background-size: 200% 200%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: subtle-gradient-32a6c3f7 6s ease-in-out infinite;
}
@keyframes subtle-gradient-32a6c3f7 {
0% { background-position: 0% 50%;
}
50% { background-position: 100% 50%;
}
100% { background-position: 0% 50%;
}
}
.casino-subtitle[data-v-32a6c3f7] {
font-size: 1.25rem;
color: #aafcff;
text-shadow: 0 0 8px rgba(0, 255, 255, 0.15);
}
.welcome-auth[data-v-32a6c3f7] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.25rem;
margin-top: 1.5rem;
width: 100%;
max-width: 420px;
margin-inline: auto;
}
.btn-auth[data-v-32a6c3f7] {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.9rem 2.75rem;
min-height: 3rem;
width: min(100%, 320px);
border-radius: 999px;
font-size: 1.05rem;
font-weight: 600;
letter-spacing: 0.02em;
text-transform: uppercase;
text-decoration: none;
transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.btn-auth[data-v-32a6c3f7]:hover {
transform: translateY(-1px);
}
.btn-auth[data-v-32a6c3f7]:active {
transform: translateY(0);
}
.btn-auth[data-v-32a6c3f7]:focus-visible {
outline: 2px solid var(--neon-blue);
outline-offset: 3px;
}
.btn-auth.primary[data-v-32a6c3f7] {
background: linear-gradient(135deg, rgba(0, 245, 255, 0.85), rgba(0, 163, 255, 0.95));
color: #03121e;
border: none;
box-shadow: 0 14px 30px rgba(0, 200, 255, 0.35), 0 0 0 1px rgba(0, 245, 255, 0.25);
}
.btn-auth.primary[data-v-32a6c3f7]:hover {
box-shadow: 0 18px 36px rgba(0, 200, 255, 0.45), 0 0 0 1px rgba(0, 245, 255, 0.35);
}
.btn-auth.primary[data-v-32a6c3f7]:active {
box-shadow: 0 8px 20px rgba(0, 200, 255, 0.35), 0 0 0 1px rgba(0, 245, 255, 0.3);
}
.btn-auth.secondary[data-v-32a6c3f7] {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.18);
color: var(--text-primary);
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.btn-auth.secondary[data-v-32a6c3f7]:hover {
background: rgba(255, 255, 255, 0.12);
box-shadow: 0 16px 32px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.btn-auth.secondary[data-v-32a6c3f7]:active {
background: rgba(255, 255, 255, 0.1);
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
/* Development Auth */
.dev-auth[data-v-32a6c3f7] {
margin: 2.5rem auto 0;
padding-top: 1.75rem;
width: 100%;
max-width: 420px;
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.dev-label[data-v-32a6c3f7] {
color: var(--neon-orange);
font-size: 0.9rem;
margin-bottom: 0;
opacity: 0.8;
text-transform: uppercase;
letter-spacing: 0.08em;
text-align: center;
}
.dev-buttons[data-v-32a6c3f7] {
display: flex;
gap: 0.75rem;
justify-content: center;
flex-wrap: wrap;
width: 100%;
}
.dev-btn[data-v-32a6c3f7] {
padding: 0.75rem 1rem;
font-size: 0.9rem;
opacity: 0.8;
min-width: 140px;
transition: all 0.3s ease;
}
.dev-btn[data-v-32a6c3f7]:hover {
opacity: 1;
transform: translateY(-2px);
}
/* Casino Selection Modal */
.casino-selection-modal[data-v-32a6c3f7] {
max-width: 560px;
width: 100%;
padding: 2.5rem;
border: 1px solid rgba(255, 215, 0, 0.15);
box-shadow:
0 12px 40px rgba(0, 0, 0, 0.4),
0 0 30px rgba(255, 215, 0, 0.05);
}
.casino-select-header[data-v-32a6c3f7] {
text-align: center;
margin-bottom: 2rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 215, 0, 0.12);
}
.casino-select-icon[data-v-32a6c3f7] {
font-size: 3rem;
margin-bottom: 0.75rem;
filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.4));
}
.casino-select-title[data-v-32a6c3f7] {
font-size: 1.8rem;
font-weight: 700;
background: linear-gradient(135deg, var(--neon-gold), #fff8dc, var(--neon-gold));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin: 0 0 0.5rem;
letter-spacing: 0.02em;
}
.casino-select-subtitle[data-v-32a6c3f7] {
color: var(--text-secondary);
margin: 0;
font-size: 1rem;
}
.casino-selection-grid[data-v-32a6c3f7] {
display: grid;
grid-template-columns: 1fr;
gap: 0.75rem;
margin-bottom: 2rem;
}
.casino-option[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 1rem;
width: 100%;
padding: 1.25rem 1.5rem;
text-align: left;
border-radius: 16px;
border: 1px solid rgba(255, 215, 0, 0.12);
background: rgba(255, 255, 255, 0.04);
backdrop-filter: var(--glass-blur-minimal);
-webkit-backdrop-filter: var(--glass-blur-minimal);
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
}
.casino-option[data-v-32a6c3f7]:hover {
border-color: var(--neon-gold);
background: rgba(255, 215, 0, 0.08);
transform: translateY(-2px);
box-shadow:
0 8px 25px rgba(0, 0, 0, 0.3),
0 0 20px rgba(255, 215, 0, 0.1);
}
.casino-option[data-v-32a6c3f7]:active {
transform: translateY(0);
}
.casino-option-icon[data-v-32a6c3f7] {
font-size: 1.5rem;
flex-shrink: 0;
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
background: rgba(255, 215, 0, 0.08);
border: 1px solid rgba(255, 215, 0, 0.15);
}
.casino-option-content[data-v-32a6c3f7] {
flex: 1;
min-width: 0;
}
.casino-option-content h3[data-v-32a6c3f7] {
margin: 0 0 0.25rem 0;
color: var(--text-primary);
font-size: 1.15rem;
font-weight: 600;
}
.casino-meta[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-secondary);
font-size: 0.85rem;
}
.casino-short-name[data-v-32a6c3f7] {
color: var(--text-muted);
}
.casino-option-code[data-v-32a6c3f7] {
padding: 0.15rem 0.5rem;
background: rgba(255, 215, 0, 0.1);
border: 1px solid rgba(255, 215, 0, 0.2);
border-radius: 6px;
font-weight: 600;
font-size: 0.75rem;
color: var(--neon-gold);
letter-spacing: 0.05em;
}
.casino-option-arrow[data-v-32a6c3f7] {
flex-shrink: 0;
font-size: 1.2rem;
color: var(--text-muted);
transition: all 0.3s ease;
}
.casino-option:hover .casino-option-arrow[data-v-32a6c3f7] {
color: var(--neon-gold);
transform: translateX(4px);
}
.casino-select-footer[data-v-32a6c3f7] {
text-align: center;
padding-top: 1.25rem;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.casino-select-footer p[data-v-32a6c3f7] {
margin: 0;
color: var(--text-muted);
font-size: 0.85rem;
}
@media (max-width: 640px) {
.casino-selection-modal[data-v-32a6c3f7] {
margin: 1rem;
padding: 1.5rem;
}
.casino-select-icon[data-v-32a6c3f7] {
font-size: 2.5rem;
}
.casino-select-title[data-v-32a6c3f7] {
font-size: 1.4rem;
}
.casino-option[data-v-32a6c3f7] {
padding: 1rem 1.25rem;
}
}
/* Primary Users Modal styles */
.confirmation-modal[data-v-32a6c3f7] {
max-width: 980px;
width: 100%;
border: 1px solid rgba(255, 255, 255, 0.15);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45), 0 0 20px rgba(0, 245, 255, 0.08);
backdrop-filter: blur(10px);
overflow: hidden;
padding: 1.25rem 1.5rem;
}
.modal-header[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 0.75rem;
padding-bottom: 0.75rem;
margin-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.icon-container[data-v-32a6c3f7] {
display: grid;
place-items: center;
width: 36px;
height: 36px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
box-shadow: 0 0 12px rgba(0, 245, 255, 0.15) inset;
}
.icon-info[data-v-32a6c3f7] {
color: var(--neon-blue);
}
.modal-body[data-v-32a6c3f7] {
padding-top: 0.25rem;
max-height: 70vh;
overflow-y: auto;
overflow-x: hidden;
}
.modal-body[data-v-32a6c3f7]::-webkit-scrollbar {
width: 8px;
}
.modal-body[data-v-32a6c3f7]::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
}
.modal-body[data-v-32a6c3f7]::-webkit-scrollbar-thumb {
background: rgba(0, 255, 255, 0.3);
border-radius: 4px;
}
.modal-body[data-v-32a6c3f7]::-webkit-scrollbar-thumb:hover {
background: rgba(0, 255, 255, 0.5);
}
.form-grid[data-v-32a6c3f7] {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.75rem 1rem;
}
.form-group label[data-v-32a6c3f7] {
display: block;
font-size: 0.8rem;
color: var(--text-secondary);
margin-bottom: 0.35rem;
}
.input-glass[data-v-32a6c3f7] {
width: 100%;
}
.input-compact[data-v-32a6c3f7] {
padding: 0.35rem 0.5rem;
font-size: 0.85rem;
}
.settings-section[data-v-32a6c3f7] {
margin-top: 1rem;
}
.table-glass[data-v-32a6c3f7] {
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 12px;
overflow: hidden;
background: rgba(255, 255, 255, 0.04);
backdrop-filter: blur(8px);
}
.table-header[data-v-32a6c3f7],
.table-row[data-v-32a6c3f7] {
display: grid;
grid-template-columns: 1.2fr 1.2fr 1.6fr 0.9fr 0.7fr 0.9fr 1.1fr;
align-items: center;
}
.table-header[data-v-32a6c3f7] {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.04));
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.03em;
}
.table-cell[data-v-32a6c3f7] {
padding: 0.75rem 1rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.table-row[data-v-32a6c3f7] {
transition: background 0.15s ease, box-shadow 0.15s ease;
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.table-row[data-v-32a6c3f7]:hover {
background: rgba(255, 255, 255, 0.06);
box-shadow: 0 0 0 1px rgba(0, 245, 255, 0.12) inset;
}
.status-indicator[data-v-32a6c3f7] {
display: inline-block;
min-width: 48px;
text-align: center;
padding: 2px 8px;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.18);
color: var(--text-secondary);
}
.status-indicator.active[data-v-32a6c3f7] {
color: var(--neon-green);
border-color: var(--neon-green);
box-shadow: 0 0 10px rgba(0, 255, 100, 0.25);
}
.action-buttons[data-v-32a6c3f7] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-small[data-v-32a6c3f7] {
padding: 0.35rem 0.6rem;
font-size: 0.8rem;
border-radius: 6px;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.06);
color: var(--text-primary);
transition: all 0.15s ease;
}
.btn-small[data-v-32a6c3f7]:hover {
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
}
.btn-edit[data-v-32a6c3f7] {
border-color: var(--neon-blue);
}
.btn-toggle[data-v-32a6c3f7] {
border-color: var(--neon-green);
}
.btn-toggle.deactivate[data-v-32a6c3f7] {
border-color: var(--neon-orange);
}
.btn-danger[data-v-32a6c3f7] {
border-color: var(--neon-orange);
}
@media (max-width: 992px) {
.form-grid[data-v-32a6c3f7] {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.table-header[data-v-32a6c3f7],
.table-row[data-v-32a6c3f7] {
grid-template-columns: 1fr 1fr 1.2fr 0.8fr 0.6fr 0.8fr 0.9fr;
}
}
@media (max-width: 640px) {
.form-grid[data-v-32a6c3f7] {
grid-template-columns: 1fr;
}
.confirmation-modal[data-v-32a6c3f7] {
padding: 1rem;
}
.table-header[data-v-32a6c3f7],
.table-row[data-v-32a6c3f7] {
grid-template-columns: 1.1fr 1.2fr 1.4fr 0.8fr 0.7fr 0.8fr 1fr;
}
.table-cell[data-v-32a6c3f7] {
padding: 0.6rem 0.6rem;
}
}
/* Navigation - Fixed glassmorphism override issue */
.nav-glass[data-v-32a6c3f7] {
/* Enhanced glassmorphism with build-resistant techniques */
position: relative;
background: var(--glass-bg);
/* Glassmorphism backdrop-filter */
backdrop-filter: var(--glass-blur, blur(20px)) !important;
-webkit-backdrop-filter: var(--glass-blur, blur(20px)) !important;
/* Clean glassmorphism box-shadow */
box-shadow: 0 8px 32px var(--glass-shadow);
border: 1px solid var(--glass-border);
border-radius: 16px;
/* Layout properties */
display: flex;
justify-content: space-between;
align-items: center;
gap: 2rem;
padding: 16px 24px;
/* Overflow to contain pseudo-elements */
overflow: hidden;
}
/* Minimal glassmorphism pseudo-element */
.nav-glass[data-v-32a6c3f7]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 245, 255, 0.02);
pointer-events: none;
z-index: -1;
}
.nav-menu[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 0.5rem;
flex: 1;
justify-content: center;
}
.nav-link[data-v-32a6c3f7] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
border-radius: 8px;
text-decoration: none;
color: var(--text-secondary);
transition: all 0.15s ease;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
min-width: 100px;
min-height: 44px;
/* Ensure consistent button height */
justify-content: center;
white-space: nowrap;
/* Prevent text wrapping at root level */
}
.nav-link[data-v-32a6c3f7]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.nav-link.active[data-v-32a6c3f7] {
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.3);
}
.nav-icon[data-v-32a6c3f7] {
font-size: 1.1rem;
}
.nav-text[data-v-32a6c3f7] {
font-size: 0.9rem;
font-weight: 500;
}
/* Responsive Navigation Improvements */
@media (max-width: 1200px) {
.nav-link[data-v-32a6c3f7] {
min-width: 85px;
padding: 0.65rem 0.85rem;
}
.nav-text[data-v-32a6c3f7] {
font-size: 0.82rem;
white-space: nowrap;
/* Prevent text wrapping */
}
.brand-text h1[data-v-32a6c3f7] {
font-size: 1.8rem;
}
}
/* Responsive Brand Text */
.brand-full[data-v-32a6c3f7] {
display: inline;
}
.brand-short[data-v-32a6c3f7] {
display: none;
}
/* Responsive Navigation Text */
.nav-text[data-v-32a6c3f7]::before {
content: attr(data-short);
display: none;
}
.logout-buttons[data-v-32a6c3f7] {
display: flex;
gap: 0.5rem;
align-items: center;
}
/* Tablet-specific optimizations for professional presentation */
@media (max-width: 1150px) {
.nav-glass[data-v-32a6c3f7] {
padding: 12px 16px;
/* More compact padding */
}
.nav-menu[data-v-32a6c3f7] {
gap: 0.3rem;
/* Tighter spacing */
}
.nav-link[data-v-32a6c3f7] {
min-width: 70px;
padding: 0.5rem 0.65rem;
font-weight: 500;
}
.nav-text[data-v-32a6c3f7] {
font-size: 0.74rem;
white-space: nowrap;
}
/* Show abbreviated brand text on tablets */
.brand-full[data-v-32a6c3f7] {
display: none;
}
.brand-short[data-v-32a6c3f7] {
display: inline;
}
/* Show shorter nav labels where available */
.nav-text[data-short][data-v-32a6c3f7]::before {
display: inline;
}
.nav-text[data-short][data-v-32a6c3f7] {
font-size: 0;
}
.nav-user[data-v-32a6c3f7] {
gap: 0.75rem;
}
.user-info[data-v-32a6c3f7] {
min-width: 80px;
}
.user-name[data-v-32a6c3f7] {
font-size: 0.85rem;
}
.user-role[data-v-32a6c3f7] {
font-size: 0.75rem;
}
.session-info[data-v-32a6c3f7] {
font-size: 0.75rem;
}
.logout-buttons[data-v-32a6c3f7] {
gap: 0.4rem;
}
.logout-btn[data-v-32a6c3f7] {
padding: 6px 10px;
font-size: 0.8rem;
}
.owner-logout[data-v-32a6c3f7] {
display: none;
/* Hide owner logout on tablets to save space */
}
}
@media (max-width: 992px) {
.nav-menu[data-v-32a6c3f7] {
gap: 0.3rem;
}
.nav-link[data-v-32a6c3f7] {
padding: 0.55rem 0.7rem;
min-width: 70px;
flex-direction: column;
gap: 0.3rem;
white-space: nowrap;
/* Keep text on single lines even in column mode */
}
.nav-text[data-v-32a6c3f7] {
font-size: 0.72rem;
line-height: 1.1;
/* Tighter line height for column layout */
text-align: center;
}
.nav-icon[data-v-32a6c3f7] {
font-size: 1.05rem;
}
}
/* Large tablet breakpoint - aggressive space optimization */
@media (max-width: 1000px) {
.nav-glass[data-v-32a6c3f7] {
padding: 10px 14px;
}
.nav-menu[data-v-32a6c3f7] {
gap: 0.25rem;
}
.nav-link[data-v-32a6c3f7] {
min-width: 60px;
padding: 0.45rem 0.6rem;
}
.nav-text[data-v-32a6c3f7],
.nav-text[data-v-32a6c3f7]::before {
font-size: 0.7rem;
}
.nav-user[data-v-32a6c3f7] {
gap: 0.6rem;
}
/* Hide session info to save critical space */
.session-info[data-v-32a6c3f7] {
display: none;
}
/* Hide user role, show only name */
.user-role[data-v-32a6c3f7] {
display: none;
}
.user-name[data-v-32a6c3f7] {
font-size: 0.8rem;
}
}
@media (max-width: 768px) {
.nav-glass[data-v-32a6c3f7] {
/* Clean mobile glassmorphism */
backdrop-filter: var(--glass-blur-subtle, blur(15px)) !important;
-webkit-backdrop-filter: var(--glass-blur-subtle, blur(15px)) !important;
/* Mobile layout */
flex-direction: column;
gap: 1rem;
padding: 1rem;
}
.nav-menu[data-v-32a6c3f7] {
order: 2;
width: 100%;
justify-content: space-around;
gap: 0.4rem;
/* Slightly more space between mobile nav items */
}
.nav-link[data-v-32a6c3f7] {
flex-direction: column;
gap: 0.25rem;
padding: 0.6rem 0.5rem;
min-width: 65px;
}
.nav-text[data-v-32a6c3f7] {
font-size: 0.68rem;
white-space: nowrap;
text-align: center;
}
.nav-user[data-v-32a6c3f7] {
order: 3;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
.user-info[data-v-32a6c3f7],
.session-info[data-v-32a6c3f7] {
display: none;
}
.logout-btn[data-v-32a6c3f7] {
padding: 6px 12px;
font-size: 0.8rem;
}
.casino-title[data-v-32a6c3f7] {
font-size: 2.5rem;
}
.welcome-content[data-v-32a6c3f7] {
padding: 2rem;
}
.brand-logo[data-v-32a6c3f7] {
gap: 0.5rem;
}
.logo-image[data-v-32a6c3f7] {
width: 40px;
height: 40px;
}
.brand-title-row[data-v-32a6c3f7] {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
}
@media (max-width: 480px) {
.nav-brand h1[data-v-32a6c3f7] {
font-size: 1.5rem;
}
.casino-title[data-v-32a6c3f7] {
font-size: 2rem;
}
.app-header[data-v-32a6c3f7] {
padding: 0.5rem;
}
}
/* Owner Console styles */
.owner-console[data-v-32a6c3f7] {
margin: 2rem auto 0;
padding: 1.5rem 2rem;
max-width: 900px;
text-align: center;
border-color: rgba(124, 58, 237, 0.2);
box-shadow: 0 4px 24px rgba(124, 58, 237, 0.08);
}
.owner-title-row[data-v-32a6c3f7] {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
margin-bottom: 0.25rem;
position: relative;
}
.owner-title[data-v-32a6c3f7] {
margin: 0;
color: #e0e0ff;
}
.owner-subtitle[data-v-32a6c3f7] {
margin: 0 0 1rem;
color: #aafcff;
font-size: 0.95rem;
}
.owner-actions[data-v-32a6c3f7] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.owner-actions[data-v-32a6c3f7] .casino-switcher {
margin-right: 0;
}
.owner-actions[data-v-32a6c3f7] .switcher-trigger {
min-width: 200px;
}
.owner-badge[data-v-32a6c3f7] {
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.25rem 0.6rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.08);
border: 1px solid rgba(0, 245, 255, 0.3);
box-shadow: 0 0 12px rgba(0, 245, 255, 0.15);
}
/* Badge Styles */
.badge[data-v-32a6c3f7] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.6rem;
border-radius: 999px;
font-size: 0.75rem;
font-weight: 600;
border: 1px solid;
white-space: nowrap;
}
.badge-basic[data-v-32a6c3f7] {
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.08);
border-color: rgba(0, 245, 255, 0.3);
}
.badge-professional[data-v-32a6c3f7] {
color: var(--neon-purple);
background: rgba(138, 43, 226, 0.08);
border-color: rgba(138, 43, 226, 0.3);
}
.badge-enterprise[data-v-32a6c3f7] {
color: var(--neon-orange);
background: rgba(255, 165, 0, 0.08);
border-color: rgba(255, 165, 0, 0.3);
}
.badge-success[data-v-32a6c3f7] {
color: var(--neon-green);
background: rgba(57, 255, 20, 0.08);
border-color: rgba(57, 255, 20, 0.3);
}
.badge-error[data-v-32a6c3f7] {
color: var(--neon-red);
background: rgba(255, 7, 58, 0.08);
border-color: rgba(255, 7, 58, 0.3);
}
.badge-warning[data-v-32a6c3f7] {
color: #FFD700;
background: rgba(255, 215, 0, 0.08);
border-color: rgba(255, 215, 0, 0.3);
}
/* Route Loading */
.route-loading[data-v-32a6c3f7] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 60vh;
gap: 1rem;
}
.loading-spinner[data-v-32a6c3f7] {
font-size: 2rem;
animation: spin-32a6c3f7 1s linear infinite;
}
@keyframes spin-32a6c3f7 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.route-loading p[data-v-32a6c3f7] {
color: var(--text-secondary);
margin: 0;
}
/* Landing Page Container */
.app-landing[data-v-32a6c3f7] {
width: 100%;
min-height: 100vh;
overflow-y: auto;
overflow-x: hidden;
}
/* Public Routes Container (SMS Consent, etc.) */
.app-public[data-v-32a6c3f7] {
width: 100%;
min-height: 100vh;
overflow-y: auto;
overflow-x: hidden;
}
/* Breadcrumb styles removed: handled within view components if needed */
/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
.loading-spinner[data-v-32a6c3f7],
.loading-spinner.large[data-v-32a6c3f7],
.welcome-logo-image[data-v-32a6c3f7] {
animation: none !important;
transition: none !important;
}
}
.grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:rgba(0,0,0,.1);margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0;top:0;left:0;width:var(--gs-column-width);height:var(--gs-cell-height)}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack>.grid-stack-item>.grid-stack-item-content,.grid-stack>.grid-stack-placeholder>.placeholder-content{top:var(--gs-item-margin-top);right:var(--gs-item-margin-right);bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle,.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:var(--gs-item-margin-top);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:var(--gs-item-margin-top);left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:var(--gs-item-margin-top);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px;right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:var(--gs-item-margin-bottom);right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px;left:var(--gs-item-margin-left)}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,top}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px rgba(0,0,0,.2);opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.grid-stack-placeholder,.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing{transition:left 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y="0"]{top:0}.grid-stack>.grid-stack-item[gs-x="0"]{left:0}
.muted[data-v-593e10cc] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.75rem;
}
.settings-section[data-v-593e10cc] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-593e10cc] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.printer-test-grid[data-v-593e10cc] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
margin: 1rem 0;
}
.printer-test-grid .btn-glass[data-v-593e10cc] {
flex: 1;
min-width: 140px;
}
.printer-result[data-v-593e10cc] {
padding: 0.75rem 1rem;
border-radius: 8px;
margin-top: 0.5rem;
font-size: 0.9rem;
}
.result-success[data-v-593e10cc] {
background: rgba(34, 197, 94, 0.15);
border: 1px solid rgba(34, 197, 94, 0.3);
color: #22c55e;
}
.result-error[data-v-593e10cc] {
background: rgba(239, 68, 68, 0.15);
border: 1px solid rgba(239, 68, 68, 0.3);
color: #ef4444;
}
.printer-checklist[data-v-593e10cc] {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin: 1rem 0;
}
.checklist-item[data-v-593e10cc] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
padding: 0.6rem 0.75rem;
border-radius: 8px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.06);
cursor: pointer;
transition: all 0.2s ease;
}
.checklist-item[data-v-593e10cc]:hover {
background: rgba(255, 255, 255, 0.06);
}
.checklist-item.checked[data-v-593e10cc] {
background: rgba(34, 197, 94, 0.08);
border-color: rgba(34, 197, 94, 0.2);
}
.checklist-item input[type="checkbox"][data-v-593e10cc] {
margin-top: 2px;
flex-shrink: 0;
}
.check-label[data-v-593e10cc] {
font-size: 0.95rem;
font-weight: 500;
}
.check-hint[data-v-593e10cc] {
display: block;
font-size: 0.8rem;
color: var(--text-secondary);
margin-left: auto;
text-align: right;
flex-shrink: 0;
}
.checklist-progress[data-v-593e10cc] {
text-align: center;
font-size: 0.85rem;
color: var(--text-secondary);
padding: 0.5rem;
}
.env-info-grid[data-v-593e10cc] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.5rem;
margin: 0.75rem 0;
}
.env-item[data-v-593e10cc] {
display: flex;
justify-content: space-between;
padding: 0.5rem 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
border: 1px solid rgba(255, 255, 255, 0.06);
}
.env-label[data-v-593e10cc] {
font-size: 0.85rem;
color: var(--text-secondary);
}
.env-value[data-v-593e10cc] {
font-size: 0.85rem;
font-weight: 600;
}
.text-green[data-v-593e10cc] {
color: #22c55e;
}
.text-red[data-v-593e10cc] {
color: #ef4444;
}
.printer-log[data-v-593e10cc] {
max-height: 200px;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.log-entry[data-v-593e10cc] {
display: flex;
gap: 0.75rem;
padding: 0.4rem 0.6rem;
border-radius: 4px;
font-size: 0.82rem;
font-family: 'Courier New', monospace;
}
.log-success[data-v-593e10cc] {
background: rgba(34, 197, 94, 0.08);
}
.log-error[data-v-593e10cc] {
background: rgba(239, 68, 68, 0.08);
}
.log-info[data-v-593e10cc] {
background: rgba(59, 130, 246, 0.08);
}
.log-time[data-v-593e10cc] {
color: var(--text-secondary);
white-space: nowrap;
}
.btn-sm[data-v-593e10cc] {
padding: 0.35rem 0.75rem;
font-size: 0.82rem;
}
.settings-section[data-v-0515984b] {
margin-bottom: 2rem;
}
.setting-item[data-v-0515984b] {
display: flex;
flex-direction: column;
gap: 0.5rem;
padding: 1rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.setting-item label[data-v-0515984b] {
color: var(--text-primary);
font-weight: 500;
}
.settings-section[data-v-642c539f] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-642c539f] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.setting-item[data-v-642c539f] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.setting-item label[data-v-642c539f] {
color: var(--text-primary);
font-weight: 500;
}
.setting-control[data-v-642c539f] {
display: flex;
align-items: center;
gap: 1rem;
}
.range-slider[data-v-642c539f] {
width: 150px;
height: 6px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.1);
outline: none;
appearance: none;
}
.range-slider[data-v-642c539f]::-webkit-slider-thumb {
appearance: none;
width: 20px;
height: 20px;
border-radius: 50%;
background: var(--neon-blue);
cursor: pointer;
box-shadow: 0 0 10px rgba(0, 150, 255, 0.5);
}
.range-value[data-v-642c539f] {
color: var(--neon-blue);
font-weight: 600;
min-width: 40px;
}
.btn-toggle[data-v-642c539f] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.active[data-v-642c539f] {
background: var(--neon-green);
color: var(--bg-primary);
border-color: var(--neon-green);
}
.new-player-tier-setting[data-v-642c539f] {
flex-wrap: wrap;
}
.setting-label-group[data-v-642c539f] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.setting-hint[data-v-642c539f] {
color: var(--text-secondary);
font-size: 0.8rem;
opacity: 0.7;
}
.tier-preview-badge[data-v-642c539f] {
background: rgba(0, 200, 120, 0.1);
border: 1px solid rgba(0, 200, 120, 0.25);
border-radius: 8px;
padding: 0.6rem 1rem;
color: var(--neon-green);
font-size: 0.9rem;
margin-bottom: 0.5rem;
}
.tier-preview-badge strong[data-v-642c539f] {
color: #fff;
}
.settings-section[data-v-b32c9b8d] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-b32c9b8d] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.setting-item[data-v-b32c9b8d] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.setting-item label[data-v-b32c9b8d] {
color: var(--text-primary);
font-weight: 500;
}
.setting-control[data-v-b32c9b8d] {
display: flex;
align-items: center;
gap: 1rem;
}
.range-slider[data-v-b32c9b8d] {
width: 150px;
height: 6px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.1);
outline: none;
appearance: none;
}
.range-slider[data-v-b32c9b8d]::-webkit-slider-thumb {
appearance: none;
width: 20px;
height: 20px;
border-radius: 50%;
background: var(--neon-blue);
cursor: pointer;
box-shadow: 0 0 10px rgba(0, 150, 255, 0.5);
}
.range-value[data-v-b32c9b8d] {
color: var(--neon-blue);
font-weight: 600;
min-width: 40px;
}
.btn-toggle[data-v-b32c9b8d] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.active[data-v-b32c9b8d] {
background: var(--neon-green);
color: var(--bg-primary);
border-color: var(--neon-green);
}
.ai-config-card .admin-status-pill[data-v-f4b7f9ac] {
margin: 1rem 0;
}
.ai-config-card .admin-actions[data-v-f4b7f9ac] {
margin-top: 1rem;
}
.settings-section[data-v-f4b7f9ac] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-f4b7f9ac] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.muted[data-v-f4b7f9ac] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.75rem;
}
.ai-config-form[data-v-f4b7f9ac] {
display: flex;
flex-direction: column;
gap: 1.5rem;
margin-top: 1.5rem;
}
.form-group[data-v-f4b7f9ac] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-f4b7f9ac] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.9rem;
}
.api-key-field[data-v-f4b7f9ac] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.api-key-field .btn-small[data-v-f4b7f9ac] {
white-space: nowrap;
}
.input-hint[data-v-f4b7f9ac] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
line-height: 1.4;
}
.input-hint code[data-v-f4b7f9ac] {
background: rgba(255, 255, 255, 0.05);
padding: 0.15rem 0.4rem;
border-radius: 4px;
font-family: monospace;
font-size: 0.85em;
color: var(--neon-blue);
}
.ai-config-meta[data-v-f4b7f9ac] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 1rem;
}
.meta-card[data-v-f4b7f9ac] {
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.03);
}
.meta-label[data-v-f4b7f9ac] {
display: block;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--text-secondary);
margin-bottom: 0.25rem;
}
.meta-value[data-v-f4b7f9ac] {
font-weight: 600;
color: var(--text-primary);
}
.meta-value.success[data-v-f4b7f9ac] {
color: var(--neon-green);
}
.meta-value.warning[data-v-f4b7f9ac] {
color: var(--neon-orange);
}
.ai-config-loading[data-v-f4b7f9ac] {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.9rem;
color: var(--text-secondary);
}
.loading-spinner[data-v-f4b7f9ac] {
font-size: 1.5rem;
animation: spin-f4b7f9ac 1s linear infinite;
}
@keyframes spin-f4b7f9ac {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.ai-config-error[data-v-f4b7f9ac] {
padding: 0.75rem 1rem;
border-radius: 10px;
border: 1px solid rgba(255, 99, 71, 0.4);
background: rgba(255, 99, 71, 0.1);
color: var(--neon-red);
font-size: 0.85rem;
}
.ai-config-actions[data-v-f4b7f9ac] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
flex-wrap: wrap;
}
.ai-config-action-buttons[data-v-f4b7f9ac] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.btn-small[data-v-f4b7f9ac] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-f4b7f9ac]:hover {
background: rgba(255, 255, 255, 0.1);
}
.email-config-card .admin-status-pill[data-v-722ba394] {
margin: 1rem 0;
}
.settings-section[data-v-722ba394] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-722ba394] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.muted[data-v-722ba394] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.75rem;
}
/* Tab navigation */
.modal-tabs[data-v-722ba394] {
display: flex;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-button[data-v-722ba394] {
flex: 1;
padding: 0.875rem 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.tab-button[data-v-722ba394]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
transform: translateY(-1px);
}
.tab-button.active[data-v-722ba394] {
background: var(--neon-cyan);
border-color: var(--neon-cyan);
color: #000;
box-shadow: 0 4px 15px rgba(0, 229, 255, 0.3);
}
.tab-button[data-v-722ba394]:disabled {
opacity: 0.4;
cursor: not-allowed;
background: rgba(255, 255, 255, 0.01);
}
.tab-button[data-v-722ba394]:disabled:hover {
transform: none;
}
/* Form layout */
.sms-config-form[data-v-722ba394] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.form-section[data-v-722ba394] {
margin-top: 1.5rem;
}
.section-title[data-v-722ba394] {
color: var(--text-primary);
font-size: 1rem;
font-weight: 600;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
gap: 0.5rem;
}
.form-row[data-v-722ba394] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
}
.form-row .form-group[data-v-722ba394] {
flex: 1;
}
@media (max-width: 600px) {
.form-row[data-v-722ba394] {
flex-direction: column;
}
}
.form-group[data-v-722ba394] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-722ba394] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.9rem;
}
.required[data-v-722ba394] {
color: var(--neon-red);
}
.api-key-field[data-v-722ba394] {
display: flex;
gap: 0.75rem;
align-items: stretch;
}
.api-key-field .input-glass[data-v-722ba394] {
flex: 1;
}
.api-key-field .btn-small[data-v-722ba394] {
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.9rem;
font-weight: 500;
white-space: nowrap;
}
.api-key-field .btn-small[data-v-722ba394]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.input-hint[data-v-722ba394] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
line-height: 1.4;
}
/* Toggle checkbox label */
.toggle-label[data-v-722ba394] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
cursor: pointer;
}
.toggle-checkbox[data-v-722ba394] {
margin-top: 2px;
flex-shrink: 0;
width: 16px;
height: 16px;
accent-color: var(--neon-cyan);
}
.toggle-text[data-v-722ba394] {
color: var(--text-primary);
font-size: 0.95rem;
}
/* Meta cards */
.config-meta-cards[data-v-722ba394] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 1rem;
margin-top: 1.5rem;
}
.meta-card[data-v-722ba394] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 1rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.meta-label[data-v-722ba394] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--text-secondary);
font-weight: 600;
}
.meta-value[data-v-722ba394] {
font-size: 1rem;
color: var(--text-primary);
font-weight: 500;
}
/* Form actions */
.form-actions[data-v-722ba394] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 1.5rem;
flex-wrap: wrap;
}
/* Loading / empty states */
.loading-state[data-v-722ba394] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-spinner[data-v-722ba394] {
font-size: 2rem;
animation: spin-722ba394 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-722ba394 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.empty-state[data-v-722ba394] {
text-align: center;
padding: 3rem 2rem;
color: var(--text-secondary);
}
/* Email history table */
.email-history-table[data-v-722ba394] {
overflow-x: auto;
margin-top: 1.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(0, 245, 255, 0.1);
padding: 1rem;
}
.email-history-table table[data-v-722ba394] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.email-history-table thead[data-v-722ba394] {
background: linear-gradient(135deg, rgba(0, 245, 255, 0.05), rgba(255, 7, 58, 0.05));
border-bottom: 2px solid rgba(0, 245, 255, 0.3);
}
.email-history-table th[data-v-722ba394] {
padding: 1rem 1.25rem;
text-align: left;
color: var(--neon-cyan);
font-weight: 600;
white-space: nowrap;
text-transform: uppercase;
font-size: 0.85rem;
letter-spacing: 0.5px;
}
.email-history-table td[data-v-722ba394] {
padding: 1rem 1.25rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
color: var(--text-primary);
vertical-align: top;
}
.email-history-table tbody tr[data-v-722ba394] {
transition: all 0.3s ease;
}
.email-history-table tbody tr[data-v-722ba394]:hover {
background: rgba(0, 245, 255, 0.03);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.1);
}
.message-type-badge[data-v-722ba394] {
display: inline-block;
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-size: 0.8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.message-type-badge.type-compliance[data-v-722ba394] {
background: rgba(255, 7, 58, 0.2);
color: var(--neon-red);
border: 1px solid rgba(255, 7, 58, 0.4);
}
.message-type-badge.type-promotional[data-v-722ba394] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-cyan);
border: 1px solid rgba(0, 245, 255, 0.4);
}
.message-type-badge.type-transactional[data-v-722ba394] {
background: rgba(57, 255, 20, 0.2);
color: var(--neon-green);
border: 1px solid rgba(57, 255, 20, 0.4);
}
.recipients-list[data-v-722ba394] {
display: flex;
flex-direction: column;
gap: 0.35rem;
font-size: 0.85rem;
max-width: 300px;
}
.recipients-list span[data-v-722ba394] {
color: var(--text-secondary);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.more-recipients[data-v-722ba394] {
color: var(--neon-cyan);
font-style: italic;
font-weight: 600;
}
.history-status[data-v-722ba394] {
padding: 0.35rem 0.75rem;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.history-status.status-sent[data-v-722ba394] {
background: rgba(100, 255, 100, 0.15);
color: var(--neon-green);
border: 1px solid rgba(100, 255, 100, 0.3);
}
.history-status.status-pending[data-v-722ba394] {
background: rgba(255, 191, 0, 0.15);
color: var(--neon-orange);
border: 1px solid rgba(255, 191, 0, 0.3);
}
.history-status.status-failed[data-v-722ba394] {
background: rgba(255, 100, 100, 0.15);
color: #ff6464;
border: 1px solid rgba(255, 100, 100, 0.3);
}
.delivery-stats[data-v-722ba394] {
font-weight: 700;
color: var(--neon-green);
font-size: 0.95rem;
}
.failure-reason[data-v-722ba394] {
font-size: 0.8rem;
color: var(--neon-red);
margin-top: 0.5rem;
font-style: italic;
padding: 0.5rem;
background: rgba(255, 7, 58, 0.1);
border-left: 2px solid var(--neon-red);
border-radius: 4px;
}
.pagination-info[data-v-722ba394] {
margin-top: 1rem;
text-align: center;
font-size: 0.9rem;
color: var(--text-secondary);
padding: 1rem;
background: linear-gradient(135deg, rgba(0, 245, 255, 0.05), rgba(255, 7, 58, 0.05));
border-radius: 8px;
border: 1px solid rgba(0, 245, 255, 0.2);
}
.btn-small[data-v-722ba394] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-722ba394]:hover {
background: rgba(255, 255, 255, 0.1);
}
/* Comp Creator filter bar */
.comp-creator-filter-bar[data-v-b78ee074] {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.filter-label[data-v-b78ee074] {
font-size: 0.8rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 600;
white-space: nowrap;
}
.comp-creator-tabs[data-v-b78ee074] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-toggle[data-v-b78ee074] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.active[data-v-b78ee074] {
background: var(--neon-green);
color: var(--bg-primary);
border-color: var(--neon-green);
}
.btn-toggle.archived[data-v-b78ee074] {
border-color: rgba(255, 165, 0, 0.4);
color: #ffa500;
}
.btn-toggle.archived.active[data-v-b78ee074] {
background: rgba(255, 165, 0, 0.2);
border-color: #ffa500;
}
.tab-count[data-v-b78ee074] {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 18px;
height: 18px;
margin-left: 0.4rem;
padding: 0 4px;
font-size: 0.7rem;
font-weight: bold;
border-radius: 9px;
background: rgba(255, 165, 0, 0.3);
color: #ffa500;
}
/* Settings sections */
.settings-section[data-v-b78ee074] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-b78ee074] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
/* Template list */
.template-list[data-v-b78ee074] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.template-card[data-v-b78ee074] {
padding: 1rem;
border-radius: 8px;
}
.template-card-header[data-v-b78ee074] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
}
.template-name[data-v-b78ee074] {
font-weight: bold;
font-size: 1.1rem;
color: var(--text-primary);
}
.template-badge[data-v-b78ee074] {
font-size: 0.75rem;
padding: 0.2rem 0.6rem;
border-radius: 4px;
font-weight: bold;
text-transform: uppercase;
}
.badge-buffet[data-v-b78ee074] {
background: rgba(230, 126, 34, 0.2);
color: #e67e22;
border: 1px solid rgba(230, 126, 34, 0.4);
}
.badge-merchandise[data-v-b78ee074] {
background: rgba(155, 89, 182, 0.2);
color: #9b59b6;
border: 1px solid rgba(155, 89, 182, 0.4);
}
.badge-smp[data-v-b78ee074] {
background: rgba(231, 76, 60, 0.2);
color: #e74c3c;
border: 1px solid rgba(231, 76, 60, 0.4);
}
.badge-promotional[data-v-b78ee074] {
background: rgba(52, 152, 219, 0.2);
color: #3498db;
border: 1px solid rgba(52, 152, 219, 0.4);
}
.badge-industry[data-v-b78ee074] {
background: rgba(46, 204, 113, 0.2);
color: #2ecc71;
border: 1px solid rgba(46, 204, 113, 0.4);
}
.badge-specialguest[data-v-b78ee074] {
background: rgba(241, 196, 15, 0.2);
color: #f1c40f;
border: 1px solid rgba(241, 196, 15, 0.4);
}
.badge-core[data-v-b78ee074] {
background: rgba(149, 165, 166, 0.2);
color: #95a5a6;
border: 1px solid rgba(149, 165, 166, 0.4);
}
.badge-modified[data-v-b78ee074] {
background: rgba(241, 196, 15, 0.18);
color: #f1c40f;
border: 1px solid rgba(241, 196, 15, 0.45);
animation: pulse-badge-modified-b78ee074 2s ease-in-out infinite;
}
@keyframes pulse-badge-modified-b78ee074 {
0%, 100% { opacity: 1;
}
50% { opacity: 0.65;
}
}
.category-info-note-industry[data-v-b78ee074] {
background: rgba(241, 196, 15, 0.08);
border: 1px solid rgba(241, 196, 15, 0.3);
color: #f1c40f;
}
.category-info-note[data-v-b78ee074] {
font-size: 0.8rem;
color: var(--text-secondary);
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 0.5rem 0.75rem;
margin-bottom: 1rem;
}
.insert-default-btn[data-v-b78ee074] {
margin-left: 0.5rem;
font-size: 0.75rem;
padding: 0.2rem 0.6rem;
vertical-align: middle;
}
.compliance-hint[data-v-b78ee074] {
font-size: 0.75rem;
color: var(--text-secondary);
margin-top: 0.35rem;
line-height: 1.35;
}
.compliance-hint em[data-v-b78ee074] {
color: var(--text-primary);
font-style: normal;
font-weight: 600;
}
.category-info-note-promo[data-v-b78ee074] {
color: #3498db;
border-color: rgba(52, 152, 219, 0.3);
background: rgba(52, 152, 219, 0.07);
}
.template-card-body[data-v-b78ee074] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: 0.5rem;
}
.template-card-actions[data-v-b78ee074] {
display: flex;
gap: 0.5rem;
}
.template-archived[data-v-b78ee074] {
opacity: 0.65;
border-left: 3px solid rgba(255, 165, 0, 0.5);
}
.archived-name[data-v-b78ee074] {
text-decoration: line-through;
text-decoration-color: rgba(255, 165, 0, 0.5);
}
.btn-warning-outline[data-v-b78ee074] {
border-color: rgba(255, 165, 0, 0.5) !important;
color: #ffa500 !important;
}
.btn-warning-outline[data-v-b78ee074]:hover {
background: rgba(255, 165, 0, 0.15) !important;
}
/* Form */
.template-form[data-v-b78ee074] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.form-field[data-v-b78ee074] {
display: flex;
flex-direction: column;
gap: 0.4rem;
}
.form-field > label[data-v-b78ee074] {
font-size: 0.85rem;
color: var(--text-secondary);
font-weight: 500;
}
.form-field > .btn-toggle[data-v-b78ee074] {
align-self: flex-start;
}
.form-field > .input-glass.small[data-v-b78ee074] {
width: 120px;
}
.input-with-counter[data-v-b78ee074] {
position: relative;
display: flex;
flex-direction: column;
gap: 0.25rem;
flex: 1;
}
.input-with-counter .input-glass[data-v-b78ee074] {
width: 100%;
}
.char-counter[data-v-b78ee074] {
font-size: 0.7rem;
color: var(--text-secondary);
text-align: right;
}
.char-counter.warning[data-v-b78ee074] {
color: #e67e22;
}
.radio-group[data-v-b78ee074] {
display: flex;
gap: 1rem;
}
.radio-label[data-v-b78ee074] {
display: flex;
align-items: center;
gap: 0.4rem;
color: var(--text-secondary);
cursor: pointer;
}
.input-row[data-v-b78ee074] {
display: flex;
align-items: center;
}
.chips-input[data-v-b78ee074] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.input-glass.small[data-v-b78ee074] {
width: 80px;
}
.btn-sm[data-v-b78ee074] {
padding: 0.3rem 0.6rem;
font-size: 0.8rem;
border-radius: 6px;
}
/* Animations */
.animate-fade-in[data-v-b78ee074] {
animation: fadeIn-b78ee074 0.3s ease-out;
}
.animate-scale-in[data-v-b78ee074] {
animation: scaleIn-b78ee074 0.3s ease-out;
}
@keyframes fadeIn-b78ee074 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-b78ee074 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
/* Modal layout overrides for large variant */
.modal-content.large[data-v-b78ee074] {
max-width: 1000px;
}
.btn-close[data-v-b78ee074] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-b78ee074]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
/* Conditions builder */
.conditions-section[data-v-b78ee074] {
border-top: 1px solid rgba(255, 255, 255, 0.08);
padding-top: 1rem;
margin-top: 0.5rem;
}
.field-hint[data-v-b78ee074] {
font-size: 0.75rem;
color: var(--text-secondary);
margin: 0 0 0.5rem;
}
/* Industry / SpecialGuest server-side rules — 2-column grid of small numeric +
select inputs. Renders only when editing a core template. */
.industry-rules-block[data-v-b78ee074] {
border: 1px dashed rgba(241, 196, 15, 0.35);
border-radius: 8px;
padding: 0.75rem 0.9rem;
background: rgba(241, 196, 15, 0.04);
margin-top: 0.5rem;
}
.industry-rules-grid[data-v-b78ee074] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.6rem 1rem;
margin-top: 0.4rem;
}
.industry-rules-cell[data-v-b78ee074] {
display: flex;
flex-direction: column;
gap: 0.2rem;
}
.industry-rules-sub[data-v-b78ee074] {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--text-muted, rgba(255, 255, 255, 0.7));
}
.condition-presets[data-v-b78ee074] {
display: flex;
gap: 0.4rem;
flex-wrap: wrap;
margin-bottom: 0.75rem;
}
.condition-preset-btn[data-v-b78ee074] {
font-size: 0.7rem !important;
padding: 0.25rem 0.6rem !important;
white-space: nowrap;
}
.condition-row-edit[data-v-b78ee074] {
display: flex;
gap: 0.4rem;
align-items: center;
margin-bottom: 0.4rem;
flex-wrap: wrap;
}
.condition-row-edit select[data-v-b78ee074] {
min-width: 180px;
flex: 2;
}
.condition-row-edit .op-select[data-v-b78ee074] {
min-width: 60px;
max-width: 70px;
flex: 0;
}
.condition-row-edit .value-input[data-v-b78ee074] {
min-width: 80px;
max-width: 120px;
flex: 1;
}
.condition-row-edit .label-input[data-v-b78ee074] {
min-width: 140px;
flex: 2;
}
.btn-remove-cond[data-v-b78ee074] {
padding: 0.2rem 0.5rem !important;
font-size: 1.1rem;
line-height: 1;
color: #f87171;
flex-shrink: 0;
}
.add-condition-btn[data-v-b78ee074] {
font-size: 0.8rem !important;
padding: 0.3rem 0.8rem !important;
margin-top: 0.25rem;
}
.condition-clarifier[data-v-b78ee074] {
font-size: 0.75rem;
color: #4ade80;
margin: 0.5rem 0 0;
font-style: italic;
}
/* ── Modal sizing ─────────────────────────────────────────────────────────── */
.promo-modal[data-v-64de3b4c] {
max-width: 520px;
width: 100%;
}
/* ── Field rows ───────────────────────────────────────────────────────────── */
.promo-field-row[data-v-64de3b4c] {
display: flex;
flex-direction: column;
gap: 0.4rem;
margin-bottom: 1.1rem;
}
.promo-label[data-v-64de3b4c] {
font-size: 0.8rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.promo-hint[data-v-64de3b4c] {
font-size: 0.75rem;
color: var(--text-muted);
text-transform: none;
letter-spacing: 0;
}
.promo-hint-text[data-v-64de3b4c] {
font-size: 0.77rem;
color: var(--text-muted);
margin-top: 0.25rem;
}
/* ── Select / inputs ──────────────────────────────────────────────────────── */
.promo-select[data-v-64de3b4c] {
width: 100%;
}
.promo-qty-input[data-v-64de3b4c] {
width: 120px;
}
/* ── Amount quick-select ──────────────────────────────────────────────────── */
.promo-amount-row[data-v-64de3b4c] {
display: flex;
gap: 0.4rem;
flex-wrap: wrap;
}
.promo-amt-btn[data-v-64de3b4c] {
padding: 0.35rem 0.75rem;
font-size: 0.85rem;
border-radius: 8px;
min-width: 52px;
text-align: center;
}
.promo-amt-btn.active[data-v-64de3b4c] {
border-color: var(--neon-blue);
color: var(--neon-blue);
box-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.promo-amt-btn[data-v-64de3b4c]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
/* ── Custom amount row ────────────────────────────────────────────────────── */
.promo-custom-row[data-v-64de3b4c] {
display: flex;
align-items: center;
gap: 0.4rem;
margin-top: 0.4rem;
}
.promo-dollar[data-v-64de3b4c] {
color: var(--text-secondary);
font-size: 1rem;
}
.promo-custom-input[data-v-64de3b4c] {
width: 120px;
}
/* ── WA compliance warning ────────────────────────────────────────────────── */
.promo-warning[data-v-64de3b4c] {
font-size: 0.77rem;
color: var(--neon-orange);
margin-top: 0.25rem;
}
/* ── Preview bar ──────────────────────────────────────────────────────────── */
.promo-preview[data-v-64de3b4c] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.65rem 0.9rem;
border-radius: 10px;
margin-bottom: 1rem;
}
.promo-preview-label[data-v-64de3b4c] {
font-size: 0.75rem;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.05em;
flex-shrink: 0;
}
.promo-preview-value[data-v-64de3b4c] {
font-size: 0.95rem;
font-weight: 600;
}
/* ── Print button ─────────────────────────────────────────────────────────── */
.promo-print-btn[data-v-64de3b4c] {
width: 100%;
justify-content: center;
gap: 0.5rem;
padding: 0.65rem 1rem;
font-size: 0.95rem;
margin-bottom: 1.25rem;
}
.promo-print-btn[data-v-64de3b4c]:disabled {
opacity: 0.45;
cursor: not-allowed;
}
/* ── Section divider ──────────────────────────────────────────────────────── */
.promo-section-divider[data-v-64de3b4c] {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 0.75rem;
color: var(--text-muted);
font-size: 0.78rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.promo-section-divider[data-v-64de3b4c]::before,
.promo-section-divider[data-v-64de3b4c]::after {
content: '';
flex: 1;
height: 1px;
background: var(--glass-border);
}
/* ── Batches list ─────────────────────────────────────────────────────────── */
.promo-batches-loading[data-v-64de3b4c],
.promo-batches-empty[data-v-64de3b4c] {
color: var(--text-muted);
font-size: 0.85rem;
text-align: center;
padding: 0.75rem 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.promo-retry-btn[data-v-64de3b4c] {
padding: 0.2rem 0.6rem;
font-size: 0.75rem;
border-radius: 6px;
}
.promo-batches-list[data-v-64de3b4c] {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.promo-batch-row[data-v-64de3b4c] {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.75rem;
padding: 0.6rem 0.85rem;
border-radius: 10px;
}
.batch-voided[data-v-64de3b4c] {
opacity: 0.5;
}
.batch-voided .promo-batch-detail[data-v-64de3b4c],
.batch-voided .promo-batch-id[data-v-64de3b4c] {
text-decoration: line-through;
}
.promo-batch-info[data-v-64de3b4c] {
display: flex;
flex-direction: column;
gap: 0.2rem;
min-width: 0;
}
.promo-batch-id[data-v-64de3b4c] {
font-size: 0.78rem;
font-family: monospace;
letter-spacing: 0.03em;
}
.promo-batch-detail[data-v-64de3b4c] {
font-size: 0.88rem;
color: var(--text-primary);
font-weight: 500;
}
.promo-batch-meta[data-v-64de3b4c] {
font-size: 0.75rem;
color: var(--text-muted);
}
.promo-voided-badge[data-v-64de3b4c] {
font-size: 0.68rem;
color: var(--neon-red);
letter-spacing: 0.06em;
font-weight: 700;
}
.promo-batch-actions[data-v-64de3b4c] {
display: flex;
gap: 0.4rem;
align-items: center;
flex-shrink: 0;
}
.promo-batch-btn[data-v-64de3b4c] {
padding: 0.25rem 0.6rem;
font-size: 0.78rem;
border-radius: 6px;
}
.promo-batch-btn[data-v-64de3b4c]:disabled {
opacity: 0.45;
cursor: not-allowed;
}
.points-manager-card .admin-status-pill[data-v-4df5d446] {
margin-bottom: 1.5rem;
}
.points-manager-card .admin-status-error[data-v-4df5d446] {
margin: 0.5rem 0 1rem 0;
}
/* Modal tabs — shared pattern from HousePointsWidget */
.modal-tabs[data-v-4df5d446] {
display: flex;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-button[data-v-4df5d446] {
flex: 1;
padding: 0.875rem 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.tab-button[data-v-4df5d446]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
}
.tab-button.active[data-v-4df5d446] {
background: rgba(0, 245, 255, 0.12);
border-color: rgba(0, 245, 255, 0.5);
color: var(--neon-blue);
box-shadow: 0 4px 15px rgba(0, 245, 255, 0.15);
}
.settings-section[data-v-4df5d446] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-4df5d446] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
/* Stats row */
.summary-cards[data-v-4df5d446] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 0.75rem;
margin-bottom: 1.5rem;
}
.summary-cards.three-col[data-v-4df5d446] {
grid-template-columns: repeat(3, 1fr);
}
.card-glass.stat[data-v-4df5d446] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
min-width: 0;
}
.stat-icon[data-v-4df5d446] {
font-size: 1.25rem;
flex-shrink: 0;
}
.stat-content[data-v-4df5d446] {
min-width: 0;
overflow: hidden;
}
.stat-label[data-v-4df5d446] {
font-size: 0.7rem;
color: var(--text-secondary);
margin-bottom: 0.15rem;
white-space: nowrap;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.stat-value[data-v-4df5d446] {
font-size: 1.15rem;
font-weight: 700;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.stat-sublabel[data-v-4df5d446] {
font-size: 0.7rem;
color: var(--text-muted);
margin-top: 0.1rem;
white-space: nowrap;
}
/* Toggle switch */
.toggle-label[data-v-4df5d446] {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 1rem;
color: var(--text-primary);
font-weight: 600;
}
.toggle-switch-wrap[data-v-4df5d446] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.toggle-input[data-v-4df5d446] {
display: none;
}
.toggle-track[data-v-4df5d446] {
position: relative;
display: inline-block;
width: 48px;
height: 26px;
background: rgba(255, 255, 255, 0.12);
border-radius: 13px;
border: 1px solid rgba(255, 255, 255, 0.2);
cursor: pointer;
transition: background 0.3s ease;
}
.toggle-input:checked + .toggle-track[data-v-4df5d446] {
background: rgba(57, 255, 20, 0.3);
border-color: rgba(57, 255, 20, 0.6);
}
.toggle-thumb[data-v-4df5d446] {
position: absolute;
top: 3px;
left: 3px;
width: 18px;
height: 18px;
background: var(--text-secondary);
border-radius: 50%;
transition: transform 0.3s ease, background 0.3s ease;
}
.toggle-input:checked + .toggle-track .toggle-thumb[data-v-4df5d446] {
transform: translateX(22px);
background: var(--neon-green);
}
.toggle-status[data-v-4df5d446] {
font-size: 0.9rem;
color: var(--text-secondary);
font-weight: 500;
min-width: 60px;
}
/* Rolloff meta box */
.rolloff-meta[data-v-4df5d446] {
padding: 1rem 1.25rem;
margin-bottom: 1.5rem;
}
.rolloff-meta-row[data-v-4df5d446] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.4rem 0;
font-size: 0.9rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.rolloff-meta-row[data-v-4df5d446]:last-child {
border-bottom: none;
}
.meta-label[data-v-4df5d446] {
color: var(--text-secondary);
}
.meta-value[data-v-4df5d446] {
color: var(--text-primary);
font-weight: 500;
}
/* Form */
.form-group[data-v-4df5d446] {
margin-bottom: 1.25rem;
}
.form-group label[data-v-4df5d446] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.form-group .input-glass[data-v-4df5d446] {
width: 100%;
}
.input-hint[data-v-4df5d446] {
display: block;
margin-top: 0.35rem;
font-size: 0.8rem;
}
.muted[data-v-4df5d446] {
color: var(--text-secondary);
}
.form-actions[data-v-4df5d446] {
display: flex;
gap: 0.75rem;
padding-top: 0.5rem;
}
/* Disabled notice */
.disabled-notice[data-v-4df5d446] {
padding: 1rem 1.25rem;
margin-bottom: 1.5rem;
color: var(--neon-orange);
border-color: rgba(255, 102, 0, 0.4);
}
/* History */
.history-filters[data-v-4df5d446] {
display: flex;
gap: 1rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.history-filters .form-group[data-v-4df5d446] {
flex: 1;
min-width: 140px;
margin-bottom: 0;
}
.history-row[data-v-4df5d446] {
cursor: pointer;
}
.history-row[data-v-4df5d446]:hover {
background: rgba(255, 255, 255, 0.04);
}
.history-row.expanded[data-v-4df5d446] {
background: rgba(0, 245, 255, 0.05);
border-bottom: none;
}
.history-detail-row td[data-v-4df5d446] {
padding: 0.75rem 1rem 1rem;
background: rgba(0, 0, 0, 0.2);
}
.expand-toggle[data-v-4df5d446] {
text-align: center;
color: var(--text-secondary);
font-size: 0.75rem;
}
.detail-table[data-v-4df5d446] {
margin-top: 0.5rem;
}
/* Exempt cell */
.exempt-cell[data-v-4df5d446] {
display: flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
}
.exempt-reason-input[data-v-4df5d446] {
width: 140px;
padding: 6px 10px;
font-size: 0.8rem;
}
/* Table */
.table-responsive[data-v-4df5d446] {
overflow-x: auto;
}
.data-table[data-v-4df5d446] {
width: 100%;
border-collapse: separate;
border-spacing: 0;
font-size: 0.9rem;
}
.data-table th[data-v-4df5d446] {
background: rgba(255, 255, 255, 0.08);
padding: 10px 14px;
color: var(--text-primary);
font-weight: 600;
text-align: left;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.data-table td[data-v-4df5d446] {
padding: 10px 14px;
color: var(--text-secondary);
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.text-right[data-v-4df5d446] {
text-align: right;
}
.btn-sm[data-v-4df5d446] {
padding: 5px 10px;
font-size: 0.8rem;
border-radius: 8px;
}
/* Loading / empty states */
.loading-state[data-v-4df5d446] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
padding: 3rem 1rem;
color: var(--text-secondary);
}
.empty-state[data-v-4df5d446] {
display: flex;
align-items: center;
justify-content: center;
padding: 3rem 1rem;
color: var(--text-secondary);
font-style: italic;
}
/* Play Speed tab — SAFD: casino-update-default-playerspeed-configurable
Constrain the form-style content to a centered column inside the wide
.modal-content.large (which is 90vw). Other tabs (Settings/Preview/History)
fill the width naturally with stat grids and tables; this tab is a form,
so it gets a reasonable text-column width like a settings panel. */
.speed-section[data-v-4df5d446] {
max-width: 720px;
margin: 0 auto;
}
.section-hint[data-v-4df5d446] {
margin: 0 0 1rem;
font-size: 0.9rem;
line-height: 1.5;
}
.speed-buttons[data-v-4df5d446] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
margin-bottom: 0.5rem;
}
.speed-button[data-v-4df5d446] {
flex: 1 1 auto;
min-width: 84px;
padding: 0.75rem 1rem;
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.02em;
}
.speed-button.active[data-v-4df5d446] {
background: rgba(0, 245, 255, 0.18);
border-color: rgba(0, 245, 255, 0.6);
color: var(--neon-blue);
box-shadow: 0 4px 15px rgba(0, 245, 255, 0.25);
}
.save-status[data-v-4df5d446] {
margin: 0.25rem 0 0;
font-size: 0.85rem;
}
.section-divider[data-v-4df5d446] {
border: 0;
border-top: 1px solid rgba(255, 255, 255, 0.08);
margin: 2rem 0 1.5rem;
}
.attention-banner[data-v-4df5d446] {
padding: 1rem 1.25rem;
background: rgba(255, 152, 0, 0.08);
border: 1px solid rgba(255, 152, 0, 0.4);
border-radius: 8px;
color: var(--text-primary);
font-size: 0.95rem;
line-height: 1.5;
margin-bottom: 1.25rem;
}
.window-radios[data-v-4df5d446] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-top: 0.5rem;
}
.window-radio[data-v-4df5d446] {
flex: 0 1 auto;
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.875rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.9rem;
white-space: nowrap;
}
.window-radio[data-v-4df5d446]:hover {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
}
.window-radio.active[data-v-4df5d446] {
background: rgba(0, 245, 255, 0.1);
border-color: rgba(0, 245, 255, 0.5);
color: var(--neon-blue);
}
.window-radio input[type="radio"][data-v-4df5d446] {
margin: 0;
accent-color: var(--neon-blue);
}
.preview-result[data-v-4df5d446] {
padding: 1rem 1.25rem;
margin-top: 1rem;
}
.preview-row[data-v-4df5d446] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.preview-row[data-v-4df5d446]:last-child {
border-bottom: 0;
}
.preview-history .meta-value[data-v-4df5d446] {
font-size: 0.85rem;
text-align: right;
}
.last-result[data-v-4df5d446] {
padding: 1rem 1.25rem;
margin-top: 1rem;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 0.5rem;
}
.self-exclusion-card .admin-status-pill[data-v-df8966d3] {
margin-bottom: 1.5rem;
}
.self-exclusion-card .admin-status-error[data-v-df8966d3] {
margin: 0.5rem 0 1rem 0;
}
.animate-fade-in[data-v-df8966d3] {
animation: fadeIn-df8966d3 0.3s ease-out;
}
.animate-scale-in[data-v-df8966d3] {
animation: scaleIn-df8966d3 0.3s ease-out;
}
@keyframes fadeIn-df8966d3 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-df8966d3 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-content.large[data-v-df8966d3] {
max-width: 1200px;
}
.btn-close[data-v-df8966d3] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-df8966d3]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-tabs[data-v-df8966d3] {
display: flex;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-button[data-v-df8966d3] {
flex: 1;
padding: 0.875rem 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.tab-button[data-v-df8966d3]:hover {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
transform: translateY(-1px);
}
.tab-button.active[data-v-df8966d3] {
background: var(--neon-red);
border-color: var(--neon-red);
color: white;
box-shadow: 0 4px 15px rgba(255, 7, 58, 0.3);
}
.settings-section[data-v-df8966d3] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-df8966d3] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.muted[data-v-df8966d3] {
color: var(--text-secondary);
font-size: 0.9rem;
line-height: 1.5;
margin-bottom: 1.5rem;
}
.muted.small[data-v-df8966d3] {
font-size: 0.85rem;
margin-bottom: 0.75rem;
}
.stats-row[data-v-df8966d3] {
display: flex;
gap: 1.5rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.stat-box[data-v-df8966d3] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
padding: 1rem;
text-align: center;
min-width: 120px;
}
.stat-value[data-v-df8966d3] {
font-size: 1.5rem;
font-weight: 700;
color: var(--neon-blue);
margin-bottom: 0.25rem;
}
.stat-value.warning[data-v-df8966d3] {
color: var(--neon-orange);
}
.stat-label[data-v-df8966d3] {
font-size: 0.75rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.5px;
}
.form-section[data-v-df8966d3] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.form-label[data-v-df8966d3] {
font-weight: 600;
color: var(--text-primary);
font-size: 0.95rem;
}
.file-input[data-v-df8966d3] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
cursor: pointer;
font-size: 0.9rem;
}
.input-hint[data-v-df8966d3] {
font-size: 0.85rem;
color: var(--text-secondary);
line-height: 1.4;
}
.file-preview[data-v-df8966d3] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.2);
border-radius: 8px;
}
.file-icon[data-v-df8966d3] {
font-size: 1.2rem;
}
.file-name[data-v-df8966d3] {
color: var(--neon-blue);
font-weight: 500;
}
.file-size[data-v-df8966d3] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.form-actions[data-v-df8966d3] {
display: flex;
gap: 1rem;
flex-wrap: wrap;
}
.warning-box[data-v-df8966d3] {
background: rgba(255, 165, 0, 0.08);
border: 1px solid rgba(255, 165, 0, 0.3);
border-radius: 10px;
padding: 1rem 1.25rem;
color: var(--text-secondary);
font-size: 0.85rem;
line-height: 1.6;
}
.warning-box strong[data-v-df8966d3] {
color: #ffa500;
display: block;
margin-bottom: 0.5rem;
}
.warning-box ul[data-v-df8966d3] {
margin: 0;
padding-left: 1.25rem;
}
.warning-box li[data-v-df8966d3] {
margin-bottom: 0.25rem;
}
.exclusion-list-tab[data-v-df8966d3] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.exclusion-list-header[data-v-df8966d3] {
display: flex;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
}
.exclusion-search-wrapper[data-v-df8966d3] {
display: flex;
align-items: center;
gap: 0.75rem;
flex: 1;
min-width: 320px;
}
.exclusion-search-wrapper .input-glass[data-v-df8966d3] {
flex: 1;
}
.exclusion-search-count[data-v-df8966d3] {
font-size: 0.85rem;
color: var(--text-secondary);
white-space: nowrap;
}
.btn-sm[data-v-df8966d3] {
padding: 0.45rem 0.9rem;
font-size: 0.85rem;
}
.add-entry-card[data-v-df8966d3] {
padding: 1rem 1.25rem;
border-radius: 12px;
margin-bottom: 0.5rem;
}
.add-entry-card h4[data-v-df8966d3] {
margin: 0 0 0.75rem 0;
font-size: 1rem;
color: var(--text-primary);
}
.form-grid[data-v-df8966d3] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.form-group[data-v-df8966d3] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.form-group.full[data-v-df8966d3] {
grid-column: 1 / -1;
}
.form-group label[data-v-df8966d3] {
font-size: 0.8rem;
color: var(--text-secondary);
font-weight: 600;
}
.exclusion-table-wrapper[data-v-df8966d3] {
max-height: 480px;
overflow-y: auto;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.exclusion-table[data-v-df8966d3] {
display: grid;
grid-template-columns: 1fr 1fr auto auto auto auto;
}
.exclusion-table-header[data-v-df8966d3] {
display: contents;
}
.exclusion-table-header > span[data-v-df8966d3] {
padding: 0.6rem 1rem;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--text-primary);
background: rgba(255, 255, 255, 0.06);
border-bottom: 2px solid rgba(0, 245, 255, 0.15);
position: sticky;
top: 0;
z-index: 1;
}
.exclusion-table-row[data-v-df8966d3] {
display: contents;
}
.exclusion-table-row[data-v-df8966d3] > * {
padding: 0.55rem 1rem;
font-size: 0.9rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
display: flex;
align-items: center;
}
.exclusion-table-row[data-v-df8966d3]:hover > * {
background: rgba(255, 71, 87, 0.06);
}
.exclusion-table-row.is-manual[data-v-df8966d3] > * {
background: rgba(0, 245, 255, 0.04);
}
.exclusion-table-row.editing[data-v-df8966d3] > * {
background: rgba(255, 255, 0, 0.05);
}
.inline-edit[data-v-df8966d3] {
width: 100%;
padding: 0.35rem 0.5rem;
font-size: 0.85rem;
}
.excl-last[data-v-df8966d3] {
font-weight: 600;
color: var(--text-primary);
}
.excl-dob[data-v-df8966d3] {
font-family: monospace;
font-size: 0.85rem;
white-space: nowrap;
}
.excl-date[data-v-df8966d3] {
font-size: 0.8rem;
white-space: nowrap;
}
.excl-source[data-v-df8966d3] {
white-space: nowrap;
}
.excl-actions[data-v-df8966d3] {
display: flex;
gap: 0.25rem;
justify-content: flex-end;
}
.badge[data-v-df8966d3] {
display: inline-block;
padding: 0.15rem 0.5rem;
border-radius: 999px;
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.badge-wsgc[data-v-df8966d3] {
background: rgba(255, 71, 87, 0.15);
color: #ff6b6b;
border: 1px solid rgba(255, 71, 87, 0.3);
}
.badge-manual[data-v-df8966d3] {
background: rgba(0, 245, 255, 0.15);
color: var(--neon-blue);
border: 1px solid rgba(0, 245, 255, 0.3);
}
.badge-unknown[data-v-df8966d3] {
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border: 1px solid rgba(255, 255, 255, 0.1);
}
.btn-icon-only[data-v-df8966d3] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 0.3rem 0.5rem;
cursor: pointer;
font-size: 0.95rem;
transition: all 0.2s ease;
}
.btn-icon-only[data-v-df8966d3]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.25);
}
.btn-icon-only.btn-icon-danger[data-v-df8966d3]:hover {
background: rgba(255, 71, 87, 0.15);
border-color: rgba(255, 71, 87, 0.4);
}
.flagged-table[data-v-df8966d3] {
display: grid;
grid-template-columns: 1.4fr 1.2fr auto 1fr auto auto auto;
}
.flagged-table-header[data-v-df8966d3] {
display: contents;
}
.flagged-table-header > span[data-v-df8966d3] {
padding: 0.6rem 1rem;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--text-primary);
background: rgba(255, 255, 255, 0.06);
border-bottom: 2px solid rgba(255, 165, 0, 0.25);
position: sticky;
top: 0;
z-index: 1;
}
.flagged-table-row[data-v-df8966d3] {
display: contents;
}
.flagged-table-row[data-v-df8966d3] > * {
padding: 0.55rem 1rem;
font-size: 0.88rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
display: flex;
align-items: center;
}
.flagged-table-row[data-v-df8966d3]:hover > * {
background: rgba(255, 165, 0, 0.05);
}
.flagged-ids[data-v-df8966d3] {
flex-direction: column;
align-items: flex-start !important;
gap: 0.1rem;
}
.flagged-ids code[data-v-df8966d3] {
font-family: monospace;
font-size: 0.85rem;
color: var(--neon-blue);
}
.flagged-ids small[data-v-df8966d3] {
font-size: 0.75rem;
}
.flagged-dob[data-v-df8966d3],
.flagged-since[data-v-df8966d3] {
font-family: monospace;
font-size: 0.85rem;
white-space: nowrap;
}
.flagged-actions[data-v-df8966d3] {
display: flex;
gap: 0.25rem;
justify-content: flex-end;
}
.exclusion-loading[data-v-df8966d3],
.exclusion-empty[data-v-df8966d3],
.exclusion-error[data-v-df8966d3] {
padding: 2rem;
text-align: center;
border-radius: 10px;
}
.exclusion-error[data-v-df8966d3] {
color: #ff4757;
background: rgba(255, 71, 87, 0.08);
border: 1px solid rgba(255, 71, 87, 0.25);
}
/* Animations */
.animate-fade-in[data-v-7a9fa7f1] {
animation: fadeIn-7a9fa7f1 0.3s ease-out;
}
.animate-scale-in[data-v-7a9fa7f1] {
animation: scaleIn-7a9fa7f1 0.3s ease-out;
}
@keyframes fadeIn-7a9fa7f1 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-7a9fa7f1 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-content.large[data-v-7a9fa7f1] {
max-width: 1000px;
}
.btn-close[data-v-7a9fa7f1] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-7a9fa7f1]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
/* Settings sections */
.settings-section[data-v-7a9fa7f1] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-7a9fa7f1] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.settings-divider[data-v-7a9fa7f1] {
height: 1px;
background: rgba(255, 255, 255, 0.08);
margin: 1.5rem 0;
}
.section-description[data-v-7a9fa7f1] {
color: var(--text-secondary);
font-size: 0.85rem;
margin-bottom: 1rem;
}
/* Priority section */
.priority-section[data-v-7a9fa7f1] {
background: rgba(0, 245, 255, 0.03);
border: 1px solid rgba(0, 245, 255, 0.12);
border-radius: 12px;
padding: 1.25rem;
}
.global-control-header[data-v-7a9fa7f1] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.geo-status-badge[data-v-7a9fa7f1] {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.4rem 0.9rem;
border-radius: 999px;
border: 1px solid rgba(255, 100, 100, 0.4);
background: rgba(255, 100, 100, 0.1);
font-size: 0.8rem;
font-weight: 700;
color: var(--neon-red);
letter-spacing: 0.05em;
transition: all 0.3s ease;
}
.geo-status-badge.active[data-v-7a9fa7f1] {
border-color: rgba(57, 255, 20, 0.4);
background: rgba(57, 255, 20, 0.08);
color: var(--neon-green);
}
.status-dot[data-v-7a9fa7f1] {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--neon-red);
transition: background 0.3s ease;
}
.status-dot.enabled[data-v-7a9fa7f1] {
background: var(--neon-green);
box-shadow: 0 0 6px rgba(57, 255, 20, 0.6);
}
/* Setting items */
.setting-item[data-v-7a9fa7f1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.setting-item label[data-v-7a9fa7f1] {
display: flex;
flex-direction: column;
gap: 0.25rem;
flex: 1;
padding-right: 1rem;
}
.setting-item label span[data-v-7a9fa7f1]:first-child {
color: var(--text-primary);
font-weight: 500;
}
.setting-hint[data-v-7a9fa7f1] {
font-size: 0.8rem;
color: var(--text-secondary);
line-height: 1.4;
}
.setting-control[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 1rem;
flex-shrink: 0;
}
.btn-toggle[data-v-7a9fa7f1] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.active[data-v-7a9fa7f1] {
background: var(--neon-green);
color: var(--bg-primary);
border-color: var(--neon-green);
}
.btn-toggle.large[data-v-7a9fa7f1] {
padding: 0.625rem 1.25rem;
font-size: 1rem;
font-weight: 600;
}
.btn-toggle[data-v-7a9fa7f1]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* Last modified info */
.geo-last-modified[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 0.75rem;
padding: 0.5rem 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
font-size: 0.85rem;
color: var(--text-secondary);
}
.modified-icon[data-v-7a9fa7f1] {
font-size: 0.9rem;
}
.modified-text strong[data-v-7a9fa7f1] {
color: var(--text-primary);
}
/* Grace period control */
.grace-period-control[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.grace-period-input[data-v-7a9fa7f1] {
width: 80px;
text-align: center;
}
.input-suffix[data-v-7a9fa7f1] {
color: var(--text-secondary);
font-size: 0.85rem;
white-space: nowrap;
}
.grace-period-presets[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 0.75rem;
flex-wrap: wrap;
}
.preset-label[data-v-7a9fa7f1] {
font-size: 0.8rem;
color: var(--text-secondary);
}
.btn-preset[data-v-7a9fa7f1] {
padding: 0.35rem 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 6px;
color: var(--text-secondary);
font-size: 0.8rem;
cursor: pointer;
transition: all 0.2s ease;
}
.btn-preset[data-v-7a9fa7f1]:hover:not(:disabled) {
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.btn-preset[data-v-7a9fa7f1]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
/* Empty state */
.empty-state[data-v-7a9fa7f1] {
text-align: center;
padding: 3rem 2rem;
color: var(--text-secondary);
}
.empty-icon[data-v-7a9fa7f1] {
font-size: 3rem;
margin-bottom: 1rem;
}
.empty-state p[data-v-7a9fa7f1] {
margin-bottom: 1rem;
}
/* Locations */
.geo-locations-container[data-v-7a9fa7f1] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.geo-location-card[data-v-7a9fa7f1] {
padding: 1.25rem;
border-radius: 10px;
}
.geo-location-header[data-v-7a9fa7f1] {
display: flex;
gap: 0.75rem;
align-items: center;
margin-bottom: 1rem;
}
.geo-location-name[data-v-7a9fa7f1] {
flex: 1;
}
.btn-small[data-v-7a9fa7f1] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
}
.btn-small[data-v-7a9fa7f1]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
}
.btn-small.btn-error[data-v-7a9fa7f1] {
border-color: rgba(255, 7, 58, 0.4);
color: var(--neon-red);
}
.btn-small.btn-error[data-v-7a9fa7f1]:hover:not(:disabled) {
background: rgba(255, 7, 58, 0.1);
}
.btn-small[data-v-7a9fa7f1]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.geo-coords-grid[data-v-7a9fa7f1] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
margin-bottom: 0.75rem;
}
.coord-field[data-v-7a9fa7f1] {
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.coord-field label[data-v-7a9fa7f1] {
font-size: 0.8rem;
color: var(--text-secondary);
font-weight: 500;
}
.geo-hint[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.8rem;
color: var(--text-secondary);
margin-top: 0.5rem;
}
.hint-icon[data-v-7a9fa7f1] {
font-size: 0.9rem;
}
/* Exempt roles grid */
.geo-exempt-grid[data-v-7a9fa7f1] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
margin-bottom: 1rem;
}
.geo-exempt-badge[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.4rem;
padding: 0.5rem 0.9rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
}
.geo-exempt-badge.admin[data-v-7a9fa7f1] {
border-color: rgba(255, 7, 58, 0.4);
background: rgba(255, 7, 58, 0.08);
color: var(--neon-red);
}
.geo-exempt-badge.gm[data-v-7a9fa7f1] {
border-color: rgba(57, 255, 20, 0.4);
background: rgba(57, 255, 20, 0.08);
color: var(--neon-green);
}
.geo-exempt-badge.president[data-v-7a9fa7f1] {
border-color: rgba(255, 215, 0, 0.4);
background: rgba(255, 215, 0, 0.08);
color: #ffd700;
}
.geo-exempt-badge.executive[data-v-7a9fa7f1] {
border-color: rgba(0, 245, 255, 0.4);
background: rgba(0, 245, 255, 0.08);
color: var(--neon-blue);
}
.badge-icon[data-v-7a9fa7f1] {
font-size: 1rem;
}
.badge-name[data-v-7a9fa7f1] {
white-space: nowrap;
}
.info-note[data-v-7a9fa7f1] {
display: flex;
align-items: flex-start;
gap: 0.5rem;
padding: 0.75rem 1rem;
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.15);
border-radius: 8px;
font-size: 0.85rem;
color: var(--text-secondary);
}
.note-icon[data-v-7a9fa7f1] {
font-size: 0.9rem;
flex-shrink: 0;
margin-top: 0.1rem;
}
/* Tier cards */
.geo-tiers-grid[data-v-7a9fa7f1] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
}
.geo-tier-card[data-v-7a9fa7f1] {
padding: 1rem;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.03);
}
.geo-tier-card.basic[data-v-7a9fa7f1] {
border-color: rgba(255, 7, 58, 0.3);
background: rgba(255, 7, 58, 0.05);
}
.geo-tier-card.professional[data-v-7a9fa7f1] {
border-color: rgba(0, 245, 255, 0.3);
background: rgba(0, 245, 255, 0.05);
}
.geo-tier-card.enterprise[data-v-7a9fa7f1] {
border-color: rgba(57, 255, 20, 0.3);
background: rgba(57, 255, 20, 0.05);
}
.tier-header[data-v-7a9fa7f1] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.5rem;
}
.tier-icon[data-v-7a9fa7f1] {
font-size: 1.1rem;
}
.tier-name[data-v-7a9fa7f1] {
font-weight: 700;
color: var(--text-primary);
font-size: 0.95rem;
}
.tier-access-type[data-v-7a9fa7f1] {
font-size: 0.85rem;
font-weight: 600;
color: var(--neon-blue);
margin-bottom: 0.25rem;
}
.geo-tier-card.basic .tier-access-type[data-v-7a9fa7f1] {
color: var(--neon-red);
}
.geo-tier-card.enterprise .tier-access-type[data-v-7a9fa7f1] {
color: var(--neon-green);
}
.tier-description[data-v-7a9fa7f1] {
font-size: 0.8rem;
color: var(--text-secondary);
}
/* neon-cyan utility (not in glassmorphism.css) */
.neon-cyan[data-v-7a9fa7f1] {
color: #00f5ff;
text-shadow: 0 0 12px rgba(0, 245, 255, 0.45);
}
.neon-pink[data-v-cb0dd293] {
color: #ff0080;
text-shadow: 0 0 12px rgba(255, 0, 128, 0.45);
}
.modal-tabs[data-v-cb0dd293] {
display: flex;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-button[data-v-cb0dd293] {
flex: 1;
padding: 0.875rem 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.tab-button[data-v-cb0dd293]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
transform: translateY(-1px);
}
.tab-button.active[data-v-cb0dd293] {
background: #ff0080;
border-color: #ff0080;
color: white;
box-shadow: 0 4px 15px rgba(255, 0, 128, 0.3);
}
.tab-button[data-v-cb0dd293]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.settings-section[data-v-cb0dd293] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-cb0dd293] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.form-group[data-v-cb0dd293] {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.form-group label[data-v-cb0dd293] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.9rem;
}
.api-key-field[data-v-cb0dd293] {
display: flex;
gap: 0.75rem;
align-items: stretch;
}
.api-key-field .input-glass[data-v-cb0dd293] {
flex: 1;
}
.api-key-field .btn-small[data-v-cb0dd293] {
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.9rem;
font-weight: 500;
white-space: nowrap;
}
.api-key-field .btn-small[data-v-cb0dd293]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.input-hint[data-v-cb0dd293] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
line-height: 1.4;
}
.input-hint code[data-v-cb0dd293] {
background: rgba(255, 255, 255, 0.05);
padding: 0.15rem 0.4rem;
border-radius: 4px;
font-family: monospace;
font-size: 0.85em;
color: var(--neon-blue);
}
.muted[data-v-cb0dd293] {
color: var(--text-secondary);
}
.sms-config-form[data-v-cb0dd293],
.sms-message-form[data-v-cb0dd293] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.sms-config-meta[data-v-cb0dd293] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin: 1.5rem 0;
}
.meta-card[data-v-cb0dd293] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 1rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
transition: all 0.3s ease;
}
.meta-card[data-v-cb0dd293]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.15);
}
.meta-label[data-v-cb0dd293] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--text-secondary);
font-weight: 600;
}
.meta-value[data-v-cb0dd293] {
font-size: 1rem;
color: var(--text-primary);
font-weight: 500;
}
.meta-value.success[data-v-cb0dd293] { color: var(--neon-green);
}
.meta-value.warning[data-v-cb0dd293] { color: var(--neon-orange);
}
.sms-config-loading[data-v-cb0dd293],
.sms-config-error[data-v-cb0dd293] {
padding: 1rem;
border-radius: 10px;
text-align: center;
margin: 1rem 0;
}
.sms-config-loading[data-v-cb0dd293] {
background: rgba(0, 162, 255, 0.05);
border: 1px solid rgba(0, 162, 255, 0.2);
color: var(--neon-blue);
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
}
.sms-config-error[data-v-cb0dd293] {
background: rgba(255, 100, 100, 0.1);
border: 1px solid rgba(255, 100, 100, 0.3);
color: #ff6464;
}
.sms-config-actions[data-v-cb0dd293] {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 2rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.sms-config-action-buttons[data-v-cb0dd293] {
display: flex;
gap: 1rem;
justify-content: flex-end;
}
.sms-message-actions[data-v-cb0dd293] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 2rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.character-counter[data-v-cb0dd293] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.5rem;
}
.segment-count[data-v-cb0dd293] {
color: var(--neon-blue);
font-weight: 600;
}
.filter-row[data-v-cb0dd293] {
display: flex;
flex-direction: column;
gap: 0.75rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.08);
margin-bottom: 1rem;
}
.filter-row label[data-v-cb0dd293] {
font-size: 0.9rem;
font-weight: 600;
color: var(--text-primary);
}
.tier-select-grid[data-v-cb0dd293] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
gap: 0.75rem;
margin-top: 0.5rem;
}
.tier-checkbox[data-v-cb0dd293] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
}
.tier-checkbox[data-v-cb0dd293]:hover {
background: rgba(255, 255, 255, 0.06);
border-color: var(--neon-blue);
}
.recipient-preview[data-v-cb0dd293] {
background: rgba(0, 162, 255, 0.05);
border: 1px solid rgba(0, 162, 255, 0.2);
border-radius: 10px;
padding: 1rem;
margin-top: 1rem;
}
.preview-header[data-v-cb0dd293] {
color: var(--neon-blue);
font-size: 1rem;
margin-bottom: 0.5rem;
}
.preview-sample[data-v-cb0dd293] {
color: var(--text-secondary);
font-size: 0.85rem;
line-height: 1.5;
}
.sms-history-list[data-v-cb0dd293] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.history-item[data-v-cb0dd293] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 1.25rem;
transition: all 0.3s ease;
}
.history-item[data-v-cb0dd293]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.15);
}
.history-header[data-v-cb0dd293] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.75rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.history-date[data-v-cb0dd293] {
font-size: 0.9rem;
color: var(--text-secondary);
font-weight: 500;
}
.history-status[data-v-cb0dd293] {
padding: 0.35rem 0.75rem;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.history-status.status-sent[data-v-cb0dd293] {
background: rgba(100, 255, 100, 0.15);
color: var(--neon-green);
border: 1px solid rgba(100, 255, 100, 0.3);
}
.history-status.status-pending[data-v-cb0dd293] {
background: rgba(255, 191, 0, 0.15);
color: var(--neon-orange);
border: 1px solid rgba(255, 191, 0, 0.3);
}
.history-status.status-failed[data-v-cb0dd293] {
background: rgba(255, 100, 100, 0.15);
color: #ff6464;
border: 1px solid rgba(255, 100, 100, 0.3);
}
.history-body[data-v-cb0dd293] {
color: var(--text-primary);
line-height: 1.6;
margin-bottom: 0.75rem;
font-size: 0.95rem;
}
.history-meta[data-v-cb0dd293] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
color: var(--text-secondary);
flex-wrap: wrap;
}
.empty-state[data-v-cb0dd293] {
text-align: center;
padding: 3rem 2rem;
color: var(--text-secondary);
}
.loading-state[data-v-cb0dd293] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-spinner[data-v-cb0dd293] {
font-size: 2rem;
animation: spin-cb0dd293 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-cb0dd293 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.animate-fade-in[data-v-cb0dd293] { animation: fadeIn-cb0dd293 0.3s ease-out;
}
.animate-scale-in[data-v-cb0dd293] { animation: scaleIn-cb0dd293 0.3s ease-out;
}
@keyframes fadeIn-cb0dd293 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-cb0dd293 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.btn-neon.neon-pink[data-v-cb0dd293] {
background: linear-gradient(135deg, #ff0080, #ff00ff);
color: #fff;
border: none;
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
font-weight: 600;
cursor: pointer;
display: flex;
align-items: center;
gap: 0.5rem;
transition: all 0.3s ease;
margin-top: 1rem;
}
.btn-neon.neon-pink[data-v-cb0dd293]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(255, 0, 128, 0.4);
}
.btn-neon.neon-pink[data-v-cb0dd293]:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.btn-small[data-v-cb0dd293] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-cb0dd293]:hover {
background: rgba(255, 255, 255, 0.1);
}
.status-preview[data-v-cb0dd293] {
color: inherit;
font-family: monospace;
font-size: 0.85em;
opacity: 0.9;
}
.sms-config-card .admin-actions[data-v-cb0dd293] {
margin-top: 1rem;
}
.neon-mint[data-v-038110fa] {
color: #00ffaa;
text-shadow: 0 0 12px rgba(0, 255, 170, 0.45);
}
.app-manager-card .admin-status-pill[data-v-038110fa] {
margin: 1rem 0;
min-height: 36px;
background: rgba(0, 255, 170, 0.1);
border-color: rgba(0, 255, 170, 0.3);
}
.settings-section[data-v-038110fa] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-038110fa] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.muted[data-v-038110fa] { color: var(--text-secondary);
}
.form-group[data-v-038110fa] {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.form-group label[data-v-038110fa] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.9rem;
}
.form-group.inline[data-v-038110fa] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.form-group.inline label[data-v-038110fa] { margin: 0; white-space: nowrap;
}
.form-row[data-v-038110fa] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
}
.form-row .form-group[data-v-038110fa] { flex: 1;
}
@media (max-width: 600px) {
.form-row[data-v-038110fa] { flex-direction: column;
}
}
.search-input-wrapper[data-v-038110fa] {
display: flex;
gap: 0.5rem;
}
.search-input-wrapper .input-glass[data-v-038110fa] { flex: 1;
}
.btn-search[data-v-038110fa] {
min-width: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.search-results-list[data-v-038110fa] {
max-height: 200px;
overflow-y: auto;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.5rem;
margin: 1rem 0;
}
.search-result-item[data-v-038110fa] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem 1rem;
cursor: pointer;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: all 0.2s ease;
}
.search-result-item[data-v-038110fa]:last-child { border-bottom: none;
}
.search-result-item[data-v-038110fa]:hover { background: rgba(0, 255, 170, 0.1);
}
.search-result-item.selected[data-v-038110fa] { background: rgba(0, 255, 170, 0.2); border-left: 3px solid #00ffaa;
}
.player-result-info[data-v-038110fa] { display: flex; flex-direction: column; gap: 0.25rem;
}
.player-name[data-v-038110fa] { font-weight: 600; color: var(--text-primary);
}
.player-card[data-v-038110fa] { font-size: 0.85rem; color: var(--text-secondary);
}
.no-results[data-v-038110fa] { text-align: center; padding: 1rem; color: var(--text-secondary); font-style: italic;
}
.selected-player-section[data-v-038110fa] { margin-top: 1.5rem;
}
.selected-player-card[data-v-038110fa] {
padding: 1.5rem;
border: 1px solid rgba(0, 255, 170, 0.3);
border-radius: 0.75rem;
background: rgba(0, 255, 170, 0.05);
}
.selected-player-header[data-v-038110fa] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.selected-player-header h4[data-v-038110fa] { margin: 0; color: #00ffaa;
}
.selected-player-details[data-v-038110fa] { display: flex; gap: 1.5rem; align-items: flex-start;
}
.player-avatar[data-v-038110fa] {
font-size: 3rem;
background: rgba(255, 255, 255, 0.1);
padding: 1rem;
border-radius: 50%;
}
.player-info-grid[data-v-038110fa] { flex: 1; display: flex; flex-direction: column; gap: 0.5rem;
}
.info-row[data-v-038110fa] { display: flex; gap: 0.75rem;
}
.info-label[data-v-038110fa] { color: var(--text-secondary); min-width: 60px;
}
.info-value[data-v-038110fa] { color: var(--text-primary); font-weight: 500;
}
.qr-settings[data-v-038110fa] {
display: flex;
gap: 1rem;
align-items: center;
margin-top: 1.5rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
flex-wrap: wrap;
}
.input-glass.small[data-v-038110fa] { padding: 0.5rem 0.75rem; min-width: 120px;
}
.qr-code-display[data-v-038110fa] {
margin-top: 1.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 0.75rem;
text-align: center;
}
.qr-code-wrapper[data-v-038110fa] {
display: inline-block;
padding: 1rem;
background: white;
border-radius: 0.5rem;
margin-bottom: 1rem;
}
.qr-code-image[data-v-038110fa] { display: block; width: 250px; height: 250px;
}
.qr-code-info[data-v-038110fa] { text-align: center;
}
.qr-instruction[data-v-038110fa] { color: var(--text-primary); margin-bottom: 0.5rem;
}
.qr-expiry[data-v-038110fa] { color: var(--neon-orange); font-size: 0.9rem; margin-bottom: 1rem;
}
.qr-actions[data-v-038110fa] { display: flex; gap: 0.75rem; justify-content: center;
}
.qr-error[data-v-038110fa] {
margin-top: 1rem;
padding: 1rem;
background: rgba(255, 100, 100, 0.1);
border: 1px solid rgba(255, 100, 100, 0.3);
border-radius: 0.5rem;
color: #ff6464;
}
.download-qr-display[data-v-038110fa] {
margin-top: 2rem;
padding-top: 1.5rem;
border-top: 1px dashed rgba(255, 255, 255, 0.2);
text-align: center;
}
.download-instruction[data-v-038110fa] { color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 0.75rem;
}
.download-qr-small[data-v-038110fa] {
width: 120px;
height: 120px;
border: 2px solid #00ffaa;
border-radius: 0.5rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
}
.checkin-qr-display[data-v-038110fa] { margin-top: 1.5rem;
}
.qr-info-grid[data-v-038110fa] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
flex-wrap: wrap;
}
.info-card[data-v-038110fa] {
display: flex;
gap: 0.5rem;
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.usage-instructions[data-v-038110fa] { margin-top: 1rem;
}
.usage-instructions h4[data-v-038110fa] { color: var(--text-primary); margin-bottom: 0.5rem;
}
.usage-instructions ol[data-v-038110fa] { color: var(--text-secondary); line-height: 1.8;
}
.push-stats-grid[data-v-038110fa] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1rem;
margin: 1.5rem 0;
}
@media (max-width: 600px) {
.push-stats-grid[data-v-038110fa] { grid-template-columns: repeat(2, 1fr);
}
}
.push-stats-grid .stat-box[data-v-038110fa] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
padding: 1rem;
text-align: center;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.push-stats-grid .stat-value[data-v-038110fa] { font-size: 1.5rem; font-weight: 700; color: var(--neon-blue);
}
.push-stats-grid .stat-label[data-v-038110fa] { font-size: 0.75rem; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.5px;
}
.test-notification-section[data-v-038110fa] {
margin-top: 1.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
}
.test-notification-section h4[data-v-038110fa] { margin: 0 0 1rem 0; color: var(--text-primary);
}
.push-result[data-v-038110fa] {
margin-top: 1rem;
padding: 0.75rem 1rem;
border-radius: 0.5rem;
font-size: 0.9rem;
}
.push-result.success[data-v-038110fa] { background: rgba(0, 255, 170, 0.1); border: 1px solid rgba(0, 255, 170, 0.3); color: #00ffaa;
}
.push-result.error[data-v-038110fa] { background: rgba(255, 100, 100, 0.1); border: 1px solid rgba(255, 100, 100, 0.3); color: #ff6464;
}
.config-status-section[data-v-038110fa] { margin-top: 1.5rem;
}
.config-status-section h4[data-v-038110fa] { margin: 0 0 0.75rem 0; color: var(--text-primary); font-size: 0.95rem;
}
.config-status[data-v-038110fa] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
border-radius: 0.5rem;
font-size: 0.9rem;
}
.config-status.configured[data-v-038110fa] { background: rgba(0, 255, 170, 0.1); border: 1px solid rgba(0, 255, 170, 0.2); color: var(--text-primary);
}
.config-status.not-configured[data-v-038110fa] { background: rgba(255, 200, 100, 0.1); border: 1px solid rgba(255, 200, 100, 0.2); color: #ffc864;
}
.btn-small[data-v-038110fa] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-038110fa]:hover { background: rgba(255, 255, 255, 0.1);
}
.btn-neon.neon-mint[data-v-038110fa] {
background: linear-gradient(135deg, #00ffaa, #00cc88);
color: #000;
border: none;
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
font-weight: 600;
cursor: pointer;
display: flex;
align-items: center;
gap: 0.5rem;
transition: all 0.3s ease;
}
.btn-neon.neon-mint[data-v-038110fa]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(0, 255, 170, 0.4);
}
.btn-neon.neon-mint[data-v-038110fa]:disabled { opacity: 0.6; cursor: not-allowed;
}
.btn-neon.neon-pink[data-v-038110fa] {
background: linear-gradient(135deg, #ff0080, #ff00ff);
color: #fff;
border: none;
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
font-weight: 600;
cursor: pointer;
display: flex;
align-items: center;
gap: 0.5rem;
transition: all 0.3s ease;
margin-top: 1rem;
}
.btn-neon.neon-pink[data-v-038110fa]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(255, 0, 128, 0.4);
}
.btn-neon.neon-pink[data-v-038110fa]:disabled { opacity: 0.6; cursor: not-allowed;
}
.tier-badge[data-v-038110fa] {
display: inline-flex;
align-items: center;
padding: 0.35rem 0.75rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
white-space: nowrap;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.12);
}
.network-badge[data-v-038110fa] {
display: inline-flex;
align-items: center;
padding: 0.2rem 0.5rem;
font-size: 0.65rem;
font-weight: 600;
color: #22d3ee;
background: rgba(34, 211, 238, 0.12);
border: 1px solid rgba(34, 211, 238, 0.4);
border-radius: 4px;
margin-left: 0.35rem;
text-transform: uppercase;
}
.network-verified[data-v-038110fa] {
color: #34d399;
font-weight: 600;
}
.network-missing-id[data-v-038110fa] {
color: #fbbf24;
font-weight: 600;
}
.animate-fade-in[data-v-038110fa] { animation: fadeIn-038110fa 0.3s ease-out;
}
.animate-scale-in[data-v-038110fa] { animation: scaleIn-038110fa 0.3s ease-out;
}
@keyframes fadeIn-038110fa {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-038110fa {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.neon-gold[data-v-c1b19947] {
color: #ffd700;
}
.house-points-card .admin-status-pill[data-v-c1b19947] {
margin-bottom: 1.5rem;
}
.house-points-card .admin-status-error[data-v-c1b19947] {
margin: 0.5rem 0 1rem 0;
}
.modal-tabs[data-v-c1b19947] {
display: flex;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-button[data-v-c1b19947] {
flex: 1;
padding: 0.875rem 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.tab-button[data-v-c1b19947]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
}
.tab-button.active[data-v-c1b19947] {
background: rgba(255, 215, 0, 0.15);
border-color: rgba(255, 215, 0, 0.5);
color: #ffd700;
box-shadow: 0 4px 15px rgba(255, 215, 0, 0.2);
}
.settings-section[data-v-c1b19947] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-c1b19947] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.muted[data-v-c1b19947] { color: var(--text-secondary);
}
.required[data-v-c1b19947] { color: var(--neon-red);
}
.text-right[data-v-c1b19947] { text-align: right;
}
.text-muted[data-v-c1b19947] { color: var(--text-secondary); font-size: 0.85rem;
}
.text-warning[data-v-c1b19947] { color: var(--neon-orange);
}
.form-group[data-v-c1b19947] {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.form-group label[data-v-c1b19947] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.9rem;
}
.input-hint[data-v-c1b19947] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
line-height: 1.4;
}
/* Supervisor search */
.supervisor-search-group[data-v-c1b19947] { position: relative;
}
.supervisor-search-wrapper[data-v-c1b19947] { position: relative;
}
.supervisor-clear-btn[data-v-c1b19947] {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
background: none;
border: none;
color: var(--text-secondary);
cursor: pointer;
font-size: 0.9rem;
padding: 4px 6px;
border-radius: 4px;
transition: all 0.2s ease;
}
.supervisor-clear-btn[data-v-c1b19947]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.supervisor-dropdown[data-v-c1b19947] {
position: absolute;
top: 100%;
left: 0;
right: 0;
z-index: 1100;
background: rgba(20, 25, 35, 0.98);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
margin-top: 4px;
max-height: 200px;
overflow-y: auto;
backdrop-filter: blur(20px);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}
.supervisor-option[data-v-c1b19947] {
display: flex;
flex-direction: column;
padding: 10px 16px;
cursor: pointer;
transition: background 0.15s ease;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.supervisor-option[data-v-c1b19947]:last-child { border-bottom: none;
}
.supervisor-option[data-v-c1b19947]:hover { background: rgba(255, 255, 255, 0.08);
}
.supervisor-option.disabled[data-v-c1b19947] { cursor: default; color: var(--text-secondary); font-style: italic;
}
.sup-name[data-v-c1b19947] { color: var(--text-primary); font-weight: 500; font-size: 0.9rem;
}
.sup-meta[data-v-c1b19947] { color: var(--text-secondary); font-size: 0.8rem;
}
.form-actions[data-v-c1b19947] {
display: flex;
gap: 1rem;
margin-top: 1.5rem;
flex-wrap: wrap;
}
.alert[data-v-c1b19947] {
padding: 0.75rem 1rem;
border-radius: 10px;
font-size: 0.9rem;
margin-bottom: 1rem;
}
.alert-error[data-v-c1b19947] {
background: rgba(255, 100, 100, 0.1);
border: 1px solid rgba(255, 100, 100, 0.3);
color: #ff6464;
}
.alert-success[data-v-c1b19947] {
background: rgba(0, 255, 150, 0.1);
border: 1px solid rgba(0, 255, 150, 0.3);
color: var(--neon-green);
}
.report-date-range[data-v-c1b19947] {
display: flex;
gap: 1rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.report-date-range .form-group[data-v-c1b19947] {
flex: 1;
min-width: 140px;
margin-bottom: 0;
}
.history-filters[data-v-c1b19947] {
display: flex;
gap: 1rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.loading-state[data-v-c1b19947] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-state p[data-v-c1b19947] { color: var(--text-secondary); margin: 0;
}
.empty-state[data-v-c1b19947] {
text-align: center;
padding: 3rem 2rem;
color: var(--text-secondary);
}
.table-responsive[data-v-c1b19947] { overflow-x: auto;
}
.data-table[data-v-c1b19947] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.data-table th[data-v-c1b19947] {
padding: 0.75rem 1rem;
text-align: left;
color: var(--text-secondary);
font-weight: 600;
font-size: 0.8rem;
text-transform: uppercase;
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.03);
}
.data-table td[data-v-c1b19947] {
padding: 0.75rem 1rem;
color: var(--text-primary);
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.data-table tbody tr[data-v-c1b19947]:hover { background: rgba(255, 255, 255, 0.02);
}
.status-badge[data-v-c1b19947] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
}
.status-badge.status-active[data-v-c1b19947] { background: rgba(0, 255, 150, 0.15); color: var(--neon-green);
}
.status-badge.status-exhausted[data-v-c1b19947] { background: rgba(255, 150, 0, 0.15); color: var(--neon-orange);
}
.status-badge.status-revoked[data-v-c1b19947] { background: rgba(255, 100, 100, 0.15); color: #ff6464;
}
.status-badge.status-expired[data-v-c1b19947] { background: rgba(150, 150, 150, 0.15); color: var(--text-secondary);
}
.btn-sm[data-v-c1b19947] {
padding: 0.3rem 0.6rem;
font-size: 0.8rem;
border-radius: 6px;
}
.btn-error[data-v-c1b19947] { border-color: var(--neon-red); color: var(--neon-red);
}
.btn-error[data-v-c1b19947]:hover:not(:disabled) { background: rgba(255, 7, 58, 0.1);
}
.btn-error[data-v-c1b19947]:disabled { opacity: 0.4; cursor: not-allowed;
}
/* Usage Report */
.summary-cards[data-v-c1b19947] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}
.card-glass.stat[data-v-c1b19947] {
display: flex;
gap: 1rem;
align-items: center;
padding: 1.25rem;
}
.stat-icon[data-v-c1b19947] { font-size: 2rem;
}
.stat-content[data-v-c1b19947] { flex: 1;
}
.stat-label[data-v-c1b19947] { font-size: 0.8rem; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.05em;
}
.stat-value[data-v-c1b19947] { font-size: 1.25rem; font-weight: 700; color: var(--text-primary);
}
.stat-sublabel[data-v-c1b19947] { font-size: 0.8rem; color: var(--neon-gold, #ffd700);
}
.animate-fade-in[data-v-c1b19947] { animation: fadeIn-c1b19947 0.3s ease-out;
}
.animate-scale-in[data-v-c1b19947] { animation: scaleIn-c1b19947 0.3s ease-out;
}
@keyframes fadeIn-c1b19947 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-c1b19947 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.add-employee-modal[data-v-a00d11cd] {
width: 95%;
max-width: 900px;
max-height: 95vh;
overflow-y: auto;
}
.modal-container {
&[data-v-a00d11cd] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6);
max-width: 900px;
max-height: 90vh;
overflow-y: auto;
align-items: center;
justify-content: space-between;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header[data-v-a00d11cd] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
flex-shrink: 0;
}
}
.icon-container[data-v-a00d11cd] {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
flex-shrink: 0;
}
.icon-info[data-v-a00d11cd] {
background: rgba(59, 130, 246, 0.2);
border: 2px solid rgba(59, 130, 246, 0.5);
}
.modal-header h3[data-v-a00d11cd] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
font-weight: 600;
flex: 1;
text-align: center;
}
.close-btn[data-v-a00d11cd] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.25rem;
border-radius: 4px;
transition: all 0.2s ease;
}
.close-btn[data-v-a00d11cd]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-a00d11cd] {
padding: 1.5rem;
flex: 1;
overflow-y: auto;
}
.form-grid[data-v-a00d11cd] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.form-group[data-v-a00d11cd] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group.full-width[data-v-a00d11cd] {
grid-column: 1 / -1;
}
.form-label[data-v-a00d11cd] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.form-hint[data-v-a00d11cd] {
color: var(--text-muted);
font-size: 0.8rem;
font-style: italic;
}
.input-glass[data-v-a00d11cd] {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
transition: all 0.3s ease;
font-size: 0.9rem;
}
.input-glass[data-v-a00d11cd]:focus {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
outline: none;
}
.input-glass[data-v-a00d11cd]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.checkbox-label[data-v-a00d11cd] {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
user-select: none;
}
.checkbox-text[data-v-a00d11cd] {
color: var(--text-primary);
font-weight: 500;
}
.host-toggle .checkbox-text[data-v-a00d11cd] {
color: #ffd700;
}
.host-toggle[data-v-a00d11cd] {
padding: 0.75rem;
background: linear-gradient(135deg, rgba(255, 215, 0, 0.05), rgba(255, 165, 0, 0.05));
border: 1px solid rgba(255, 215, 0, 0.2);
border-radius: 8px;
}
.permissions-grid[data-v-a00d11cd] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.permission-item[data-v-a00d11cd] {
display: flex;
flex-direction: column;
gap: 0.25rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
cursor: pointer;
transition: all 0.2s ease;
}
.permission-item[data-v-a00d11cd]:hover {
background: rgba(255, 255, 255, 0.05);
}
.permission-item input[type="checkbox"][data-v-a00d11cd] {
margin-right: 0.5rem;
}
.permission-label[data-v-a00d11cd] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.permission-desc[data-v-a00d11cd] {
color: var(--text-muted);
font-size: 0.8rem;
}
.error-message[data-v-a00d11cd] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: var(--neon-red);
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
font-size: 0.9rem;
}
.modal-footer[data-v-a00d11cd] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
flex-shrink: 0;
}
.btn-glass[data-v-a00d11cd] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
}
.btn-glass[data-v-a00d11cd]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.btn-neon[data-v-a00d11cd] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 2px solid currentColor;
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
position: relative;
overflow: hidden;
}
.btn-primary[data-v-a00d11cd] {
color: var(--neon-blue);
}
.btn-neon[data-v-a00d11cd]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
}
.btn-neon[data-v-a00d11cd]:disabled,
.btn-glass[data-v-a00d11cd]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.loading-spinner-small[data-v-a00d11cd] {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top: 2px solid currentColor;
border-radius: 50%;
animation: spin-a00d11cd 1s linear infinite;
margin-right: 0.5rem;
}
.modal-overlay[data-v-a00d11cd] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(8px);
}
.animate-fade-in[data-v-a00d11cd] {
animation: fadeIn-a00d11cd 0.2s ease-out;
}
.animate-scale-in[data-v-a00d11cd] {
animation: scaleIn-a00d11cd 0.2s ease-out;
}
@keyframes fadeIn-a00d11cd {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-a00d11cd {
from {
opacity: 0;
transform: scale(0.9) translateY(20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
@keyframes spin-a00d11cd {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* Responsive */
@media (max-width: 768px) {
.add-employee-modal[data-v-a00d11cd] {
width: 98%;
max-height: 98vh;
}
.form-grid[data-v-a00d11cd] {
grid-template-columns: 1fr;
}
.permissions-grid[data-v-a00d11cd] {
grid-template-columns: 1fr;
}
.modal-footer[data-v-a00d11cd] {
flex-direction: column;
}
}
.edit-employee-modal[data-v-bfe67cf5] {
width: 95%;
max-width: 900px;
max-height: 95vh;
overflow-y: auto;
}
.modal-container[data-v-bfe67cf5] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6);
max-width: 900px;
max-height: 90vh;
overflow-y: auto;
display: flex;
flex-direction: column;
}
.modal-header[data-v-bfe67cf5] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
flex-shrink: 0;
}
.icon-container[data-v-bfe67cf5] {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
flex-shrink: 0;
}
.icon-warning[data-v-bfe67cf5] {
background: rgba(245, 158, 11, 0.2);
border: 2px solid rgba(245, 158, 11, 0.5);
}
.modal-header h3[data-v-bfe67cf5] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
font-weight: 600;
flex: 1;
text-align: center;
}
.close-btn[data-v-bfe67cf5] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.25rem;
border-radius: 4px;
transition: all 0.2s ease;
}
.close-btn[data-v-bfe67cf5]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-bfe67cf5] {
padding: 1.5rem;
flex: 1;
overflow-y: auto;
}
.employee-info[data-v-bfe67cf5] {
margin-bottom: 1.5rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.employee-badge[data-v-bfe67cf5] {
display: flex;
align-items: center;
gap: 1rem;
}
.employee-id[data-v-bfe67cf5] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
padding: 0.5rem 1rem;
border-radius: 8px;
font-family: 'JetBrains Mono', monospace;
font-weight: 600;
}
.employee-name[data-v-bfe67cf5] {
color: var(--text-primary);
font-size: 1.1rem;
font-weight: 600;
}
.form-grid[data-v-bfe67cf5] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.form-group[data-v-bfe67cf5] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group.full-width[data-v-bfe67cf5] {
grid-column: 1 / -1;
}
.form-label[data-v-bfe67cf5] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.form-hint[data-v-bfe67cf5] {
color: var(--text-muted);
font-size: 0.8rem;
font-style: italic;
}
.input-glass[data-v-bfe67cf5] {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
transition: all 0.3s ease;
font-size: 0.9rem;
}
.input-glass[data-v-bfe67cf5]:focus {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
outline: none;
}
.input-glass[data-v-bfe67cf5]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.checkbox-label[data-v-bfe67cf5] {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
user-select: none;
}
.checkbox-text[data-v-bfe67cf5] {
color: var(--text-primary);
font-weight: 500;
}
.host-toggle .checkbox-text[data-v-bfe67cf5] {
color: #ffd700;
}
.host-toggle[data-v-bfe67cf5] {
padding: 0.75rem;
background: linear-gradient(135deg, rgba(255, 215, 0, 0.05), rgba(255, 165, 0, 0.05));
border: 1px solid rgba(255, 215, 0, 0.2);
border-radius: 8px;
}
.permissions-grid[data-v-bfe67cf5] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.permission-item[data-v-bfe67cf5] {
display: flex;
flex-direction: column;
gap: 0.25rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
cursor: pointer;
transition: all 0.2s ease;
}
.permission-item[data-v-bfe67cf5]:hover {
background: rgba(255, 255, 255, 0.05);
}
.permission-item input[type="checkbox"][data-v-bfe67cf5] {
margin-right: 0.5rem;
}
.permission-label[data-v-bfe67cf5] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.permission-desc[data-v-bfe67cf5] {
color: var(--text-muted);
font-size: 0.8rem;
}
.error-message[data-v-bfe67cf5] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: var(--neon-red);
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
font-size: 0.9rem;
}
.modal-footer[data-v-bfe67cf5] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
flex-shrink: 0;
}
.btn-glass[data-v-bfe67cf5] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
}
.btn-glass[data-v-bfe67cf5]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.btn-neon[data-v-bfe67cf5] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 2px solid currentColor;
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
position: relative;
overflow: hidden;
}
.btn-warning[data-v-bfe67cf5] {
color: var(--neon-orange);
}
.btn-neon[data-v-bfe67cf5]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
}
.btn-neon[data-v-bfe67cf5]:disabled,
.btn-glass[data-v-bfe67cf5]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.loading-spinner-small[data-v-bfe67cf5] {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top: 2px solid currentColor;
border-radius: 50%;
animation: spin-bfe67cf5 1s linear infinite;
margin-right: 0.5rem;
}
.modal-overlay[data-v-bfe67cf5] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(8px);
}
.animate-fade-in[data-v-bfe67cf5] {
animation: fadeIn-bfe67cf5 0.2s ease-out;
}
.animate-scale-in[data-v-bfe67cf5] {
animation: scaleIn-bfe67cf5 0.2s ease-out;
}
@keyframes fadeIn-bfe67cf5 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-bfe67cf5 {
from {
opacity: 0;
transform: scale(0.9) translateY(20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
@keyframes spin-bfe67cf5 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* Responsive */
@media (max-width: 768px) {
.edit-employee-modal[data-v-bfe67cf5] {
width: 98%;
max-height: 98vh;
}
.form-grid[data-v-bfe67cf5] {
grid-template-columns: 1fr;
}
.permissions-grid[data-v-bfe67cf5] {
grid-template-columns: 1fr;
}
.modal-footer[data-v-bfe67cf5] {
flex-direction: column;
}
}
.pin-change-modal[data-v-2073b347] {
width: 90%;
max-width: 500px;
max-height: 90vh;
display: flex;
flex-direction: column;
}
.modal-container[data-v-2073b347] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6);
display: flex;
flex-direction: column;
max-height: 90vh;
overflow: hidden;
}
.modal-header[data-v-2073b347] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.icon-container[data-v-2073b347] {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
flex-shrink: 0;
}
.icon-warning[data-v-2073b347] {
background: rgba(245, 158, 11, 0.2);
border: 2px solid rgba(245, 158, 11, 0.5);
}
.modal-header h3[data-v-2073b347] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
font-weight: 600;
flex: 1;
text-align: center;
}
.close-btn[data-v-2073b347] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.25rem;
border-radius: 4px;
transition: all 0.2s ease;
}
.close-btn[data-v-2073b347]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-form[data-v-2073b347] {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
overflow: hidden;
}
.modal-body[data-v-2073b347] {
padding: 1.5rem;
overflow-y: auto;
flex: 1;
min-height: 0;
}
.employee-info[data-v-2073b347] {
margin-bottom: 1.5rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.employee-badge[data-v-2073b347] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}
.employee-id[data-v-2073b347] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
padding: 0.5rem 1rem;
border-radius: 8px;
font-family: 'JetBrains Mono', monospace;
font-weight: 600;
}
.employee-name[data-v-2073b347] {
color: var(--text-primary);
font-size: 1.1rem;
font-weight: 600;
}
.security-notice[data-v-2073b347] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem;
background: rgba(245, 158, 11, 0.1);
border: 1px solid rgba(245, 158, 11, 0.3);
border-radius: 6px;
color: var(--neon-orange);
font-size: 0.9rem;
}
.security-icon[data-v-2073b347] {
flex-shrink: 0;
}
.form-section[data-v-2073b347] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.form-group[data-v-2073b347] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-label[data-v-2073b347] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.form-hint[data-v-2073b347] {
color: var(--text-muted);
font-size: 0.8rem;
font-style: italic;
}
.pin-input[data-v-2073b347] {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
transition: all 0.3s ease;
font-size: 1.1rem;
font-family: 'JetBrains Mono', monospace;
letter-spacing: 2px;
text-align: center;
}
.pin-input[data-v-2073b347]:focus {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
outline: none;
}
.pin-input[data-v-2073b347]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.validation-error[data-v-2073b347] {
color: var(--neon-red);
font-size: 0.8rem;
font-weight: 500;
}
.validation-success[data-v-2073b347] {
color: var(--neon-green);
font-size: 0.8rem;
font-weight: 500;
}
.pin-strength[data-v-2073b347] {
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.strength-label[data-v-2073b347] {
color: var(--text-primary);
font-weight: 500;
margin-bottom: 0.5rem;
font-size: 0.9rem;
}
.strength-bar[data-v-2073b347] {
width: 100%;
height: 8px;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
overflow: hidden;
margin-bottom: 0.5rem;
}
.strength-fill[data-v-2073b347] {
height: 100%;
transition: all 0.3s ease;
border-radius: 4px;
}
.strength-weak[data-v-2073b347] {
background: var(--neon-red);
}
.strength-medium[data-v-2073b347] {
background: var(--neon-orange);
}
.strength-strong[data-v-2073b347] {
background: var(--neon-blue);
}
.strength-very-strong[data-v-2073b347] {
background: var(--neon-green);
}
.strength-text[data-v-2073b347] {
font-size: 0.8rem;
font-weight: 500;
text-align: right;
}
.pin-guidelines[data-v-2073b347] {
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.guidelines-title[data-v-2073b347] {
color: var(--text-primary);
font-weight: 500;
margin-bottom: 0.5rem;
font-size: 0.9rem;
}
.guidelines-list[data-v-2073b347] {
list-style: none;
padding: 0;
margin: 0;
}
.guidelines-list li[data-v-2073b347] {
padding: 0.25rem 0;
color: var(--text-muted);
font-size: 0.8rem;
position: relative;
padding-left: 1.5rem;
}
.guidelines-list li[data-v-2073b347]:before {
content: '○';
position: absolute;
left: 0;
color: var(--text-muted);
}
.guidelines-list li.valid[data-v-2073b347] {
color: var(--neon-green);
}
.guidelines-list li.valid[data-v-2073b347]:before {
content: '✓';
color: var(--neon-green);
}
.error-message[data-v-2073b347] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: var(--neon-red);
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
font-size: 0.9rem;
}
.modal-footer[data-v-2073b347] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
flex-shrink: 0;
}
.btn-glass[data-v-2073b347] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
}
.btn-glass[data-v-2073b347]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.btn-neon[data-v-2073b347] {
background: var(--glass-bg);
backdrop-filter: blur(20px);
border: 2px solid currentColor;
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
position: relative;
overflow: hidden;
}
.btn-warning[data-v-2073b347] {
color: var(--neon-orange);
}
.btn-neon[data-v-2073b347]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
}
.btn-neon[data-v-2073b347]:disabled,
.btn-glass[data-v-2073b347]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.loading-spinner-small[data-v-2073b347] {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top: 2px solid currentColor;
border-radius: 50%;
animation: spin-2073b347 1s linear infinite;
margin-right: 0.5rem;
}
.modal-overlay[data-v-2073b347] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(8px);
}
.animate-fade-in[data-v-2073b347] {
animation: fadeIn-2073b347 0.2s ease-out;
}
.animate-scale-in[data-v-2073b347] {
animation: scaleIn-2073b347 0.2s ease-out;
}
@keyframes fadeIn-2073b347 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-2073b347 {
from {
opacity: 0;
transform: scale(0.9) translateY(20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
@keyframes spin-2073b347 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* Card Code Section */
.card-code-section[data-v-2073b347] {
margin-top: 1rem;
}
.section-divider[data-v-2073b347] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}
.section-divider[data-v-2073b347]::before,
.section-divider[data-v-2073b347]::after {
content: '';
flex: 1;
height: 1px;
background: rgba(255, 255, 255, 0.1);
}
.divider-text[data-v-2073b347] {
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
white-space: nowrap;
}
.current-card-status[data-v-2073b347] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.06);
}
.card-assigned[data-v-2073b347] {
color: var(--neon-green);
font-family: 'JetBrains Mono', monospace;
font-size: 0.9rem;
}
.btn-clear-card[data-v-2073b347] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: var(--neon-red);
padding: 0.4rem 0.8rem;
border-radius: 6px;
cursor: pointer;
font-size: 0.8rem;
transition: all 0.2s ease;
}
.btn-clear-card[data-v-2073b347]:hover:not(:disabled) {
background: rgba(239, 68, 68, 0.2);
}
.btn-clear-card[data-v-2073b347]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* Responsive */
@media (max-width: 768px) {
.pin-change-modal[data-v-2073b347] {
width: 95%;
max-height: 95vh;
}
.modal-footer[data-v-2073b347] {
flex-direction: column;
}
}
/* Employee Management */
.no-access-message[data-v-0582ec14] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 2rem;
text-align: center;
color: var(--text-secondary);
}
.no-access-icon[data-v-0582ec14] {
font-size: 4rem;
margin-bottom: 1rem;
opacity: 0.6;
}
.no-access-message h3[data-v-0582ec14] {
color: var(--text-primary);
margin-bottom: 0.5rem;
font-size: 1.5rem;
}
.no-access-message p[data-v-0582ec14] { margin-bottom: 0.5rem;
}
.no-access-message .text-muted[data-v-0582ec14] { font-size: 0.85rem; opacity: 0.7;
}
.text-muted[data-v-0582ec14] { color: var(--text-secondary);
}
/* Employee Tabs */
.employee-tabs[data-v-0582ec14] {
display: flex;
gap: 0.5rem;
margin-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
}
.employee-tab[data-v-0582ec14] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px 8px 0 0;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.9rem;
}
.employee-tab[data-v-0582ec14]:hover {
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.employee-tab.active[data-v-0582ec14] {
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.employee-tab .tab-icon[data-v-0582ec14] { font-size: 1rem;
}
.employee-tab .tab-count[data-v-0582ec14] {
background: rgba(255, 255, 255, 0.1);
padding: 0.15rem 0.5rem;
border-radius: 10px;
font-size: 0.75rem;
font-weight: 600;
}
.employee-tab.active .tab-count[data-v-0582ec14] {
background: rgba(0, 245, 255, 0.2);
}
/* Empty employee state */
.empty-employee-state[data-v-0582ec14] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 2rem;
text-align: center;
color: var(--text-secondary);
}
.empty-employee-state .empty-icon[data-v-0582ec14] {
font-size: 3rem;
margin-bottom: 1rem;
opacity: 0.5;
}
.empty-employee-state p[data-v-0582ec14] { margin: 0;
}
.empty-employee-state .text-muted[data-v-0582ec14] { font-size: 0.85rem; opacity: 0.6; margin-top: 0.5rem;
}
.employee-actions[data-v-0582ec14] {
display: flex;
gap: 1rem;
margin-bottom: 2rem;
}
.employee-list[data-v-0582ec14] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
overflow: hidden;
}
.table-glass[data-v-0582ec14] { width: 100%;
}
.table-header[data-v-0582ec14],
.table-row[data-v-0582ec14] {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr;
gap: 1rem;
align-items: center;
}
.table-header[data-v-0582ec14] {
background: rgba(255, 255, 255, 0.05);
padding: 1rem;
font-weight: 600;
color: var(--text-primary);
}
.table-row[data-v-0582ec14] {
padding: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: all 0.3s ease;
}
.table-row[data-v-0582ec14]:hover { background: rgba(255, 255, 255, 0.02);
}
.table-cell[data-v-0582ec14] { color: var(--text-primary);
}
.employee-info[data-v-0582ec14] { display: flex; flex-direction: column; gap: 0.25rem;
}
.employee-name[data-v-0582ec14] { font-weight: 500; color: var(--text-primary);
}
.employee-id[data-v-0582ec14] { font-size: 0.9rem; color: var(--text-secondary); opacity: 0.7;
}
.role-badge[data-v-0582ec14] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
text-transform: uppercase;
}
.role-badge.admin[data-v-0582ec14] { background: var(--neon-red); color: white;
}
.role-badge.pit[data-v-0582ec14] { background: var(--neon-blue); color: white;
}
.role-badge.dealer[data-v-0582ec14] { background: var(--neon-green); color: white;
}
.role-badge.floor[data-v-0582ec14] { background: var(--neon-orange); color: white;
}
.role-badge.general[data-v-0582ec14],
.role-badge.casino[data-v-0582ec14] { background: var(--neon-purple); color: white;
}
.role-badge.shift[data-v-0582ec14] { background: var(--neon-orange); color: white;
}
.role-badge.supervisor[data-v-0582ec14] { background: var(--neon-green); color: white;
}
.host-badge[data-v-0582ec14] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.2rem 0.5rem;
margin-left: 0.5rem;
background: linear-gradient(135deg, rgba(255, 215, 0, 0.2), rgba(255, 165, 0, 0.2));
border: 1px solid rgba(255, 215, 0, 0.4);
border-radius: 12px;
font-size: 0.7rem;
font-weight: 600;
color: #ffd700;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.pin-display[data-v-0582ec14] { display: flex; align-items: center; gap: 0.5rem;
}
.pin-dots[data-v-0582ec14] { color: var(--text-secondary); font-family: monospace;
}
.card-status[data-v-0582ec14] { font-family: monospace; font-size: 0.85rem;
}
.card-status.card-assigned[data-v-0582ec14] { color: var(--neon-green);
}
.permissions-preview[data-v-0582ec14] { display: flex; align-items: center; gap: 0.5rem;
}
.permission-count[data-v-0582ec14] {
padding: 0.25rem 0.5rem;
border-radius: 12px;
font-size: 0.75rem;
font-weight: 500;
background: rgba(0, 162, 255, 0.2);
color: var(--neon-blue);
}
.status-indicator[data-v-0582ec14] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
background: rgba(255, 100, 100, 0.2);
color: #ff6464;
}
.status-indicator.active[data-v-0582ec14] {
background: rgba(100, 255, 100, 0.2);
color: #64ff64;
}
.action-buttons[data-v-0582ec14] { display: flex; gap: 0.5rem;
}
.btn-small[data-v-0582ec14] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-0582ec14]:hover { background: rgba(255, 255, 255, 0.1);
}
.btn-edit[data-v-0582ec14] { border-color: var(--neon-blue); color: var(--neon-blue);
}
.btn-edit[data-v-0582ec14]:hover { background: rgba(0, 150, 255, 0.1);
}
.btn-toggle[data-v-0582ec14] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.deactivate[data-v-0582ec14] { border-color: var(--neon-red); color: var(--neon-red);
}
.btn-toggle.deactivate[data-v-0582ec14]:hover { background: rgba(255, 100, 100, 0.1);
}
.animate-fade-in[data-v-0582ec14] { animation: fadeIn-0582ec14 0.3s ease-out;
}
.animate-scale-in[data-v-0582ec14] { animation: scaleIn-0582ec14 0.3s ease-out;
}
@keyframes fadeIn-0582ec14 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-0582ec14 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-overlay[data-v-3f9fb6a6] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1100;
padding: 1rem;
}
.modal-content.large[data-v-3f9fb6a6] {
width: 100%;
max-width: 900px;
max-height: 90vh;
overflow-y: auto;
}
.modal-header[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem 2rem 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 1rem;
margin: 0;
font-size: 1.8rem;
}
.modal-icon[data-v-3f9fb6a6] {
font-size: 2rem;
}
.modal-body[data-v-3f9fb6a6] {
padding: 2rem;
}
.loading-state[data-v-3f9fb6a6] {
text-align: center;
padding: 3rem;
}
.loading-spinner[data-v-3f9fb6a6] {
width: 40px;
height: 40px;
border: 3px solid rgba(255, 255, 255, 0.1);
border-left: 3px solid var(--neon-blue);
border-radius: 50%;
animation: spin-3f9fb6a6 1s linear infinite;
margin: 0 auto 1rem;
}
.loading-spinner.small[data-v-3f9fb6a6] {
width: 16px;
height: 16px;
border-width: 2px;
margin: 0 0.5rem 0 0;
display: inline-block;
}
.gaming-day-info[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.info-card[data-v-3f9fb6a6] {
padding: 1.5rem;
border-radius: 12px;
}
.info-card h4[data-v-3f9fb6a6] {
margin: 0 0 1rem 0;
color: var(--neon-blue);
font-size: 1.1rem;
}
.info-grid[data-v-3f9fb6a6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.info-item[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.info-item label[data-v-3f9fb6a6] {
font-size: 0.9rem;
color: var(--text-secondary);
font-weight: 500;
}
.info-item span[data-v-3f9fb6a6] {
color: var(--text-primary);
font-weight: 600;
}
.table-name[data-v-3f9fb6a6] {
color: var(--neon-green) !important;
}
.chip-denominations[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.chip-denominations h4[data-v-3f9fb6a6] {
margin: 0 0 1.5rem 0;
color: var(--text-primary);
font-size: 1.2rem;
}
.chip-grid[data-v-3f9fb6a6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1.5rem;
}
.chip-input-group[data-v-3f9fb6a6] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.5rem;
transition: all 0.3s ease;
}
.chip-input-group.has-value[data-v-3f9fb6a6] {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.1);
}
.chip-header[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}
.chip-color[data-v-3f9fb6a6] {
width: 40px;
height: 40px;
border-radius: 50%;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
.chip-info[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
}
.chip-name[data-v-3f9fb6a6] {
font-weight: 600;
color: var(--text-primary);
font-size: 1.1rem;
}
.chip-value[data-v-3f9fb6a6] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.quantity-input[data-v-3f9fb6a6] {
margin-bottom: 1rem;
}
.quantity-input label[data-v-3f9fb6a6] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.input-controls[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.qty-btn[data-v-3f9fb6a6] {
width: 36px;
height: 36px;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.2s ease;
font-size: 1.2rem;
font-weight: bold;
}
.qty-btn[data-v-3f9fb6a6]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.2);
border-color: var(--neon-blue);
}
.qty-btn[data-v-3f9fb6a6]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.qty-input[data-v-3f9fb6a6] {
flex: 1;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
padding: 0.75rem;
color: var(--text-primary);
text-align: center;
font-size: 1rem;
font-weight: 600;
}
.qty-input[data-v-3f9fb6a6]:focus {
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
outline: none;
}
.chip-total[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
}
.total-label[data-v-3f9fb6a6] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.total-amount[data-v-3f9fb6a6] {
font-weight: 600;
color: var(--text-primary);
font-size: 1.1rem;
}
.total-amount.has-amount[data-v-3f9fb6a6] {
color: var(--neon-green);
}
.fill-summary[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.summary-card[data-v-3f9fb6a6] {
padding: 2rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.15);
}
.summary-card h4[data-v-3f9fb6a6] {
margin: 0 0 1.5rem 0;
color: var(--neon-orange);
font-size: 1.2rem;
}
.summary-grid[data-v-3f9fb6a6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.summary-item[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.summary-item.total-amount[data-v-3f9fb6a6] {
background: rgba(0, 245, 255, 0.1);
border: 1px solid var(--neon-blue);
}
.summary-item .label[data-v-3f9fb6a6] {
color: var(--text-secondary);
font-weight: 500;
}
.summary-item .value[data-v-3f9fb6a6] {
color: var(--text-primary);
font-weight: 600;
font-size: 1.1rem;
}
.denomination-breakdown h5[data-v-3f9fb6a6] {
margin: 0 0 1rem 0;
color: var(--text-secondary);
font-size: 1rem;
}
.breakdown-list[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.breakdown-item[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
}
.chip-color-mini[data-v-3f9fb6a6] {
width: 20px;
height: 20px;
border-radius: 50%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
.breakdown-text[data-v-3f9fb6a6] {
color: var(--text-primary);
font-size: 0.9rem;
}
.notes-section[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.notes-section label[data-v-3f9fb6a6] {
display: block;
margin-bottom: 0.75rem;
color: var(--text-primary);
font-weight: 500;
}
.notes-input[data-v-3f9fb6a6] {
width: 100%;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 1rem;
color: var(--text-primary);
font-size: 0.95rem;
line-height: 1.5;
resize: vertical;
min-height: 80px;
}
.notes-input[data-v-3f9fb6a6]:focus {
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
outline: none;
}
.char-count[data-v-3f9fb6a6] {
text-align: right;
margin-top: 0.5rem;
color: var(--text-muted);
font-size: 0.8rem;
}
.validation-errors[data-v-3f9fb6a6] {
margin-bottom: 1rem;
}
.error-list[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.error-item[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 1rem;
background: rgba(255, 0, 0, 0.1);
border: 1px solid rgba(255, 0, 0, 0.3);
border-radius: 8px;
}
.error-icon[data-v-3f9fb6a6] {
font-size: 1.2rem;
}
.error-text[data-v-3f9fb6a6] {
color: var(--text-primary);
font-size: 0.95rem;
}
.modal-footer[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 2rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@keyframes spin-3f9fb6a6 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Responsive adjustments */
@media (max-width: 768px) {
.modal-content.large[data-v-3f9fb6a6] {
margin: 1rem;
max-height: calc(100vh - 2rem);
}
.chip-grid[data-v-3f9fb6a6] {
grid-template-columns: 1fr;
}
.summary-grid[data-v-3f9fb6a6] {
grid-template-columns: 1fr;
}
.modal-header[data-v-3f9fb6a6] {
padding: 1.5rem 1.5rem 1rem;
}
.modal-body[data-v-3f9fb6a6] {
padding: 1.5rem;
}
.modal-footer[data-v-3f9fb6a6] {
padding: 1rem 1.5rem 1.5rem;
flex-direction: column;
gap: 1rem;
}
}
/* WAC Compliance Information Styling */
.wac-compliance-info[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.compliance-card[data-v-3f9fb6a6] {
border: 1px solid rgba(0, 255, 136, 0.2);
background: rgba(0, 255, 136, 0.05);
}
.compliance-card h4[data-v-3f9fb6a6] {
color: var(--neon-green);
display: flex;
align-items: center;
gap: 0.5rem;
}
.compliance-details[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.compliance-item[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
border-left: 3px solid var(--neon-green);
}
.compliance-label[data-v-3f9fb6a6] {
font-weight: 600;
color: var(--text-secondary);
margin-right: 1rem;
min-width: 140px;
}
.compliance-value[data-v-3f9fb6a6] {
color: var(--text-primary);
font-weight: 500;
text-align: right;
flex: 1;
}
/* Employee Authorization Styling */
.employee-authorization[data-v-3f9fb6a6] {
margin-bottom: 2rem;
}
.auth-card[data-v-3f9fb6a6] {
border: 1px solid rgba(0, 162, 255, 0.2);
background: rgba(0, 162, 255, 0.05);
}
.auth-card h4[data-v-3f9fb6a6] {
color: var(--neon-blue);
display: flex;
align-items: center;
gap: 0.5rem;
}
.auth-details[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.auth-item[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
border-left: 3px solid var(--neon-blue);
}
.auth-label[data-v-3f9fb6a6] {
font-weight: 600;
color: var(--text-secondary);
margin-right: 1rem;
min-width: 140px;
}
.auth-value[data-v-3f9fb6a6] {
color: var(--text-primary);
font-weight: 600;
}
.auth-warning[data-v-3f9fb6a6] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 1rem;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.3);
border-radius: 6px;
color: var(--neon-orange);
font-size: 0.9rem;
}
.warning-icon[data-v-3f9fb6a6] {
font-size: 1.2rem;
}
@media (max-width: 768px) {
.compliance-item[data-v-3f9fb6a6],
.auth-item[data-v-3f9fb6a6] {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
.compliance-label[data-v-3f9fb6a6],
.auth-label[data-v-3f9fb6a6] {
min-width: auto;
margin-right: 0;
}
.compliance-value[data-v-3f9fb6a6] {
text-align: left;
}
}
/* WAC Signature Section Styling */
.signature-section[data-v-3f9fb6a6] {
margin-top: 1.5rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
}
.signature-header h4[data-v-3f9fb6a6] {
color: var(--neon-blue);
margin: 0 0 1rem 0;
font-size: 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.signature-acknowledgment[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.employee-signature[data-v-3f9fb6a6] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.signature-row[data-v-3f9fb6a6] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.signature-label[data-v-3f9fb6a6] {
font-weight: 500;
color: var(--text-muted);
}
.signature-value[data-v-3f9fb6a6] {
color: var(--text-color);
font-weight: 600;
}
.authorization-badge[data-v-3f9fb6a6] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
}
.auth-full[data-v-3f9fb6a6] {
background: linear-gradient(135deg, #00ff88, #00cc6a);
color: #000;
}
.auth-standard[data-v-3f9fb6a6] {
background: linear-gradient(135deg, #ffd700, #ffb347);
color: #000;
}
.auth-limited[data-v-3f9fb6a6] {
background: linear-gradient(135deg, #ff6b6b, #ff5252);
color: #fff;
}
.auth-none[data-v-3f9fb6a6] {
background: linear-gradient(135deg, #666, #444);
color: #fff;
}
.acknowledgment-checkbox[data-v-3f9fb6a6] {
margin-top: 1rem;
}
.checkbox-container[data-v-3f9fb6a6] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
cursor: pointer;
line-height: 1.4;
}
.checkbox-container input[type="checkbox"][data-v-3f9fb6a6] {
display: none;
}
.checkmark[data-v-3f9fb6a6] {
width: 20px;
height: 20px;
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 4px;
flex-shrink: 0;
position: relative;
transition: all 0.3s ease;
}
.checkbox-container input[type="checkbox"]:checked+.checkmark[data-v-3f9fb6a6] {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 162, 255, 0.5);
}
.checkbox-container input[type="checkbox"]:checked+.checkmark[data-v-3f9fb6a6]::after {
content: '✓';
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: white;
font-weight: bold;
font-size: 14px;
}
.checkbox-text[data-v-3f9fb6a6] {
color: var(--text-color);
font-size: 0.9rem;
line-height: 1.4;
}
@media (max-width: 768px) {
.signature-row[data-v-3f9fb6a6] {
flex-direction: column;
align-items: flex-start;
gap: 0.25rem;
}
.checkbox-container[data-v-3f9fb6a6] {
flex-direction: column;
gap: 0.5rem;
}
.modal-footer button[data-v-3f9fb6a6] {
width: 100%;
}
}
.table-management[data-v-dff182d4] {
max-width: 1400px;
margin: 0 auto;
padding: 1.5rem;
}
/* Header */
.management-header[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 2rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.management-header h2[data-v-dff182d4] {
margin: 0;
color: var(--text-primary);
font-size: 2rem;
}
.subtitle[data-v-dff182d4] {
color: var(--text-secondary);
margin: 0.5rem 0 0 0;
}
.header-actions[data-v-dff182d4] {
display: flex;
align-items: center;
gap: 2rem;
}
.header-buttons[data-v-dff182d4] {
display: flex;
gap: 1rem;
align-items: center;
}
.table-stats[data-v-dff182d4] {
display: flex;
gap: 1.5rem;
}
.stat-item[data-v-dff182d4] {
text-align: center;
}
.stat-value[data-v-dff182d4] {
display: block;
font-size: 1.5rem;
font-weight: 700;
color: var(--neon-blue);
}
.stat-label[data-v-dff182d4] {
display: block;
font-size: 0.8rem;
color: var(--text-secondary);
margin-top: 0.25rem;
}
/* Game Type Grid */
.game-type-grid[data-v-dff182d4] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin-bottom: 3rem;
}
.game-type-card[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.5rem;
}
.game-type-header[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1rem;
}
.game-type-info h3[data-v-dff182d4] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.game-type-desc[data-v-dff182d4] {
color: var(--text-secondary);
font-size: 0.9rem;
margin: 0;
}
.stat-badge[data-v-dff182d4] {
width: 48px;
height: 48px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
font-weight: 700;
background: rgba(0, 245, 255, 0.1);
color: var(--neon-blue);
}
.stat-badge.neon-purple[data-v-dff182d4] {
background: rgba(138, 43, 226, 0.1);
color: var(--neon-purple);
}
.stat-badge.neon-green[data-v-dff182d4] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.stat-badge.neon-orange[data-v-dff182d4] {
background: rgba(255, 102, 0, 0.1);
color: var(--neon-orange);
}
.stat-badge.neon-red[data-v-dff182d4] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
.stat-badge.neon-gold[data-v-dff182d4] {
background: rgba(255, 215, 0, 0.1);
color: #FFD700;
}
.game-type-stats[data-v-dff182d4] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.active-badge[data-v-dff182d4] {
font-size: 0.7rem;
padding: 0.2rem 0.5rem;
background: rgba(0, 255, 150, 0.2);
color: var(--neon-green);
border: 1px solid var(--neon-green);
border-radius: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.game-type-details[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-row[data-v-dff182d4] {
display: flex;
justify-content: space-between;
font-size: 0.9rem;
}
.detail-row span[data-v-dff182d4]:first-child {
color: var(--text-secondary);
}
.detail-row span[data-v-dff182d4]:last-child {
color: var(--text-primary);
font-weight: 500;
}
.vip-indicator[data-v-dff182d4] {
color: var(--neon-purple) !important;
}
/* Tables Section */
.tables-section[data-v-dff182d4] {
margin-bottom: 2rem;
}
.section-header[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.section-header h3[data-v-dff182d4] {
margin: 0;
color: var(--text-primary);
}
.table-filters[data-v-dff182d4] {
display: flex;
gap: 1rem;
}
.filter-select[data-v-dff182d4] {
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 0.9rem;
}
/* Tables Grid */
.tables-grid[data-v-dff182d4] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 1.5rem;
}
.table-card[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.5rem;
transition: all 0.3s ease;
}
.table-card.inactive[data-v-dff182d4] {
opacity: 0.6;
background: rgba(255, 255, 255, 0.01);
}
.table-card.vip[data-v-dff182d4] {
border-color: rgba(138, 43, 226, 0.3);
background: rgba(138, 43, 226, 0.02);
}
.table-card.editing[data-v-dff182d4] {
border-color: var(--neon-blue);
background: rgba(0, 245, 255, 0.02);
}
.table-card-header[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1rem;
}
.table-id-section[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.table-id[data-v-dff182d4] {
font-size: 1.25rem;
font-weight: 700;
color: var(--neon-blue);
}
.table-id.neon-purple[data-v-dff182d4] {
color: var(--neon-purple);
}
.table-id.neon-green[data-v-dff182d4] {
color: var(--neon-green);
}
.table-id.neon-orange[data-v-dff182d4] {
color: var(--neon-orange);
}
.table-id.neon-red[data-v-dff182d4] {
color: var(--neon-red);
}
.table-id.neon-gold[data-v-dff182d4] {
color: #FFD700;
}
.table-badges[data-v-dff182d4] {
display: flex;
gap: 0.5rem;
}
.vip-badge[data-v-dff182d4],
.inactive-badge[data-v-dff182d4] {
font-size: 0.7rem;
padding: 0.2rem 0.5rem;
border-radius: 12px;
font-weight: 600;
}
.vip-badge[data-v-dff182d4] {
background: rgba(138, 43, 226, 0.2);
color: var(--neon-purple);
}
.inactive-badge[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.1);
color: var(--text-muted);
}
.table-actions[data-v-dff182d4] {
display: flex;
gap: 0.5rem;
}
.btn-icon[data-v-dff182d4] {
width: 32px;
height: 32px;
border-radius: 6px;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.9rem;
}
.btn-icon[data-v-dff182d4]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.2);
color: var(--text-primary);
}
.btn-icon.active[data-v-dff182d4] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.btn-icon.danger[data-v-dff182d4]:hover:not(:disabled) {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
.btn-icon[data-v-dff182d4]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
/* Table Info */
.table-name[data-v-dff182d4] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.5rem;
}
.table-game-type[data-v-dff182d4] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.table-details[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-item[data-v-dff182d4] {
display: flex;
justify-content: space-between;
font-size: 0.875rem;
}
.detail-item span[data-v-dff182d4]:first-child {
color: var(--text-secondary);
}
.detail-item span[data-v-dff182d4]:last-child {
color: var(--text-primary);
font-weight: 500;
}
.seat-display[data-v-dff182d4] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.seat-occupancy-bar[data-v-dff182d4] {
width: 40px;
height: 6px;
background: rgba(255, 255, 255, 0.1);
border-radius: 3px;
overflow: hidden;
}
.seat-fill[data-v-dff182d4] {
height: 100%;
background: linear-gradient(90deg, var(--neon-green), var(--neon-orange), var(--neon-red));
transition: width 0.3s ease;
border-radius: 3px;
}
/* Table Management Actions */
.table-management-actions[data-v-dff182d4] {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.fill-btn[data-v-dff182d4] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 0.6rem 1rem;
font-size: 0.85rem;
border-radius: 6px;
transition: all 0.3s ease;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.3);
color: var(--neon-orange);
}
.fill-btn[data-v-dff182d4]:hover:not(:disabled) {
background: rgba(255, 165, 0, 0.2);
border-color: var(--neon-orange);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(255, 165, 0, 0.2);
}
.fill-btn[data-v-dff182d4]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.fill-btn.urgent[data-v-dff182d4] {
background: rgba(255, 7, 58, 0.2);
border-color: var(--neon-red);
color: var(--neon-red);
animation: pulse-dff182d4 2s infinite;
}
@keyframes pulse-dff182d4 {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.7;
}
}
.chip-status[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.chip-info[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.last-fill[data-v-dff182d4] {
font-size: 0.7rem;
color: var(--text-muted);
background: rgba(255, 255, 255, 0.03);
padding: 0.2rem 0.4rem;
border-radius: 8px;
}
.fill-count[data-v-dff182d4] {
font-size: 0.75rem;
color: var(--text-secondary);
background: rgba(255, 255, 255, 0.05);
padding: 0.25rem 0.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
/* Financial Metrics */
.table-financials[data-v-dff182d4] {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.financials-header[data-v-dff182d4] {
font-size: 0.8rem;
font-weight: 600;
color: var(--text-secondary);
margin-bottom: 0.5rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.financial-row[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.85rem;
margin-bottom: 0.25rem;
}
.financial-row span[data-v-dff182d4]:first-child {
color: var(--text-secondary);
}
.amount[data-v-dff182d4] {
font-weight: 600;
font-family: 'Consolas', 'Monaco', monospace;
}
.amount.positive[data-v-dff182d4] {
color: var(--neon-green);
}
.amount.negative[data-v-dff182d4] {
color: var(--neon-red);
}
.amount.neutral[data-v-dff182d4] {
color: var(--text-primary);
}
/* Edit Form */
.table-edit-form[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
padding: 1rem;
}
.form-group[data-v-dff182d4] {
margin-bottom: 1rem;
}
.form-row[data-v-dff182d4] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
}
.form-row .form-group[data-v-dff182d4] {
flex: 1;
margin-bottom: 0;
}
.form-group label[data-v-dff182d4] {
display: block;
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.5rem;
}
.form-input[data-v-dff182d4],
.form-select[data-v-dff182d4] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
font-size: 0.9rem;
}
.form-input[data-v-dff182d4]:focus,
.form-select[data-v-dff182d4]:focus {
outline: none;
border-color: var(--neon-blue);
}
.checkbox-group[data-v-dff182d4] {
display: flex;
align-items: center;
}
.checkbox-label[data-v-dff182d4] {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
}
.form-checkbox[data-v-dff182d4] {
display: none;
}
.checkbox-custom[data-v-dff182d4] {
width: 18px;
height: 18px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-radius: 4px;
position: relative;
transition: all 0.3s ease;
}
.form-checkbox:checked+.checkbox-custom[data-v-dff182d4] {
background: var(--neon-blue);
border-color: var(--neon-blue);
}
.form-checkbox:checked+.checkbox-custom[data-v-dff182d4]::after {
content: '✓';
position: absolute;
top: -2px;
left: 2px;
color: white;
font-size: 12px;
font-weight: bold;
}
.form-actions[data-v-dff182d4] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 1.5rem;
}
/* Modal */
.modal-overlay[data-v-dff182d4] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(4px);
}
.modal-content[data-v-dff182d4] {
background: var(--card-bg);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
width: 90%;
max-width: 500px;
max-height: 90vh;
overflow-y: auto;
}
.modal-header[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-dff182d4] {
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-dff182d4] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
transition: all 0.3s ease;
}
.btn-close[data-v-dff182d4]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-dff182d4] {
padding: 1.5rem;
}
.modal-footer[data-v-dff182d4] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.error-text[data-v-dff182d4] {
color: var(--neon-red);
font-size: 0.8rem;
margin-top: 0.25rem;
display: block;
}
.warning-text[data-v-dff182d4] {
color: var(--neon-orange);
font-weight: 500;
}
/* Game Type Modal */
.game-type-modal[data-v-dff182d4] {
max-width: 800px;
max-height: 90vh;
}
.game-types-list[data-v-dff182d4] {
margin-bottom: 2rem;
}
.game-types-list h4[data-v-dff182d4] {
color: var(--text-primary);
margin-bottom: 1rem;
}
.game-type-items[data-v-dff182d4] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.game-type-item[data-v-dff182d4] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
transition: all 0.3s ease;
}
.game-type-item[data-v-dff182d4]:hover {
background: rgba(255, 255, 255, 0.05);
}
.game-type-item.neon-blue[data-v-dff182d4] {
border-left: 3px solid var(--neon-blue);
}
.game-type-item.neon-purple[data-v-dff182d4] {
border-left: 3px solid var(--neon-purple);
}
.game-type-item.neon-green[data-v-dff182d4] {
border-left: 3px solid var(--neon-green);
}
.game-type-item.neon-orange[data-v-dff182d4] {
border-left: 3px solid var(--neon-orange);
}
.game-type-item.neon-red[data-v-dff182d4] {
border-left: 3px solid var(--neon-red);
}
.game-type-item.neon-gold[data-v-dff182d4] {
border-left: 3px solid #FFD700;
}
.game-type-content[data-v-dff182d4] {
flex: 1;
}
.game-type-name[data-v-dff182d4] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.game-type-details[data-v-dff182d4] {
display: flex;
gap: 1rem;
font-size: 0.9rem;
color: var(--text-secondary);
margin-bottom: 0.25rem;
}
.game-type-description[data-v-dff182d4] {
font-size: 0.85rem;
color: var(--text-muted);
}
.game-type-actions[data-v-dff182d4] {
display: flex;
gap: 0.5rem;
}
.add-game-type-section h4[data-v-dff182d4] {
color: var(--text-primary);
margin-bottom: 1rem;
}
.game-type-form[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
padding: 1.5rem;
}
/* Stashing specific styles */
.btn-icon.warning[data-v-dff182d4] {
background: rgba(255, 165, 0, 0.1);
border-color: rgba(255, 165, 0, 0.3);
color: var(--neon-orange);
}
.btn-icon.warning[data-v-dff182d4]:hover:not(:disabled) {
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
border-color: var(--neon-orange);
}
.btn-icon.success[data-v-dff182d4] {
background: rgba(57, 255, 20, 0.1);
border-color: rgba(57, 255, 20, 0.3);
color: var(--neon-green);
}
.btn-icon.success[data-v-dff182d4]:hover:not(:disabled) {
background: rgba(57, 255, 20, 0.2);
color: var(--neon-green);
border-color: var(--neon-green);
}
.info-text[data-v-dff182d4] {
color: var(--neon-blue);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.stash-info[data-v-dff182d4] {
background: rgba(255, 255, 255, 0.05);
border-radius: 6px;
padding: 1rem;
margin-top: 1rem;
}
.stash-info p[data-v-dff182d4] {
margin: 0.5rem 0;
font-size: 0.9rem;
}
.stash-info strong[data-v-dff182d4] {
color: var(--text-primary);
}
.warning-text[data-v-dff182d4] {
color: var(--neon-red);
font-weight: 500;
}
/* Responsive */
@media (max-width: 768px) {
.management-header[data-v-dff182d4] {
flex-direction: column;
gap: 1rem;
align-items: stretch;
}
.header-actions[data-v-dff182d4] {
flex-direction: column;
gap: 1rem;
}
.header-buttons[data-v-dff182d4] {
flex-direction: column;
}
.game-type-grid[data-v-dff182d4] {
grid-template-columns: 1fr;
}
.tables-grid[data-v-dff182d4] {
grid-template-columns: 1fr;
}
.section-header[data-v-dff182d4] {
flex-direction: column;
gap: 1rem;
align-items: stretch;
}
.table-filters[data-v-dff182d4] {
flex-direction: column;
}
.game-type-modal[data-v-dff182d4] {
max-width: 95%;
}
.game-type-details[data-v-dff182d4] {
flex-direction: column;
gap: 0.25rem;
}
}
.table-management-modal[data-v-a517ee6d] {
max-width: 1200px;
width: 95%;
}
.animate-fade-in[data-v-a517ee6d] {
animation: fadeIn-a517ee6d 0.3s ease-out;
}
.animate-scale-in[data-v-a517ee6d] {
animation: scaleIn-a517ee6d 0.3s ease-out;
}
@keyframes fadeIn-a517ee6d {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-a517ee6d {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.btn-close[data-v-a517ee6d] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-a517ee6d]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.loading-state[data-v-a517ee6d] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-spinner[data-v-a517ee6d] {
font-size: 2rem;
animation: spin-a517ee6d 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-a517ee6d {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.loading-state p[data-v-a517ee6d] {
color: var(--text-secondary);
margin: 0;
}
.theoretical-formulas[data-v-24d3c05f] {
max-width: 1400px;
margin: 0 auto;
padding: 1.5rem;
}
/* Header */
.formulas-header[data-v-24d3c05f] {
margin-bottom: 2rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.formulas-header h2[data-v-24d3c05f] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.8rem;
}
.subtitle[data-v-24d3c05f] {
color: var(--text-secondary);
margin: 0 0 1.5rem 0;
}
.header-actions[data-v-24d3c05f] {
display: flex;
justify-content: space-between;
align-items: center;
gap: 2rem;
}
.formula-stats[data-v-24d3c05f] {
display: flex;
gap: 2rem;
}
.stat-item[data-v-24d3c05f] {
text-align: center;
}
.stat-value[data-v-24d3c05f] {
display: block;
font-size: 1.25rem;
font-weight: 700;
color: var(--neon-orange);
}
.stat-label[data-v-24d3c05f] {
display: block;
font-size: 0.8rem;
color: var(--text-secondary);
margin-top: 0.25rem;
}
.formula-actions[data-v-24d3c05f] {
display: flex;
gap: 1rem;
}
/* Formulas Grid */
.formulas-grid[data-v-24d3c05f] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 2rem;
}
.formula-card[data-v-24d3c05f] {
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
padding: 1.5rem;
transition: all 0.3s ease;
}
.formula-card.has-changes[data-v-24d3c05f] {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.02);
}
.formula-header[data-v-24d3c05f] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1.5rem;
}
.game-info h3[data-v-24d3c05f] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.2rem;
}
.game-desc[data-v-24d3c05f] {
color: var(--text-secondary);
font-size: 0.9rem;
margin: 0 0 0.75rem 0;
}
.game-meta[data-v-24d3c05f] {
display: flex;
gap: 1rem;
font-size: 0.8rem;
color: var(--text-muted);
}
.game-color[data-v-24d3c05f] {
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--neon-blue);
}
.game-color.neon-purple[data-v-24d3c05f] {
background: var(--neon-purple);
}
.game-color.neon-green[data-v-24d3c05f] {
background: var(--neon-green);
}
.game-color.neon-orange[data-v-24d3c05f] {
background: var(--neon-orange);
}
.game-color.neon-red[data-v-24d3c05f] {
background: var(--neon-red);
}
.game-color.neon-gold[data-v-24d3c05f] {
background: #FFD700;
}
/* Parameters */
.formula-params[data-v-24d3c05f] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
margin-bottom: 1.5rem;
}
.param-group[data-v-24d3c05f] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.param-group label[data-v-24d3c05f] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.input-with-validation[data-v-24d3c05f] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.param-input[data-v-24d3c05f] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 0.9rem;
transition: all 0.3s ease;
}
.param-input[data-v-24d3c05f]:focus {
outline: none;
border-color: var(--neon-blue);
background: rgba(255, 255, 255, 0.08);
}
.param-input.changed[data-v-24d3c05f] {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.05);
}
.param-input.small[data-v-24d3c05f] {
padding: 0.5rem;
font-size: 0.85rem;
}
.validation-info[data-v-24d3c05f] {
font-size: 0.75rem;
color: var(--text-muted);
}
.validation-info.washington-limit[data-v-24d3c05f] {
color: var(--neon-red);
font-weight: 500;
}
/* Flat-hourly mode (live cardroom poker) */
.theo-mode-banner[data-v-24d3c05f] {
grid-column: 1 / -1;
display: flex;
align-items: flex-start;
gap: 0.75rem;
padding: 0.75rem 1rem;
background: rgba(255, 215, 0, 0.06);
border: 1px solid rgba(255, 215, 0, 0.25);
border-left: 4px solid gold;
border-radius: 6px;
margin-bottom: 0.5rem;
}
.theo-mode-icon[data-v-24d3c05f] { font-size: 1.5rem; line-height: 1; flex-shrink: 0;
}
.theo-mode-banner strong[data-v-24d3c05f] { color: gold;
}
.theo-mode-note[data-v-24d3c05f] {
margin: 0.25rem 0 0;
font-size: 0.8rem;
opacity: 0.85;
line-height: 1.4;
}
.param-input.readonly-input[data-v-24d3c05f] {
background: rgba(255, 255, 255, 0.04);
cursor: not-allowed;
font-family: 'Courier New', monospace;
color: gold;
border-style: dashed;
}
.validation-info.readonly-note[data-v-24d3c05f] {
font-style: italic;
opacity: 0.7;
}
.full-width-note[data-v-24d3c05f] {
grid-column: 1 / -1;
}
.future-analytics-note[data-v-24d3c05f] {
margin: 0;
padding: 0.5rem 0.75rem;
background: rgba(0, 245, 255, 0.05);
border: 1px dashed rgba(0, 245, 255, 0.25);
border-radius: 6px;
font-size: 0.8rem;
opacity: 0.85;
line-height: 1.5;
}
.future-analytics-note strong[data-v-24d3c05f] { color: var(--neon-blue, #00f5ff);
}
/* Game-Specific Parameters */
.game-specific-params[data-v-24d3c05f] {
margin: 1.5rem 0;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.game-specific-params h4[data-v-24d3c05f] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.specific-params[data-v-24d3c05f] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
/* Formula Actions */
.formula-actions[data-v-24d3c05f] {
display: flex;
gap: 0.75rem;
justify-content: flex-end;
margin-top: 1.5rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.btn-sm[data-v-24d3c05f] {
padding: 0.5rem 1rem;
font-size: 0.85rem;
}
/* Test Modal */
.test-modal[data-v-24d3c05f] {
max-width: 800px;
width: 90%;
}
.scenario-grid[data-v-24d3c05f] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem;
}
.scenario-card[data-v-24d3c05f] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 1rem;
}
.scenario-card h5[data-v-24d3c05f] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.scenario-results[data-v-24d3c05f] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.result-item[data-v-24d3c05f] {
display: flex;
justify-content: space-between;
font-size: 0.9rem;
}
.result-item span[data-v-24d3c05f]:first-child {
color: var(--text-secondary);
}
.result-item .value[data-v-24d3c05f] {
color: var(--text-primary);
font-weight: 500;
}
/* Modal styles */
.modal-overlay[data-v-24d3c05f] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(4px);
}
.modal-content[data-v-24d3c05f] {
background: var(--card-bg);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
max-height: 90vh;
overflow-y: auto;
}
.modal-header[data-v-24d3c05f] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-24d3c05f] {
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-24d3c05f] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
transition: all 0.3s ease;
}
.btn-close[data-v-24d3c05f]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-24d3c05f] {
padding: 1.5rem;
}
.modal-footer[data-v-24d3c05f] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Responsive */
@media (max-width: 768px) {
.formulas-grid[data-v-24d3c05f] {
grid-template-columns: 1fr;
}
.formula-params[data-v-24d3c05f] {
grid-template-columns: 1fr;
}
.header-actions[data-v-24d3c05f] {
flex-direction: column;
gap: 1rem;
}
.specific-params[data-v-24d3c05f] {
grid-template-columns: 1fr;
}
}
.modal-content.large[data-v-28452486] {
max-width: 1000px;
}
.animate-fade-in[data-v-28452486] {
animation: fadeIn-28452486 0.3s ease-out;
}
.animate-scale-in[data-v-28452486] {
animation: scaleIn-28452486 0.3s ease-out;
}
@keyframes fadeIn-28452486 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-28452486 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.btn-close[data-v-28452486] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-28452486]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.loading-state[data-v-28452486] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-spinner[data-v-28452486] {
font-size: 2rem;
animation: spin-28452486 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-28452486 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.loading-state p[data-v-28452486] {
color: var(--text-secondary);
margin: 0;
}
.data-management[data-v-742fb1f7] {
padding: 1rem 0;
}
.section-header[data-v-742fb1f7] {
margin-bottom: 2rem;
}
.section-header h3[data-v-742fb1f7] {
margin-bottom: 0.5rem;
}
.data-cards-grid[data-v-742fb1f7] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 1.5rem;
margin-bottom: 2rem;
}
.data-card[data-v-742fb1f7] {
padding: 1.5rem;
transition: all 0.3s ease;
}
.data-card[data-v-742fb1f7]:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(0, 150, 255, 0.1);
}
.data-card.processing[data-v-742fb1f7] {
border-color: var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 150, 255, 0.3);
}
.card-header[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}
.card-icon[data-v-742fb1f7] {
font-size: 2rem;
padding: 0.5rem;
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
}
.card-header h4[data-v-742fb1f7] {
margin: 0;
color: var(--text-primary);
}
.card-body[data-v-742fb1f7] {
margin-bottom: 1.5rem;
}
.card-body p[data-v-742fb1f7] {
color: var(--text-secondary);
margin-bottom: 1rem;
}
.card-actions[data-v-742fb1f7] {
display: flex;
gap: 1rem;
justify-content: flex-end;
}
/* File Input Styling */
.file-input-section[data-v-742fb1f7] {
margin: 1rem 0;
}
.file-input-label[data-v-742fb1f7] {
display: flex;
align-items: center;
padding: 0.75rem;
border: 2px dashed rgba(255, 255, 255, 0.3);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.file-input-label[data-v-742fb1f7]:hover {
border-color: var(--neon-blue);
background: rgba(0, 150, 255, 0.05);
}
.file-input[data-v-742fb1f7] {
display: none;
}
.file-input-display[data-v-742fb1f7] {
flex: 1;
color: var(--text-primary);
}
.file-input-icon[data-v-742fb1f7] {
font-size: 1.2rem;
color: var(--neon-blue);
}
.file-help[data-v-742fb1f7] {
margin-top: 0.5rem;
color: var(--text-secondary);
}
/* Import Options */
.import-options[data-v-742fb1f7] {
margin: 1rem 0;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.option-row[data-v-742fb1f7] {
margin-bottom: 0.5rem;
}
.checkbox-label[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 0.75rem;
cursor: pointer;
}
.checkbox-input[data-v-742fb1f7] {
display: none;
}
.checkbox-custom[data-v-742fb1f7] {
width: 18px;
height: 18px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-radius: 3px;
position: relative;
transition: all 0.3s ease;
}
.checkbox-input:checked+.checkbox-custom[data-v-742fb1f7] {
background: var(--neon-blue);
border-color: var(--neon-blue);
}
.checkbox-input:checked+.checkbox-custom[data-v-742fb1f7]::after {
content: '✓';
position: absolute;
top: -2px;
left: 2px;
color: white;
font-size: 14px;
font-weight: bold;
}
/* Progress Indicators */
.import-progress[data-v-742fb1f7] {
margin: 1rem 0;
}
.progress-bar[data-v-742fb1f7] {
width: 100%;
height: 8px;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
overflow: hidden;
margin-bottom: 0.5rem;
}
.progress-fill[data-v-742fb1f7] {
height: 100%;
background: linear-gradient(90deg, var(--neon-blue), var(--neon-green));
border-radius: 4px;
transition: width 0.3s ease;
position: relative;
}
.progress-fill[data-v-742fb1f7]::after {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
animation: shimmer-742fb1f7 1.5s infinite;
}
@keyframes shimmer-742fb1f7 {
0% {
left: -100%;
}
100% {
left: 100%;
}
}
.progress-text[data-v-742fb1f7] {
color: var(--text-secondary);
font-size: 0.9rem;
}
/* Import Results */
.import-results[data-v-742fb1f7] {
margin: 1rem 0;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.results-summary[data-v-742fb1f7] {
display: flex;
gap: 2rem;
margin-bottom: 1rem;
}
.result-stat[data-v-742fb1f7] {
text-align: center;
}
.stat-value[data-v-742fb1f7] {
display: block;
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 0.25rem;
}
.stat-value.success[data-v-742fb1f7] {
color: var(--neon-green);
}
.stat-value.warning[data-v-742fb1f7] {
color: var(--neon-orange);
}
.stat-value.error[data-v-742fb1f7] {
color: var(--neon-red);
}
.stat-label[data-v-742fb1f7] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.results-errors[data-v-742fb1f7] {
margin-top: 1rem;
padding: 1rem;
background: rgba(255, 0, 0, 0.1);
border-radius: 8px;
}
.results-errors h5[data-v-742fb1f7] {
color: var(--neon-red);
margin-bottom: 0.5rem;
}
.results-errors ul[data-v-742fb1f7] {
margin: 0;
padding-left: 1rem;
color: var(--text-secondary);
}
/* Export Options */
.export-options[data-v-742fb1f7] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.export-type[data-v-742fb1f7],
.export-format[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 1rem;
}
.export-type label[data-v-742fb1f7],
.export-format label[data-v-742fb1f7] {
min-width: 100px;
color: var(--text-primary);
}
.date-range[data-v-742fb1f7] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.date-range label[data-v-742fb1f7] {
color: var(--text-primary);
}
.date-inputs[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 1rem;
}
/* Report Features */
.report-features[data-v-742fb1f7] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 0.5rem;
margin: 1rem 0;
}
.feature-item[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-secondary);
}
.feature-icon[data-v-742fb1f7] {
color: var(--neon-orange);
}
/* Migration Status */
.migration-status[data-v-742fb1f7] {
margin: 1rem 0;
padding: 1rem;
background: rgba(255, 193, 7, 0.1);
border: 1px solid rgba(255, 193, 7, 0.3);
border-radius: 8px;
}
.status-indicator[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.status-indicator.warning[data-v-742fb1f7] {
color: var(--neon-orange);
}
.indicator-icon[data-v-742fb1f7] {
font-size: 1.2rem;
}
/* Migration Guide */
.migration-guide[data-v-742fb1f7] {
margin-top: 2rem;
padding: 2rem;
}
.guide-header[data-v-742fb1f7] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.guide-header h4[data-v-742fb1f7] {
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-742fb1f7] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 4px;
transition: all 0.3s ease;
}
.btn-close[data-v-742fb1f7]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.guide-steps[data-v-742fb1f7] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
margin-bottom: 2rem;
}
.guide-step[data-v-742fb1f7] {
display: flex;
gap: 1rem;
}
.step-number[data-v-742fb1f7] {
width: 32px;
height: 32px;
background: var(--neon-blue);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
flex-shrink: 0;
}
.step-content h5[data-v-742fb1f7] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.step-content p[data-v-742fb1f7] {
margin: 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
/* Field Mappings */
.field-mappings[data-v-742fb1f7] {
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.field-mappings h5[data-v-742fb1f7] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.mapping-table[data-v-742fb1f7] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.mapping-row[data-v-742fb1f7] {
display: flex;
align-items: center;
gap: 1rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
}
.casinotrac-field[data-v-742fb1f7] {
font-family: monospace;
color: var(--neon-orange);
flex: 1;
}
.arrow[data-v-742fb1f7] {
color: var(--text-secondary);
}
.ipc-field[data-v-742fb1f7] {
color: var(--neon-blue);
flex: 1;
}
@media (max-width: 768px) {
.data-cards-grid[data-v-742fb1f7] {
grid-template-columns: 1fr;
}
.guide-steps[data-v-742fb1f7] {
grid-template-columns: 1fr;
}
.results-summary[data-v-742fb1f7] {
flex-direction: column;
gap: 1rem;
}
.date-inputs[data-v-742fb1f7] {
flex-direction: column;
align-items: stretch;
}
}
.modal-content.large[data-v-d9b08da8] {
max-width: 1000px;
}
.animate-fade-in[data-v-d9b08da8] {
animation: fadeIn-d9b08da8 0.3s ease-out;
}
.animate-scale-in[data-v-d9b08da8] {
animation: scaleIn-d9b08da8 0.3s ease-out;
}
@keyframes fadeIn-d9b08da8 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-d9b08da8 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.btn-close[data-v-d9b08da8] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-d9b08da8]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.loading-state[data-v-d9b08da8] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
text-align: center;
}
.loading-spinner[data-v-d9b08da8] {
font-size: 2rem;
animation: spin-d9b08da8 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-d9b08da8 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.loading-state p[data-v-d9b08da8] {
color: var(--text-secondary);
margin: 0;
}
.dropzone[data-v-4ed3e9d5] {
padding: 1.5rem 1.25rem;
text-align: center;
border: 2px dashed rgba(255, 255, 255, 0.15);
transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
cursor: pointer;
}
.dropzone.drag-over[data-v-4ed3e9d5] {
border-color: rgba(255, 215, 0, 0.7);
background: rgba(255, 215, 0, 0.06);
transform: translateY(-2px);
}
.dz-icon[data-v-4ed3e9d5] {
font-size: 2.5rem;
margin-bottom: 0.5rem;
}
.dz-title[data-v-4ed3e9d5] {
margin: 0;
font-size: 1rem;
color: rgba(255, 255, 255, 0.85);
}
.dz-hint[data-v-4ed3e9d5] {
margin: 0.4rem 0 0;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.55);
letter-spacing: 0.05em;
}
.dz-sub[data-v-4ed3e9d5] {
margin: 0.25rem 0 0;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.4);
font-style: italic;
}
.btn-link[data-v-4ed3e9d5] {
background: none;
border: none;
color: #ffd700;
font: inherit;
cursor: pointer;
text-decoration: underline;
padding: 0;
}
.scope-chip[data-v-de42c4e8] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0.35rem 0.7rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
cursor: pointer;
transition: background 0.15s ease, border-color 0.15s ease;
font-family: inherit;
color: inherit;
}
.scope-chip[data-v-de42c4e8]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 215, 0, 0.4);
}
.scope-badge[data-v-de42c4e8] {
display: inline-block;
padding: 0.15rem 0.55rem;
border-radius: 999px;
font-size: 0.72rem;
font-weight: 600;
letter-spacing: 0.04em;
white-space: nowrap;
}
.tone-all[data-v-de42c4e8] { background: rgba(74, 222, 128, 0.18); color: #4ade80;
}
.tone-pit[data-v-de42c4e8] { background: rgba(96, 165, 250, 0.18); color: #60a5fa;
}
.tone-game[data-v-de42c4e8] { background: rgba(255, 215, 0, 0.18); color: #ffd700;
}
.tone-table[data-v-de42c4e8] { background: rgba(167, 139, 250, 0.18); color: #a78bfa;
}
.tone-none[data-v-de42c4e8] { background: rgba(248, 113, 113, 0.18); color: #f87171;
}
.edit-icon[data-v-de42c4e8] {
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.45);
margin-left: 0.15rem;
}
.media-card[data-v-b8c3181e] {
display: flex;
flex-direction: column;
overflow: hidden;
transition: opacity 0.18s ease, transform 0.18s ease;
}
.media-card.inactive[data-v-b8c3181e] {
opacity: 0.55;
}
.media-preview[data-v-b8c3181e] {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
background: #000;
overflow: hidden;
}
.preview-thumb[data-v-b8c3181e] {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.type-badge[data-v-b8c3181e] {
position: absolute;
top: 0.5rem;
left: 0.5rem;
padding: 0.15rem 0.5rem;
border-radius: 4px;
font-size: 0.65rem;
font-weight: 700;
letter-spacing: 0.15em;
background: rgba(0, 0, 0, 0.65);
backdrop-filter: blur(6px);
}
.type-image[data-v-b8c3181e] { color: #60a5fa;
}
.type-video[data-v-b8c3181e] { color: #ffd700;
}
.preview-actions[data-v-b8c3181e] {
position: absolute;
top: 0.5rem;
right: 0.5rem;
display: flex;
gap: 0.25rem;
}
.btn-icon-small[data-v-b8c3181e] {
width: 1.7rem;
height: 1.7rem;
border-radius: 50%;
background: rgba(0, 0, 0, 0.65);
border: 1px solid rgba(255, 255, 255, 0.1);
color: #fff;
cursor: pointer;
font-size: 0.75rem;
backdrop-filter: blur(6px);
display: inline-flex;
align-items: center;
justify-content: center;
}
.btn-icon-small.btn-danger[data-v-b8c3181e]:hover {
background: rgba(248, 113, 113, 0.7);
border-color: rgba(248, 113, 113, 0.9);
}
.media-meta[data-v-b8c3181e] {
padding: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.filename[data-v-b8c3181e] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.85);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.meta-row[data-v-b8c3181e] {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
}
.meta-pill[data-v-b8c3181e] {
display: inline-flex;
align-items: center;
padding: 0.2rem 0.5rem;
border-radius: 4px;
font-size: 0.7rem;
background: rgba(255, 255, 255, 0.06);
color: rgba(255, 255, 255, 0.65);
}
.duration-input[data-v-b8c3181e] {
width: 2.6rem;
background: transparent;
border: none;
color: inherit;
font: inherit;
text-align: right;
-moz-appearance: textfield;
}
.duration-input[data-v-b8c3181e]::-webkit-outer-spin-button,
.duration-input[data-v-b8c3181e]::-webkit-inner-spin-button {
-webkit-appearance: none;
}
.duration-suffix[data-v-b8c3181e] {
margin-left: 0.15rem;
}
.order-row[data-v-b8c3181e] {
display: flex;
align-items: center;
gap: 0.35rem;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
}
.btn-tiny[data-v-b8c3181e] {
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.08);
color: #fff;
border-radius: 4px;
padding: 0.15rem 0.4rem;
font-size: 0.7rem;
cursor: pointer;
}
.btn-tiny[data-v-b8c3181e]:hover {
background: rgba(255, 215, 0, 0.15);
border-color: rgba(255, 215, 0, 0.4);
}
.library-root[data-v-efe52cfa] {
margin: 1rem 0;
}
.library-grid[data-v-efe52cfa] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 1rem;
}
.empty-state[data-v-efe52cfa] {
padding: 2.5rem 1rem;
text-align: center;
color: rgba(255, 255, 255, 0.55);
}
.empty-icon[data-v-efe52cfa] {
display: block;
font-size: 2.5rem;
margin-bottom: 0.5rem;
opacity: 0.7;
}
.empty-hint[data-v-efe52cfa] {
margin-top: 0.4rem;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.4);
}
/* Stacks above the parent MediaManagement modal-overlay (which uses
.animate-fade-in for z-index: 9999). Without this override, the global
.modal-overlay z-index (1000) hides this Teleported child modal. */
.modal-overlay[data-v-dd1a0aab] {
z-index: 10000;
}
/* Override global .modal-content's translucent background for nested-modal use.
Default 0.08 white is fine over a dark page, but stacked over another modal
(Media Management) the parent text shows through. Use a strong dark fill instead. */
.modal-content[data-v-dd1a0aab] {
background: rgba(15, 18, 30, 0.96);
border: 1px solid rgba(255, 215, 0, 0.18);
}
.all-toggle[data-v-dd1a0aab] {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.6rem 0.8rem;
border-radius: 0.6rem;
background: rgba(74, 222, 128, 0.08);
border: 1px solid rgba(74, 222, 128, 0.25);
margin-bottom: 1rem;
cursor: pointer;
}
.all-toggle input[data-v-dd1a0aab] { transform: scale(1.2);
}
.all-label[data-v-dd1a0aab] { font-weight: 600; color: #4ade80;
}
.all-hint[data-v-dd1a0aab] { color: rgba(255, 255, 255, 0.5); font-size: 0.8rem; margin-left: auto;
}
.picker-grid[data-v-dd1a0aab] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem;
transition: opacity 0.15s ease;
}
.picker-grid.is-disabled[data-v-dd1a0aab] {
opacity: 0.5;
pointer-events: none;
}
.span-2[data-v-dd1a0aab] { grid-column: span 2;
}
.picker-section[data-v-dd1a0aab] {
padding: 0.8rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
max-height: 320px;
}
.picker-header[data-v-dd1a0aab] {
display: flex;
justify-content: space-between;
font-weight: 600;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.85);
letter-spacing: 0.1em;
text-transform: uppercase;
}
.picker-count[data-v-dd1a0aab] {
color: rgba(255, 215, 0, 0.7);
font-weight: 500;
letter-spacing: 0.05em;
}
.picker-search[data-v-dd1a0aab] {
width: 100%;
}
.picker-options[data-v-dd1a0aab] {
overflow-y: auto;
max-height: 240px;
padding-right: 0.25rem;
}
.table-options[data-v-dd1a0aab] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
gap: 0.25rem;
}
.pick-row[data-v-dd1a0aab] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.3rem 0.4rem;
border-radius: 0.4rem;
cursor: pointer;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.85);
}
.pick-row[data-v-dd1a0aab]:hover {
background: rgba(255, 255, 255, 0.04);
}
.pick-row input[data-v-dd1a0aab] { transform: scale(1.05);
}
.table-row-label[data-v-dd1a0aab] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
}
.table-id[data-v-dd1a0aab] { font-weight: 600;
}
.table-pit[data-v-dd1a0aab] { font-size: 0.7rem; color: rgba(96, 165, 250, 0.85);
}
.picker-empty[data-v-dd1a0aab] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.4);
font-style: italic;
}
.validation-hint[data-v-dd1a0aab] {
margin-top: 0.75rem;
padding: 0.5rem 0.8rem;
border-radius: 0.4rem;
background: rgba(248, 113, 113, 0.1);
border: 1px solid rgba(248, 113, 113, 0.3);
color: #f87171;
font-size: 0.85rem;
}
.modal-fade-enter-active[data-v-dd1a0aab],
.modal-fade-leave-active[data-v-dd1a0aab] { transition: opacity 0.18s ease;
}
.modal-fade-enter-from[data-v-dd1a0aab],
.modal-fade-leave-to[data-v-dd1a0aab] { opacity: 0;
}
.preview-tile[data-v-c452e631] {
display: flex;
flex-direction: column;
gap: 0.4rem;
padding: 0.7rem;
text-align: left;
cursor: pointer;
transition: transform 0.15s ease, border-color 0.15s ease;
border: 1px solid rgba(255, 255, 255, 0.06);
}
.preview-tile[data-v-c452e631]:hover {
transform: translateY(-2px);
border-color: rgba(255, 215, 0, 0.4);
}
.tile-head[data-v-c452e631] {
display: flex;
justify-content: space-between;
align-items: center;
}
.tile-id[data-v-c452e631] {
font-weight: 700;
letter-spacing: 0.08em;
color: #ffd700;
}
.tile-status[data-v-c452e631] {
font-size: 0.7rem;
letter-spacing: 0.15em;
font-weight: 700;
}
.status-open[data-v-c452e631] { color: #4ade80;
}
.status-closed[data-v-c452e631] { color: #f87171;
}
.status-maintenance[data-v-c452e631] { color: #fb923c;
}
.status-private[data-v-c452e631] { color: #60a5fa;
}
.tile-meta[data-v-c452e631] {
display: flex;
justify-content: space-between;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.55);
}
.meta-pit[data-v-c452e631] { text-transform: uppercase; letter-spacing: 0.1em;
}
.tile-strip[data-v-c452e631] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.25rem;
height: 60px;
}
.strip-thumb[data-v-c452e631] {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 4px;
background: #000;
}
.strip-empty[data-v-c452e631] {
grid-column: 1 / -1;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.3);
font-style: italic;
border: 1px dashed rgba(255, 255, 255, 0.12);
border-radius: 4px;
}
.tile-footer[data-v-c452e631] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
text-align: right;
}
.count[data-v-c452e631] { font-weight: 500;
}
.preview-section[data-v-261d7281] {
margin-top: 2rem;
}
.section-head[data-v-261d7281] {
margin-bottom: 0.75rem;
}
.section-head h4[data-v-261d7281] {
margin: 0;
font-size: 1rem;
letter-spacing: 0.05em;
}
.section-hint[data-v-261d7281] {
margin: 0.25rem 0 0;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.5);
}
.preview-grid[data-v-261d7281] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.75rem;
}
.empty-state[data-v-261d7281] {
padding: 1.5rem;
text-align: center;
color: rgba(255, 255, 255, 0.45);
}
.drawer-backdrop[data-v-f1072b70] {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.55);
backdrop-filter: blur(4px);
/* Stacks above the parent MediaManagement modal-overlay (z-index: 9999 via
.animate-fade-in). Without this, the drawer renders behind it. */
z-index: 10000;
display: flex;
justify-content: flex-end;
}
.drawer-panel[data-v-f1072b70] {
width: min(480px, 92vw);
height: 100%;
background: rgba(15, 18, 30, 0.97);
border-left: 1px solid rgba(255, 215, 0, 0.18);
box-shadow: -20px 0 60px rgba(0, 0, 0, 0.6);
display: flex;
flex-direction: column;
}
.drawer-head[data-v-f1072b70] {
padding: 1.25rem 1.25rem 0.75rem;
display: flex;
justify-content: space-between;
align-items: flex-start;
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.drawer-title[data-v-f1072b70] {
margin: 0;
font-size: 1.4rem;
letter-spacing: 0.08em;
color: #ffd700;
}
.drawer-sub[data-v-f1072b70] {
margin: 0.25rem 0 0;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.55);
letter-spacing: 0.05em;
}
.btn-close[data-v-f1072b70] {
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 50%;
width: 2rem;
height: 2rem;
color: #fff;
cursor: pointer;
}
.btn-close[data-v-f1072b70]:hover {
background: rgba(248, 113, 113, 0.6);
border-color: rgba(248, 113, 113, 0.8);
}
.drawer-body[data-v-f1072b70] {
padding: 1rem 1.25rem;
flex: 1;
overflow-y: auto;
}
.drawer-count[data-v-f1072b70] {
margin: 0 0 0.75rem;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.7);
}
.resolved-list[data-v-f1072b70] {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.resolved-row[data-v-f1072b70] {
display: grid;
grid-template-columns: 80px 1fr auto;
align-items: center;
gap: 0.75rem;
padding: 0.5rem;
}
.resolved-thumb[data-v-f1072b70] {
position: relative;
width: 80px;
height: 60px;
background: #000;
border-radius: 4px;
overflow: hidden;
}
.resolved-thumb img[data-v-f1072b70],
.resolved-thumb video[data-v-f1072b70] {
width: 100%;
height: 100%;
object-fit: cover;
}
.thumb-type[data-v-f1072b70] {
position: absolute;
bottom: 2px;
left: 2px;
padding: 1px 4px;
border-radius: 3px;
font-size: 0.55rem;
font-weight: 700;
background: rgba(0, 0, 0, 0.7);
}
.type-image[data-v-f1072b70] { color: #60a5fa;
}
.type-video[data-v-f1072b70] { color: #ffd700;
}
.resolved-meta[data-v-f1072b70] {
min-width: 0;
}
.resolved-name[data-v-f1072b70] {
font-size: 0.85rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: rgba(255, 255, 255, 0.85);
}
.resolved-why[data-v-f1072b70] {
margin-top: 0.2rem;
font-size: 0.7rem;
letter-spacing: 0.08em;
color: rgba(255, 215, 0, 0.65);
text-transform: uppercase;
}
.resolved-order[data-v-f1072b70] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.4);
letter-spacing: 0.05em;
}
.resolved-empty[data-v-f1072b70] {
padding: 1.5rem 0;
text-align: center;
color: rgba(255, 255, 255, 0.45);
font-style: italic;
}
/* Simple backdrop fade. Slide animation on the panel was causing it to get
stuck off-screen (translateX 100%) due to scoped CSS not matching the
dynamically-classed Vue Transition root → panel descendant path. Fade-only is
reliable across HMR and avoids the data-v scoping edge case. */
.drawer-slide-enter-active[data-v-f1072b70],
.drawer-slide-leave-active[data-v-f1072b70] { transition: opacity 0.18s ease;
}
.drawer-slide-enter-from[data-v-f1072b70],
.drawer-slide-leave-to[data-v-f1072b70] { opacity: 0;
}
.signs-tab[data-v-cf4785e6] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.tab-header h3[data-v-cf4785e6] {
margin: 0 0 0.25rem;
font-size: 1.1rem;
letter-spacing: 0.05em;
}
.tab-header p[data-v-cf4785e6] {
margin: 0;
color: rgba(255, 255, 255, 0.6);
font-size: 0.85rem;
}
.upload-progress[data-v-cf4785e6] {
margin: 0.5rem 0;
}
.progress-bar[data-v-cf4785e6] {
width: 100%;
height: 6px;
background: rgba(255, 255, 255, 0.08);
border-radius: 3px;
overflow: hidden;
}
.progress-fill[data-v-cf4785e6] {
height: 100%;
background: linear-gradient(90deg, #ffd700, #ff8c00);
transition: width 0.15s ease;
}
.diorama-container[data-v-a3957534] {
position: relative;
width: 100%;
height: 100%;
min-height: 400px;
background: linear-gradient(135deg, #0a0a0f, #141828 40%, #0e1322 100%);
border-radius: 12px;
overflow: hidden;
}
.diorama-canvas[data-v-a3957534] {
width: 100%;
height: 100%;
display: block;
cursor: grab;
}
.diorama-canvas[data-v-a3957534]:active {
cursor: grabbing;
}
.loading-overlay[data-v-a3957534],
.error-overlay[data-v-a3957534] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: rgba(10, 10, 15, 0.9);
color: #fff;
z-index: 10;
}
.loading-spinner[data-v-a3957534] {
width: 50px;
height: 50px;
border: 4px solid rgba(255, 255, 255, 0.1);
border-left: 4px solid #00ffff;
border-radius: 50%;
animation: spin-a3957534 1s linear infinite;
margin-bottom: 1rem;
}
@keyframes spin-a3957534 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.error-overlay p[data-v-a3957534] {
color: #ff6464;
font-size: 1.2rem;
margin-bottom: 1rem;
}
.btn-retry[data-v-a3957534] {
padding: 0.75rem 1.5rem;
background: rgba(0, 255, 255, 0.2);
border: 1px solid rgba(0, 255, 255, 0.4);
border-radius: 8px;
color: #00ffff;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-retry[data-v-a3957534]:hover {
background: rgba(0, 255, 255, 0.3);
border-color: rgba(0, 255, 255, 0.6);
}
.scene-info[data-v-a3957534] {
position: absolute;
top: 10px;
right: 10px;
background: rgba(0, 0, 0, 0.7);
padding: 0.5rem 1rem;
border-radius: 8px;
font-size: 0.85rem;
color: #00ffff;
font-family: monospace;
z-index: 5;
}
.scene-info p[data-v-a3957534] {
margin: 0.25rem 0;
}
.modal-overlay[data-v-2a7db5d2] {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.8);
backdrop-filter: blur(10px);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
}
.modal-content.xlarge[data-v-2a7db5d2] {
width: 95%;
max-width: 1200px;
max-height: 90vh;
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
overflow: hidden;
display: flex;
flex-direction: column;
}
.modal-header[data-v-2a7db5d2] {
padding: 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-header h2[data-v-2a7db5d2] {
margin: 0;
}
.btn-close[data-v-2a7db5d2] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 2rem;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-close[data-v-2a7db5d2]:hover {
color: var(--neon-red);
transform: rotate(90deg);
}
.tab-nav[data-v-2a7db5d2] {
display: flex;
gap: 0.5rem;
padding: 1rem 2rem 0 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.2);
}
.tab-button[data-v-2a7db5d2] {
padding: 1rem 1.5rem;
background: transparent;
border: none;
border-bottom: 3px solid transparent;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1rem;
}
.tab-button[data-v-2a7db5d2]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.05);
}
.tab-button.active[data-v-2a7db5d2] {
color: var(--neon-cyan);
border-bottom-color: var(--neon-cyan);
background: rgba(0, 255, 255, 0.05);
}
.tab-icon[data-v-2a7db5d2] {
font-size: 1.2rem;
}
.modal-body[data-v-2a7db5d2] {
flex: 1;
overflow-y: auto;
padding: 2rem;
}
.tab-content[data-v-2a7db5d2] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.tab-header[data-v-2a7db5d2] {
margin-bottom: 1rem;
}
.tab-header h3[data-v-2a7db5d2] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.tab-header p[data-v-2a7db5d2] {
margin: 0;
color: var(--text-secondary);
}
/* Upload Section */
.upload-section[data-v-2a7db5d2] {
padding: 1.5rem;
}
.upload-section h4[data-v-2a7db5d2] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.upload-area[data-v-2a7db5d2] {
border: 2px dashed rgba(255, 255, 255, 0.2);
border-radius: 12px;
padding: 3rem;
text-align: center;
transition: all 0.3s ease;
cursor: pointer;
}
.upload-area[data-v-2a7db5d2]:hover,
.upload-area.drag-over[data-v-2a7db5d2] {
border-color: var(--neon-cyan);
background: rgba(0, 255, 255, 0.05);
}
.upload-icon[data-v-2a7db5d2] {
font-size: 3rem;
display: block;
margin-bottom: 1rem;
}
.upload-prompt p[data-v-2a7db5d2] {
margin: 0.5rem 0;
color: var(--text-secondary);
}
.btn-link[data-v-2a7db5d2] {
background: none;
border: none;
color: var(--neon-cyan);
cursor: pointer;
text-decoration: underline;
}
.upload-hint[data-v-2a7db5d2] {
font-size: 0.85rem;
opacity: 0.7;
}
.upload-progress[data-v-2a7db5d2] {
margin-top: 1rem;
}
.progress-bar[data-v-2a7db5d2] {
width: 100%;
height: 8px;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
overflow: hidden;
margin-bottom: 0.5rem;
}
.progress-fill[data-v-2a7db5d2] {
height: 100%;
background: linear-gradient(90deg, var(--neon-cyan), var(--neon-magenta));
transition: width 0.3s ease;
}
/* Images Grid */
.images-grid[data-v-2a7db5d2] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 1.5rem;
}
.empty-state[data-v-2a7db5d2] {
grid-column: 1 / -1;
text-align: center;
padding: 3rem;
color: var(--text-secondary);
}
.empty-icon[data-v-2a7db5d2] {
font-size: 4rem;
display: block;
margin-bottom: 1rem;
opacity: 0.5;
}
.empty-hint[data-v-2a7db5d2] {
font-size: 0.9rem;
opacity: 0.7;
}
.image-card[data-v-2a7db5d2] {
padding: 0;
overflow: hidden;
transition: all 0.3s ease;
}
.image-card.inactive[data-v-2a7db5d2] {
opacity: 0.5;
}
.image-preview[data-v-2a7db5d2] {
position: relative;
aspect-ratio: 16 / 9;
overflow: hidden;
}
.image-preview img[data-v-2a7db5d2] {
width: 100%;
height: 100%;
object-fit: cover;
}
.image-overlay[data-v-2a7db5d2] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
opacity: 0;
transition: opacity 0.3s ease;
}
.image-card:hover .image-overlay[data-v-2a7db5d2] {
opacity: 1;
}
.btn-icon-small[data-v-2a7db5d2] {
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: white;
cursor: pointer;
font-size: 1.2rem;
transition: all 0.3s ease;
}
.btn-icon-small[data-v-2a7db5d2]:hover {
background: rgba(255, 255, 255, 0.2);
transform: scale(1.1);
}
.btn-icon-small.btn-danger[data-v-2a7db5d2]:hover {
background: rgba(255, 100, 100, 0.3);
border-color: rgba(255, 100, 100, 0.5);
}
.image-info[data-v-2a7db5d2] {
padding: 1rem;
}
.image-meta[data-v-2a7db5d2] {
display: flex;
justify-content: space-between;
margin-bottom: 0.75rem;
font-size: 0.85rem;
color: var(--text-secondary);
}
.image-controls[data-v-2a7db5d2] {
display: flex;
gap: 0.5rem;
align-items: center;
}
.btn-small[data-v-2a7db5d2] {
padding: 0.4rem 0.8rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-2a7db5d2]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
}
.btn-small[data-v-2a7db5d2]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.duration-input[data-v-2a7db5d2] {
flex: 1;
padding: 0.4rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
color: var(--text-primary);
text-align: center;
width: 80px;
}
/* Games Grid */
.games-grid[data-v-2a7db5d2] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 1.5rem;
}
.game-card[data-v-2a7db5d2] {
padding: 0;
overflow: hidden;
transition: all 0.3s ease;
}
.game-card.disabled[data-v-2a7db5d2] {
opacity: 0.6;
}
.game-thumbnail[data-v-2a7db5d2] {
position: relative;
aspect-ratio: 16 / 9;
background: linear-gradient(135deg, #1a1a2e, #2a2a3e);
display: flex;
align-items: center;
justify-content: center;
}
.game-thumbnail img[data-v-2a7db5d2] {
width: 100%;
height: 100%;
object-fit: cover;
}
.game-badge[data-v-2a7db5d2] {
position: absolute;
top: 0.75rem;
right: 0.75rem;
padding: 0.4rem 0.8rem;
background: rgba(255, 100, 100, 0.3);
border: 1px solid rgba(255, 100, 100, 0.5);
border-radius: 6px;
font-size: 0.75rem;
font-weight: 600;
color: #ff6464;
}
.game-badge.active[data-v-2a7db5d2] {
background: rgba(0, 255, 136, 0.3);
border-color: rgba(0, 255, 136, 0.5);
color: #00ff88;
}
.game-info[data-v-2a7db5d2] {
padding: 1rem;
}
.game-info h4[data-v-2a7db5d2] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.game-info p[data-v-2a7db5d2] {
margin: 0 0 0.75rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.game-stats[data-v-2a7db5d2] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
color: var(--text-secondary);
}
.game-controls[data-v-2a7db5d2] {
padding: 0 1rem 1rem 1rem;
display: flex;
gap: 0.75rem;
}
.game-controls .btn-glass[data-v-2a7db5d2] {
flex: 1;
}
/* 3D Scene Settings */
.scene-preview-container[data-v-2a7db5d2] {
padding: 1.5rem;
margin-bottom: 1.5rem;
}
.scene-preview-container h4[data-v-2a7db5d2] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.scene-preview[data-v-2a7db5d2] {
height: 400px;
border-radius: 12px;
overflow: hidden;
}
.settings-group[data-v-2a7db5d2] {
padding: 1.5rem;
}
.settings-group h4[data-v-2a7db5d2] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.settings-row[data-v-2a7db5d2] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1.5rem;
}
.setting-item[data-v-2a7db5d2] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.setting-item label[data-v-2a7db5d2] {
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.slider[data-v-2a7db5d2] {
width: 100%;
height: 6px;
background: rgba(255, 255, 255, 0.1);
border-radius: 3px;
outline: none;
-webkit-appearance: none;
appearance: none;
}
.slider[data-v-2a7db5d2]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 18px;
height: 18px;
background: var(--neon-cyan);
border-radius: 50%;
cursor: pointer;
}
.slider-value[data-v-2a7db5d2] {
color: var(--neon-cyan);
font-weight: 600;
font-size: 0.9rem;
}
.btn-toggle[data-v-2a7db5d2] {
padding: 0.5rem 1rem;
background: rgba(255, 100, 100, 0.2);
border: 1px solid rgba(255, 100, 100, 0.4);
border-radius: 8px;
color: #ff6464;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
}
.btn-toggle.active[data-v-2a7db5d2] {
background: rgba(0, 255, 136, 0.2);
border-color: rgba(0, 255, 136, 0.4);
color: #00ff88;
}
.input-glass[data-v-2a7db5d2] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
width: 100%;
}
.setting-hint[data-v-2a7db5d2] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.7;
margin: 0;
}
.checkbox-label[data-v-2a7db5d2] {
display: flex;
align-items: center;
gap: 0.75rem;
cursor: pointer;
color: var(--text-primary);
}
.checkbox-label input[type="checkbox"][data-v-2a7db5d2] {
width: 20px;
height: 20px;
cursor: pointer;
}
/* Display Mode Selector */
.mode-selector[data-v-2a7db5d2] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.mode-button[data-v-2a7db5d2] {
padding: 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
text-align: center;
}
.mode-button[data-v-2a7db5d2]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.2);
}
.mode-button.active[data-v-2a7db5d2] {
background: rgba(0, 255, 255, 0.1);
border-color: var(--neon-cyan);
}
.mode-icon[data-v-2a7db5d2] {
font-size: 2rem;
display: block;
margin-bottom: 0.5rem;
}
.mode-label[data-v-2a7db5d2] {
display: block;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.5rem;
}
.mode-desc[data-v-2a7db5d2] {
font-size: 0.85rem;
color: var(--text-secondary);
margin: 0;
}
/* Actions */
.actions-row[data-v-2a7db5d2] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 1.5rem;
}
.btn-glass[data-v-2a7db5d2] {
padding: 0.75rem 1.5rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-glass[data-v-2a7db5d2]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
border-color: var(--neon-cyan);
}
.btn-glass[data-v-2a7db5d2]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.btn-neon[data-v-2a7db5d2] {
padding: 0.75rem 1.5rem;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: 600;
transition: all 0.3s ease;
}
.btn-success[data-v-2a7db5d2] {
background: linear-gradient(135deg, #00ff88, #00cc6a);
color: #000;
}
.btn-success[data-v-2a7db5d2]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 255, 136, 0.3);
}
.btn-info[data-v-2a7db5d2] {
background: linear-gradient(135deg, #00ffff, #00cccc);
color: #000;
}
.btn-warning[data-v-2a7db5d2] {
background: linear-gradient(135deg, #ffaa00, #ff8800);
color: #000;
}
.card-glass[data-v-2a7db5d2] {
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
}
/* Device URL List */
.url-list[data-v-2a7db5d2] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.url-item[data-v-2a7db5d2] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
gap: 1rem;
}
.url-info[data-v-2a7db5d2] {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.url-info strong[data-v-2a7db5d2] {
color: var(--text-primary);
font-size: 0.95rem;
}
.url-desc[data-v-2a7db5d2] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.url-code[data-v-2a7db5d2] {
padding: 0.5rem 1rem;
background: rgba(0, 255, 136, 0.1);
border: 1px solid rgba(0, 255, 136, 0.3);
border-radius: 6px;
font-family: 'Courier New', monospace;
font-size: 0.9rem;
color: #00ff88;
white-space: nowrap;
user-select: all;
cursor: pointer;
transition: all 0.2s ease;
}
.url-code[data-v-2a7db5d2]:hover {
background: rgba(0, 255, 136, 0.2);
border-color: rgba(0, 255, 136, 0.5);
}
.url-section-header[data-v-2a7db5d2] {
font-size: 0.85rem;
font-weight: 700;
color: rgba(255, 215, 0, 0.8);
text-transform: uppercase;
letter-spacing: 0.05em;
margin-top: 0.75rem;
padding-bottom: 0.25rem;
border-bottom: 1px solid rgba(255, 215, 0, 0.15);
}
.url-hint[data-v-2a7db5d2] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.4);
margin: 0.25rem 0 0.5rem;
line-height: 1.4;
}
.url-hint code[data-v-2a7db5d2] {
background: rgba(255, 255, 255, 0.08);
padding: 0.1rem 0.35rem;
border-radius: 3px;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
}
.text-gradient[data-v-2a7db5d2] {
background: linear-gradient(135deg, #00ffff, #ff00ff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
/* Animations */
.animate-fade-in[data-v-2a7db5d2] {
animation: fadeIn-2a7db5d2 0.3s ease-out;
}
.animate-scale-in[data-v-2a7db5d2] {
animation: scaleIn-2a7db5d2 0.3s ease-out;
}
@keyframes fadeIn-2a7db5d2 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-2a7db5d2 {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* ── Kiosk tab styles ── */
.spinner-weights-grid[data-v-2a7db5d2] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 0.75rem;
}
.weight-item[data-v-2a7db5d2] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.5rem 0;
}
.weight-label[data-v-2a7db5d2] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.8);
}
.weight-color[data-v-2a7db5d2] {
width: 14px;
height: 14px;
border-radius: 4px;
flex-shrink: 0;
}
.input-small[data-v-2a7db5d2] {
width: 70px !important;
text-align: center;
}
.activity-summary[data-v-2a7db5d2] {
display: flex;
gap: 1.5rem;
margin-bottom: 1rem;
flex-wrap: wrap;
}
.summary-stat[data-v-2a7db5d2] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
padding: 0.75rem 1.5rem;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
min-width: 100px;
}
.stat-value[data-v-2a7db5d2] {
font-size: 1.5rem;
font-weight: 800;
color: #ffd700;
}
.stat-label[data-v-2a7db5d2] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.activity-table-wrap[data-v-2a7db5d2] {
max-height: 300px;
overflow-y: auto;
}
.activity-table[data-v-2a7db5d2] {
width: 100%;
border-collapse: collapse;
font-size: 0.85rem;
}
.activity-table th[data-v-2a7db5d2] {
text-align: left;
padding: 0.5rem 0.75rem;
color: rgba(255, 255, 255, 0.5);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
font-weight: 600;
text-transform: uppercase;
font-size: 0.7rem;
letter-spacing: 0.05em;
}
.activity-table td[data-v-2a7db5d2] {
padding: 0.5rem 0.75rem;
color: rgba(255, 255, 255, 0.7);
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.badge-checkin[data-v-2a7db5d2],
.badge-spin[data-v-2a7db5d2],
.badge-print[data-v-2a7db5d2] {
display: inline-block;
padding: 0.15rem 0.5rem;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 600;
margin-right: 0.25rem;
}
.badge-checkin[data-v-2a7db5d2] {
background: rgba(59, 130, 246, 0.12);
color: #60a5fa;
border: 1px solid rgba(59, 130, 246, 0.3);
}
.badge-spin[data-v-2a7db5d2] {
background: rgba(255, 215, 0, 0.15);
color: #ffd700;
border: 1px solid rgba(255, 215, 0, 0.3);
}
.badge-print[data-v-2a7db5d2] {
background: rgba(57, 255, 20, 0.1);
color: #39ff14;
border: 1px solid rgba(57, 255, 20, 0.25);
}
.empty-state-small[data-v-2a7db5d2] {
text-align: center;
padding: 1.5rem;
color: rgba(255, 255, 255, 0.4);
font-size: 0.9rem;
}
.loading-inline[data-v-2a7db5d2] {
text-align: center;
padding: 1rem;
color: rgba(255, 255, 255, 0.4);
font-size: 0.9rem;
}
.neon-magenta[data-v-bd7120de] {
color: #ff00ff;
text-shadow: 0 0 12px rgba(255, 0, 255, 0.45);
}
.pull-tab-manager-modal[data-v-8024f1ac] {
max-width: 700px;
max-height: 90vh;
overflow-y: auto;
}
.modal-body[data-v-8024f1ac] {
padding: 2rem;
}
.loading-state[data-v-8024f1ac] {
text-align: center;
padding: 3rem;
color: rgba(255, 255, 255, 0.6);
}
.config-section[data-v-8024f1ac] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.control-group[data-v-8024f1ac] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.control-label[data-v-8024f1ac] {
display: flex;
justify-content: space-between;
align-items: center;
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
}
.control-label strong[data-v-8024f1ac] {
color: #00d4ff;
font-size: 1.1rem;
}
.toggle-label[data-v-8024f1ac] {
display: flex;
align-items: center;
gap: 1rem;
cursor: pointer;
}
.toggle-checkbox[data-v-8024f1ac] {
display: none;
}
.toggle-slider[data-v-8024f1ac] {
position: relative;
width: 60px;
height: 30px;
background: rgba(255, 255, 255, 0.1);
border-radius: 15px;
transition: background 0.3s ease;
}
.toggle-slider[data-v-8024f1ac]::after {
content: '';
position: absolute;
top: 3px;
left: 3px;
width: 24px;
height: 24px;
background: white;
border-radius: 50%;
transition: transform 0.3s ease;
}
.toggle-checkbox:checked+.toggle-slider[data-v-8024f1ac] {
background: #00d4ff;
}
.toggle-checkbox:checked+.toggle-slider[data-v-8024f1ac]::after {
transform: translateX(30px);
}
.toggle-text[data-v-8024f1ac] {
font-size: 1.1rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
}
.slider[data-v-8024f1ac] {
width: 100%;
height: 6px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.1);
outline: none;
appearance: none;
-webkit-appearance: none;
}
.slider[data-v-8024f1ac]::-webkit-slider-thumb {
appearance: none;
-webkit-appearance: none;
width: 20px;
height: 20px;
border-radius: 50%;
background: #00d4ff;
cursor: pointer;
box-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
}
.slider[data-v-8024f1ac]::-moz-range-thumb {
width: 20px;
height: 20px;
border-radius: 50%;
background: #00d4ff;
cursor: pointer;
border: none;
box-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
}
.slider-labels[data-v-8024f1ac] {
display: flex;
justify-content: space-between;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
}
.locations-section[data-v-8024f1ac] {
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.locations-section h3[data-v-8024f1ac] {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 1rem;
}
.add-location[data-v-8024f1ac] {
display: flex;
gap: 0.75rem;
margin-bottom: 1rem;
align-items: center;
}
.location-name-input[data-v-8024f1ac] {
flex: 1;
}
.seat-count-input[data-v-8024f1ac] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.seat-count-input label[data-v-8024f1ac] {
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
}
.seat-count-input input[data-v-8024f1ac] {
width: 60px;
text-align: center;
}
.locations-list[data-v-8024f1ac] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.location-item[data-v-8024f1ac] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.location-info[data-v-8024f1ac] {
display: flex;
align-items: center;
gap: 1rem;
}
.location-name[data-v-8024f1ac] {
font-weight: 500;
color: rgba(255, 255, 255, 0.9);
}
.location-seats[data-v-8024f1ac] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
background: rgba(255, 255, 255, 0.1);
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.location-actions[data-v-8024f1ac] {
display: flex;
gap: 0.5rem;
}
.active-btn[data-v-8024f1ac] {
border: 1px solid rgba(0, 255, 136, 0.5);
color: #00ff88;
}
.inactive-btn[data-v-8024f1ac] {
border: 1px solid rgba(255, 255, 255, 0.3);
color: rgba(255, 255, 255, 0.5);
}
.remove-btn[data-v-8024f1ac] {
border: 1px solid rgba(255, 0, 0, 0.5);
color: #ff4444;
padding: 0.5rem 0.75rem;
}
.formula-preview[data-v-8024f1ac] {
padding: 1.5rem;
background: rgba(0, 212, 255, 0.1);
border: 1px solid rgba(0, 212, 255, 0.3);
border-radius: 8px;
}
.formula-preview h4[data-v-8024f1ac] {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 1rem;
}
.formula-calc[data-v-8024f1ac] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.calc-step[data-v-8024f1ac] {
color: rgba(255, 255, 255, 0.7);
font-family: 'Courier New', monospace;
}
.calc-step strong[data-v-8024f1ac] {
color: #00d4ff;
}
.neon-green[data-v-8024f1ac] {
color: #00ff88;
}
.neon-gold[data-v-875ba001] {
color: #ffd700;
}
.admin-status-pill.status-active[data-v-875ba001] {
color: var(--neon-green);
border-color: rgba(0, 255, 150, 0.4);
background: rgba(0, 255, 150, 0.08);
}
.admin-status-pill.status-inactive[data-v-875ba001] {
color: var(--text-secondary);
border-color: rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.04);
}
.admin-status-pill.loading[data-v-875ba001] {
color: var(--text-secondary);
border-color: rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
}
.neon-race[data-v-feef1ce7] {
color: #ff6b35;
}
.admin-status-pill.status-active[data-v-feef1ce7] {
color: var(--neon-green);
border-color: rgba(0, 255, 150, 0.4);
background: rgba(0, 255, 150, 0.08);
}
.admin-status-pill.status-pending[data-v-feef1ce7] {
color: #ffaa00;
border-color: rgba(255, 170, 0, 0.4);
background: rgba(255, 170, 0, 0.08);
}
.admin-status-pill.status-inactive[data-v-feef1ce7] {
color: var(--text-secondary);
border-color: rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.04);
}
.admin-status-pill.loading[data-v-feef1ce7] {
color: var(--text-secondary);
border-color: rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
}
.hh-card[data-v-6dd75679] { cursor: pointer; transition: transform 0.15s, box-shadow 0.15s;
}
.hh-card[data-v-6dd75679]:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(247, 220, 111, 0.2);
}
.neon-gold[data-v-6dd75679] { color: gold; text-shadow: 0 0 12px rgba(255, 215, 0, 0.5); font-size: 2.2rem;
}
.leader-preview[data-v-6dd75679] { color: gold; font-weight: 600;
}
.no-leader[data-v-6dd75679] { font-style: italic; opacity: 0.6;
}
.animate-fade-in[data-v-974b0b3e] {
animation: fadeIn-974b0b3e 0.3s ease-out;
}
.animate-scale-in[data-v-974b0b3e] {
animation: scaleIn-974b0b3e 0.3s ease-out;
}
@keyframes fadeIn-974b0b3e {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-974b0b3e {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-content.large[data-v-974b0b3e] {
max-width: 1000px;
}
.btn-close[data-v-974b0b3e] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-974b0b3e]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
/* Settings Sections */
.settings-section[data-v-974b0b3e] {
margin-bottom: 2rem;
}
.settings-section h3[data-v-974b0b3e] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.2rem;
}
.section-description[data-v-974b0b3e] {
color: var(--text-secondary, rgba(255, 255, 255, 0.55));
font-size: 0.85rem;
margin-bottom: 1rem;
}
.setting-item[data-v-974b0b3e] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.setting-item label[data-v-974b0b3e] {
color: var(--text-primary);
font-weight: 500;
}
.setting-control[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 1rem;
}
/* Comp Settings */
.comp-settings-grid[data-v-974b0b3e] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1rem;
}
.comp-group[data-v-974b0b3e] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.06);
border-radius: 10px;
padding: 1rem;
}
.comp-group label[data-v-974b0b3e] {
color: var(--text-primary);
display: block;
margin-bottom: 0.5rem;
}
.chips-input[data-v-974b0b3e] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.input-glass.small[data-v-974b0b3e] {
width: 80px;
}
/* Reasons */
.reasons-list[data-v-974b0b3e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.reason-item[data-v-974b0b3e] {
display: flex;
gap: 0.5rem;
align-items: center;
}
.reason-add[data-v-974b0b3e] {
display: flex;
gap: 0.5rem;
align-items: center;
margin-top: 0.5rem;
}
/* Tier Config Grid */
.tier-config-grid[data-v-974b0b3e] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
gap: 0.6rem;
margin-bottom: 1rem;
}
.tier-config-card[data-v-974b0b3e] {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 0.75rem;
transition: border-color 0.2s, transform 0.15s;
}
.tier-config-card[data-v-974b0b3e]:hover {
border-color: rgba(255, 255, 255, 0.18);
transform: translateY(-1px);
}
.tier-card-1[data-v-974b0b3e]:hover, .tier-card-2[data-v-974b0b3e]:hover { border-color: rgba(0, 200, 255, 0.35);
}
.tier-card-3[data-v-974b0b3e]:hover, .tier-card-4[data-v-974b0b3e]:hover { border-color: rgba(180, 140, 255, 0.35);
}
.tier-card-5[data-v-974b0b3e]:hover, .tier-card-6[data-v-974b0b3e]:hover { border-color: rgba(255, 200, 0, 0.35);
}
.tier-card-7[data-v-974b0b3e]:hover, .tier-card-8[data-v-974b0b3e]:hover { border-color: rgba(200, 200, 200, 0.25);
}
.tier-card-9[data-v-974b0b3e]:hover, .tier-card-10[data-v-974b0b3e]:hover { border-color: rgba(205, 127, 50, 0.35);
}
.tier-config-header[data-v-974b0b3e] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.6rem;
}
.tier-config-badge[data-v-974b0b3e] {
font-size: 0.72rem;
font-weight: 600;
padding: 0.2rem 0.55rem;
border-radius: 6px;
letter-spacing: 0.02em;
}
.tier-config-number[data-v-974b0b3e] {
font-size: 0.7rem;
font-weight: 500;
color: rgba(255, 255, 255, 0.35);
font-variant-numeric: tabular-nums;
}
.tier-config-badge.tier-1[data-v-974b0b3e], .tier-config-badge.tier-2[data-v-974b0b3e] { background: rgba(0, 200, 255, 0.15); color: #00c8ff;
}
.tier-config-badge.tier-3[data-v-974b0b3e], .tier-config-badge.tier-4[data-v-974b0b3e] { background: rgba(180, 140, 255, 0.15); color: #b48cff;
}
.tier-config-badge.tier-5[data-v-974b0b3e], .tier-config-badge.tier-6[data-v-974b0b3e] { background: rgba(255, 200, 0, 0.15); color: #ffc800;
}
.tier-config-badge.tier-7[data-v-974b0b3e], .tier-config-badge.tier-8[data-v-974b0b3e] { background: rgba(200, 200, 200, 0.12); color: #c8c8c8;
}
.tier-config-badge.tier-9[data-v-974b0b3e], .tier-config-badge.tier-10[data-v-974b0b3e] { background: rgba(205, 127, 50, 0.15); color: #cd7f32;
}
.tier-stepper[data-v-974b0b3e] {
display: flex;
align-items: stretch;
border-radius: 8px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.3);
height: 38px;
}
.stepper-btn[data-v-974b0b3e] {
display: flex;
align-items: center;
justify-content: center;
width: 34px;
border: none;
background: rgba(255, 255, 255, 0.07);
color: rgba(255, 255, 255, 0.6);
font-size: 1.15rem;
font-weight: 700;
cursor: pointer;
transition: background 0.15s, color 0.15s;
flex-shrink: 0;
user-select: none;
line-height: 1;
padding: 0;
}
.stepper-btn[data-v-974b0b3e]:hover { background: rgba(255, 255, 255, 0.14); color: #fff;
}
.stepper-btn[data-v-974b0b3e]:active { background: rgba(255, 255, 255, 0.22); transform: scale(0.95);
}
.stepper-minus[data-v-974b0b3e] { border-right: 1px solid rgba(255, 255, 255, 0.08); border-radius: 8px 0 0 8px;
}
.stepper-plus[data-v-974b0b3e] { border-left: 1px solid rgba(255, 255, 255, 0.08); border-radius: 0 8px 8px 0;
}
.tier-card-1 .stepper-btn[data-v-974b0b3e]:hover, .tier-card-2 .stepper-btn[data-v-974b0b3e]:hover { background: rgba(0, 200, 255, 0.18); color: #00c8ff;
}
.tier-card-3 .stepper-btn[data-v-974b0b3e]:hover, .tier-card-4 .stepper-btn[data-v-974b0b3e]:hover { background: rgba(180, 140, 255, 0.18); color: #b48cff;
}
.tier-card-5 .stepper-btn[data-v-974b0b3e]:hover, .tier-card-6 .stepper-btn[data-v-974b0b3e]:hover { background: rgba(255, 200, 0, 0.18); color: #ffc800;
}
.tier-card-7 .stepper-btn[data-v-974b0b3e]:hover, .tier-card-8 .stepper-btn[data-v-974b0b3e]:hover { background: rgba(200, 200, 200, 0.14); color: #e0e0e0;
}
.tier-card-9 .stepper-btn[data-v-974b0b3e]:hover, .tier-card-10 .stepper-btn[data-v-974b0b3e]:hover { background: rgba(205, 127, 50, 0.18); color: #cd7f32;
}
.stepper-value[data-v-974b0b3e] {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
gap: 2px;
padding: 0 6px;
min-width: 0;
}
.stepper-dollar[data-v-974b0b3e] {
color: rgba(255, 255, 255, 0.35);
font-weight: 600;
font-size: 0.85rem;
flex-shrink: 0;
}
.stepper-value input[type="number"][data-v-974b0b3e] {
background: transparent;
border: none;
outline: none;
color: #fff;
font-size: 1rem;
font-weight: 600;
font-variant-numeric: tabular-nums;
width: 100%;
text-align: center;
padding: 0;
-moz-appearance: textfield;
appearance: textfield;
}
.stepper-value input[type="number"][data-v-974b0b3e]::-webkit-outer-spin-button,
.stepper-value input[type="number"][data-v-974b0b3e]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.tier-cap-warning[data-v-974b0b3e] {
color: #f5a623;
font-size: 0.7rem;
margin-top: 0.35rem;
}
.squash-option[data-v-974b0b3e] { margin-bottom: 1rem;
}
.squash-checkbox[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-primary);
cursor: pointer;
font-size: 0.9rem;
}
.squash-checkbox input[type="checkbox"][data-v-974b0b3e] { accent-color: #f5a623;
}
.squash-warning[data-v-974b0b3e] {
color: #f5a623;
font-size: 0.8rem;
margin-top: 0.5rem;
padding: 0.5rem 0.75rem;
background: rgba(245, 166, 35, 0.1);
border: 1px solid rgba(245, 166, 35, 0.25);
border-radius: 8px;
}
.tier-config-actions[data-v-974b0b3e] { display: flex; justify-content: flex-end;
}
/* Tier Auto Toggle */
.tier-auto-toggle[data-v-974b0b3e] {
display: flex;
flex-direction: column;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.btn-toggle[data-v-974b0b3e] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.active[data-v-974b0b3e] {
background: var(--neon-green);
color: var(--bg-primary);
border-color: var(--neon-green);
}
.btn-toggle.deactivate[data-v-974b0b3e] {
border-color: var(--neon-red);
color: var(--neon-red);
}
.tier-last-run[data-v-974b0b3e] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem;
}
.tier-meta-label[data-v-974b0b3e] { color: var(--text-secondary);
}
.tier-meta-value[data-v-974b0b3e] { color: var(--neon-blue); font-weight: 600;
}
.tier-stats-summary[data-v-974b0b3e] { display: flex; gap: 1.5rem; flex-wrap: wrap;
}
.tier-stat-item[data-v-974b0b3e] { display: flex; align-items: center; gap: 0.5rem;
}
.tier-stat-label[data-v-974b0b3e] { color: var(--text-secondary); font-size: 0.85rem;
}
.tier-stat-value[data-v-974b0b3e] { color: var(--neon-green); font-weight: 700; font-size: 1rem;
}
/* Guided Tier Management */
.tier-guided-controls[data-v-974b0b3e] {
display: flex;
gap: 1rem;
align-items: flex-end;
margin-bottom: 1.5rem;
}
.period-selector[data-v-974b0b3e] { display: flex; flex-direction: column; gap: 0.5rem; flex: 1;
}
.period-selector label[data-v-974b0b3e] { font-size: 0.85rem; color: var(--text-secondary);
}
.candidates-summary[data-v-974b0b3e] {
display: flex;
gap: 2rem;
margin-bottom: 1rem;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.summary-stat[data-v-974b0b3e] { font-size: 0.9rem; color: var(--text-secondary);
}
.summary-stat strong[data-v-974b0b3e] { color: var(--neon-blue); font-weight: 700;
}
.tier-candidates-section[data-v-974b0b3e] { margin-top: 1rem;
}
.tier-candidates-table[data-v-974b0b3e] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
overflow: hidden;
margin-bottom: 1rem;
}
.tier-candidates-table .table-header[data-v-974b0b3e] {
display: grid;
grid-template-columns: 40px 2fr 80px 90px 85px 1fr 80px;
gap: 0.75rem;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.05);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
font-size: 0.85rem;
font-weight: 600;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.tier-candidates-table .table-header .table-cell.sortable[data-v-974b0b3e] {
cursor: pointer;
user-select: none;
transition: all 0.2s ease;
position: relative;
padding-right: 1.2rem;
}
.tier-candidates-table .table-header .table-cell.sortable[data-v-974b0b3e]:hover {
color: var(--neon-blue);
transform: translateY(-1px);
}
.sort-indicator[data-v-974b0b3e] {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
color: var(--neon-green);
font-size: 0.7rem;
font-weight: 700;
}
.tier-candidates-table .table-row[data-v-974b0b3e] {
display: grid;
grid-template-columns: 40px 2fr 80px 90px 85px 1fr 80px;
gap: 0.75rem;
padding: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
align-items: center;
transition: background 0.2s ease;
}
.tier-candidates-table .table-row[data-v-974b0b3e]:hover { background: rgba(255, 255, 255, 0.03);
}
.tier-candidates-table .table-row.tier-change[data-v-974b0b3e] { border-left: 3px solid var(--neon-orange);
}
.tier-candidates-table .table-row.expanded[data-v-974b0b3e] { background: rgba(255, 255, 255, 0.05); border-bottom: none;
}
.tier-candidates-table .table-cell[data-v-974b0b3e] { display: flex; align-items: center;
}
.btn-icon[data-v-974b0b3e] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 0.4rem 0.7rem;
font-size: 0.75rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.2s ease;
}
.btn-icon[data-v-974b0b3e]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.tier-details-panel[data-v-974b0b3e] {
background: rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.1);
border-top: none;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
padding: 1.5rem;
animation: slideDown-974b0b3e 0.3s ease-out;
}
@keyframes slideDown-974b0b3e {
from { opacity: 0; max-height: 0; padding-top: 0; padding-bottom: 0;
}
to { opacity: 1; max-height: 800px; padding-top: 1.5rem; padding-bottom: 1.5rem;
}
}
.details-grid[data-v-974b0b3e] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1.5rem;
}
.detail-section[data-v-974b0b3e] {
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.05);
border-radius: 8px;
padding: 1rem;
}
.detail-section.full-width[data-v-974b0b3e] { grid-column: 1 / -1;
}
.detail-section h4[data-v-974b0b3e] {
font-size: 0.9rem;
font-weight: 600;
color: var(--neon-blue);
margin-bottom: 0.75rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.metric-row[data-v-974b0b3e] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}
.metric-row[data-v-974b0b3e]:last-child { border-bottom: none;
}
.metric-row.metric-total[data-v-974b0b3e] {
margin-top: 0.5rem;
padding-top: 0.75rem;
border-top: 2px solid rgba(255, 255, 255, 0.1);
font-weight: 600;
}
.metric-label[data-v-974b0b3e] { font-size: 0.85rem; color: var(--text-secondary);
}
.metric-value[data-v-974b0b3e] { font-size: 0.9rem; color: var(--text-primary); font-weight: 500;
}
.metric-value.highlight[data-v-974b0b3e] { color: var(--neon-green); font-size: 1.1rem; font-weight: 700;
}
.supervisor-explanation[data-v-974b0b3e] {
font-size: 0.9rem;
line-height: 1.6;
color: var(--text-primary);
background: rgba(255, 255, 255, 0.03);
padding: 1rem;
border-radius: 6px;
border-left: 3px solid var(--neon-purple);
}
.tier-badge[data-v-974b0b3e] {
display: inline-flex;
align-items: center;
padding: 0.35rem 0.75rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
white-space: nowrap;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.12);
}
.tier-badge.tier-tier-1[data-v-974b0b3e] { background: rgba(255, 215, 0, 0.15); border-color: rgba(255, 215, 0, 0.4); color: #ffd700;
}
.tier-badge.tier-tier-2[data-v-974b0b3e] { background: rgba(192, 192, 192, 0.15); border-color: rgba(192, 192, 192, 0.4); color: #c0c0c0;
}
.tier-badge.tier-tier-3[data-v-974b0b3e] { background: rgba(205, 127, 50, 0.15); border-color: rgba(205, 127, 50, 0.4); color: #cd7f32;
}
.tier-arrow[data-v-974b0b3e] { margin-left: 0.5rem; font-size: 1.2rem; font-weight: 700;
}
.tier-arrow.upgrade[data-v-974b0b3e] { color: var(--neon-green);
}
.tier-arrow.downgrade[data-v-974b0b3e] { color: var(--neon-red);
}
.match-play-cell[data-v-974b0b3e] { display: flex; align-items: center; justify-content: space-between;
}
.match-play-display[data-v-974b0b3e] { display: flex; flex-direction: column; gap: 0.25rem;
}
.status-icons[data-v-974b0b3e] { display: flex; align-items: center; gap: 0.25rem; flex-shrink: 0;
}
.match-play-change[data-v-974b0b3e] { font-size: 0.75rem; font-weight: 600;
}
.match-play-change.positive[data-v-974b0b3e] { color: var(--neon-green);
}
.match-play-change.negative[data-v-974b0b3e] { color: var(--neon-red);
}
.status-icon[data-v-974b0b3e] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.4rem;
height: 1.4rem;
font-size: 0.75rem;
border-radius: 50%;
cursor: help;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.status-icon[data-v-974b0b3e]:hover { transform: scale(1.3);
}
.status-icon.override-icon[data-v-974b0b3e] { background: rgba(251, 191, 36, 0.15); box-shadow: 0 0 6px rgba(251, 191, 36, 0.3);
}
.status-icon.lock-icon[data-v-974b0b3e] { background: rgba(248, 113, 113, 0.15); box-shadow: 0 0 6px rgba(248, 113, 113, 0.3);
}
.override-callout[data-v-974b0b3e] {
padding: 0.5rem 0.75rem;
margin-bottom: 0.5rem;
font-size: 0.8rem;
color: #fbbf24;
background: rgba(251, 191, 36, 0.1);
border: 1px solid rgba(251, 191, 36, 0.25);
border-radius: 6px;
line-height: 1.4;
}
.override-clear-warning[data-v-974b0b3e] { color: var(--neon-red, #f87171);
}
.tier-actions[data-v-974b0b3e] {
display: flex;
gap: 1rem;
justify-content: flex-end;
align-items: center;
margin-top: 1rem;
flex-wrap: wrap;
}
.override-checkbox[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 1rem;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.3);
border-radius: 8px;
cursor: pointer;
font-size: 0.85rem;
color: #ffa500;
transition: all 0.2s ease;
}
.override-checkbox[data-v-974b0b3e]:hover {
background: rgba(255, 165, 0, 0.2);
border-color: rgba(255, 165, 0, 0.5);
}
.override-checkbox input[type="checkbox"][data-v-974b0b3e] { width: 16px; height: 16px; cursor: pointer; accent-color: #ffa500;
}
.tier-protection-badge[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 0.4rem;
padding: 0.5rem 1rem;
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
border-radius: 8px;
font-size: 0.85rem;
color: #22c55e;
cursor: help;
user-select: none;
}
.tier-protected-icon[data-v-974b0b3e] {
display: inline-flex;
align-items: center;
justify-content: center;
margin-left: 0.35rem;
width: 1.4rem;
height: 1.4rem;
font-size: 0.75rem;
border-radius: 50%;
background: rgba(34, 197, 94, 0.12);
box-shadow: 0 0 6px rgba(34, 197, 94, 0.25);
cursor: help;
transition: transform 0.15s ease;
}
.tier-protected-icon[data-v-974b0b3e]:hover { transform: scale(1.3);
}
.no-candidates[data-v-974b0b3e] {
padding: 2rem;
text-align: center;
color: var(--text-secondary);
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
/* Small button */
.btn-small[data-v-974b0b3e] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-974b0b3e]:hover { background: rgba(255, 255, 255, 0.1);
}
.hard-cap-row[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
margin-top: 0.5rem;
}
.hard-cap-input[data-v-974b0b3e] {
position: relative;
display: inline-flex;
align-items: center;
}
.hard-cap-prefix[data-v-974b0b3e] {
position: absolute;
left: 0.7rem;
color: var(--text-secondary, rgba(255, 255, 255, 0.6));
pointer-events: none;
font-weight: 500;
}
.hard-cap-input input[data-v-974b0b3e] {
padding-left: 1.6rem;
width: 10rem;
}
.hard-cap-help[data-v-974b0b3e] {
color: var(--text-secondary, rgba(255, 255, 255, 0.55));
font-size: 0.8rem;
}
.hard-cap-readonly-note[data-v-974b0b3e] {
margin-top: 0.4rem;
font-size: 0.8rem;
color: var(--text-secondary, rgba(255, 255, 255, 0.55));
font-style: italic;
}
.split-rewards-row[data-v-974b0b3e] {
display: flex;
align-items: center;
gap: 1.25rem;
flex-wrap: wrap;
margin-top: 0.5rem;
}
.split-toggle[data-v-974b0b3e] {
display: inline-flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
user-select: none;
}
.split-toggle.disabled[data-v-974b0b3e] {
opacity: 0.55;
cursor: not-allowed;
}
.split-toggle input[data-v-974b0b3e] {
width: 1.05rem;
height: 1.05rem;
cursor: pointer;
accent-color: var(--neon-green, #00ff96);
}
.merge-splits-btn[data-v-974b0b3e]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.neon-gold[data-v-d96ab7f5] {
color: #ffd700;
}
.animate-fade-in[data-v-d96ab7f5] {
animation: fadeIn-d96ab7f5 0.3s ease-out;
}
.animate-scale-in[data-v-d96ab7f5] {
animation: scaleIn-d96ab7f5 0.3s ease-out;
}
@keyframes fadeIn-d96ab7f5 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-d96ab7f5 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-content.large[data-v-d96ab7f5] {
max-width: 1000px;
}
.btn-close[data-v-d96ab7f5] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-d96ab7f5]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
/* Pit Configuration */
.pit-actions[data-v-d96ab7f5] {
display: flex;
gap: 1rem;
margin-bottom: 2rem;
}
.pits-grid[data-v-d96ab7f5] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 1.5rem;
}
.pit-card[data-v-d96ab7f5] {
background: rgba(255, 255, 255, 0.03);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.5rem;
transition: all 0.3s ease;
}
.pit-card.inactive[data-v-d96ab7f5] {
opacity: 0.6;
background: rgba(255, 255, 255, 0.01);
}
.pit-card[data-v-d96ab7f5]:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}
.pit-header[data-v-d96ab7f5] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1rem;
}
.pit-info[data-v-d96ab7f5] {
display: flex;
align-items: center;
gap: 1rem;
}
.pit-color[data-v-d96ab7f5] {
width: 20px;
height: 20px;
border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.3);
}
.pit-details[data-v-d96ab7f5] { flex: 1;
}
.pit-name[data-v-d96ab7f5] {
margin: 0 0 0.25rem 0;
color: var(--text-primary);
font-size: 1.1rem;
font-weight: 600;
}
.pit-short-name[data-v-d96ab7f5] {
color: var(--text-secondary);
font-size: 0.9rem;
opacity: 0.8;
}
.pit-status .status-badge[data-v-d96ab7f5] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
background: rgba(255, 100, 100, 0.2);
color: #ff6464;
}
.pit-status .status-badge.active[data-v-d96ab7f5] {
background: rgba(100, 255, 100, 0.2);
color: #64ff64;
}
.pit-description[data-v-d96ab7f5] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 1rem;
line-height: 1.4;
}
.pit-stats[data-v-d96ab7f5] {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-bottom: 1rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
}
.stat-item[data-v-d96ab7f5] {
display: flex;
gap: 0.5rem;
}
.stat-label[data-v-d96ab7f5] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.stat-value[data-v-d96ab7f5] {
color: var(--text-primary);
font-size: 0.85rem;
font-weight: 500;
}
.pit-actions[data-v-d96ab7f5] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
/* Small buttons */
.btn-small[data-v-d96ab7f5] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-d96ab7f5]:hover { background: rgba(255, 255, 255, 0.1);
}
.btn-edit[data-v-d96ab7f5] {
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.btn-edit[data-v-d96ab7f5]:hover { background: rgba(0, 150, 255, 0.1);
}
.btn-toggle[data-v-d96ab7f5] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.deactivate[data-v-d96ab7f5] {
border-color: var(--neon-red);
color: var(--neon-red);
}
.btn-toggle.deactivate[data-v-d96ab7f5]:hover { background: rgba(255, 100, 100, 0.1);
}
.btn-danger[data-v-d96ab7f5] {
border-color: var(--neon-red);
color: var(--neon-red);
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid var(--neon-red);
background: rgba(255, 255, 255, 0.05);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-danger[data-v-d96ab7f5]:hover:not(:disabled) { background: rgba(255, 7, 58, 0.1);
}
.btn-danger[data-v-d96ab7f5]:disabled { opacity: 0.4; cursor: not-allowed;
}
/* Add Pit Form */
.form-group[data-v-d96ab7f5] {
margin-bottom: 1.5rem;
}
.form-group label[data-v-d96ab7f5] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-primary);
font-weight: 500;
}
.form-group textarea[data-v-d96ab7f5] {
resize: vertical;
min-height: 80px;
}
.color-picker-group[data-v-d96ab7f5] {
display: flex;
gap: 1rem;
align-items: center;
}
.color-picker[data-v-d96ab7f5] {
width: 50px;
height: 40px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
background: none;
cursor: pointer;
}
.color-text[data-v-d96ab7f5] {
flex: 1;
font-family: monospace;
}
.modal-overlay[data-v-55dcf367] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1200;
/* Higher than parent PromoModal */
padding: 1rem;
backdrop-filter: blur(4px);
}
.modal-content[data-v-55dcf367] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
width: 100%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.modal-large[data-v-55dcf367] {
max-width: 900px;
}
.modal-header[data-v-55dcf367] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
position: sticky;
top: 0;
background: rgba(20, 25, 35, 0.95);
z-index: 10;
}
.modal-header h2[data-v-55dcf367] {
margin: 0;
font-size: 1.5rem;
}
.btn-close[data-v-55dcf367] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-55dcf367]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-55dcf367] {
padding: 1.5rem;
min-height: 300px;
}
.modal-footer[data-v-55dcf367] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
position: sticky;
bottom: 0;
background: rgba(20, 25, 35, 0.95);
}
/* Loading/Error States */
.loading-state[data-v-55dcf367],
.error-state[data-v-55dcf367] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 1rem;
gap: 1rem;
}
.spinner[data-v-55dcf367] {
width: 48px;
height: 48px;
border: 4px solid rgba(255, 255, 255, 0.1);
border-top-color: var(--neon-blue);
border-radius: 50%;
animation: spin-55dcf367 1s linear infinite;
}
@keyframes spin-55dcf367 {
to {
transform: rotate(360deg);
}
}
.error-icon[data-v-55dcf367] {
font-size: 3rem;
}
.error-message[data-v-55dcf367] {
color: var(--neon-red);
margin: 0;
text-align: center;
}
/* Settings Form */
.settings-form[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.settings-section[data-v-55dcf367] {
padding: 1.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.section-title[data-v-55dcf367] {
margin: 0 0 0.5rem 0;
font-size: 1.2rem;
color: var(--text-primary);
}
.section-description[data-v-55dcf367] {
margin: 0 0 1.5rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.form-group[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-row[data-v-55dcf367] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.form-group label[data-v-55dcf367] {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
}
.form-input[data-v-55dcf367],
.form-select[data-v-55dcf367] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
font-size: 1rem;
transition: all 0.3s ease;
}
.form-input[data-v-55dcf367]:focus,
.form-select[data-v-55dcf367]:focus {
outline: none;
border-color: var(--neon-blue);
background: rgba(255, 255, 255, 0.08);
}
.help-text[data-v-55dcf367] {
color: var(--text-secondary);
font-size: 0.8rem;
margin-top: -0.25rem;
}
/* Toggle Switch */
.toggle-label[data-v-55dcf367] {
display: flex;
align-items: center;
gap: 1rem;
cursor: pointer;
user-select: none;
}
.toggle-checkbox[data-v-55dcf367] {
display: none;
}
.toggle-slider[data-v-55dcf367] {
position: relative;
width: 50px;
height: 26px;
background: rgba(255, 255, 255, 0.1);
border-radius: 13px;
transition: background 0.3s ease;
}
.toggle-slider[data-v-55dcf367]::before {
content: '';
position: absolute;
top: 3px;
left: 3px;
width: 20px;
height: 20px;
background: white;
border-radius: 50%;
transition: transform 0.3s ease;
}
.toggle-checkbox:checked+.toggle-slider[data-v-55dcf367] {
background: var(--neon-blue);
}
.toggle-checkbox:checked+.toggle-slider[data-v-55dcf367]::before {
transform: translateX(24px);
}
.toggle-text[data-v-55dcf367] {
font-weight: 600;
color: var(--text-primary);
}
.toggle-label-inline[data-v-55dcf367] {
flex-direction: row;
align-items: center;
gap: 0.5rem;
margin-top: 1.5rem;
}
.toggle-checkbox-small[data-v-55dcf367] {
display: none;
}
.auto-award-options[data-v-55dcf367],
.expiration-options[data-v-55dcf367],
.prequalification-options[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.info-box[data-v-55dcf367] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
background: rgba(0, 150, 255, 0.1);
border: 1px solid rgba(0, 150, 255, 0.2);
border-radius: 8px;
color: var(--text-secondary);
font-size: 0.9rem;
margin-top: 0.5rem;
}
.info-icon[data-v-55dcf367] {
font-size: 1.2rem;
}
/* Prize Eligibility Filter Styles */
.prize-filter-info[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.info-box-warning[data-v-55dcf367] {
background: rgba(156, 39, 176, 0.1);
border-color: rgba(156, 39, 176, 0.3);
}
.info-box-alert[data-v-55dcf367] {
background: rgba(255, 193, 7, 0.1);
border-color: rgba(255, 193, 7, 0.3);
}
.active-game-types[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.active-game-types label[data-v-55dcf367] {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
}
.game-type-chips[data-v-55dcf367] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.game-type-chip[data-v-55dcf367] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0.4rem 0.75rem;
border: 1px solid rgba(156, 39, 176, 0.4);
border-radius: 20px;
font-size: 0.85rem;
font-weight: 600;
background: rgba(156, 39, 176, 0.1);
color: var(--text-primary);
}
/* Promotional Periods */
.periods-list[data-v-55dcf367] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.period-item[data-v-55dcf367] {
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
position: relative;
}
.period-header[data-v-55dcf367] {
display: flex;
gap: 1rem;
align-items: center;
margin-bottom: 1rem;
}
.period-name-input[data-v-55dcf367] {
flex: 1;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
font-size: 1rem;
font-weight: 600;
}
.period-name-input[data-v-55dcf367]:focus {
outline: none;
border-color: var(--neon-blue);
}
.btn-icon[data-v-55dcf367] {
background: none;
border: none;
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-remove[data-v-55dcf367]:hover {
background: rgba(255, 59, 48, 0.2);
}
.active-badge[data-v-55dcf367] {
margin-top: 1rem;
padding: 0.5rem 1rem;
background: linear-gradient(135deg, rgba(57, 255, 20, 0.2), rgba(0, 255, 127, 0.2));
border: 1px solid var(--neon-green);
border-radius: 8px;
color: var(--neon-green);
font-weight: 700;
font-size: 0.85rem;
text-align: center;
letter-spacing: 0.5px;
}
.btn-add-period[data-v-55dcf367] {
padding: 1rem;
width: 100%;
border-radius: 12px;
border: 2px dashed rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.03);
color: var(--text-secondary);
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-add-period[data-v-55dcf367]:hover {
border-color: var(--neon-blue);
background: rgba(0, 150, 255, 0.05);
color: var(--neon-blue);
}
/* Buttons */
.btn-glass[data-v-55dcf367],
.btn-neon[data-v-55dcf367] {
padding: 1rem 1.5rem;
border-radius: 12px;
font-size: 1rem;
font-weight: 600;
min-height: 48px;
cursor: pointer;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.btn-glass[data-v-55dcf367]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
}
.btn-neon[data-v-55dcf367] {
background: linear-gradient(135deg, var(--neon-blue), #0066cc);
border-color: var(--neon-blue);
color: white;
box-shadow: 0 4px 15px rgba(0, 150, 255, 0.3);
}
.btn-neon[data-v-55dcf367]:hover:not(:disabled) {
background: linear-gradient(135deg, #0066cc, var(--neon-blue));
box-shadow: 0 6px 20px rgba(0, 150, 255, 0.4);
transform: translateY(-2px);
}
.btn-neon[data-v-55dcf367]:disabled,
.btn-glass[data-v-55dcf367]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
/* Responsive */
@media (max-width: 768px) {
.modal-overlay[data-v-55dcf367] {
padding: 0.5rem;
}
.modal-large[data-v-55dcf367] {
max-width: 100%;
}
.form-row[data-v-55dcf367] {
grid-template-columns: 1fr;
}
.modal-footer[data-v-55dcf367] {
flex-wrap: wrap;
}
.modal-footer .btn-glass[data-v-55dcf367],
.modal-footer .btn-neon[data-v-55dcf367] {
flex: 1;
}
}
.mode-toggle[data-v-55dcf367] {
display: flex;
gap: 8px;
}
.mode-btn[data-v-55dcf367] {
flex: 1;
padding: 10px 16px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
color: rgba(255, 255, 255, 0.7);
cursor: pointer;
transition: all 0.15s;
font-size: 0.9em;
}
.mode-btn[data-v-55dcf367]:hover {
background: rgba(255, 255, 255, 0.1);
}
.mode-btn.active[data-v-55dcf367] {
background: rgba(0, 200, 255, 0.12);
border-color: rgba(0, 200, 255, 0.5);
color: #00c8ff;
}
.day-chips[data-v-55dcf367] {
display: flex;
gap: 6px;
flex-wrap: wrap;
}
.day-chip[data-v-55dcf367] {
padding: 8px 14px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
color: rgba(255, 255, 255, 0.7);
cursor: pointer;
transition: all 0.15s;
font-weight: 500;
font-size: 0.85em;
}
.day-chip[data-v-55dcf367]:hover {
background: rgba(255, 255, 255, 0.1);
}
.day-chip.active[data-v-55dcf367] {
background: rgba(0, 200, 255, 0.15);
border-color: rgba(0, 200, 255, 0.5);
color: #00c8ff;
}
.day-chip.conflict[data-v-55dcf367] {
border-color: rgba(255, 80, 80, 0.6);
background: rgba(255, 80, 80, 0.15);
color: #ff5050;
}
.info-box-success[data-v-55dcf367] {
border-color: rgba(0, 200, 100, 0.3);
background: rgba(0, 200, 100, 0.08);
}
.info-box-error[data-v-55dcf367] {
border-color: rgba(255, 80, 80, 0.3);
background: rgba(255, 80, 80, 0.08);
}
.info-box-info[data-v-55dcf367] {
border-color: rgba(0, 200, 255, 0.3);
background: rgba(0, 200, 255, 0.08);
}
.modal-body[data-v-3e3fb041] {
display: flex;
flex-direction: column;
gap: 1.25rem;
}
.form-group[data-v-3e3fb041] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-3e3fb041] {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
}
.label-hint[data-v-3e3fb041] {
font-weight: 400;
color: var(--text-secondary, rgba(255, 255, 255, 0.5));
font-size: 0.85em;
}
.search-container[data-v-3e3fb041] {
position: relative;
}
.search-results[data-v-3e3fb041] {
position: absolute;
top: 100%;
left: 0;
right: 0;
z-index: 50;
max-height: 280px;
overflow-y: auto;
margin-top: 4px;
}
.search-item[data-v-3e3fb041] {
padding: 10px 14px;
cursor: pointer;
display: flex;
align-items: center;
gap: 10px;
transition: background 0.15s;
}
.search-item[data-v-3e3fb041]:hover {
background: rgba(255, 255, 255, 0.08);
}
.search-item.muted[data-v-3e3fb041] {
color: rgba(255, 255, 255, 0.5);
cursor: default;
}
.player-name[data-v-3e3fb041] {
flex: 1;
font-weight: 500;
}
.player-card[data-v-3e3fb041] {
color: var(--text-secondary, rgba(255, 255, 255, 0.5));
font-size: 0.85em;
}
.player-tier[data-v-3e3fb041] {
font-size: 0.8em;
padding: 2px 8px;
border-radius: 4px;
background: rgba(255, 255, 255, 0.1);
}
.selected-player-card[data-v-3e3fb041] {
padding: 1rem;
}
.player-info-row[data-v-3e3fb041] {
display: flex;
align-items: center;
justify-content: space-between;
}
.player-details h3[data-v-3e3fb041] {
margin: 0 0 4px;
font-size: 1.1rem;
}
.player-meta[data-v-3e3fb041] {
display: flex;
gap: 10px;
align-items: center;
}
.meta-item[data-v-3e3fb041] {
color: var(--text-secondary, rgba(255, 255, 255, 0.5));
font-size: 0.9em;
}
.tier-badge[data-v-3e3fb041] {
padding: 2px 10px;
border-radius: 4px;
background: rgba(255, 255, 255, 0.1);
font-size: 0.85em;
color: var(--text-secondary, rgba(255, 255, 255, 0.6));
}
.quantity-selector[data-v-3e3fb041] {
display: flex;
gap: 8px;
}
.quantity-chip[data-v-3e3fb041] {
padding: 8px 18px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
color: rgba(255, 255, 255, 0.8);
cursor: pointer;
transition: all 0.15s;
font-weight: 500;
}
.quantity-chip[data-v-3e3fb041]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.quantity-chip.active[data-v-3e3fb041] {
background: var(--neon-blue-bg, rgba(0, 200, 255, 0.15));
border-color: var(--neon-blue, rgba(0, 200, 255, 0.5));
color: var(--neon-blue, #00c8ff);
}
.modal-overlay[data-v-faa365f7] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
padding: 1rem;
backdrop-filter: blur(4px);
}
.modal-content[data-v-faa365f7] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 600px;
width: 100%;
max-height: 85vh;
overflow-y: auto;
backdrop-filter: blur(20px);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
/* Nested modal overlay (confirmation dialog) - higher z-index to appear on top */
.modal-overlay-nested[data-v-faa365f7] {
z-index: 1100;
background: rgba(0, 0, 0, 0.9);
}
/* Confirmation modal - smaller and centered */
.modal-content-confirm[data-v-faa365f7] {
max-width: 450px;
max-height: auto;
}
.modal-header[data-v-faa365f7] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-faa365f7] {
margin: 0;
font-size: 1.5rem;
}
.header-actions[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-settings[data-v-faa365f7] {
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 1.1rem;
transition: all 0.2s ease;
}
.btn-settings[data-v-faa365f7]:hover {
background: rgba(255, 255, 255, 0.2);
transform: rotate(45deg);
}
.btn-close[data-v-faa365f7] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-faa365f7]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-faa365f7] {
padding: 1.5rem;
min-height: 200px;
}
.modal-footer[data-v-faa365f7] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Loading State */
.loading-state[data-v-faa365f7] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 1rem;
gap: 1rem;
}
.spinner[data-v-faa365f7] {
width: 48px;
height: 48px;
border: 4px solid rgba(255, 255, 255, 0.1);
border-top-color: var(--neon-blue);
border-radius: 50%;
animation: spin-faa365f7 1s linear infinite;
}
@keyframes spin-faa365f7 {
to {
transform: rotate(360deg);
}
}
.loading-state p[data-v-faa365f7] {
color: var(--text-secondary);
margin: 0;
}
/* Error State */
.error-state[data-v-faa365f7] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 1rem;
gap: 1rem;
}
.error-icon[data-v-faa365f7] {
font-size: 3rem;
}
.error-message[data-v-faa365f7] {
color: var(--neon-red);
margin: 0;
text-align: center;
}
/* Empty State */
.empty-state[data-v-faa365f7] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 1rem;
gap: 1rem;
}
.empty-icon[data-v-faa365f7] {
font-size: 3rem;
opacity: 0.5;
}
.empty-message[data-v-faa365f7] {
color: var(--text-primary);
margin: 0;
font-weight: 600;
font-size: 1.1rem;
}
.empty-description[data-v-faa365f7] {
color: var(--text-secondary);
margin: 0;
text-align: center;
max-width: 400px;
}
/* Eligible Players Section */
.players-section[data-v-faa365f7] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.ticket-quantity-selector[data-v-faa365f7] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.ticket-quantity-selector label[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.5rem;
font-weight: 600;
color: var(--text-primary);
}
.label-icon[data-v-faa365f7] {
font-size: 1.2rem;
}
.quantity-select[data-v-faa365f7] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.5rem 1rem;
color: var(--text-primary);
font-size: 1rem;
cursor: pointer;
transition: all 0.3s ease;
min-width: 130px;
}
.quantity-select[data-v-faa365f7]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.3);
}
.quantity-select[data-v-faa365f7]:focus {
outline: none;
border-color: var(--neon-blue);
}
.tabs-container[data-v-faa365f7] {
display: flex;
gap: 0.5rem;
border-bottom: 2px solid rgba(255, 255, 255, 0.1);
}
.tab-button[data-v-faa365f7] {
flex: 1;
padding: 0.75rem 1rem;
background: transparent;
border: none;
border-bottom: 2px solid transparent;
color: var(--text-secondary);
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
margin-bottom: -2px;
}
.tab-button[data-v-faa365f7]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.05);
}
.tab-button.active[data-v-faa365f7] {
color: var(--neon-blue);
border-bottom-color: var(--neon-blue);
background: rgba(0, 150, 255, 0.05);
}
.tab-content[data-v-faa365f7] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.empty-tab-state[data-v-faa365f7] {
text-align: center;
padding: 2rem 1rem;
color: var(--text-secondary);
font-style: italic;
}
.section-header .description[data-v-faa365f7] {
margin: 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
/* Prize Filter Banner */
.prize-filter-banner[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
margin-top: 0.75rem;
background: linear-gradient(135deg, rgba(156, 39, 176, 0.15), rgba(103, 58, 183, 0.15));
border: 1px solid rgba(156, 39, 176, 0.4);
border-radius: 10px;
animation: prize-pulse-faa365f7 3s ease-in-out infinite;
}
@keyframes prize-pulse-faa365f7 {
0%,
100% {
box-shadow: 0 0 8px rgba(156, 39, 176, 0.2);
}
50% {
box-shadow: 0 0 16px rgba(156, 39, 176, 0.4);
}
}
.prize-filter-icon[data-v-faa365f7] {
font-size: 1.3rem;
}
.prize-filter-text[data-v-faa365f7] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.prize-filter-text strong[data-v-faa365f7] {
color: var(--neon-purple, #9c27b0);
}
/* Prize Game Type Badge on Player Row */
.prize-game-badge[data-v-faa365f7] {
display: inline-flex;
align-items: center;
gap: 0.3rem;
padding: 0.2rem 0.5rem;
border: 1px solid rgba(156, 39, 176, 0.5);
border-radius: 6px;
font-size: 0.7rem;
font-weight: 600;
background: rgba(156, 39, 176, 0.1);
color: var(--text-primary);
margin-left: 0.5rem;
white-space: nowrap;
}
.players-list[data-v-faa365f7] {
display: flex;
flex-direction: column;
gap: 0.75rem;
max-height: 400px;
overflow-y: auto;
padding-right: 0.5rem;
}
.player-item[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
transition: all 0.3s ease;
}
.player-item[data-v-faa365f7]:hover {
border-color: rgba(255, 255, 255, 0.2);
transform: translateX(4px);
}
.player-item.ineligible[data-v-faa365f7] {
border-color: rgba(255, 193, 7, 0.3);
background: rgba(255, 193, 7, 0.03);
}
.player-checkbox[data-v-faa365f7] {
width: 20px;
height: 20px;
cursor: pointer;
flex-shrink: 0;
}
.player-info[data-v-faa365f7] {
flex: 1;
cursor: pointer;
}
.player-name[data-v-faa365f7] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.waive-badge[data-v-faa365f7] {
background: linear-gradient(135deg, #ffc107, #ff9800);
color: #000;
font-size: 0.7rem;
font-weight: 700;
padding: 0.2rem 0.5rem;
border-radius: 4px;
letter-spacing: 0.5px;
}
.prequalified-badge[data-v-faa365f7] {
background: linear-gradient(135deg, #4caf50, #2e7d32);
color: #fff;
font-size: 0.7rem;
font-weight: 700;
padding: 0.2rem 0.5rem;
border-radius: 4px;
letter-spacing: 0.5px;
}
.not-prequalified-badge[data-v-faa365f7] {
background: linear-gradient(135deg, #ff5722, #d84315);
color: #fff;
font-size: 0.7rem;
font-weight: 700;
padding: 0.2rem 0.5rem;
border-radius: 4px;
letter-spacing: 0.5px;
}
.player-meta[data-v-faa365f7] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
color: var(--text-secondary);
flex-wrap: wrap;
}
.play-duration[data-v-faa365f7] {
color: var(--neon-green);
font-weight: 500;
}
.play-duration.warning[data-v-faa365f7] {
color: var(--neon-orange, #ffc107);
}
.sessions-badge[data-v-faa365f7] {
color: var(--neon-purple);
font-size: 0.75rem;
font-weight: 600;
margin-left: 0.25rem;
opacity: 0.9;
}
.play-speed[data-v-faa365f7] {
color: var(--neon-blue);
font-weight: 500;
font-size: 0.8rem;
}
.play-speed.speed-warning[data-v-faa365f7] {
color: var(--neon-orange, #ffc107);
font-weight: 600;
}
.qualifying-hours[data-v-faa365f7] {
color: var(--neon-purple, #9c27b0);
font-weight: 500;
font-size: 0.8rem;
}
.entries-remaining[data-v-faa365f7] {
color: var(--neon-cyan, #00bcd4);
font-weight: 500;
font-size: 0.8rem;
}
.low-speed-badge[data-v-faa365f7] {
background: linear-gradient(135deg, #ff5722, #e91e63);
color: #fff;
font-size: 0.65rem;
font-weight: 700;
padding: 0.15rem 0.4rem;
border-radius: 4px;
letter-spacing: 0.5px;
margin-left: 0.5rem;
}
.selection-info[data-v-faa365f7] {
display: flex;
gap: 0.75rem;
padding: 1rem;
background: rgba(0, 150, 255, 0.05);
border: 1px solid rgba(0, 150, 255, 0.2);
border-radius: 12px;
margin-top: 0.5rem;
}
.info-icon[data-v-faa365f7] {
font-size: 1.5rem;
flex-shrink: 0;
}
.selection-info p[data-v-faa365f7] {
margin: 0;
color: var(--text-secondary);
font-size: 0.9rem;
line-height: 1.5;
}
.selection-info strong[data-v-faa365f7] {
color: var(--neon-blue);
font-weight: 700;
}
/* Buttons */
.btn-glass[data-v-faa365f7],
.btn-neon[data-v-faa365f7] {
padding: 1rem 1.5rem;
border-radius: 12px;
font-size: 1rem;
font-weight: 600;
min-height: 48px;
cursor: pointer;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.btn-select-all[data-v-faa365f7] {
min-width: 120px;
}
.btn-glass[data-v-faa365f7]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
}
.btn-neon[data-v-faa365f7] {
background: linear-gradient(135deg, var(--neon-green), #45d62b);
border-color: var(--neon-green);
color: #000;
box-shadow: 0 4px 15px rgba(57, 255, 20, 0.3);
}
.btn-neon[data-v-faa365f7]:hover:not(:disabled) {
background: linear-gradient(135deg, #45d62b, var(--neon-green));
box-shadow: 0 6px 20px rgba(57, 255, 20, 0.4);
transform: translateY(-2px);
}
.btn-neon[data-v-faa365f7]:disabled,
.btn-glass[data-v-faa365f7]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
/* Scrollbar styling */
.players-list[data-v-faa365f7]::-webkit-scrollbar {
width: 8px;
}
.players-list[data-v-faa365f7]::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
}
.players-list[data-v-faa365f7]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 4px;
}
.players-list[data-v-faa365f7]::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.3);
}
/* Raffle Entries Tab Styles */
.entries-header[data-v-faa365f7] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 1rem;
margin-bottom: 1rem;
}
.stats-card[data-v-faa365f7] {
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
text-align: center;
}
.stat-label[data-v-faa365f7] {
font-size: 0.8rem;
color: var(--text-secondary);
margin-bottom: 0.5rem;
}
.stat-value[data-v-faa365f7] {
font-size: 1.8rem;
font-weight: 700;
color: var(--neon-blue);
}
.btn-settings[data-v-faa365f7] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
white-space: nowrap;
padding: 1rem;
}
.promo-banner[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem 1.5rem;
background: linear-gradient(135deg, rgba(255, 193, 7, 0.15), rgba(255, 152, 0, 0.15));
border: 2px solid rgba(255, 193, 7, 0.4);
border-radius: 12px;
margin-bottom: 1rem;
animation: pulse-glow-faa365f7 2s ease-in-out infinite;
}
@keyframes pulse-glow-faa365f7 {
0%,
100% {
box-shadow: 0 0 10px rgba(255, 193, 7, 0.3);
}
50% {
box-shadow: 0 0 20px rgba(255, 193, 7, 0.5);
}
}
.promo-icon[data-v-faa365f7] {
font-size: 2rem;
animation: pulse-faa365f7 1.5s ease-in-out infinite;
}
@keyframes pulse-faa365f7 {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
}
.promo-info[data-v-faa365f7] {
flex: 1;
}
.promo-name[data-v-faa365f7] {
font-weight: 700;
color: var(--neon-orange, #ffc107);
font-size: 1.1rem;
margin-bottom: 0.25rem;
}
.promo-details[data-v-faa365f7] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.award-controls[data-v-faa365f7] {
padding: 1.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
margin-bottom: 1rem;
}
.control-header h4[data-v-faa365f7] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.control-description[data-v-faa365f7] {
margin: 0 0 1rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.control-inputs[data-v-faa365f7] {
display: flex;
gap: 1rem;
align-items: flex-end;
flex-wrap: wrap;
}
.control-inputs .form-group[data-v-faa365f7] {
flex: 0 0 auto;
min-width: 150px;
}
.control-inputs .form-group label[data-v-faa365f7] {
display: block;
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
margin-bottom: 0.5rem;
}
.entry-input[data-v-faa365f7] {
width: 150px;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
font-size: 1rem;
transition: all 0.3s ease;
}
.entry-input[data-v-faa365f7]:focus {
outline: none;
border-color: var(--neon-blue);
background: rgba(255, 255, 255, 0.08);
}
.btn-neon.neon-purple[data-v-faa365f7] {
flex: 1;
min-width: 250px;
background: linear-gradient(135deg, #9c27b0, #7b1fa2);
border-color: #9c27b0;
box-shadow: 0 4px 15px rgba(156, 39, 176, 0.3);
}
.btn-neon.neon-purple[data-v-faa365f7]:hover:not(:disabled) {
background: linear-gradient(135deg, #7b1fa2, #9c27b0);
box-shadow: 0 6px 20px rgba(156, 39, 176, 0.4);
}
.entry-players-section[data-v-faa365f7] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.entry-filter-tabs[data-v-faa365f7] {
display: flex;
gap: 0.75rem;
margin-bottom: 1rem;
padding: 0.5rem;
background: rgba(0, 0, 0, 0.2);
border-radius: 12px;
}
.filter-tab[data-v-faa365f7] {
flex: 1;
padding: 0.75rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
font-size: 0.9rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
text-align: center;
}
.filter-tab[data-v-faa365f7]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.filter-tab.active[data-v-faa365f7] {
background: linear-gradient(135deg, rgba(0, 150, 255, 0.2), rgba(0, 200, 255, 0.2));
border-color: var(--neon-blue);
color: var(--text-primary);
box-shadow: 0 0 15px rgba(0, 150, 255, 0.3);
}
.section-controls[data-v-faa365f7] {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 1rem;
}
.section-controls h4[data-v-faa365f7] {
margin: 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.control-buttons[data-v-faa365f7] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-sm[data-v-faa365f7] {
padding: 0.5rem 1rem;
font-size: 0.9rem;
min-height: 36px;
}
.btn-danger[data-v-faa365f7] {
border-color: rgba(255, 59, 48, 0.5);
background: rgba(255, 59, 48, 0.1);
color: var(--neon-red, #ff3b30);
}
.btn-danger[data-v-faa365f7]:hover:not(:disabled) {
background: rgba(255, 59, 48, 0.2);
border-color: var(--neon-red, #ff3b30);
}
.entry-player[data-v-faa365f7] {
border-left: 3px solid transparent;
transition: all 0.3s ease;
}
.entry-player[data-v-faa365f7]:has(.player-checkbox:checked) {
border-left-color: var(--neon-purple, #9c27b0);
background: rgba(156, 39, 176, 0.05);
}
.entry-count[data-v-faa365f7] {
color: var(--text-secondary);
font-weight: 500;
}
.entry-count.has-entries[data-v-faa365f7] {
color: var(--neon-green);
font-weight: 700;
}
.entries-batch-helper[data-v-faa365f7] {
margin-top: 0.75rem;
padding: 0.6rem 0.9rem;
display: flex;
justify-content: space-between;
align-items: center;
gap: 0.75rem;
border-radius: 10px;
}
.entries-batch-text[data-v-faa365f7] {
font-size: 0.85rem;
color: var(--text-secondary);
}
.entries-batch-text .mono[data-v-faa365f7] {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.entries-batch-actions[data-v-faa365f7] {
display: flex;
gap: 0.5rem;
}
.print-warning[data-v-faa365f7] {
margin: 0.75rem 1.25rem 1rem;
padding: 0.85rem 1rem;
display: flex;
align-items: flex-start;
gap: 0.75rem;
border-radius: 10px;
border: 1px solid rgba(255, 193, 7, 0.4);
background: linear-gradient(135deg,
rgba(255, 193, 7, 0.15),
rgba(255, 255, 255, 0.02));
box-shadow: 0 0 18px rgba(255, 193, 7, 0.25);
}
.print-warning-icon[data-v-faa365f7] {
font-size: 1.4rem;
line-height: 1;
}
.print-warning-text[data-v-faa365f7] {
flex: 1;
}
.print-warning-title[data-v-faa365f7] {
font-weight: 700;
margin-bottom: 0.25rem;
color: var(--text-primary);
}
.print-warning p[data-v-faa365f7] {
margin: 0;
font-size: 0.9rem;
color: var(--text-secondary);
}
/* Responsive */
@media (max-width: 768px) {
.modal-overlay[data-v-faa365f7] {
padding: 0.5rem;
}
.modal-content[data-v-faa365f7] {
max-height: 90vh;
}
.player-item[data-v-faa365f7] {
flex-direction: column;
align-items: flex-start;
gap: 0.75rem;
}
.modal-footer[data-v-faa365f7] {
flex-wrap: wrap;
gap: 0.5rem;
}
.modal-footer .btn-glass[data-v-faa365f7],
.modal-footer .btn-neon[data-v-faa365f7] {
flex: 1;
min-width: 0;
}
.btn-select-all[data-v-faa365f7] {
width: 100%;
order: -1;
}
.ticket-quantity-selector[data-v-faa365f7] {
flex-direction: column;
align-items: stretch;
gap: 0.5rem;
}
.quantity-select[data-v-faa365f7] {
width: 100%;
}
}
/* Pre-qualification mode styles */
.prequal-mode-toggle[data-v-faa365f7] {
padding: 1rem;
margin-bottom: 1rem;
border-radius: 12px;
background: rgba(59, 130, 246, 0.1);
border: 1px solid rgba(59, 130, 246, 0.3);
}
.prequal-mode-toggle .toggle-label[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.75rem;
cursor: pointer;
}
.prequal-mode-toggle .toggle-slider[data-v-faa365f7] {
width: 44px;
height: 24px;
background: rgba(255, 255, 255, 0.2);
border-radius: 12px;
position: relative;
transition: background 0.3s;
}
.prequal-mode-toggle input:checked+.toggle-slider[data-v-faa365f7] {
background: var(--neon-blue, #3b82f6);
}
.prequal-mode-toggle .toggle-slider[data-v-faa365f7]::after {
content: '';
position: absolute;
width: 18px;
height: 18px;
background: white;
border-radius: 50%;
top: 3px;
left: 3px;
transition: transform 0.3s;
}
.prequal-mode-toggle input:checked+.toggle-slider[data-v-faa365f7]::after {
transform: translateX(20px);
}
.prequal-mode-toggle input[data-v-faa365f7] {
display: none;
}
.prequal-mode-toggle .toggle-text[data-v-faa365f7] {
font-weight: 600;
color: var(--text-primary);
}
.prequal-mode-toggle .help-text[data-v-faa365f7] {
display: block;
margin-top: 0.5rem;
font-size: 0.8rem;
color: var(--text-secondary);
}
.prequal-info-banner[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
margin-top: 0.75rem;
border-radius: 8px;
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
}
.prequal-info-icon[data-v-faa365f7] {
font-size: 1.25rem;
}
.prequal-info-text[data-v-faa365f7] {
font-size: 0.9rem;
color: var(--text-primary);
}
/* Calculated entries display */
.calculated-entries[data-v-faa365f7] {
padding: 0.25rem 0.5rem;
background: rgba(34, 197, 94, 0.2);
border: 1px solid rgba(34, 197, 94, 0.4);
border-radius: 6px;
color: #22c55e;
font-size: 0.85rem;
}
.visit-days[data-v-faa365f7] {
font-size: 0.85rem;
color: var(--text-secondary);
}
.not-seated-badge[data-v-faa365f7] {
padding: 0.2rem 0.4rem;
background: rgba(251, 146, 60, 0.2);
border: 1px solid rgba(251, 146, 60, 0.4);
border-radius: 4px;
color: #fb923c;
font-size: 0.8rem;
font-weight: 500;
}
/* Pre-qualification timing banner */
.prequal-timing-banner[data-v-faa365f7] {
padding: 0.75rem 1rem;
margin-top: 0.75rem;
border-radius: 8px;
background: rgba(59, 130, 246, 0.1);
border: 1px solid rgba(59, 130, 246, 0.3);
}
.prequal-timing-banner.timing-warning[data-v-faa365f7] {
background: rgba(251, 191, 36, 0.1);
border-color: rgba(251, 191, 36, 0.4);
}
.timing-dates[data-v-faa365f7] {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-bottom: 0.5rem;
}
.timing-item[data-v-faa365f7] {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: help;
}
.timing-label[data-v-faa365f7] {
font-size: 0.85rem;
color: var(--text-secondary);
}
.timing-value[data-v-faa365f7] {
font-size: 0.85rem;
font-weight: 600;
color: var(--text-primary);
}
.timing-value.timing-not-set[data-v-faa365f7] {
color: #fbbf24;
font-weight: 500;
}
.timing-note[data-v-faa365f7] {
display: block;
font-size: 0.8rem;
color: var(--text-secondary);
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 0.5rem;
margin-top: 0.25rem;
cursor: help;
}
.neon-purple[data-v-992cf224] {
color: #b380ff;
}
.admin-status-pill.status-active[data-v-992cf224] {
color: var(--neon-green);
border-color: rgba(0, 255, 150, 0.4);
background: rgba(0, 255, 150, 0.08);
}
.admin-status-pill.status-ready[data-v-992cf224] {
color: var(--neon-blue, #00c8ff);
border-color: rgba(0, 200, 255, 0.3);
background: rgba(0, 200, 255, 0.08);
}
.admin-status-pill.loading[data-v-992cf224] {
color: var(--text-secondary);
border-color: rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.05);
}
.admin-actions[data-v-992cf224] {
display: flex;
gap: 8px;
}
.area-manager-modal[data-v-ebfc2331] {
width: min(820px, 96vw);
max-height: 92vh;
display: flex;
flex-direction: column;
}
.modal-header[data-v-ebfc2331] {
display: flex; justify-content: space-between; align-items: center;
padding: 1rem 1.25rem;
border-bottom: 1px solid rgba(0, 245, 255, 0.2);
}
.modal-header h2[data-v-ebfc2331] { margin: 0; color: #00f5ff; font-size: 1.3rem;
}
.btn-close[data-v-ebfc2331] { padding: 0.4rem 0.7rem; font-size: 1rem;
}
.tab-nav[data-v-ebfc2331] {
display: flex;
gap: 0.4rem;
padding: 0.6rem 1rem;
border-bottom: 1px solid rgba(0, 245, 255, 0.12);
}
.tab-btn[data-v-ebfc2331] {
padding: 0.55rem 1.1rem;
border-radius: 8px;
border: 1px solid rgba(0, 245, 255, 0.18);
background: rgba(0, 0, 0, 0.3);
color: #b0b0b0;
cursor: pointer;
font-size: 0.95rem;
font-weight: 600;
}
.tab-btn.active[data-v-ebfc2331] {
background: rgba(0, 212, 255, 0.15);
border-color: rgba(0, 245, 255, 0.55);
color: #00f5ff;
}
.err-banner[data-v-ebfc2331] {
margin: 0.6rem 1rem 0;
padding: 0.6rem 0.85rem;
background: rgba(255, 7, 58, 0.15);
border-left: 4px solid #ff073a;
border-radius: 6px;
color: #ff8da4;
font-size: 0.9rem;
}
.modal-body[data-v-ebfc2331] {
overflow-y: auto;
padding: 1rem 1.25rem 1.25rem;
}
/* Areas tab */
.add-row[data-v-ebfc2331] {
display: grid;
grid-template-columns: 1fr 110px 90px 110px;
gap: 0.5rem;
margin-bottom: 0.6rem;
}
.input-glass[data-v-ebfc2331] { padding: 0.55rem 0.75rem; min-height: 44px; box-sizing: border-box;
}
.btn-add[data-v-ebfc2331] { font-weight: 700; min-height: 44px;
}
.filter-row[data-v-ebfc2331] {
display: flex; align-items: center; justify-content: space-between;
margin-bottom: 0.5rem; font-size: 0.9rem;
}
.filter-label[data-v-ebfc2331] { display: flex; align-items: center; gap: 0.4rem; color: #b0b0b0; cursor: pointer;
}
.muted[data-v-ebfc2331] { color: #888;
}
.area-list[data-v-ebfc2331] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem;
}
.area-row-wrap[data-v-ebfc2331] {
padding: 0.55rem 0.6rem;
background: rgba(0, 0, 0, 0.18);
border: 1px solid rgba(0, 245, 255, 0.08);
border-radius: 8px;
display: flex;
flex-direction: column;
gap: 0.45rem;
}
.area-row-wrap.inactive[data-v-ebfc2331] { opacity: 0.5;
}
.area-row[data-v-ebfc2331] {
display: grid;
grid-template-columns: 1fr 110px 90px 110px;
gap: 0.5rem;
align-items: center;
}
.area-row-secondary[data-v-ebfc2331] {
display: grid;
grid-template-columns: 200px 1fr;
gap: 0.5rem;
}
.add-row-secondary[data-v-ebfc2331] {
display: grid;
grid-template-columns: 240px 1fr;
gap: 0.5rem;
margin-bottom: 0.6rem;
}
.chip-row[data-v-ebfc2331] {
display: flex;
flex-wrap: wrap;
gap: 0.35rem;
align-items: center;
min-height: 44px;
padding: 0.3rem 0.5rem;
background: rgba(0, 0, 0, 0.25);
border: 1px solid rgba(0, 245, 255, 0.12);
border-radius: 8px;
}
.area-chip[data-v-ebfc2331] {
padding: 0.3rem 0.7rem;
border-radius: 999px;
border: 1px solid rgba(0, 245, 255, 0.3);
background: rgba(0, 0, 0, 0.35);
color: #b0e8ff;
font-size: 0.82rem;
font-weight: 500;
cursor: pointer;
transition: background 0.15s, border-color 0.15s, transform 0.1s;
letter-spacing: 0.2px;
}
.area-chip[data-v-ebfc2331]:hover { transform: translateY(-1px);
}
.area-chip[data-v-ebfc2331]:active { transform: translateY(0);
}
.area-chip.selected[data-v-ebfc2331] {
background: rgba(0, 212, 255, 0.22);
border-color: rgba(0, 245, 255, 0.7);
color: #00f5ff;
box-shadow: 0 0 12px rgba(0, 245, 255, 0.25);
}
.area-chip.chip-pit[data-v-ebfc2331]:not(.selected) {
border-style: dashed;
color: #a78bfa;
border-color: rgba(167, 139, 250, 0.4);
}
.area-chip.chip-pit.selected[data-v-ebfc2331] {
background: rgba(167, 139, 250, 0.22);
border-color: rgba(167, 139, 250, 0.7);
color: #c4b5fd;
box-shadow: 0 0 12px rgba(167, 139, 250, 0.25);
}
.chip-hint[data-v-ebfc2331] {
color: #888;
font-size: 0.82rem;
font-style: italic;
padding: 0 0.4rem;
}
.btn-toggle[data-v-ebfc2331] {
min-height: 44px;
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.5px;
color: #39ff14;
border-color: rgba(57, 255, 20, 0.4);
}
.btn-toggle.disabled[data-v-ebfc2331] { color: #ff8da4; border-color: rgba(255, 7, 58, 0.4);
}
.empty[data-v-ebfc2331] {
padding: 1rem;
text-align: center;
color: #888;
background: rgba(0, 0, 0, 0.2);
border-radius: 8px;
}
/* Settings tab */
.settings-tab[data-v-ebfc2331] { display: flex; flex-direction: column; gap: 1.25rem;
}
.setting-group[data-v-ebfc2331] { display: flex; flex-direction: column; gap: 0.35rem;
}
.setting-label[data-v-ebfc2331] { color: #b0e8ff; font-size: 0.9rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
}
.setting-input[data-v-ebfc2331] { max-width: 160px;
}
.setting-hint[data-v-ebfc2331] { margin: 0; font-size: 0.85rem; color: #888;
}
.checkbox-label[data-v-ebfc2331] { display: flex; align-items: center; gap: 0.6rem; cursor: pointer; color: #fff; font-size: 0.95rem;
}
.checkbox-label input[type="checkbox"][data-v-ebfc2331] { width: 1.2rem; height: 1.2rem; cursor: pointer;
}
.settings-actions[data-v-ebfc2331] { display: flex; justify-content: flex-end;
}
.settings-actions button[data-v-ebfc2331] { min-height: 48px; padding: 0 1.2rem; font-weight: 600;
}
.modal-footer[data-v-ebfc2331] {
padding: 0.75rem 1.25rem;
border-top: 1px solid rgba(0, 245, 255, 0.15);
display: flex; justify-content: flex-end;
}
@media (max-width: 720px) {
.add-row[data-v-ebfc2331], .area-row[data-v-ebfc2331] { grid-template-columns: 1fr 90px; gap: 0.4rem;
}
.area-order[data-v-ebfc2331], .order-input[data-v-ebfc2331] { display: none;
}
}
.flag-history-modal[data-v-e9721068] {
max-width: 720px;
width: 100%;
max-height: 85vh;
display: flex;
flex-direction: column;
}
.modal-body[data-v-e9721068] {
padding: 1.5rem 2rem;
overflow-y: auto;
flex: 1 1 auto;
}
.modal-footer[data-v-e9721068] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.loading-state[data-v-e9721068], .empty-state[data-v-e9721068], .error-state[data-v-e9721068] {
padding: 2rem;
text-align: center;
color: rgba(255, 255, 255, 0.6);
}
.summary-row[data-v-e9721068] {
display: flex;
gap: 1rem;
margin-bottom: 1.25rem;
flex-wrap: wrap;
}
.stat[data-v-e9721068] {
flex: 1 1 140px;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 0.85rem 1rem;
text-align: center;
}
.stat-label[data-v-e9721068] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 1px;
color: rgba(255, 255, 255, 0.55);
}
.stat-value[data-v-e9721068] {
font-size: 1.4rem;
font-weight: 700;
color: #f5f5f5;
margin-top: 0.25rem;
}
.stat-value.urgent[data-v-e9721068] { color: #ff073a; text-shadow: 0 0 12px rgba(255, 7, 58, 0.4);
}
.stat-value.reason[data-v-e9721068] { font-size: 0.95rem; line-height: 1.35;
}
.history-list[data-v-e9721068] { display: flex; flex-direction: column; gap: 0.85rem;
}
.history-entry[data-v-e9721068] {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 1rem 1.1rem;
position: relative;
}
.history-entry.urgent[data-v-e9721068] { border-color: rgba(255, 7, 58, 0.45); box-shadow: 0 0 12px rgba(255, 7, 58, 0.12);
}
.history-entry.acknowledged[data-v-e9721068] { opacity: 0.78;
}
.entry-header[data-v-e9721068] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
flex-wrap: wrap;
gap: 0.5rem;
}
.entry-reason[data-v-e9721068] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1rem;
color: #f5f5f5;
}
.reason-icon[data-v-e9721068] { font-size: 1.3rem; line-height: 1;
}
.entry-time[data-v-e9721068] { font-size: 0.8rem; color: rgba(255, 255, 255, 0.55);
}
.entry-detail[data-v-e9721068] {
color: rgba(255, 255, 255, 0.85);
font-style: italic;
font-size: 0.9rem;
margin-bottom: 0.4rem;
}
.entry-notes[data-v-e9721068] {
background: rgba(255, 191, 0, 0.06);
border-left: 3px solid rgba(255, 191, 0, 0.5);
border-radius: 4px;
padding: 0.45rem 0.7rem;
margin-top: 0.4rem;
font-size: 0.85rem;
color: rgba(255, 240, 200, 0.9);
}
.entry-linked[data-v-e9721068] {
background: rgba(255, 126, 0, 0.08);
border: 1px solid rgba(255, 126, 0, 0.3);
border-radius: 6px;
padding: 0.45rem 0.7rem;
margin-top: 0.5rem;
font-size: 0.85rem;
color: #ffd6b0;
}
.entry-footer[data-v-e9721068] {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 0.65rem;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.6);
gap: 0.5rem;
flex-wrap: wrap;
}
.ack-pill[data-v-e9721068] {
background: rgba(0, 255, 153, 0.1);
border: 1px solid rgba(0, 255, 153, 0.35);
color: #7cffcd;
padding: 0.25rem 0.6rem;
border-radius: 14px;
font-size: 0.75rem;
}
.ack-pill small[data-v-e9721068] { color: rgba(255, 255, 255, 0.5); margin-left: 4px;
}
.btn-ack[data-v-e9721068] { padding: 0.4rem 0.85rem; font-size: 0.8rem;
}
.flagged-players-card .admin-status-pill[data-v-7ee92ed2] {
margin-bottom: 1.5rem;
}
.modal-content.large[data-v-7ee92ed2] {
max-width: 1280px;
}
.filter-bar[data-v-7ee92ed2] {
display: flex;
gap: 1rem;
flex-wrap: wrap;
margin-bottom: 1.5rem;
align-items: flex-end;
}
.filter-group[data-v-7ee92ed2] {
display: flex;
flex-direction: column;
gap: 0.25rem;
min-width: 180px;
}
.filter-group.search-group[data-v-7ee92ed2] { flex: 1 1 240px;
}
.filter-group label[data-v-7ee92ed2] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--text-secondary);
font-weight: 600;
}
.stats-row[data-v-7ee92ed2] {
display: flex;
gap: 1rem;
margin-bottom: 1.25rem;
flex-wrap: wrap;
}
.stat-box[data-v-7ee92ed2] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
padding: 0.85rem 1rem;
text-align: center;
min-width: 140px;
}
.stat-value[data-v-7ee92ed2] {
font-size: 1.4rem;
font-weight: 700;
color: var(--neon-blue);
}
.stat-value.warning[data-v-7ee92ed2] { color: var(--neon-red, #ff073a);
}
.stat-label[data-v-7ee92ed2] {
font-size: 0.72rem;
text-transform: uppercase;
letter-spacing: 0.5px;
color: var(--text-secondary);
}
.flagged-table-wrapper[data-v-7ee92ed2] {
max-height: 520px;
overflow-y: auto;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
}
.flagged-table[data-v-7ee92ed2] {
display: grid;
grid-template-columns: 1.4fr 1fr auto auto 1.2fr 1fr 1fr auto;
}
.flagged-table-header[data-v-7ee92ed2] { display: contents;
}
.flagged-table-header > span[data-v-7ee92ed2] {
padding: 0.6rem 1rem;
font-size: 0.72rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--text-primary);
background: rgba(255, 255, 255, 0.06);
border-bottom: 2px solid rgba(255, 7, 58, 0.25);
position: sticky;
top: 0;
z-index: 1;
}
.flagged-table-row[data-v-7ee92ed2] { display: contents;
}
.flagged-table-row[data-v-7ee92ed2] > * {
padding: 0.55rem 1rem;
font-size: 0.88rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
display: flex;
align-items: center;
}
.flagged-table-row[data-v-7ee92ed2]:hover > * { background: rgba(255, 7, 58, 0.05);
}
.num[data-v-7ee92ed2] { font-variant-numeric: tabular-nums; font-weight: 600;
}
.num.warning[data-v-7ee92ed2] { color: #ff6b6b;
}
.player-name strong[data-v-7ee92ed2] { color: var(--text-primary);
}
.flagged-table-row code[data-v-7ee92ed2] {
font-family: monospace;
font-size: 0.82rem;
color: var(--neon-blue);
}
.date[data-v-7ee92ed2] { font-family: monospace; font-size: 0.82rem; white-space: nowrap;
}
.actions[data-v-7ee92ed2] { display: flex; gap: 0.25rem; justify-content: flex-end;
}
.btn-icon-only[data-v-7ee92ed2] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
padding: 0.3rem 0.5rem;
cursor: pointer;
font-size: 0.95rem;
transition: all 0.2s ease;
}
.btn-icon-only[data-v-7ee92ed2]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.25);
}
.loading-state[data-v-7ee92ed2], .empty-state[data-v-7ee92ed2], .error-state[data-v-7ee92ed2] {
padding: 2rem;
text-align: center;
color: var(--text-secondary);
}
.error-state[data-v-7ee92ed2] {
color: #ff4757;
background: rgba(255, 71, 87, 0.08);
border: 1px solid rgba(255, 71, 87, 0.25);
border-radius: 10px;
}
.animate-fade-in[data-v-e96684b8] { animation: fadeIn-e96684b8 0.3s ease-out;
}
.animate-scale-in[data-v-e96684b8] { animation: scaleIn-e96684b8 0.3s ease-out;
}
@keyframes fadeIn-e96684b8 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-e96684b8 {
from { opacity: 0; transform: scale(0.9);
}
to { opacity: 1; transform: scale(1);
}
}
.modal-content.large[data-v-e96684b8] { max-width: 900px;
}
.btn-close[data-v-e96684b8] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-e96684b8]:hover { color: var(--text-primary); background: rgba(255, 255, 255, 0.1);
}
.loading-row[data-v-e96684b8] { padding: 2rem; text-align: center; color: var(--text-secondary);
}
.settings-section[data-v-e96684b8] { margin-bottom: 2rem;
}
.settings-section h3[data-v-e96684b8] { color: var(--text-primary); margin-bottom: 0.75rem; font-size: 1.15rem;
}
.section-description[data-v-e96684b8] { color: var(--text-secondary); font-size: 0.85rem; margin-bottom: 1rem; line-height: 1.5;
}
.priority-section[data-v-e96684b8] {
background: rgba(168, 85, 247, 0.05);
border: 1px solid rgba(168, 85, 247, 0.18);
border-radius: 12px;
padding: 1.25rem;
margin-bottom: 1.5rem;
}
.setting-item[data-v-e96684b8] {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.setting-item label[data-v-e96684b8] { display: flex; flex-direction: column; gap: 0.25rem; flex: 1;
}
.setting-item label span[data-v-e96684b8]:first-child { color: var(--text-primary); font-weight: 600;
}
.setting-hint[data-v-e96684b8] { font-size: 0.8rem; color: var(--text-secondary); line-height: 1.4;
}
.setting-control[data-v-e96684b8] { flex-shrink: 0;
}
.btn-toggle[data-v-e96684b8] {
padding: 0.5rem 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-toggle.large[data-v-e96684b8] { padding: 0.625rem 1.25rem; font-size: 1rem; font-weight: 600;
}
.btn-toggle.active[data-v-e96684b8] { background: var(--neon-green); color: var(--bg-primary); border-color: var(--neon-green);
}
.btn-toggle[data-v-e96684b8]:disabled { opacity: 0.5; cursor: not-allowed;
}
/* Disabled fieldset dims the dependent config when the master switch is off */
.config-fieldset[data-v-e96684b8] { border: none; padding: 0; margin: 0; transition: opacity 0.2s ease;
}
.config-fieldset[data-v-e96684b8]:disabled { opacity: 0.5;
}
/* Chip-style checkbox grid (roles + casinos) */
.chip-grid[data-v-e96684b8] { display: flex; flex-wrap: wrap; gap: 0.6rem;
}
.chip-item[data-v-e96684b8] {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.9rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.04);
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.85rem;
}
.chip-item[data-v-e96684b8]:hover { border-color: rgba(0, 245, 255, 0.4);
}
.chip-item.selected[data-v-e96684b8] {
border-color: var(--neon-green);
background: rgba(57, 255, 20, 0.1);
color: var(--text-primary);
}
.chip-item input[data-v-e96684b8] { accent-color: var(--neon-green); cursor: pointer;
}
.chip-label[data-v-e96684b8] { white-space: nowrap;
}
.chip-code[data-v-e96684b8] { color: var(--text-secondary);
}
/* Import safety cards */
.safety-grid[data-v-e96684b8] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
.safety-card[data-v-e96684b8] {
padding: 1rem;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.03);
cursor: pointer;
transition: all 0.2s ease;
}
.safety-card[data-v-e96684b8]:hover { border-color: rgba(0, 245, 255, 0.4);
}
.safety-card.selected[data-v-e96684b8] { border-color: var(--neon-blue); background: rgba(0, 245, 255, 0.07);
}
.safety-head[data-v-e96684b8] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem;
}
.safety-radio[data-v-e96684b8] {
width: 14px; height: 14px; border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.3);
flex-shrink: 0;
}
.safety-radio.on[data-v-e96684b8] { border-color: var(--neon-blue); background: var(--neon-blue); box-shadow: 0 0 6px rgba(0, 245, 255, 0.6);
}
.safety-name[data-v-e96684b8] { font-weight: 700; color: var(--text-primary);
}
.safety-hint[data-v-e96684b8] { font-size: 0.78rem; color: var(--text-secondary); line-height: 1.4; margin: 0;
}
.warn-note[data-v-e96684b8] { font-size: 0.82rem; color: var(--neon-red); margin-top: 0.75rem;
}
.hint-note[data-v-e96684b8] { font-size: 0.8rem; color: var(--text-secondary); margin-top: 0.6rem; font-style: italic;
}
.info-note[data-v-e96684b8] {
display: flex;
align-items: flex-start;
gap: 0.5rem;
padding: 0.75rem 1rem;
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.15);
border-radius: 8px;
font-size: 0.85rem;
color: var(--text-secondary);
}
.note-icon[data-v-e96684b8] { flex-shrink: 0; margin-top: 0.1rem;
}
.neon-purple[data-v-e96684b8] { color: #a855f7; text-shadow: 0 0 12px rgba(168, 85, 247, 0.45);
}
@media (max-width: 640px) {
.safety-grid[data-v-e96684b8] { grid-template-columns: 1fr;
}
}
.admin-view[data-v-ca76809b] {
max-width: 1400px;
margin: 0 auto;
padding: 1rem;
}
.view-header[data-v-ca76809b] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 2rem;
margin-bottom: 2rem;
}
.view-header-content[data-v-ca76809b] {
flex: 1;
}
.view-header-content p[data-v-ca76809b] {
color: var(--text-secondary);
margin-top: 0.5rem;
}
/* Quick Stats */
.admin-stats[data-v-ca76809b] {
margin-bottom: 2rem;
}
.stats-grid[data-v-ca76809b] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.stat-card[data-v-ca76809b] {
display: flex;
align-items: center;
padding: 1.5rem;
gap: 1rem;
box-shadow: none;
}
.stat-icon[data-v-ca76809b] {
font-size: 2rem;
padding: 0.8rem;
border-radius: 12px;
background: rgba(255, 255, 255, 0.1);
}
.stat-info[data-v-ca76809b] {
flex: 1;
}
.stat-value[data-v-ca76809b] {
font-size: 1.8rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.stat-label[data-v-ca76809b] {
font-size: 0.9rem;
color: var(--text-secondary);
opacity: 0.8;
}
/* Grid Toolbar */
.grid-toolbar[data-v-ca76809b] {
display: flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-sm[data-v-ca76809b] {
padding: 0.4rem 0.8rem;
font-size: 0.85rem;
}
.widget-picker-wrapper[data-v-ca76809b] {
position: relative;
}
.widget-picker-dropdown[data-v-ca76809b] {
position: absolute;
top: 100%;
left: 0;
z-index: 100;
margin-top: 4px;
padding: 0.5rem 0;
min-width: 200px;
background: rgba(20, 25, 35, 0.98);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
backdrop-filter: blur(20px);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
list-style: none;
max-height: 300px;
overflow-y: auto;
}
.widget-picker-item[data-v-ca76809b] {
padding: 0.6rem 1rem;
cursor: pointer;
color: var(--text-primary);
font-size: 0.85rem;
transition: background 0.15s ease;
}
.widget-picker-item[data-v-ca76809b]:hover {
background: rgba(255, 255, 255, 0.08);
}
/* Gridstack Section */
.admin-grid-section[data-v-ca76809b] {
min-height: 200px;
}
.admin-edit-mode[data-v-ca76809b] {
background: rgba(0, 150, 255, 0.03);
border: 2px dashed rgba(0, 150, 255, 0.2);
border-radius: 12px;
padding: 0.5rem;
}
/* Gridstack item overrides — match Home.vue pattern */
[data-v-ca76809b] .grid-stack-item-content {
overflow: visible !important;
background: transparent !important;
inset: 8px !important;
}
[data-v-ca76809b] .grid-stack-item {
overflow: visible !important;
}
.admin-edit-mode[data-v-ca76809b] .grid-stack-item-content {
outline: 2px dashed var(--glass-border, rgba(255, 255, 255, 0.15));
outline-offset: -2px;
border-radius: 12px;
}
[data-v-ca76809b] .grid-stack-placeholder > .placeholder-content {
background: rgba(0, 150, 255, 0.08) !important;
border: 2px dashed var(--neon-blue) !important;
border-radius: 12px;
}
/* Edit mode remove buttons */
.admin-edit-mode[data-v-ca76809b] .gs-remove-btn {
position: absolute;
top: 4px;
right: 4px;
z-index: 10;
width: 24px;
height: 24px;
border-radius: 50%;
border: none;
background: rgba(255, 7, 58, 0.8);
color: white;
font-size: 14px;
line-height: 1;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s, transform 0.2s;
}
.admin-edit-mode[data-v-ca76809b] .gs-remove-btn:hover {
background: rgba(255, 7, 58, 1);
transform: scale(1.15);
}
/* Breadcrumb */
.breadcrumb-nav[data-v-ca76809b] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0;
margin-bottom: 1rem;
}
.breadcrumb-link[data-v-ca76809b] {
display: flex;
align-items: center;
gap: 0.3rem;
color: var(--text-secondary);
text-decoration: none;
transition: color 0.2s;
}
.breadcrumb-link[data-v-ca76809b]:hover {
color: var(--neon-blue);
}
.breadcrumb-separator[data-v-ca76809b] {
color: var(--text-secondary);
opacity: 0.5;
}
.breadcrumb-current[data-v-ca76809b] {
color: var(--text-primary);
font-weight: 500;
}
.refresh-countdown-wrapper[data-v-0608d3c6] {
display: inline-flex;
align-items: center;
gap: 6px;
}
.refresh-countdown[data-v-0608d3c6] {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 50%;
cursor: pointer;
padding: 0;
transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
flex-shrink: 0;
}
.refresh-countdown[data-v-0608d3c6]:hover {
background: rgba(255, 255, 255, 0.1);
transform: scale(1.12);
box-shadow: 0 0 12px rgba(0, 245, 255, 0.2);
}
.refresh-countdown[data-v-0608d3c6]:active {
transform: scale(0.95);
}
.countdown-ring[data-v-0608d3c6] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.countdown-arc[data-v-0608d3c6] {
transition: stroke 0.3s ease;
}
.countdown-value[data-v-0608d3c6] {
font-weight: 700;
color: var(--text-primary, #fff);
z-index: 1;
font-variant-numeric: tabular-nums;
line-height: 1;
user-select: none;
}
.countdown-loading[data-v-0608d3c6] {
width: 40%;
height: 40%;
border: 2px solid rgba(255, 255, 255, 0.15);
border-top-color: var(--neon-blue, #00f5ff);
border-radius: 50%;
animation: countdown-spin-0608d3c6 0.6s linear infinite;
z-index: 1;
}
.refreshing[data-v-0608d3c6] {
border-color: rgba(0, 245, 255, 0.15);
}
.refreshing .countdown-ring[data-v-0608d3c6] {
animation: countdown-spin-0608d3c6 1.2s linear infinite;
}
.paused[data-v-0608d3c6] {
opacity: 0.5;
}
.countdown-label[data-v-0608d3c6] {
font-size: 12px;
color: var(--text-secondary, rgba(255,255,255,0.6));
font-weight: 500;
white-space: nowrap;
}
@keyframes countdown-spin-0608d3c6 {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.casino-view[data-v-9e252dc1] {
max-width: 1600px;
margin: 0 auto;
padding: 1rem;
}
.view-header[data-v-9e252dc1] {
padding: 2rem;
text-align: center;
margin-bottom: 2rem;
}
/* Floor Dashboard */
.floor-dashboard[data-v-9e252dc1] {
margin-bottom: 2rem;
}
.dashboard-stats[data-v-9e252dc1] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}
.stat-card[data-v-9e252dc1] {
display: flex;
align-items: center;
padding: 1.5rem;
gap: 1rem;
}
.stat-icon[data-v-9e252dc1] {
font-size: 2rem;
padding: 0.8rem;
border-radius: 12px;
background: rgba(255, 255, 255, 0.1);
}
.stat-info[data-v-9e252dc1] {
flex: 1;
}
.stat-value[data-v-9e252dc1] {
font-size: 1.8rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.stat-label[data-v-9e252dc1] {
font-size: 0.9rem;
color: var(--text-secondary);
opacity: 0.8;
margin-bottom: 0.5rem;
}
.stat-trend[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.7;
}
.stat-trend.positive[data-v-9e252dc1] {
color: var(--neon-green);
}
/* Floor Alerts */
.floor-alerts[data-v-9e252dc1] {
background: rgba(255, 100, 100, 0.1);
border: 1px solid rgba(255, 100, 100, 0.3);
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 2rem;
}
.alerts-header[data-v-9e252dc1] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.alerts-header h3[data-v-9e252dc1] {
color: var(--neon-red);
margin: 0;
font-size: 1.2rem;
}
.alerts-list[data-v-9e252dc1] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.alert-item[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
border-left: 4px solid;
}
.alert-item.high[data-v-9e252dc1] {
border-left-color: var(--neon-red);
}
.alert-item.medium[data-v-9e252dc1] {
border-left-color: var(--neon-orange);
}
.alert-item.low[data-v-9e252dc1] {
border-left-color: var(--neon-blue);
}
.alert-icon[data-v-9e252dc1] {
font-size: 1.2rem;
}
.alert-content[data-v-9e252dc1] {
flex: 1;
}
.alert-message[data-v-9e252dc1] {
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.alert-time[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.7;
}
.alert-dismiss[data-v-9e252dc1] {
background: none;
border: none;
color: var(--text-secondary);
cursor: pointer;
padding: 0.25rem;
border-radius: 4px;
transition: all 0.3s ease;
}
.alert-dismiss[data-v-9e252dc1]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
/* Flag alert styling */
.activity-item.is-flag[data-v-9e252dc1] {
border-left: 4px solid var(--neon-orange);
background: linear-gradient(90deg, rgba(255, 126, 0, 0.12), rgba(255, 126, 0, 0.05));
}
.activity-item.critical[data-v-9e252dc1] {
border-left-width: 5px;
animation: criticalPulse-9e252dc1 2s ease-in-out infinite;
}
@keyframes criticalPulse-9e252dc1 {
0%,
100% {
box-shadow: 0 0 10px rgba(255, 126, 0, 0.2);
}
50% {
box-shadow: 0 0 20px rgba(255, 126, 0, 0.4);
}
}
.activity-icon.flag[data-v-9e252dc1] {
color: var(--neon-orange);
filter: drop-shadow(0 0 8px rgba(255, 126, 0, 0.6));
}
.badge-flag[data-v-9e252dc1] {
background: var(--neon-orange);
color: var(--bg-primary);
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-weight: 600;
font-size: 0.75rem;
text-transform: uppercase;
}
/* Floor Controls */
.floor-controls[data-v-9e252dc1] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.5rem 2rem;
margin-bottom: 2rem;
flex-wrap: wrap;
gap: 1rem;
}
.view-controls[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 1rem;
}
.view-controls h3[data-v-9e252dc1] {
color: var(--text-primary);
margin: 0;
}
.control-buttons[data-v-9e252dc1] {
display: flex;
gap: 0.5rem;
}
.btn-view[data-v-9e252dc1] {
padding: 0.6rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-view[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.btn-view.active[data-v-9e252dc1] {
background: var(--neon-blue);
color: white;
border-color: var(--neon-blue);
}
.filter-controls[data-v-9e252dc1] {
display: flex;
gap: 1rem;
align-items: end;
}
.filter-group[data-v-9e252dc1] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.filter-group label[data-v-9e252dc1] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.input-glass.small[data-v-9e252dc1] {
padding: 0.5rem 1rem;
font-size: 0.9rem;
min-width: 120px;
}
.refresh-controls[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 1rem;
}
.auto-refresh[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.auto-refresh label[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-primary);
cursor: pointer;
}
.auto-refresh input[type="checkbox"][data-v-9e252dc1] {
accent-color: var(--neon-green);
}
.refresh-indicator[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--neon-green);
font-size: 0.8rem;
}
.pulse-dot[data-v-9e252dc1] {
width: 8px;
height: 8px;
background: var(--neon-green);
border-radius: 50%;
animation: pulse-9e252dc1 2s infinite;
}
@keyframes pulse-9e252dc1 {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.3;
}
}
/* Floor Layout */
.floor-layout[data-v-9e252dc1] {
min-height: 500px;
}
/* Grid View */
.floor-grid[data-v-9e252dc1] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 1.5rem;
}
.floor-table-card[data-v-9e252dc1] {
position: relative;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
backdrop-filter: blur(10px);
cursor: pointer;
transition: all 0.3s ease;
overflow: hidden;
}
.floor-table-card[data-v-9e252dc1]:hover {
transform: translateY(-2px);
box-shadow: 0 15px 30px rgba(0, 150, 255, 0.1);
}
.floor-table-card.active[data-v-9e252dc1] {
border-color: var(--neon-green);
box-shadow: 0 0 20px rgba(0, 255, 150, 0.1);
}
.floor-table-card.full[data-v-9e252dc1] {
border-color: var(--neon-orange);
}
.floor-table-card.alert[data-v-9e252dc1] {
border-color: var(--neon-red);
animation: alertPulse-9e252dc1 2s infinite;
}
@keyframes alertPulse-9e252dc1 {
0%,
100% {
box-shadow: 0 0 20px rgba(255, 100, 100, 0.1);
}
50% {
box-shadow: 0 0 20px rgba(255, 100, 100, 0.3);
}
}
.table-status-indicator[data-v-9e252dc1] {
position: absolute;
top: 1rem;
right: 1rem;
}
.status-dot[data-v-9e252dc1] {
width: 12px;
height: 12px;
border-radius: 50%;
animation: statusPulse-9e252dc1 2s infinite;
}
.table-status-indicator.active .status-dot[data-v-9e252dc1] {
background: var(--neon-green);
}
.table-status-indicator.closed .status-dot[data-v-9e252dc1] {
background: var(--neon-red);
animation: none;
}
.table-status-indicator.maintenance .status-dot[data-v-9e252dc1] {
background: var(--neon-orange);
}
@keyframes statusPulse-9e252dc1 {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.5;
}
}
.table-info[data-v-9e252dc1] {
margin-bottom: 1rem;
}
.table-name[data-v-9e252dc1] {
font-size: 1.4rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.table-game[data-v-9e252dc1] {
font-size: 0.9rem;
color: var(--text-secondary);
opacity: 0.8;
text-transform: uppercase;
letter-spacing: 0.5px;
margin-bottom: 0.25rem;
}
.table-limits[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--neon-blue);
}
.player-occupancy[data-v-9e252dc1] {
margin-bottom: 1rem;
}
.occupancy-visual[data-v-9e252dc1] {
display: flex;
gap: 0.25rem;
margin-bottom: 0.5rem;
}
.seat-indicator[data-v-9e252dc1] {
width: 20px;
height: 20px;
border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.3);
transition: all 0.3s ease;
}
.seat-indicator.occupied[data-v-9e252dc1] {
background: var(--neon-green);
border-color: var(--neon-green);
box-shadow: 0 0 8px rgba(0, 255, 150, 0.5);
}
.occupancy-text[data-v-9e252dc1] {
font-size: 0.9rem;
color: var(--text-secondary);
text-align: center;
}
.dealer-badge[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
margin-bottom: 1rem;
}
.dealer-avatar[data-v-9e252dc1] {
width: 30px;
height: 30px;
border-radius: 50%;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: 600;
font-size: 0.8rem;
}
.dealer-name[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--text-primary);
}
.no-dealer-badge[data-v-9e252dc1] {
padding: 0.5rem;
background: rgba(255, 255, 255, 0.02);
border: 1px dashed rgba(255, 255, 255, 0.2);
border-radius: 8px;
text-align: center;
margin-bottom: 1rem;
}
.no-dealer-text[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.7;
font-style: italic;
}
.table-mini-metrics[data-v-9e252dc1] {
display: flex;
justify-content: space-between;
margin-bottom: 1rem;
}
.mini-metric[data-v-9e252dc1] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.metric-label[data-v-9e252dc1] {
font-size: 0.7rem;
color: var(--text-secondary);
opacity: 0.8;
text-transform: uppercase;
}
.metric-value[data-v-9e252dc1] {
font-size: 0.9rem;
font-weight: 600;
color: var(--text-primary);
}
.mini-speed-rating[data-v-9e252dc1] {
display: flex;
gap: 0.125rem;
}
.mini-speed-star[data-v-9e252dc1] {
font-size: 0.6rem;
opacity: 0.3;
}
.mini-speed-star.active[data-v-9e252dc1] {
opacity: 1;
color: var(--neon-orange);
}
.table-alert-indicator[data-v-9e252dc1] {
position: absolute;
top: 0.5rem;
left: 0.5rem;
}
.alert-badge[data-v-9e252dc1] {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
background: var(--neon-red);
color: white;
border-radius: 50%;
font-size: 0.8rem;
font-weight: 700;
animation: alertBounce-9e252dc1 1s infinite;
}
@keyframes alertBounce-9e252dc1 {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
}
/* Floor Map View */
.floor-map[data-v-9e252dc1] {
position: relative;
background: linear-gradient(135deg, rgba(0, 0, 0, 0.3), rgba(20, 25, 35, 0.5));
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
overflow: hidden;
min-height: 600px;
}
.floor-map.edit-mode[data-v-9e252dc1] {
border-color: var(--neon-blue);
box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
}
.edit-mode-banner[data-v-9e252dc1] {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 100;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
color: white;
padding: 0.75rem 1.5rem;
display: flex;
align-items: center;
gap: 1rem;
font-weight: 600;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
.banner-icon[data-v-9e252dc1] {
font-size: 1.25rem;
}
.banner-text[data-v-9e252dc1] {
flex: 1;
}
.unsaved-badge[data-v-9e252dc1] {
background: rgba(255, 255, 255, 0.3);
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-size: 0.813rem;
font-weight: 700;
animation: pulseBadge-9e252dc1 2s ease-in-out infinite;
}
@keyframes pulseBadge-9e252dc1 {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.7;
}
}
.btn-banner-close[data-v-9e252dc1] {
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
padding: 0.375rem 0.75rem;
border-radius: 6px;
cursor: pointer;
font-size: 0.875rem;
font-weight: 600;
transition: all 0.2s ease;
}
.btn-banner-close[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.3);
transform: translateY(-1px);
}
.map-container[data-v-9e252dc1] {
position: relative;
width: 100%;
height: 600px;
padding-top: 3rem;
/* Space for edit banner when active */
}
.map-section[data-v-9e252dc1] {
position: absolute;
border: 2px dashed rgba(255, 255, 255, 0.2);
border-radius: 12px;
padding: 1rem;
transition: all 0.3s ease;
}
.map-section.editing[data-v-9e252dc1] {
border-width: 3px;
box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
cursor: move;
}
.section-label[data-v-9e252dc1] {
position: absolute;
top: -0.75rem;
left: 1rem;
background: var(--bg-primary);
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-size: 0.8rem;
font-weight: 600;
color: var(--text-primary);
border: 1px solid rgba(255, 255, 255, 0.2);
display: flex;
align-items: center;
gap: 0.5rem;
z-index: 10;
pointer-events: auto;
}
.section-dimensions[data-v-9e252dc1] {
font-size: 0.7rem;
color: var(--text-muted);
opacity: 0.8;
}
.btn-section-edit[data-v-9e252dc1],
.btn-section-delete[data-v-9e252dc1] {
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
color: white;
padding: 0.25rem 0.5rem;
border-radius: 6px;
cursor: pointer;
font-size: 0.875rem;
transition: all 0.2s ease;
margin-left: 0.25rem;
}
.btn-section-edit[data-v-9e252dc1]:hover {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 12px rgba(0, 212, 255, 0.4);
}
.btn-section-delete[data-v-9e252dc1]:hover {
background: #ef4444;
border-color: #ef4444;
box-shadow: 0 0 12px rgba(239, 68, 68, 0.4);
}
.btn-add-section[data-v-9e252dc1] {
position: absolute;
bottom: 20px;
right: 20px;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
color: white;
border: none;
padding: 0.75rem 1.25rem;
border-radius: 12px;
cursor: pointer;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
transition: all 0.2s ease;
z-index: 50;
}
.btn-add-section[data-v-9e252dc1]:hover {
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}
.section-tables[data-v-9e252dc1] {
position: relative;
width: 100%;
height: 100%;
}
.map-table[data-v-9e252dc1] {
position: absolute;
width: 100px;
min-height: 85px;
background: rgba(50, 50, 50, 0.9);
border: 3px solid rgba(255, 255, 255, 0.3);
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.35rem;
padding: 0.65rem 0.5rem;
font-size: 0.75rem;
user-select: none;
backdrop-filter: blur(10px);
}
.map-table[data-v-9e252dc1]:hover {
transform: scale(1.1);
z-index: 10;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}
.map-table.dragging[data-v-9e252dc1] {
opacity: 0.6;
cursor: grabbing !important;
transform: scale(1.15) rotate(2deg);
z-index: 999;
transition: none !important;
/* Disable transition during drag for smooth movement */
}
.edit-mode .map-table[data-v-9e252dc1] {
cursor: grab;
border-style: dashed;
}
.edit-mode .map-table[data-v-9e252dc1]:hover {
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);
}
.map-table.active[data-v-9e252dc1] {
background: rgba(0, 255, 150, 0.15);
border-color: var(--neon-green);
box-shadow: 0 0 15px rgba(0, 255, 150, 0.3);
}
.map-table.closed[data-v-9e252dc1] {
background: rgba(255, 50, 50, 0.15);
border-color: var(--neon-red);
opacity: 0.7;
}
.map-table.full[data-v-9e252dc1] {
background: rgba(255, 150, 0, 0.15);
border-color: var(--neon-orange);
box-shadow: 0 0 15px rgba(255, 150, 0, 0.3);
}
.map-table.alert[data-v-9e252dc1] {
background: rgba(255, 100, 100, 0.2);
border-color: var(--neon-red);
animation: mapAlertPulse-9e252dc1 1.5s infinite;
box-shadow: 0 0 20px rgba(255, 50, 50, 0.5);
}
@keyframes mapAlertPulse-9e252dc1 {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
}
.map-table-badge[data-v-9e252dc1] {
font-weight: 700;
font-size: 1rem;
color: var(--text-primary);
font-family: 'Courier New', monospace;
letter-spacing: 0.5px;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}
.map-table-limits[data-v-9e252dc1] {
font-size: 0.75rem;
color: var(--neon-green);
font-weight: 600;
letter-spacing: 0.5px;
background: rgba(0, 255, 150, 0.1);
padding: 0.125rem 0.5rem;
border-radius: 4px;
border: 1px solid rgba(0, 255, 150, 0.3);
}
.map-table-players[data-v-9e252dc1] {
width: 100%;
display: flex;
justify-content: center;
margin-top: 0.25rem;
}
.player-dots[data-v-9e252dc1] {
display: flex;
gap: 3px;
justify-content: center;
flex-wrap: wrap;
max-width: 100%;
}
.player-dot[data-v-9e252dc1] {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.15);
border: 1px solid rgba(255, 255, 255, 0.25);
transition: all 0.3s ease;
}
.player-dot.active[data-v-9e252dc1] {
background: var(--neon-green);
border-color: var(--neon-green);
box-shadow: 0 0 6px rgba(0, 255, 150, 0.6);
animation: playerDotPulse-9e252dc1 2s ease-in-out infinite;
}
@keyframes playerDotPulse-9e252dc1 {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.7;
}
}
.map-table-occupancy[data-v-9e252dc1] {
color: var(--text-secondary);
font-size: 0.65rem;
font-weight: 600;
}
.map-table-tooltip[data-v-9e252dc1] {
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%) translateY(-8px);
background: rgba(20, 25, 35, 0.98);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.75rem;
min-width: 180px;
opacity: 0;
pointer-events: none;
transition: all 0.2s ease;
z-index: 1000;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
backdrop-filter: blur(10px);
}
.map-table:hover .map-table-tooltip[data-v-9e252dc1] {
opacity: 1;
}
.tooltip-row[data-v-9e252dc1] {
font-size: 0.75rem;
color: var(--text-secondary);
padding: 0.25rem 0;
white-space: nowrap;
}
.tooltip-row[data-v-9e252dc1]:first-child {
font-size: 0.875rem;
color: var(--text-primary);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
margin-bottom: 0.25rem;
}
.map-legend[data-v-9e252dc1] {
position: absolute;
bottom: 1rem;
left: 1rem;
display: flex;
gap: 1rem;
background: rgba(20, 25, 35, 0.9);
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.legend-item[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.8rem;
color: var(--text-primary);
}
.legend-dot[data-v-9e252dc1] {
width: 12px;
height: 12px;
border-radius: 50%;
}
.legend-dot.active[data-v-9e252dc1] {
background: var(--neon-green);
}
.legend-dot.closed[data-v-9e252dc1] {
background: var(--neon-red);
}
.legend-dot.full[data-v-9e252dc1] {
background: var(--neon-orange);
}
.legend-dot.alert[data-v-9e252dc1] {
background: var(--neon-red);
animation: pulse-9e252dc1 1s infinite;
}
/* Modal Styles */
.modal-overlay[data-v-9e252dc1] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-9e252dc1] {
background: linear-gradient(135deg, rgba(20, 25, 35, 0.98), rgba(30, 35, 45, 0.95));
border: 2px solid rgba(255, 255, 255, 0.15);
border-radius: 20px;
max-width: 520px;
width: 90%;
max-height: 90vh;
overflow: hidden;
backdrop-filter: blur(20px);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-9e252dc1] {
padding: 1.5rem 2rem;
max-height: calc(90vh - 140px);
overflow-y: auto;
}
.form-group[data-v-9e252dc1] {
margin-bottom: 1.5rem;
}
.form-group label[data-v-9e252dc1] {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
font-size: 0.875rem;
color: var(--neon-blue);
text-transform: uppercase;
letter-spacing: 0.5px;
}
.form-row[data-v-9e252dc1] {
display: flex;
gap: 1rem;
margin-bottom: 1.5rem;
}
.form-group.half[data-v-9e252dc1] {
flex: 1;
margin-bottom: 0;
}
.input-text[data-v-9e252dc1],
.input-number[data-v-9e252dc1] {
width: 100%;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 1rem;
transition: all 0.3s ease;
}
.input-text[data-v-9e252dc1]:focus,
.input-number[data-v-9e252dc1]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.1),
0 0 12px rgba(0, 212, 255, 0.3);
background: rgba(255, 255, 255, 0.08);
}
.input-text[data-v-9e252dc1]:disabled {
opacity: 0.5;
cursor: not-allowed;
background: rgba(255, 255, 255, 0.02);
}
.input-number[data-v-9e252dc1] {
font-family: 'Courier New', monospace;
font-weight: 600;
}
.warning-text[data-v-9e252dc1] {
display: block;
margin-top: 0.5rem;
color: #ff9800;
font-size: 0.8125rem;
font-weight: 500;
}
.color-picker-wrapper[data-v-9e252dc1] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.input-color[data-v-9e252dc1] {
width: 60px;
height: 45px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-radius: 8px;
cursor: pointer;
background: transparent;
transition: all 0.3s ease;
}
.input-color[data-v-9e252dc1]:hover {
border-color: var(--neon-blue);
box-shadow: 0 0 12px rgba(0, 212, 255, 0.3);
}
.color-preview[data-v-9e252dc1] {
width: 45px;
height: 45px;
border-radius: 8px;
border: 2px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2),
inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
.color-hex[data-v-9e252dc1] {
flex: 1;
font-family: 'Courier New', monospace;
text-transform: uppercase;
font-weight: 600;
}
.modal-footer[data-v-9e252dc1] {
padding: 1.25rem 2rem;
background: rgba(0, 0, 0, 0.2);
border-top: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
gap: 1rem;
justify-content: flex-end;
}
.btn-primary[data-v-9e252dc1],
.btn-secondary[data-v-9e252dc1] {
padding: 0.75rem 1.5rem;
border-radius: 8px;
font-weight: 600;
font-size: 0.9375rem;
cursor: pointer;
transition: all 0.3s ease;
border: none;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-primary[data-v-9e252dc1] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
color: white;
box-shadow: 0 4px 12px rgba(0, 212, 255, 0.3);
}
.btn-primary[data-v-9e252dc1]:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(0, 212, 255, 0.4),
0 0 20px rgba(0, 212, 255, 0.3);
}
.btn-secondary[data-v-9e252dc1] {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.btn-secondary[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.15);
border-color: rgba(255, 255, 255, 0.3);
}
.modal-header[data-v-9e252dc1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-9e252dc1] {
margin: 0;
}
.btn-close[data-v-9e252dc1] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-9e252dc1]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-9e252dc1] {
padding: 2rem;
}
.table-quick-info[data-v-9e252dc1] {
margin-bottom: 2rem;
}
.quick-info-grid[data-v-9e252dc1] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
}
.info-item[data-v-9e252dc1] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.info-item select.input-glass.small[data-v-9e252dc1] {
margin-top: 0.25rem;
padding: 0.375rem 0.5rem;
font-size: 0.8rem;
cursor: pointer;
}
.info-label[data-v-9e252dc1] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.8;
}
.info-value[data-v-9e252dc1] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
}
.quick-actions-grid[data-v-9e252dc1] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
.action-btn[data-v-9e252dc1] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
color: var(--text-primary);
}
.action-btn[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
}
.action-btn.view[data-v-9e252dc1] {
border-color: var(--neon-blue);
}
.action-btn.view[data-v-9e252dc1]:hover {
box-shadow: 0 0 20px rgba(0, 150, 255, 0.2);
}
.action-btn.dealer[data-v-9e252dc1] {
border-color: var(--neon-purple);
}
.action-btn.dealer[data-v-9e252dc1]:hover {
box-shadow: 0 0 20px rgba(147, 51, 234, 0.2);
}
.action-btn.players[data-v-9e252dc1] {
border-color: var(--neon-green);
}
.action-btn.players[data-v-9e252dc1]:hover {
box-shadow: 0 0 20px rgba(0, 255, 150, 0.2);
}
.action-btn.status[data-v-9e252dc1] {
border-color: var(--neon-orange);
}
.action-btn.status[data-v-9e252dc1]:hover {
box-shadow: 0 0 20px rgba(255, 165, 0, 0.2);
}
.action-icon[data-v-9e252dc1] {
font-size: 1.5rem;
}
/* Common button styles */
.btn-small[data-v-9e252dc1] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.1);
}
.btn-glass[data-v-9e252dc1] {
padding: 0.6rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--text-primary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-glass[data-v-9e252dc1]:hover {
background: rgba(255, 255, 255, 0.1);
}
.btn-icon[data-v-9e252dc1] {
font-size: 1rem;
}
.input-glass[data-v-9e252dc1] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
.input-glass[data-v-9e252dc1]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
/* Animations */
.animate-fade-in[data-v-9e252dc1] {
animation: fadeIn-9e252dc1 0.3s ease-out;
}
.animate-scale-in[data-v-9e252dc1] {
animation: scaleIn-9e252dc1 0.3s ease-out;
}
@keyframes fadeIn-9e252dc1 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-9e252dc1 {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.floor-controls[data-v-9e252dc1] {
flex-direction: column;
align-items: stretch;
gap: 1rem;
}
.view-controls[data-v-9e252dc1],
.filter-controls[data-v-9e252dc1],
.refresh-controls[data-v-9e252dc1] {
justify-content: center;
}
.dashboard-stats[data-v-9e252dc1] {
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.floor-grid[data-v-9e252dc1] {
grid-template-columns: 1fr;
}
.map-container[data-v-9e252dc1] {
height: 400px;
}
.quick-actions-grid[data-v-9e252dc1] {
grid-template-columns: 1fr;
}
.quick-info-grid[data-v-9e252dc1] {
grid-template-columns: 1fr;
}
}
/* Modal Base Styles */
.modal-overlay[data-v-ecfe9ae3] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
justify-content: center;
z-index: 2000;
/* Higher than CompModal */
}
.modal-content[data-v-ecfe9ae3] {
background: rgba(20, 25, 35, 0.98);
border: 2px solid var(--neon-orange);
border-radius: 20px;
max-width: 550px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
box-shadow: 0 0 40px rgba(255, 102, 0, 0.3);
}
.modal-header[data-v-ecfe9ae3] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-ecfe9ae3] {
margin: 0;
font-size: 1.5rem;
}
.btn-close[data-v-ecfe9ae3] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-ecfe9ae3]:hover:not(:disabled) {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.btn-close[data-v-ecfe9ae3]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.modal-body[data-v-ecfe9ae3] {
padding: 2rem;
}
.modal-footer[data-v-ecfe9ae3] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Override Warning Styles */
.override-warning[data-v-ecfe9ae3] {
display: flex;
gap: 1rem;
padding: 1.25rem;
background: rgba(255, 102, 0, 0.1);
border: 1px solid var(--neon-orange);
border-radius: 12px;
margin-bottom: 1.5rem;
}
.warning-icon[data-v-ecfe9ae3] {
font-size: 2.5rem;
line-height: 1;
}
.warning-message h3[data-v-ecfe9ae3] {
margin: 0 0 0.5rem 0;
color: var(--neon-orange);
font-size: 1.1rem;
}
.warning-message p[data-v-ecfe9ae3] {
margin: 0;
color: var(--text-secondary);
font-size: 0.95rem;
line-height: 1.5;
}
/* Override Details */
.override-details[data-v-ecfe9ae3] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1rem;
margin-bottom: 1.5rem;
}
.detail-row[data-v-ecfe9ae3] {
display: flex;
justify-content: space-between;
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.detail-row[data-v-ecfe9ae3]:last-child {
border-bottom: none;
}
.detail-row .label[data-v-ecfe9ae3] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.detail-row .value[data-v-ecfe9ae3] {
color: var(--text-primary);
font-weight: 600;
font-size: 0.95rem;
}
/* PIN Display */
.pin-display[data-v-ecfe9ae3] {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 1.5rem;
}
.pin-display>label[data-v-ecfe9ae3] {
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
margin-bottom: 0.75rem;
}
.pin-dots[data-v-ecfe9ae3] {
display: flex;
gap: 1rem;
margin-bottom: 0.75rem;
}
.pin-dot[data-v-ecfe9ae3] {
width: 20px;
height: 20px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
border: 2px solid rgba(255, 255, 255, 0.3);
transition: all 0.3s ease;
}
.pin-dot.filled[data-v-ecfe9ae3] {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 10px var(--neon-blue);
}
.pin-dot.error[data-v-ecfe9ae3] {
background: var(--neon-red);
border-color: var(--neon-red);
box-shadow: 0 0 10px var(--neon-red);
animation: shake-ecfe9ae3 0.5s ease-in-out;
}
@keyframes shake-ecfe9ae3 {
0%,
100% {
transform: translateX(0);
}
25% {
transform: translateX(-5px);
}
75% {
transform: translateX(5px);
}
}
.error-message[data-v-ecfe9ae3] {
color: var(--neon-red);
font-size: 0.9rem;
text-align: center;
font-weight: 500;
}
/* Keypad */
.keypad[data-v-ecfe9ae3] {
margin-bottom: 1.5rem;
}
.keypad-grid[data-v-ecfe9ae3] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.75rem;
max-width: 280px;
margin: 0 auto;
}
.key-button[data-v-ecfe9ae3] {
width: 80px;
height: 80px;
background: var(--glass-bg, rgba(255, 255, 255, 0.05));
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.1));
border-radius: 16px;
color: var(--text-primary);
font-size: 1.5rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.key-button[data-v-ecfe9ae3]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}
.key-button[data-v-ecfe9ae3]:active:not(:disabled) {
transform: translateY(0);
}
.key-button[data-v-ecfe9ae3]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.key-clear[data-v-ecfe9ae3] {
background: rgba(255, 7, 58, 0.1);
border-color: var(--neon-red);
color: var(--neon-red);
font-size: 0.85rem;
}
.key-clear[data-v-ecfe9ae3]:hover:not(:disabled) {
background: rgba(255, 7, 58, 0.2);
box-shadow: 0 8px 25px rgba(255, 7, 58, 0.3);
}
.key-backspace[data-v-ecfe9ae3] {
background: rgba(255, 102, 0, 0.1);
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.key-backspace[data-v-ecfe9ae3]:hover:not(:disabled) {
background: rgba(255, 102, 0, 0.2);
box-shadow: 0 8px 25px rgba(255, 102, 0, 0.3);
}
/* Authorization Info */
.authorization-info[data-v-ecfe9ae3] {
text-align: center;
padding: 0.75rem;
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.2);
border-radius: 8px;
}
.authorization-info p[data-v-ecfe9ae3] {
margin: 0;
color: var(--neon-blue);
font-size: 0.85rem;
}
/* Button Styles */
.btn-glass[data-v-ecfe9ae3] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 0.75rem 1.5rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
font-weight: 500;
}
.btn-glass[data-v-ecfe9ae3]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.btn-glass[data-v-ecfe9ae3]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.btn-neon[data-v-ecfe9ae3] {
padding: 0.75rem 1.5rem;
border: 1px solid;
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
min-width: 180px;
}
.btn-neon.neon-green[data-v-ecfe9ae3] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
border-color: var(--neon-green);
}
.btn-neon.neon-blue[data-v-ecfe9ae3] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
}
.btn-neon.neon-blue[data-v-ecfe9ae3]:hover:not(:disabled) {
background: rgba(0, 245, 255, 0.3);
box-shadow: 0 0 30px rgba(0, 245, 255, 0.5);
transform: translateY(-2px);
}
.btn-neon[data-v-ecfe9ae3]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.loading-spinner[data-v-ecfe9ae3] {
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-left: 2px solid var(--neon-blue);
border-radius: 50%;
animation: spin-ecfe9ae3 1s linear infinite;
}
@keyframes spin-ecfe9ae3 {
to {
transform: rotate(360deg);
}
}
/* Text Styles */
.text-gradient[data-v-ecfe9ae3] {
background: linear-gradient(135deg, var(--neon-orange), var(--neon-red));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.text-sm[data-v-ecfe9ae3] {
font-size: 0.875rem;
}
.text-muted[data-v-ecfe9ae3] {
opacity: 0.7;
}
/* CSS Variables */
[data-v-ecfe9ae3]:root {
--text-primary: #ffffff;
--text-secondary: #b8c5d1;
--bg-primary: #0f1419;
--neon-blue: #00f5ff;
--neon-purple: #8a2be2;
--neon-green: #39ff14;
--neon-orange: #ff6600;
--neon-red: #ff073a;
}
/* Animations */
.animate-fade-in[data-v-ecfe9ae3] {
animation: fadeIn-ecfe9ae3 0.3s ease-out;
}
.animate-scale-in[data-v-ecfe9ae3] {
animation: scaleIn-ecfe9ae3 0.3s ease-out;
}
@keyframes fadeIn-ecfe9ae3 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-ecfe9ae3 {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.modal-content[data-v-ecfe9ae3] {
max-width: 95vw;
}
.modal-body[data-v-ecfe9ae3] {
padding: 1.5rem;
}
.modal-header[data-v-ecfe9ae3],
.modal-footer[data-v-ecfe9ae3] {
padding: 1rem 1.5rem;
}
.key-button[data-v-ecfe9ae3] {
width: 70px;
height: 70px;
font-size: 1.3rem;
}
.keypad-grid[data-v-ecfe9ae3] {
gap: 0.6rem;
max-width: 240px;
}
}
/* Large touch screens */
@media (min-width: 1200px) {
.key-button[data-v-ecfe9ae3] {
width: 90px;
height: 90px;
font-size: 1.6rem;
}
.keypad-grid[data-v-ecfe9ae3] {
gap: 1rem;
max-width: 320px;
}
}
/* Modal Base Styles */
.modal-overlay[data-v-c17c9bfe] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-c17c9bfe] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 600px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
}
.modal-header[data-v-c17c9bfe] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-c17c9bfe] {
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-c17c9bfe] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-c17c9bfe]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-c17c9bfe] {
padding: 2rem;
}
.modal-footer[data-v-c17c9bfe] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Comp Modal Specific Styles */
.comp-player-info[data-v-c17c9bfe] {
margin-bottom: 2rem;
}
.player-summary[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
}
.player-avatar[data-v-c17c9bfe] {
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(45deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.2rem;
color: white;
background-size: cover;
background-position: center;
}
.player-details[data-v-c17c9bfe] {
flex: 1;
}
.player-name[data-v-c17c9bfe] {
font-size: 1.2rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.player-tier[data-v-c17c9bfe] {
font-size: 0.9rem;
color: var(--neon-blue);
margin-bottom: 0.5rem;
}
.tier-match-play-info[data-v-c17c9bfe] {
font-size: 0.8rem;
color: var(--neon-green);
margin-bottom: 0.5rem;
font-weight: 500;
}
.comp-balance[data-v-c17c9bfe] {
font-size: 1rem;
color: var(--neon-green);
font-weight: 500;
}
.comp-options[data-v-c17c9bfe] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.comp-presets h4[data-v-c17c9bfe] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.preset-buttons[data-v-c17c9bfe] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 0.75rem;
margin-bottom: 1.5rem;
}
/* Quick Comps Main Layout - 4 buttons in a row: Match Play, Free Play | Food, Beverage */
.preset-buttons.quick-comps-main[data-v-c17c9bfe] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.75rem;
margin-bottom: 1.5rem;
}
.preset-buttons.quick-comps-main .preset-btn[data-v-c17c9bfe] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.35rem;
padding: 1rem 0.75rem;
min-height: 70px;
font-weight: 600;
}
.preset-buttons.quick-comps-main .comp-icon[data-v-c17c9bfe] {
font-size: 1.5rem;
}
.preset-buttons.quick-comps-main .comp-text[data-v-c17c9bfe] {
font-size: 0.85rem;
text-align: center;
}
/* Responsive: 2x2 grid on smaller screens */
@media (max-width: 480px) {
.preset-buttons.quick-comps-main[data-v-c17c9bfe] {
grid-template-columns: repeat(2, 1fr);
}
}
.preset-btn[data-v-c17c9bfe] {
padding: 0.75rem 1rem;
border: 1px solid;
border-radius: 8px;
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.9rem;
font-weight: 500;
}
.preset-btn.food[data-v-c17c9bfe] {
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.preset-btn.food[data-v-c17c9bfe]:hover {
background: rgba(255, 102, 0, 0.1);
}
.preset-btn.beverage[data-v-c17c9bfe] {
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.preset-btn.beverage[data-v-c17c9bfe]:hover {
background: rgba(0, 245, 255, 0.1);
}
.preset-btn.cigarette[data-v-c17c9bfe] {
border-color: #9b59b6;
color: #9b59b6;
}
.preset-btn.cigarette[data-v-c17c9bfe]:hover {
background: rgba(155, 89, 182, 0.1);
}
.preset-btn.premium-cigs[data-v-c17c9bfe] {
border-color: #8e44ad;
color: #8e44ad;
}
.preset-btn.premium-cigs[data-v-c17c9bfe]:hover {
background: rgba(142, 68, 173, 0.1);
}
.preset-btn.ecigs[data-v-c17c9bfe] {
border-color: #1abc9c;
color: #1abc9c;
}
.preset-btn.ecigs[data-v-c17c9bfe]:hover {
background: rgba(26, 188, 156, 0.1);
}
.preset-btn.match-play[data-v-c17c9bfe] {
border-color: var(--neon-green);
color: var(--neon-green);
}
.preset-btn.match-play[data-v-c17c9bfe]:hover {
background: rgba(57, 255, 20, 0.1);
}
.preset-btn.free-play[data-v-c17c9bfe] {
border-color: var(--neon-purple);
color: var(--neon-purple);
}
.preset-btn.free-play[data-v-c17c9bfe]:hover {
background: rgba(138, 43, 226, 0.1);
}
.preset-btn.industry-comp[data-v-c17c9bfe] {
border-color: #f39c12;
color: #f39c12;
font-size: 0.85rem;
padding: 0.7rem 0.8rem;
line-height: 1.3;
white-space: normal;
min-height: 60px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 0.25rem;
}
.preset-btn.industry-comp .comp-label[data-v-c17c9bfe] {
font-weight: 600;
}
.preset-btn.industry-comp .comp-industry[data-v-c17c9bfe] {
font-size: 0.7rem;
opacity: 0.7;
font-weight: 400;
}
.preset-btn.industry-comp[data-v-c17c9bfe]:hover {
background: rgba(243, 156, 18, 0.1);
}
/* Template preset container — flex instead of grid so buttons don't stretch */
.preset-buttons.template-presets[data-v-c17c9bfe] {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
}
/* Shared template button layout — match industry-comp stacked style */
.preset-btn.buffet[data-v-c17c9bfe],
.preset-btn.merchandise[data-v-c17c9bfe],
.preset-btn.special-match-play[data-v-c17c9bfe] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 0.25rem;
font-size: 0.85rem;
padding: 0.7rem 0.8rem;
line-height: 1.3;
white-space: normal;
min-height: 60px;
min-width: 120px;
}
.preset-btn.buffet .comp-label[data-v-c17c9bfe],
.preset-btn.merchandise .comp-label[data-v-c17c9bfe],
.preset-btn.special-match-play .comp-label[data-v-c17c9bfe] {
font-weight: 600;
}
.preset-btn.buffet .comp-industry[data-v-c17c9bfe],
.preset-btn.merchandise .comp-industry[data-v-c17c9bfe],
.preset-btn.special-match-play .comp-industry[data-v-c17c9bfe] {
font-size: 0.7rem;
opacity: 0.7;
font-weight: 400;
}
/* Template comp colors */
.preset-btn.buffet[data-v-c17c9bfe] {
border-color: rgba(230, 126, 34, 0.5);
color: #e67e22;
}
.preset-btn.buffet[data-v-c17c9bfe]:hover {
background: rgba(230, 126, 34, 0.1);
}
.preset-btn.merchandise[data-v-c17c9bfe] {
border-color: rgba(155, 89, 182, 0.5);
color: #9b59b6;
}
.preset-btn.merchandise[data-v-c17c9bfe]:hover {
background: rgba(155, 89, 182, 0.1);
}
.preset-btn.special-match-play[data-v-c17c9bfe] {
border-color: rgba(231, 76, 60, 0.5);
color: #e74c3c;
}
.preset-btn.special-match-play[data-v-c17c9bfe]:hover {
background: rgba(231, 76, 60, 0.1);
}
/* Tobacco section styling */
.tobacco-section[data-v-c17c9bfe] {
border: 1px solid rgba(255, 165, 0, 0.3);
padding: 0.75rem;
border-radius: 12px;
background: rgba(255, 165, 0, 0.05);
}
.cost-notice[data-v-c17c9bfe] {
font-size: 0.75rem;
color: var(--neon-orange, #ff9500);
font-weight: 500;
margin-left: 0.5rem;
background: rgba(255, 165, 0, 0.15);
padding: 0.25rem 0.5rem;
border-radius: 6px;
}
.tobacco-cost-note[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 0.75rem;
margin-bottom: 0.75rem;
padding: 0.75rem;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.2);
border-radius: 8px;
font-size: 0.85rem;
color: var(--text-secondary);
}
.tobacco-cost-note .note-icon[data-v-c17c9bfe] {
font-size: 1.1rem;
}
.tobacco-cost-note .note-text[data-v-c17c9bfe] {
flex: 1;
color: var(--text-primary);
}
.custom-comp h4[data-v-c17c9bfe] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.industry-comp-notice[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 1rem;
background: rgba(243, 156, 18, 0.1);
border: 1px solid rgba(243, 156, 18, 0.3);
border-radius: 8px;
margin-bottom: 1rem;
}
.notice-icon[data-v-c17c9bfe] {
font-size: 1.5rem;
flex-shrink: 0;
}
.notice-text[data-v-c17c9bfe] {
color: #f39c12;
font-weight: 600;
font-size: 0.95rem;
}
.comp-input-group[data-v-c17c9bfe] {
position: relative;
margin-bottom: 1rem;
}
/* Side-by-side layout for Amount and Quantity */
.comp-input-row[data-v-c17c9bfe] {
display: flex;
gap: 1.5rem;
align-items: flex-start;
margin-bottom: 1rem;
}
.comp-input-row .comp-input-group[data-v-c17c9bfe] {
flex: 1;
margin-bottom: 0;
}
.comp-input-row .quantity-group[data-v-c17c9bfe] {
flex: 0 0 120px;
}
/* Industry comp party-size enforcement (Military Discount). The label + small
number input stack on the left; the explanatory hint occupies the remaining
width with a sensible min-width so the label never wraps to one char per line. */
.party-size-row[data-v-c17c9bfe] {
align-items: center;
}
.party-size-row .comp-input-group[data-v-c17c9bfe] {
flex: 0 0 200px;
margin-bottom: 0;
}
.party-size-row .comp-input-group input[type="number"][data-v-c17c9bfe] {
width: 100%;
}
.party-size-row .party-size-hint[data-v-c17c9bfe] {
flex: 1 1 auto;
font-size: 0.8rem;
color: var(--text-muted, rgba(255, 255, 255, 0.65));
line-height: 1.4;
}
/* Verification reminder (Military ID / Industry Card / Host Approval). Shown
below the party-size row when the chosen template requires verification. */
.verification-hint[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.55rem 0.75rem;
margin: 0.5rem 0 0.75rem;
background: rgba(241, 196, 15, 0.08);
border: 1px solid rgba(241, 196, 15, 0.32);
border-radius: 6px;
font-size: 0.85rem;
color: #f1c40f;
}
.verification-hint .verification-icon[data-v-c17c9bfe] {
font-size: 1.1rem;
}
.verification-hint .verification-text[data-v-c17c9bfe] {
flex: 1 1 auto;
line-height: 1.35;
}
.input-label[data-v-c17c9bfe] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.input-with-prefix[data-v-c17c9bfe] {
position: relative;
}
.quantity-info[data-v-c17c9bfe] {
margin-top: 0.5rem;
}
.quantity-info .info-text[data-v-c17c9bfe] {
font-size: 0.85rem;
color: var(--neon-green);
font-weight: 500;
}
.input-prefix[data-v-c17c9bfe] {
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
color: var(--text-secondary);
font-size: 1.1rem;
font-weight: 600;
}
.comp-input-group .input-glass[data-v-c17c9bfe] {
padding-left: 2rem;
font-size: 1.1rem;
}
.comp-type-reason[data-v-c17c9bfe] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.comp-type label[data-v-c17c9bfe],
.comp-reason label[data-v-c17c9bfe] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
}
.input-glass[data-v-c17c9bfe] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
width: 100%;
}
.input-glass[data-v-c17c9bfe]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
/* Points Redemption Styles */
.points-redemption[data-v-c17c9bfe] {
margin-top: 1.5rem;
padding: 1rem;
background: rgba(57, 255, 20, 0.05);
border: 1px solid rgba(57, 255, 20, 0.2);
border-radius: 8px;
}
.redemption-header[data-v-c17c9bfe] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.75rem;
}
/* House Points Balance Display */
.house-points-balance[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
margin: 1rem 0;
background: rgba(0, 245, 255, 0.08);
border: 1px solid rgba(0, 245, 255, 0.3);
border-radius: 8px;
}
.house-points-icon[data-v-c17c9bfe] {
font-size: 2rem;
flex-shrink: 0;
}
.house-points-info[data-v-c17c9bfe] {
flex: 1;
}
.house-points-label[data-v-c17c9bfe] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: 0.25rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.house-points-amount[data-v-c17c9bfe] {
font-size: 1.1rem;
font-weight: 700;
color: var(--neon-blue);
margin-bottom: 0.25rem;
}
.house-points-note[data-v-c17c9bfe] {
font-size: 0.75rem;
color: var(--text-secondary);
font-style: italic;
opacity: 0.8;
}
/* ✅ Floor Supervisor Cap Math Display */
.cap-math-display[data-v-c17c9bfe] {
margin: 1rem 0;
padding: 1rem;
background: rgba(255, 193, 7, 0.08);
border: 1px solid rgba(255, 193, 7, 0.3);
border-radius: 8px;
}
.cap-math-header[data-v-c17c9bfe] {
font-size: 0.85rem;
font-weight: 700;
color: var(--neon-orange);
text-transform: uppercase;
letter-spacing: 0.5px;
margin-bottom: 0.75rem;
text-align: center;
}
.cap-math-grid[data-v-c17c9bfe] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.cap-math-row[data-v-c17c9bfe] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 4px;
}
.cap-math-row.highlight[data-v-c17c9bfe] {
background: rgba(255, 193, 7, 0.15);
border: 1px solid rgba(255, 193, 7, 0.4);
font-weight: 600;
}
.cap-label[data-v-c17c9bfe] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.cap-value[data-v-c17c9bfe] {
color: var(--text-primary);
font-weight: 600;
font-size: 0.95rem;
}
.cap-value.subsidy-amount[data-v-c17c9bfe] {
color: var(--neon-orange);
font-weight: 700;
}
.cap-status[data-v-c17c9bfe] {
margin-top: 0.75rem;
padding: 0.75rem;
border-radius: 6px;
display: flex;
align-items: center;
gap: 0.75rem;
}
.cap-status.within-cap[data-v-c17c9bfe] {
background: rgba(57, 255, 20, 0.15);
border: 1px solid rgba(57, 255, 20, 0.4);
}
.cap-status.exceeds-cap[data-v-c17c9bfe] {
background: rgba(255, 77, 77, 0.15);
border: 1px solid rgba(255, 77, 77, 0.4);
}
.cap-status .status-icon[data-v-c17c9bfe] {
font-size: 1.5rem;
flex-shrink: 0;
}
.cap-status .status-text[data-v-c17c9bfe] {
flex: 1;
font-weight: 600;
font-size: 0.9rem;
}
.cap-status.within-cap .status-text[data-v-c17c9bfe] {
color: var(--neon-green);
}
.cap-status.exceeds-cap .status-text[data-v-c17c9bfe] {
color: var(--neon-red);
}
.checkbox-label[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
color: var(--text-primary);
font-weight: 500;
}
.checkbox-label input[type="checkbox"][data-v-c17c9bfe] {
width: 18px;
height: 18px;
cursor: pointer;
accent-color: var(--neon-green);
}
.checkbox-label input[type="checkbox"][data-v-c17c9bfe]:disabled {
cursor: not-allowed;
opacity: 0.5;
}
.points-available[data-v-c17c9bfe] {
color: var(--neon-green);
font-size: 0.9rem;
font-weight: 600;
}
.redemption-details[data-v-c17c9bfe] {
margin-top: 0.75rem;
padding-top: 0.75rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.redemption-row[data-v-c17c9bfe] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
}
.redemption-row span[data-v-c17c9bfe]:last-child {
font-weight: 600;
color: var(--text-primary);
}
.points-cost[data-v-c17c9bfe] {
color: var(--neon-blue) !important;
}
.redemption-row .insufficient[data-v-c17c9bfe] {
color: var(--neon-red) !important;
}
.redemption-row .partial-points[data-v-c17c9bfe] {
color: var(--neon-orange) !important;
font-weight: 700;
}
.warning-message[data-v-c17c9bfe] {
margin-top: 0.5rem;
padding: 0.5rem;
background: rgba(255, 69, 58, 0.1);
border: 1px solid rgba(255, 69, 58, 0.3);
border-radius: 4px;
color: var(--neon-red);
font-size: 0.85rem;
text-align: center;
}
.warning-message.override-available[data-v-c17c9bfe] {
padding: 1rem;
background: rgba(255, 102, 0, 0.1);
border: 1px solid rgba(255, 102, 0, 0.3);
display: flex;
align-items: flex-start;
gap: 0.75rem;
text-align: left;
}
.warning-icon[data-v-c17c9bfe] {
font-size: 1.5rem;
flex-shrink: 0;
}
.warning-content[data-v-c17c9bfe] {
flex: 1;
}
.warning-title[data-v-c17c9bfe] {
font-weight: 600;
color: var(--neon-orange);
margin-bottom: 0.25rem;
font-size: 0.9rem;
}
.warning-text[data-v-c17c9bfe] {
color: var(--text-secondary);
margin-bottom: 0.5rem;
font-size: 0.85rem;
}
.warning-action[data-v-c17c9bfe] {
color: var(--neon-green);
font-size: 0.8rem;
font-style: italic;
}
/* Button Styles */
.btn-glass[data-v-c17c9bfe] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 0.75rem 1.5rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
font-weight: 500;
}
.btn-glass[data-v-c17c9bfe]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.btn-neon[data-v-c17c9bfe] {
padding: 0.75rem 1.5rem;
border: 1px solid;
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-neon.neon-green[data-v-c17c9bfe] {
background: rgba(57, 255, 20, 0.2);
color: var(--neon-green);
border-color: var(--neon-green);
}
.btn-neon.neon-green[data-v-c17c9bfe]:hover:not(:disabled) {
background: var(--neon-green);
color: var(--bg-primary);
box-shadow: 0 0 20px rgba(57, 255, 20, 0.5);
transform: translateY(-2px);
}
.btn-neon.neon-blue[data-v-c17c9bfe] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
border-color: var(--neon-blue);
}
.btn-neon.neon-blue[data-v-c17c9bfe]:hover:not(:disabled) {
background: var(--neon-blue);
color: var(--bg-primary);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.5);
transform: translateY(-2px);
}
.btn-neon.neon-orange[data-v-c17c9bfe] {
background: rgba(255, 102, 0, 0.2);
color: var(--neon-orange);
border-color: var(--neon-orange);
}
.btn-neon.neon-orange[data-v-c17c9bfe]:hover:not(:disabled) {
background: var(--neon-orange);
color: var(--bg-primary);
box-shadow: 0 0 20px rgba(255, 102, 0, 0.5);
transform: translateY(-2px);
}
.btn-neon[data-v-c17c9bfe]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
/* Text Gradient */
.text-gradient[data-v-c17c9bfe] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
/* CSS Variables (ensure these are defined in your global styles) */
[data-v-c17c9bfe]:root {
--text-primary: #ffffff;
--text-secondary: #b8c5d1;
--bg-primary: #0f1419;
--neon-blue: #00f5ff;
--neon-purple: #8a2be2;
--neon-green: #39ff14;
--neon-orange: #ff6600;
}
/* Animations */
.animate-fade-in[data-v-c17c9bfe] {
animation: fadeIn-c17c9bfe 0.3s ease-out;
}
.animate-scale-in[data-v-c17c9bfe] {
animation: scaleIn-c17c9bfe 0.3s ease-out;
}
@keyframes fadeIn-c17c9bfe {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-c17c9bfe {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.modal-content[data-v-c17c9bfe] {
max-width: 95vw;
}
.modal-body[data-v-c17c9bfe] {
padding: 1rem;
}
.modal-header[data-v-c17c9bfe],
.modal-footer[data-v-c17c9bfe] {
padding: 1rem;
}
.comp-type-reason[data-v-c17c9bfe] {
grid-template-columns: 1fr;
}
.preset-buttons[data-v-c17c9bfe] {
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
}
/* Conditional comp eligibility */
.condition-locked[data-v-c17c9bfe] {
opacity: 0.5 !important;
cursor: not-allowed !important;
position: relative;
filter: grayscale(0.7);
}
.condition-locked[data-v-c17c9bfe]:hover {
transform: none !important;
box-shadow: none !important;
}
.lock-icon[data-v-c17c9bfe] {
font-size: 0.75rem;
margin-right: 4px;
}
.condition-breakdown[data-v-c17c9bfe] {
width: 100%;
padding: 6px 10px;
margin-top: 2px;
margin-bottom: 8px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.06);
border-radius: 6px;
font-size: 0.75rem;
}
.condition-row[data-v-c17c9bfe] {
display: flex;
align-items: center;
gap: 6px;
padding: 2px 0;
color: rgba(255, 255, 255, 0.6);
}
.condition-icon[data-v-c17c9bfe] {
font-weight: bold;
width: 14px;
text-align: center;
flex-shrink: 0;
}
.condition-icon.met[data-v-c17c9bfe] {
color: #4ade80;
}
.condition-icon.unmet[data-v-c17c9bfe] {
color: #f87171;
}
.condition-label[data-v-c17c9bfe] {
color: rgba(255, 255, 255, 0.8);
}
.condition-current[data-v-c17c9bfe] {
color: rgba(255, 255, 255, 0.4);
font-style: italic;
margin-left: auto;
}
.widget-full-height[data-v-cab007f0] {
height: 100%;
box-sizing: border-box;
}
.stat-card[data-v-cab007f0] { padding: 1.5rem;
}
.stat-header[data-v-cab007f0] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.stat-header h4[data-v-cab007f0] {
margin: 0;
color: var(--text-primary);
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.stat-value[data-v-cab007f0] {
font-size: 2.5rem;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1;
}
.stat-details[data-v-cab007f0] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-item[data-v-cab007f0] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.875rem;
}
.detail-label[data-v-cab007f0] { color: var(--text-secondary);
}
.detail-value[data-v-cab007f0] { color: var(--text-primary); font-weight: 500;
}
.widget-full-height[data-v-c8abae0c] {
height: 100%;
box-sizing: border-box;
}
.stat-card[data-v-c8abae0c] { padding: 1.5rem;
}
.stat-header[data-v-c8abae0c] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.stat-header h4[data-v-c8abae0c] {
margin: 0;
color: var(--text-primary);
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.stat-value[data-v-c8abae0c] {
font-size: 2.5rem;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1;
}
.stat-details[data-v-c8abae0c] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-item[data-v-c8abae0c] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.875rem;
}
.detail-label[data-v-c8abae0c] { color: var(--text-secondary);
}
.detail-value[data-v-c8abae0c] { color: var(--text-primary); font-weight: 500;
}
.widget-full-height[data-v-956c1d63] {
height: 100%;
box-sizing: border-box;
overflow: hidden;
}
.stat-card[data-v-956c1d63] { padding: 1rem 1.25rem;
}
.stat-header[data-v-956c1d63] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.625rem;
}
.stat-header h4[data-v-956c1d63] {
margin: 0;
color: var(--text-primary);
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.stat-trend[data-v-956c1d63] {
font-size: 0.75rem;
padding: 0.2rem 0.5rem;
border-radius: 12px;
font-weight: 600;
}
.trend-up[data-v-956c1d63] { background: rgba(57, 255, 20, 0.1); color: var(--neon-green);
}
.trend-down[data-v-956c1d63] { background: rgba(255, 7, 58, 0.1); color: var(--neon-red);
}
.trend-neutral[data-v-956c1d63] { background: rgba(255, 255, 255, 0.08); color: var(--text-secondary);
}
.delta-positive[data-v-956c1d63] { color: var(--neon-green);
}
.delta-negative[data-v-956c1d63] { color: var(--neon-red);
}
.stat-value-dual[data-v-956c1d63] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem;
margin-bottom: 0.75rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.stat-value-primary[data-v-956c1d63], .stat-value-secondary[data-v-956c1d63] {
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.stat-value-primary[data-v-956c1d63] {
border-right: 1px solid rgba(255, 255, 255, 0.1);
padding-right: 0.75rem;
}
.stat-label-small[data-v-956c1d63] {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--text-secondary);
font-weight: 600;
}
.stat-value-medium[data-v-956c1d63] {
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
cursor: help;
transition: transform 0.2s ease;
}
.stat-value-medium[data-v-956c1d63]:hover { transform: scale(1.05);
}
.stat-details[data-v-956c1d63] {
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.detail-item[data-v-956c1d63] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.8rem;
}
.detail-label[data-v-956c1d63] { color: var(--text-secondary);
}
.detail-value[data-v-956c1d63] { color: var(--text-primary); font-weight: 500;
}
.widget-full-height[data-v-e1f96c6f] {
height: 100%;
box-sizing: border-box;
}
.stat-card[data-v-e1f96c6f] { padding: 1.5rem;
}
.stat-header[data-v-e1f96c6f] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.stat-header h4[data-v-e1f96c6f] {
margin: 0;
color: var(--text-primary);
font-size: 0.875rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.stat-status[data-v-e1f96c6f] {
font-size: 0.75rem;
padding: 0.25rem 0.5rem;
border-radius: 12px;
font-weight: 500;
}
.status-active[data-v-e1f96c6f] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.stat-value[data-v-e1f96c6f] {
font-size: 2.5rem;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1;
}
.stat-details[data-v-e1f96c6f] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-item[data-v-e1f96c6f] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.875rem;
}
.detail-label[data-v-e1f96c6f] { color: var(--text-secondary);
}
.detail-value[data-v-e1f96c6f] { color: var(--text-primary); font-weight: 500;
}
.activity-item[data-v-8faf0abf] {
display: grid;
grid-template-columns: 2rem 1fr auto auto auto auto;
gap: 0.75rem;
align-items: center;
padding: 0.5rem 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: background 0.2s ease;
font-size: 0.9rem;
}
.activity-item[data-v-8faf0abf]:hover {
background: rgba(255, 255, 255, 0.03);
}
.activity-item.voided[data-v-8faf0abf] {
opacity: 0.6;
text-decoration: line-through;
}
.activity-icon[data-v-8faf0abf] {
font-size: 1.1rem;
text-align: center;
}
/* Icon colors by type */
.icon-buy-in[data-v-8faf0abf] {
color: var(--neon-green);
}
.icon-cash-out[data-v-8faf0abf] {
color: var(--neon-blue);
}
.icon-comp-issued[data-v-8faf0abf] {
color: var(--neon-purple);
}
.icon-match-play-issued[data-v-8faf0abf] {
color: var(--neon-gold);
}
.icon-fill-slip[data-v-8faf0abf] {
color: var(--neon-orange);
}
.activity-content[data-v-8faf0abf] {
display: flex;
align-items: center;
gap: 0.75rem;
min-width: 0;
}
.activity-message[data-v-8faf0abf] {
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.activity-time[data-v-8faf0abf] {
font-size: 0.8rem;
color: var(--text-muted);
white-space: nowrap;
}
.activity-location[data-v-8faf0abf] {
font-size: 0.8rem;
color: var(--text-muted);
white-space: nowrap;
}
.activity-amount[data-v-8faf0abf] {
font-weight: 600;
white-space: nowrap;
padding: 0.125rem 0.5rem;
border-radius: 4px;
font-size: 0.85rem;
}
.amount-buyin[data-v-8faf0abf],
.amount-buy-in[data-v-8faf0abf] {
color: var(--neon-green);
}
.amount-cashout[data-v-8faf0abf],
.amount-cash-out[data-v-8faf0abf] {
color: var(--neon-blue);
}
.amount-comp[data-v-8faf0abf],
.amount-comp-issued[data-v-8faf0abf] {
color: var(--neon-purple);
}
.amount-match-play[data-v-8faf0abf],
.amount-match-play-issued[data-v-8faf0abf] {
color: var(--neon-gold);
}
.amount-fill[data-v-8faf0abf] {
color: var(--neon-orange);
}
.void-badge[data-v-8faf0abf] {
padding: 0.125rem 0.5rem;
background: rgba(255, 0, 0, 0.2);
border: 1px solid rgba(255, 0, 0, 0.4);
border-radius: 4px;
font-size: 0.7rem;
font-weight: 600;
color: #ff6b6b;
white-space: nowrap;
}
.btn-void[data-v-8faf0abf] {
background: none;
border: none;
color: #ff6b6b;
cursor: pointer;
padding: 0.25rem 0.5rem;
font-size: 1rem;
opacity: 0.6;
transition: opacity 0.2s;
}
.btn-void[data-v-8faf0abf]:hover:not(:disabled) {
opacity: 1;
}
.btn-void[data-v-8faf0abf]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.btn-new-rating[data-v-8faf0abf] {
background: rgba(57, 255, 20, 0.1);
border: 1px solid rgba(57, 255, 20, 0.3);
color: var(--neon-green);
cursor: pointer;
padding: 0.25rem 0.75rem;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 600;
white-space: nowrap;
transition: all 0.2s;
}
.btn-new-rating[data-v-8faf0abf]:hover {
background: rgba(57, 255, 20, 0.2);
border-color: var(--neon-green);
transform: translateY(-1px);
box-shadow: 0 2px 8px rgba(57, 255, 20, 0.2);
}
/* Mobile responsive */
@media (max-width: 768px) {
.activity-item[data-v-8faf0abf] {
grid-template-columns: 1.5rem 1fr auto;
gap: 0.5rem;
padding: 0.4rem 0.5rem;
font-size: 0.85rem;
}
.activity-time[data-v-8faf0abf],
.activity-location[data-v-8faf0abf],
.btn-new-rating[data-v-8faf0abf] {
display: none;
}
.btn-void[data-v-8faf0abf] {
font-size: 0.9rem;
padding: 0.2rem 0.4rem;
}
}
.modal-overlay[data-v-07fe442c] {
overflow-y: auto;
padding: 2rem 0;
}
.modal-container[data-v-07fe442c] {
background: rgba(20, 25, 40, 0.95);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
margin: auto;
max-height: calc(100vh - 4rem);
}
.void-transaction-modal[data-v-07fe442c] {
max-width: 800px;
width: 100%;
}
.modal-header[data-v-07fe442c] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1.5rem 2rem 1rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.icon-container[data-v-07fe442c] {
display: grid;
place-items: center;
width: 40px;
height: 40px;
border-radius: 8px;
background: rgba(255, 152, 0, 0.1);
border: 1px solid rgba(255, 152, 0, 0.3);
font-size: 1.2rem;
}
.icon-warning[data-v-07fe442c] {
color: var(--neon-orange);
}
.modal-header h3[data-v-07fe442c] {
flex: 1;
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-07fe442c] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 4px;
transition: all 0.2s ease;
min-width: 40px;
min-height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-07fe442c]:hover {
background: rgba(248, 113, 113, 0.1);
color: #f87171;
}
.modal-body[data-v-07fe442c] {
display: flex;
flex-direction: column;
gap: 1.5rem;
padding: 0 2rem;
}
.transaction-details[data-v-07fe442c],
.eligibility-warning[data-v-07fe442c],
.audit-warning[data-v-07fe442c] {
padding: 1rem;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.transaction-details h4[data-v-07fe442c],
.eligibility-warning h4[data-v-07fe442c],
.audit-warning h4[data-v-07fe442c] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.detail-grid[data-v-07fe442c] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 0.75rem;
}
.detail-item[data-v-07fe442c] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.detail-item label[data-v-07fe442c] {
font-size: 0.85rem;
color: var(--text-secondary);
font-weight: 500;
}
.detail-item span[data-v-07fe442c] {
color: var(--text-primary);
font-weight: 600;
}
.transaction-id[data-v-07fe442c] {
font-family: 'Courier New', monospace;
font-size: 0.9rem;
background: rgba(255, 255, 255, 0.05);
padding: 0.25rem 0.5rem;
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.transaction-type[data-v-07fe442c] {
text-transform: uppercase;
font-size: 0.85rem;
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-weight: 700;
}
.type-buy-in[data-v-07fe442c] {
color: var(--neon-green);
background: rgba(0, 255, 100, 0.1);
}
.type-cash-out[data-v-07fe442c] {
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
}
.type-comp[data-v-07fe442c] {
color: var(--neon-purple);
background: rgba(138, 43, 226, 0.1);
}
.type-bet[data-v-07fe442c] {
color: var(--neon-orange);
background: rgba(255, 152, 0, 0.1);
}
.type-win[data-v-07fe442c] {
color: var(--neon-green);
background: rgba(0, 255, 100, 0.1);
}
.type-loss[data-v-07fe442c] {
color: #f87171;
background: rgba(248, 113, 113, 0.1);
}
.type-adjustment[data-v-07fe442c] {
color: var(--neon-gold);
background: rgba(255, 215, 0, 0.1);
}
.transaction-amount[data-v-07fe442c] {
color: var(--neon-green);
font-size: 1.1rem;
}
.eligibility-warning[data-v-07fe442c],
.audit-warning[data-v-07fe442c] {
display: flex;
align-items: flex-start;
gap: 1rem;
}
.warning-icon[data-v-07fe442c] {
font-size: 1.5rem;
flex-shrink: 0;
}
.eligibility-warning[data-v-07fe442c] {
background: rgba(248, 113, 113, 0.05);
border-color: rgba(248, 113, 113, 0.2);
}
.audit-warning[data-v-07fe442c] {
background: rgba(0, 245, 255, 0.05);
border-color: rgba(0, 245, 255, 0.2);
}
.void-reason-section h4[data-v-07fe442c] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.reason-subtitle[data-v-07fe442c] {
margin: 0 0 1.5rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.reason-grid[data-v-07fe442c] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
.reason-card[data-v-07fe442c] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 1rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 1rem;
position: relative;
}
.reason-card[data-v-07fe442c]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(0, 245, 255, 0.3);
transform: translateY(-2px);
}
.reason-card.selected[data-v-07fe442c] {
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.2);
}
.reason-icon[data-v-07fe442c] {
font-size: 1.5rem;
flex-shrink: 0;
}
.reason-content[data-v-07fe442c] {
flex: 1;
}
.reason-title[data-v-07fe442c] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.reason-description[data-v-07fe442c] {
font-size: 0.85rem;
color: var(--text-secondary);
line-height: 1.3;
}
.reason-check[data-v-07fe442c] {
position: absolute;
top: 0.5rem;
right: 0.5rem;
width: 24px;
height: 24px;
background: var(--neon-blue);
color: var(--bg-primary);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.8rem;
font-weight: bold;
}
.custom-reason-input[data-v-07fe442c],
.additional-notes[data-v-07fe442c] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.custom-reason-input label[data-v-07fe442c],
.additional-notes label[data-v-07fe442c] {
font-weight: 500;
color: var(--text-primary);
}
.input-glass[data-v-07fe442c] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 0.9rem;
resize: vertical;
min-height: 80px;
}
.input-glass[data-v-07fe442c]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.char-count[data-v-07fe442c] {
font-size: 0.75rem;
color: var(--text-muted);
text-align: right;
margin-top: -0.25rem;
}
.modal-footer[data-v-07fe442c] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem 2rem 2rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.btn-glass[data-v-07fe442c],
.btn-danger[data-v-07fe442c] {
padding: 0.75rem 1.5rem;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
border: none;
min-width: 120px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.btn-glass[data-v-07fe442c] {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.btn-glass[data-v-07fe442c]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.15);
transform: translateY(-1px);
}
.btn-danger[data-v-07fe442c] {
background: linear-gradient(135deg, #dc2626, #b91c1c);
color: white;
}
.btn-danger[data-v-07fe442c]:hover:not(:disabled) {
background: linear-gradient(135deg, #b91c1c, #991b1b);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
}
.btn-glass[data-v-07fe442c]:disabled,
.btn-danger[data-v-07fe442c]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.processing-spinner[data-v-07fe442c] {
animation: spin-07fe442c 1s linear infinite;
}
@keyframes spin-07fe442c {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@media (max-width: 768px) {
.void-transaction-modal[data-v-07fe442c] {
margin: 1rem;
max-height: 90vh;
overflow-y: auto;
}
.detail-grid[data-v-07fe442c] {
grid-template-columns: 1fr;
}
.reason-grid[data-v-07fe442c] {
grid-template-columns: 1fr;
}
.modal-footer[data-v-07fe442c] {
flex-direction: column;
}
}
.recent-activity-section[data-v-f3cc35f4] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.section-header[data-v-f3cc35f4] {
display: flex;
justify-content: space-between;
align-items: center;
gap: 0.75rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.section-title[data-v-f3cc35f4] {
display: flex;
align-items: center;
gap: 0.5rem;
margin: 0;
color: var(--text-primary);
font-size: 1.1rem;
font-weight: 600;
}
.section-icon[data-v-f3cc35f4] {
font-size: 1rem;
}
.activity-controls[data-v-f3cc35f4] {
display: flex;
gap: 0.5rem;
}
.btn-refresh[data-v-f3cc35f4] {
display: flex;
align-items: center;
gap: 0.4rem;
padding: 0.4rem 0.6rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 6px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.8rem;
}
.btn-refresh[data-v-f3cc35f4]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
border-color: rgba(255, 255, 255, 0.25);
transform: translateY(-1px);
}
.btn-refresh[data-v-f3cc35f4]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.refresh-icon[data-v-f3cc35f4] {
font-size: 0.9rem;
transition: transform 0.3s ease;
}
.refresh-icon.spinning[data-v-f3cc35f4] {
animation: spin-f3cc35f4 1s linear infinite;
}
@keyframes spin-f3cc35f4 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.activity-feed[data-v-f3cc35f4] {
display: flex;
flex-direction: column;
gap: 0;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.08);
overflow: hidden;
}
.activity-feed.compact[data-v-f3cc35f4] {
gap: 0;
}
.loading-state[data-v-f3cc35f4],
.empty-state[data-v-f3cc35f4] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem 1rem;
text-align: center;
color: var(--text-secondary);
}
.loading-spinner[data-v-f3cc35f4] {
font-size: 1.5rem;
margin-bottom: 1rem;
animation: spin-f3cc35f4 1s linear infinite;
}
.loading-spinner.small[data-v-f3cc35f4] {
font-size: 1rem;
margin: 0;
}
.empty-icon[data-v-f3cc35f4] {
font-size: 3rem;
margin-bottom: 1rem;
opacity: 0.6;
}
.empty-state h4[data-v-f3cc35f4] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
}
.empty-state p[data-v-f3cc35f4] {
margin: 0;
font-size: 0.9rem;
}
.activity-list[data-v-f3cc35f4] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.activity-feed.compact .activity-list[data-v-f3cc35f4] {
gap: 0.5rem;
}
.load-more-section[data-v-f3cc35f4] {
display: flex;
justify-content: center;
padding-top: 1rem;
margin-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.btn-load-more[data-v-f3cc35f4] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.5rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
}
.btn-load-more[data-v-f3cc35f4]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.25);
transform: translateY(-2px);
}
.btn-load-more[data-v-f3cc35f4]:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
}
.last-updated[data-v-f3cc35f4] {
text-align: center;
font-size: 0.8rem;
color: var(--text-muted);
font-style: italic;
padding-top: 0.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
/* Compact mode adjustments */
.activity-feed.compact .section-title[data-v-f3cc35f4] {
font-size: 1.1rem;
}
.activity-feed.compact .loading-state[data-v-f3cc35f4],
.activity-feed.compact .empty-state[data-v-f3cc35f4] {
padding: 2rem 1rem;
}
.activity-feed.compact .empty-icon[data-v-f3cc35f4] {
font-size: 2rem;
}
/* Mobile responsive */
@media (max-width: 768px) {
.section-header[data-v-f3cc35f4] {
flex-direction: column;
align-items: flex-start;
gap: 0.75rem;
}
.activity-controls[data-v-f3cc35f4] {
align-self: stretch;
justify-content: flex-end;
}
.btn-refresh[data-v-f3cc35f4] {
padding: 0.4rem 0.6rem;
font-size: 0.8rem;
}
.refresh-text[data-v-f3cc35f4] {
display: none;
}
}
.widget-full-height[data-v-4fc7285e] {
height: 100%;
box-sizing: border-box;
overflow-y: auto;
}
.widget-full-height[data-v-afb97692] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-afb97692] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
}
.nav-widget.edit-mode[data-v-afb97692] { cursor: grab;
}
.nav-widget-icon[data-v-afb97692] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-afb97692] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-afb97692] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-afb97692] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-afb97692] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.widget-full-height[data-v-b9cadec2] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-b9cadec2] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
}
.nav-widget.edit-mode[data-v-b9cadec2] { cursor: grab;
}
.nav-widget-icon[data-v-b9cadec2] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-b9cadec2] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-b9cadec2] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-b9cadec2] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-b9cadec2] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.widget-full-height[data-v-65685e16] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-65685e16] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
}
.nav-widget.edit-mode[data-v-65685e16] { cursor: grab;
}
.nav-widget-icon[data-v-65685e16] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-65685e16] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-65685e16] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-65685e16] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-65685e16] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.widget-full-height[data-v-54b91113] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-54b91113] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
}
.nav-widget.edit-mode[data-v-54b91113] { cursor: grab;
}
.nav-widget-icon[data-v-54b91113] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-54b91113] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-54b91113] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-54b91113] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-54b91113] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.widget-full-height[data-v-2bed7194] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-2bed7194] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
position: relative;
}
.nav-widget.edit-mode[data-v-2bed7194] { cursor: grab;
}
.nav-widget.nav-widget-locked[data-v-2bed7194] { opacity: 0.5; cursor: not-allowed;
}
.nav-widget-icon[data-v-2bed7194] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-2bed7194] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-2bed7194] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-2bed7194] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-2bed7194] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.nav-widget-money[data-v-2bed7194] { color: var(--neon-green); font-weight: 600;
}
.nav-widget-lock[data-v-2bed7194] {
position: absolute;
top: 0.75rem;
right: 0.75rem;
font-size: 1.25rem;
}
.widget-full-height[data-v-d6c70e12] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-d6c70e12] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
position: relative;
}
.nav-widget.edit-mode[data-v-d6c70e12] { cursor: grab;
}
.nav-widget.nav-widget-locked[data-v-d6c70e12] { opacity: 0.5; cursor: not-allowed;
}
.nav-widget-icon[data-v-d6c70e12] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-d6c70e12] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-d6c70e12] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-d6c70e12] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-d6c70e12] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.nav-widget-lock[data-v-d6c70e12] {
position: absolute;
top: 0.75rem;
right: 0.75rem;
font-size: 1.25rem;
}
.widget-full-height[data-v-60eb38fe] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-60eb38fe] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
position: relative;
}
.nav-widget.edit-mode[data-v-60eb38fe] { cursor: grab;
}
.nav-widget.nav-widget-locked[data-v-60eb38fe] { opacity: 0.5; cursor: not-allowed;
}
.nav-widget-icon[data-v-60eb38fe] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-60eb38fe] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-60eb38fe] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-60eb38fe] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-60eb38fe] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.nav-widget-lock[data-v-60eb38fe] {
position: absolute;
top: 0.75rem;
right: 0.75rem;
font-size: 1.25rem;
}
.widget-full-height[data-v-b4e5a157] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-b4e5a157] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
position: relative;
}
.nav-widget.edit-mode[data-v-b4e5a157] { cursor: grab;
}
.nav-widget.nav-widget-locked[data-v-b4e5a157] { opacity: 0.5; cursor: not-allowed;
}
.nav-widget-icon[data-v-b4e5a157] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-b4e5a157] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-b4e5a157] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-lock[data-v-b4e5a157] {
position: absolute;
top: 0.75rem;
right: 0.75rem;
font-size: 1.25rem;
}
.widget-full-height[data-v-a043b0b1] { height: 100%; box-sizing: border-box;
}
.nav-widget[data-v-a043b0b1] {
padding: 1.5rem;
cursor: pointer;
display: flex;
flex-direction: column;
}
.nav-widget.edit-mode[data-v-a043b0b1] { cursor: grab;
}
.nav-widget-icon[data-v-a043b0b1] { font-size: 2.5rem; margin-bottom: 1rem;
}
.nav-widget h3[data-v-a043b0b1] { margin-bottom: 0.5rem; color: var(--text-primary);
}
.nav-widget p[data-v-a043b0b1] { color: var(--text-secondary); margin-bottom: 1rem; font-size: 0.9rem;
}
.nav-widget-stats[data-v-a043b0b1] { display: flex; align-items: center; gap: 1rem; margin-top: auto;
}
.nav-widget-stat[data-v-a043b0b1] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--text-muted);
}
.modal-overlay[data-v-cd2ab7dd] {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1100;
padding: 1rem;
}
.modal-content[data-v-cd2ab7dd] {
background: var(--color-surface, #1a1a2e);
border-radius: 16px;
width: 100%;
max-width: 600px;
max-height: 90vh;
overflow-y: auto;
box-shadow: 0 25px 80px rgba(0, 0, 0, 0.5);
}
.modal-content.large[data-v-cd2ab7dd] {
max-width: 650px;
}
.modal-header[data-v-cd2ab7dd] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.25rem 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-cd2ab7dd] {
margin: 0;
font-size: 1.4rem;
}
.btn-close[data-v-cd2ab7dd] {
background: transparent;
border: none;
color: var(--color-text-muted, #888);
font-size: 1.5rem;
cursor: pointer;
}
.modal-body[data-v-cd2ab7dd] {
padding: 1.5rem;
}
.modal-footer[data-v-cd2ab7dd] {
display: flex;
justify-content: flex-end;
gap: 0.75rem;
padding: 1rem 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Pot Info Banner */
.pot-info-banner[data-v-cd2ab7dd] {
background: linear-gradient(135deg, rgba(108, 92, 231, 0.2), rgba(0, 200, 83, 0.2));
border: 1px solid rgba(108, 92, 231, 0.3);
border-radius: 12px;
padding: 1rem;
text-align: center;
margin-bottom: 1.5rem;
}
.pot-game-type[data-v-cd2ab7dd] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
font-size: 0.9rem;
color: var(--color-text-muted, #aaa);
}
.game-emoji[data-v-cd2ab7dd] {
font-size: 1.25rem;
}
.pot-name[data-v-cd2ab7dd] {
font-size: 1.2rem;
font-weight: bold;
margin: 0.5rem 0;
}
.pot-balance[data-v-cd2ab7dd] {
font-size: 1rem;
color: #00c853;
}
/* Winner Type Tabs */
.winner-type-tabs[data-v-cd2ab7dd] {
display: flex;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.winner-type-btn[data-v-cd2ab7dd] {
flex: 1;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 10px;
color: var(--color-text-muted, #888);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
transition: all 0.2s;
}
.winner-type-btn[data-v-cd2ab7dd]:hover {
background: rgba(255, 255, 255, 0.1);
}
.winner-type-btn.active[data-v-cd2ab7dd] {
background: rgba(108, 92, 231, 0.2);
border-color: #6c5ce7;
color: #a29bfe;
}
.tab-icon[data-v-cd2ab7dd] {
font-size: 1.25rem;
}
/* Player Search */
.player-search-section[data-v-cd2ab7dd] {
margin-bottom: 1.5rem;
}
.search-input-wrapper[data-v-cd2ab7dd] {
position: relative;
}
.search-spinner[data-v-cd2ab7dd] {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
}
.search-results[data-v-cd2ab7dd] {
margin-top: 0.5rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 10px;
max-height: 250px;
overflow-y: auto;
}
/* Suggestion item - matches PitStation.vue pattern */
.suggestion-item[data-v-cd2ab7dd] {
padding: 0.6rem 1rem;
cursor: pointer;
transition: background 0.2s;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.suggestion-item[data-v-cd2ab7dd]:hover {
background: rgba(255, 255, 255, 0.08);
}
.suggestion-item.selected[data-v-cd2ab7dd] {
background: rgba(108, 92, 231, 0.25);
border-left: 3px solid var(--neon-purple, #a29bfe);
}
.suggestion-item[data-v-cd2ab7dd]:last-child {
border-bottom: none;
}
.suggestion-item.muted[data-v-cd2ab7dd] {
color: var(--text-secondary, #888);
cursor: default;
font-style: italic;
}
/* Suggest line layout - matches PitStation.vue */
.suggest-line[data-v-cd2ab7dd] {
display: flex;
gap: 0.5rem;
align-items: center;
justify-content: flex-start;
}
.suggest-line .name[data-v-cd2ab7dd] {
color: var(--text-primary, #fff);
font-weight: 600;
}
.suggest-line .name-flex[data-v-cd2ab7dd] {
flex: 0 0 auto;
min-width: 150px;
}
.suggest-line .meta[data-v-cd2ab7dd] {
color: var(--text-secondary, #888);
font-size: 0.85rem;
}
.suggest-line .birthdate[data-v-cd2ab7dd] {
color: var(--neon-blue, #00f5ff);
font-weight: 500;
}
.suggest-line .no-birthdate[data-v-cd2ab7dd] {
color: #ff6b6b;
font-weight: 600;
animation: pulse-warning-cd2ab7dd 2s infinite;
}
@keyframes pulse-warning-cd2ab7dd {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.6;
}
}
.suggest-line .tier[data-v-cd2ab7dd] {
color: var(--neon-purple, #a29bfe);
}
/* Player avatar - matches PitStation.vue */
.player-avatar[data-v-cd2ab7dd] {
display: flex;
align-items: center;
justify-content: center;
min-width: 24px;
width: 24px;
height: 24px;
flex-shrink: 0;
}
.player-thumb[data-v-cd2ab7dd] {
width: 24px;
height: 24px;
border-radius: 50%;
object-fit: cover;
}
.player-initials[data-v-cd2ab7dd] {
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--neon-blue, #00f5ff);
color: white;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
font-weight: 700;
}
/* Large avatar for selected player card */
.player-avatar.large[data-v-cd2ab7dd] {
width: 60px;
height: 60px;
min-width: 60px;
}
.player-avatar.large .player-thumb[data-v-cd2ab7dd] {
width: 60px;
height: 60px;
}
.player-avatar.large .player-initials[data-v-cd2ab7dd] {
width: 60px;
height: 60px;
font-size: 1.2rem;
background: linear-gradient(135deg, #6c5ce7, #a29bfe);
}
/* Player flag badges - matches PitStation.vue */
.player-flag[data-v-cd2ab7dd] {
display: inline-flex;
align-items: center;
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 0.2rem 0.45rem;
border-radius: 999px;
margin-left: 0.35rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.06);
}
.player-flag.vip[data-v-cd2ab7dd] {
color: #FFD700;
background: rgba(255, 215, 0, 0.15);
border-color: rgba(255, 215, 0, 0.6);
text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
}
.player-flag.hosted[data-v-cd2ab7dd] {
color: var(--neon-green, #00ff96);
border-color: rgba(0, 255, 150, 0.5);
}
.player-flag.tourney[data-v-cd2ab7dd] {
color: var(--neon-purple, #8a2be2);
background: rgba(138, 43, 226, 0.12);
border-color: rgba(138, 43, 226, 0.45);
text-shadow: 0 0 8px rgba(138, 43, 226, 0.35);
}
.player-flag.event[data-v-cd2ab7dd] {
color: #f472b6;
background: rgba(244, 114, 182, 0.12);
border-color: rgba(244, 114, 182, 0.45);
text-shadow: 0 0 8px rgba(244, 114, 182, 0.35);
}
.player-info[data-v-cd2ab7dd] {
flex: 1;
}
.player-name[data-v-cd2ab7dd] {
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
}
.player-meta[data-v-cd2ab7dd] {
font-size: 0.8rem;
color: var(--color-text-muted, #888);
display: flex;
align-items: center;
gap: 0.25rem;
margin-top: 0.2rem;
}
.no-results[data-v-cd2ab7dd] {
padding: 1rem;
text-align: center;
color: var(--color-text-muted, #888);
}
.selected-player-card[data-v-cd2ab7dd] {
display: flex;
align-items: center;
gap: 1rem;
background: rgba(0, 200, 83, 0.1);
border: 1px solid rgba(0, 200, 83, 0.3);
border-radius: 12px;
padding: 1rem;
margin-top: 1rem;
position: relative;
}
.selected-badge[data-v-cd2ab7dd] {
position: absolute;
top: -10px;
left: 12px;
background: #00c853;
color: #000;
padding: 0.2rem 0.5rem;
border-radius: 4px;
font-size: 0.7rem;
font-weight: bold;
}
.player-details[data-v-cd2ab7dd] {
flex: 1;
}
.btn-clear[data-v-cd2ab7dd] {
background: rgba(255, 255, 255, 0.1);
border: none;
color: var(--color-text-muted, #888);
width: 30px;
height: 30px;
border-radius: 50%;
cursor: pointer;
font-size: 1rem;
}
.btn-clear[data-v-cd2ab7dd]:hover {
background: rgba(255, 0, 0, 0.2);
color: #ff5252;
}
/* Guest Form */
.guest-form-section[data-v-cd2ab7dd] {
margin-bottom: 1.5rem;
}
.compliance-notice[data-v-cd2ab7dd] {
display: flex;
align-items: center;
gap: 0.5rem;
background: rgba(255, 193, 7, 0.1);
border: 1px solid rgba(255, 193, 7, 0.3);
border-radius: 8px;
padding: 0.75rem 1rem;
margin-bottom: 1rem;
font-size: 0.85rem;
color: #ffc107;
}
.notice-icon[data-v-cd2ab7dd] {
font-size: 1.25rem;
}
/* Prize Amount Section */
.prize-amount-section[data-v-cd2ab7dd] {
margin-bottom: 1.5rem;
padding: 1rem;
background: rgba(0, 200, 83, 0.05);
border: 1px solid rgba(0, 200, 83, 0.2);
border-radius: 12px;
}
.prize-amount-section>label[data-v-cd2ab7dd] {
display: block;
margin-bottom: 0.75rem;
font-weight: 600;
}
.amount-input-wrapper[data-v-cd2ab7dd] {
position: relative;
display: flex;
align-items: center;
}
.currency-symbol[data-v-cd2ab7dd] {
position: absolute;
left: 12px;
font-size: 1.25rem;
color: #00c853;
font-weight: bold;
}
.amount-input[data-v-cd2ab7dd] {
padding-left: 32px !important;
font-size: 1.5rem;
font-weight: bold;
text-align: center;
}
.amount-limits[data-v-cd2ab7dd] {
text-align: center;
font-size: 0.8rem;
color: var(--color-text-muted, #888);
margin-top: 0.5rem;
}
.quick-amounts[data-v-cd2ab7dd] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-top: 0.75rem;
justify-content: center;
}
.quick-amount-btn[data-v-cd2ab7dd] {
padding: 0.4rem 0.75rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--color-text, #fff);
cursor: pointer;
font-size: 0.85rem;
transition: all 0.2s;
}
.quick-amount-btn[data-v-cd2ab7dd]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.15);
}
.quick-amount-btn.selected[data-v-cd2ab7dd] {
background: rgba(0, 200, 83, 0.2);
border-color: #00c853;
color: #00c853;
}
.quick-amount-btn[data-v-cd2ab7dd]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
/* Prize Type Section */
.prize-type-section[data-v-cd2ab7dd] {
margin-top: 1rem;
}
.prize-type-section select[data-v-cd2ab7dd] {
font-size: 1rem;
}
.field-hint[data-v-cd2ab7dd] {
font-size: 0.75rem;
color: var(--color-text-muted, #888);
margin-top: 0.25rem;
}
/* Validation Error */
.validation-error[data-v-cd2ab7dd] {
background: rgba(244, 67, 54, 0.1);
border: 1px solid rgba(244, 67, 54, 0.3);
color: #f44336;
padding: 0.75rem 1rem;
border-radius: 8px;
margin-top: 1rem;
font-size: 0.9rem;
}
/* Form Controls */
.form-group[data-v-cd2ab7dd] {
margin-bottom: 1rem;
}
.form-group label[data-v-cd2ab7dd] {
display: block;
margin-bottom: 0.5rem;
font-size: 0.9rem;
color: var(--color-text-muted, #aaa);
}
.form-control[data-v-cd2ab7dd] {
width: 100%;
padding: 0.75rem 1rem;
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--color-text, #fff);
font-size: 1rem;
}
.form-control[data-v-cd2ab7dd]:focus {
outline: none;
border-color: #6c5ce7;
}
.form-row[data-v-cd2ab7dd] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
textarea.form-control[data-v-cd2ab7dd] {
resize: vertical;
min-height: 60px;
}
/* Buttons */
.btn-glass[data-v-cd2ab7dd] {
padding: 0.6rem 1.25rem;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.1);
color: var(--color-text, #fff);
cursor: pointer;
font-size: 0.95rem;
transition: all 0.2s;
}
.btn-glass[data-v-cd2ab7dd]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.15);
}
.btn-glass[data-v-cd2ab7dd]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.btn-glass.btn-lg[data-v-cd2ab7dd] {
padding: 0.75rem 1.5rem;
font-size: 1.05rem;
}
.btn-success[data-v-cd2ab7dd] {
border-color: #00c853;
color: #00c853;
}
.btn-success[data-v-cd2ab7dd]:hover:not(:disabled) {
background: rgba(0, 200, 83, 0.2);
}
.btn-secondary[data-v-cd2ab7dd] {
border-color: #9e9e9e;
color: #9e9e9e;
}
/* Responsive */
@media (max-width: 600px) {
.form-row[data-v-cd2ab7dd] {
grid-template-columns: 1fr;
}
.winner-type-tabs[data-v-cd2ab7dd] {
flex-direction: column;
}
.quick-amounts[data-v-cd2ab7dd] {
justify-content: center;
}
}
.widget-full-height[data-v-bf98bf25] { height: 100%; box-sizing: border-box;
}
.prize-widget[data-v-bf98bf25] {
padding: 1rem;
display: flex;
flex-direction: column;
}
.prize-widget.edit-mode[data-v-bf98bf25] { cursor: grab;
}
.prize-loading[data-v-bf98bf25], .prize-empty[data-v-bf98bf25] {
color: var(--text-secondary);
font-size: 0.85rem;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 1;
gap: 0.5rem;
}
.empty-icon[data-v-bf98bf25] { font-size: 2rem; opacity: 0.4;
}
.pot-header[data-v-bf98bf25] {
display: flex;
align-items: center;
gap: 0.4rem;
margin-bottom: 0.5rem;
}
.game-emoji[data-v-bf98bf25] { font-size: 1.1rem;
}
.game-name[data-v-bf98bf25] {
font-size: 0.8rem;
color: var(--text-secondary);
flex: 1;
}
.pot-status[data-v-bf98bf25] {
padding: 0.15rem 0.5rem;
border-radius: 10px;
font-size: 0.65rem;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.03em;
}
.status-active[data-v-bf98bf25] {
background: rgba(0, 200, 83, 0.2);
color: #00c853;
}
.status-closed[data-v-bf98bf25] {
background: rgba(255, 152, 0, 0.2);
color: #ff9800;
}
.pot-name[data-v-bf98bf25] {
font-size: 1rem;
font-weight: 600;
margin: 0 0 0.75rem;
color: var(--text-primary);
}
.pot-balance[data-v-bf98bf25] {
text-align: center;
margin-bottom: 0.6rem;
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
}
.balance-label[data-v-bf98bf25] {
font-size: 0.7rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.04em;
margin-bottom: 0.15rem;
}
.balance-amount[data-v-bf98bf25] {
font-size: 1.6rem;
font-weight: 700;
color: #00c853;
line-height: 1.2;
}
.balance-amount.low-balance[data-v-bf98bf25] {
color: #ff9800;
}
.pot-progress[data-v-bf98bf25] {
height: 5px;
background: rgba(255, 255, 255, 0.08);
border-radius: 3px;
overflow: hidden;
margin-bottom: 0.6rem;
}
.progress-bar[data-v-bf98bf25] {
height: 100%;
background: linear-gradient(90deg, #00c853, #69f0ae);
border-radius: 3px;
transition: width 0.3s;
}
.progress-bar.low[data-v-bf98bf25] {
background: linear-gradient(90deg, #ff9800, #ffb74d);
}
.pot-limits[data-v-bf98bf25] {
font-size: 0.75rem;
color: var(--text-secondary);
text-align: center;
margin-bottom: 0.75rem;
}
.btn-award[data-v-bf98bf25] {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
margin-top: auto;
}
.btn-icon[data-v-bf98bf25] {
font-size: 0.9rem;
}
.pending-prizes-widget[data-v-61db5376] {
display: flex;
flex-direction: column;
height: 100%;
padding: 0.75rem 1rem;
overflow: hidden;
}
.pending-prizes-widget.is-empty[data-v-61db5376] { opacity: 0.85;
}
.widget-header[data-v-61db5376] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.5rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(255,255,255,0.08);
}
.header-title[data-v-61db5376] { display: flex; align-items: center; gap: 0.5rem;
}
.header-icon[data-v-61db5376] { font-size: 1.2rem;
}
.widget-header h3[data-v-61db5376] { margin: 0; font-size: 1rem; font-weight: 700;
}
.count-badge[data-v-61db5376] {
background: var(--neon-red, salmon);
color: white;
font-weight: 700;
font-size: 0.75rem;
padding: 0.1rem 0.5rem;
border-radius: 999px;
margin-left: 0.25rem;
}
.empty-state[data-v-61db5376] {
text-align: center; padding: 1.25rem 0;
flex: 1; display: flex; flex-direction: column; justify-content: center;
}
.empty-icon[data-v-61db5376] { font-size: 2rem; color: var(--neon-green, lime);
}
.empty-text[data-v-61db5376] { font-weight: 600; margin-top: 0.4rem;
}
.empty-sub[data-v-61db5376] { opacity: 0.6; font-size: 0.8rem; margin-top: 0.2rem;
}
.empty-setup-hint[data-v-61db5376] {
margin: 0.8rem auto 0;
max-width: 32rem;
padding: 0.6rem 0.8rem;
background: rgba(255,255,255,0.04);
border-left: 3px solid var(--neon-blue, deepskyblue);
border-radius: 4px;
font-size: 0.75rem;
line-height: 1.4;
text-align: left;
opacity: 0.85;
}
.empty-setup-hint code[data-v-61db5376] {
background: rgba(0,0,0,0.35);
padding: 0.05rem 0.3rem;
border-radius: 3px;
font-family: ui-monospace, monospace;
font-size: 0.7rem;
}
.prize-list[data-v-61db5376] {
flex: 1; overflow-y: auto;
display: flex; flex-direction: column; gap: 0.5rem;
}
.prize-row[data-v-61db5376] {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.5rem 0.6rem;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.08);
border-radius: 6px;
transition: all 0.15s;
}
/* Use design-system gold/red so dark-mode tweaks ripple here automatically.
Kept as semi-transparent so the underlying card-glass shimmer stays visible. */
.prize-row.aging[data-v-61db5376] { border-color: var(--neon-gold, gold); background: color-mix(in srgb, var(--neon-gold, gold) 5%, transparent);
}
.prize-row.overdue[data-v-61db5376] { border-color: var(--neon-red, salmon); background: color-mix(in srgb, var(--neon-red, salmon) 6%, transparent);
}
.prize-row-icon[data-v-61db5376] { font-size: 1.4rem;
}
.prize-row-body[data-v-61db5376] { flex: 1; min-width: 0;
}
.prize-row-headline[data-v-61db5376] {
display: flex; justify-content: space-between; align-items: baseline;
margin-bottom: 0.15rem;
}
.prize-source-label[data-v-61db5376] { font-weight: 700; font-size: 0.85rem;
}
.prize-amount[data-v-61db5376] {
font-weight: 700;
color: var(--neon-gold, gold);
}
.prize-amount.requires[data-v-61db5376] { color: var(--neon-orange, orange);
}
.prize-row-detail[data-v-61db5376] { font-size: 0.85rem; opacity: 0.95;
}
.prize-class-badge[data-v-61db5376] {
display: inline-block;
margin-left: 0.4rem;
padding: 0.05rem 0.4rem;
border-radius: 999px;
background: rgba(0, 245, 255, 0.18);
font-size: 0.7rem;
font-weight: 700;
}
.prize-class-badge.hclass-five-aces[data-v-61db5376] { background: rgba(247, 220, 111, 0.4); color: gold;
}
.prize-class-badge.hclass-royal-flush[data-v-61db5376] { background: rgba(247, 220, 111, 0.3); color: gold;
}
.prize-row-meta[data-v-61db5376] {
font-size: 0.75rem; opacity: 0.7;
margin-top: 0.15rem;
display: flex; gap: 0.6rem;
}
.prize-elev-badge[data-v-61db5376] {
color: var(--neon-orange, orange);
font-weight: 700;
}
.prize-row-actions[data-v-61db5376] { display: flex; align-items: center;
}
.prize-total-row[data-v-61db5376] {
margin-top: 0.5rem;
padding-top: 0.5rem;
border-top: 1px solid rgba(255,255,255,0.08);
text-align: right;
font-size: 0.85rem;
}
.neon-gold-text[data-v-61db5376] { color: var(--neon-gold, gold);
}
.se-widget[data-v-416fa2b2] {
display: flex;
flex-direction: column;
height: 100%;
padding: 0.75rem 1rem;
overflow: hidden;
}
.widget-header[data-v-416fa2b2] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.5rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.header-title[data-v-416fa2b2] { display: flex; align-items: center; gap: 0.5rem;
}
.header-icon[data-v-416fa2b2] { font-size: 1.2rem;
}
.widget-header h3[data-v-416fa2b2] { margin: 0; font-size: 1rem; font-weight: 700;
}
.ro-badge[data-v-416fa2b2] {
font-size: 0.6rem;
font-weight: 700;
letter-spacing: 0.05em;
padding: 0.1rem 0.4rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
color: var(--text-secondary, #b0b0b0);
}
.se-stat[data-v-416fa2b2] { text-align: center; margin: 0.4rem 0;
}
.se-stat-num[data-v-416fa2b2] { display: block; font-size: 2.2rem; font-weight: 800; line-height: 1; color: var(--neon-green, #39ff14);
}
.se-stat-num.has-flagged[data-v-416fa2b2] { color: var(--neon-red, #ff073a);
}
.se-stat-label[data-v-416fa2b2] { font-size: 0.78rem; opacity: 0.7;
}
.se-meta[data-v-416fa2b2] { margin-top: 0.5rem; display: flex; flex-direction: column; gap: 0.2rem;
}
.se-meta-row[data-v-416fa2b2] { display: flex; justify-content: space-between; font-size: 0.8rem;
}
.se-meta-sub[data-v-416fa2b2] { font-size: 0.72rem;
}
.se-meta-key[data-v-416fa2b2] { opacity: 0.6;
}
.se-meta-val[data-v-416fa2b2] { font-weight: 600; text-align: right;
}
.se-dim[data-v-416fa2b2] { opacity: 0.55; font-weight: 400;
}
.se-actions[data-v-416fa2b2] { margin-top: auto; padding-top: 0.6rem; display: flex; gap: 0.4rem; flex-wrap: wrap;
}
.se-error[data-v-416fa2b2] { color: var(--neon-red, #ff073a); font-size: 0.8rem; padding: 0.4rem 0;
}
.se-loading[data-v-416fa2b2], .se-empty[data-v-416fa2b2] { opacity: 0.6; font-size: 0.85rem; padding: 0.8rem 0; text-align: center;
}
/* Modal */
.se-modal[data-v-416fa2b2] { max-width: 900px; width: 92vw;
}
.se-modal-body[data-v-416fa2b2] { max-height: 60vh; overflow-y: auto;
}
.se-tabs[data-v-416fa2b2] { display: flex; gap: 0.3rem; padding: 0 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.se-tab[data-v-416fa2b2] {
background: none;
border: none;
border-bottom: 2px solid transparent;
color: var(--text-secondary, #b0b0b0);
padding: 0.6rem 0.8rem;
cursor: pointer;
font-size: 0.85rem;
font-weight: 600;
}
.se-tab.active[data-v-416fa2b2] { color: var(--text-primary, #fff); border-bottom-color: var(--neon-blue, #00f5ff);
}
.se-tab-count[data-v-416fa2b2] {
margin-left: 0.35rem;
font-size: 0.7rem;
background: rgba(255, 255, 255, 0.12);
padding: 0.05rem 0.35rem;
border-radius: 999px;
}
.se-search[data-v-416fa2b2] { width: 100%; margin-bottom: 0.6rem;
}
.se-table[data-v-416fa2b2] { width: 100%; font-size: 0.82rem;
}
.se-table th[data-v-416fa2b2] { text-align: left;
}
.se-list-foot[data-v-416fa2b2] { margin-top: 0.4rem; font-size: 0.75rem; text-align: right;
}
.se-hint[data-v-416fa2b2] { font-size: 0.78rem; opacity: 0.7; margin: 0 0 0.6rem;
}
.se-audit-detail[data-v-416fa2b2] { max-width: 320px;
}
.se-action-badge[data-v-416fa2b2] {
display: inline-block;
padding: 0.05rem 0.45rem;
border-radius: 999px;
font-size: 0.7rem;
font-weight: 700;
background: rgba(255, 255, 255, 0.1);
}
.se-action-badge.act-import[data-v-416fa2b2] { background: color-mix(in srgb, var(--neon-blue, #00f5ff) 22%, transparent);
}
.se-action-badge.act-unflag_player[data-v-416fa2b2] { background: color-mix(in srgb, var(--neon-orange, #ff6600) 25%, transparent);
}
.se-action-badge.act-clear[data-v-416fa2b2],
.se-action-badge.act-delete_record[data-v-416fa2b2] { background: color-mix(in srgb, var(--neon-red, #ff073a) 22%, transparent);
}
.modal-footer[data-v-416fa2b2] { display: flex; align-items: center; justify-content: space-between;
}
.se-foot-note[data-v-416fa2b2] { font-size: 0.72rem;
}
.widget-full-height[data-v-1acfb03d] { height: 100%; box-sizing: border-box;
}
.app-login-widget[data-v-1acfb03d] {
padding: 1.25rem;
display: flex;
flex-direction: column;
overflow: hidden;
}
.app-login-widget.edit-mode[data-v-1acfb03d] { cursor: grab; pointer-events: none;
}
/* ── Header ─────────────────────────────────────── */
.widget-header[data-v-1acfb03d] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.header-left[data-v-1acfb03d] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.header-icon[data-v-1acfb03d] {
font-size: 1.5rem;
line-height: 1;
}
.widget-header h4[data-v-1acfb03d] {
margin: 0;
color: var(--text-primary);
font-size: 0.9rem;
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 600;
}
.header-badge[data-v-1acfb03d] {
font-size: 0.7rem;
font-weight: 600;
padding: 0.2rem 0.6rem;
border-radius: 10px;
background: rgba(0, 245, 255, 0.1);
white-space: nowrap;
}
/* ── Idle Section ───────────────────────────────── */
.idle-section[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
/* ── Stats Grid ─────────────────────────────────── */
.stats-grid[data-v-1acfb03d] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.5rem;
margin-bottom: 1rem;
}
.stat-tile[data-v-1acfb03d] {
display: flex;
flex-direction: column;
align-items: center;
padding: 0.5rem 0.25rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.06);
}
.stat-num[data-v-1acfb03d] {
font-size: 1.25rem;
font-weight: 700;
line-height: 1.2;
}
.stat-label[data-v-1acfb03d] {
font-size: 0.65rem;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.04em;
margin-top: 0.15rem;
}
/* ── Transitions ────────────────────────────────── */
.fade-enter-active[data-v-1acfb03d], .fade-leave-active[data-v-1acfb03d] {
transition: opacity 0.25s ease, max-height 0.25s ease;
overflow: hidden;
}
.fade-enter-from[data-v-1acfb03d], .fade-leave-to[data-v-1acfb03d] {
opacity: 0;
max-height: 0;
}
.fade-enter-to[data-v-1acfb03d], .fade-leave-from[data-v-1acfb03d] {
opacity: 1;
max-height: 120px;
}
/* ── Search ─────────────────────────────────────── */
.search-area[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.search-input-wrap[data-v-1acfb03d] {
position: relative;
}
.search-icon[data-v-1acfb03d] {
position: absolute;
left: 0.65rem;
top: 50%;
transform: translateY(-50%);
font-size: 0.85rem;
pointer-events: none;
opacity: 0.5;
}
.search-input[data-v-1acfb03d] {
width: 100%;
padding: 0.55rem 0.75rem 0.55rem 2rem;
font-size: 0.85rem;
border-radius: 8px;
}
.search-status[data-v-1acfb03d] {
font-size: 0.8rem;
color: var(--text-muted);
padding: 0.75rem 0;
text-align: center;
}
.search-results[data-v-1acfb03d] {
flex: 1;
overflow-y: auto;
margin-top: 0.4rem;
}
.search-result-item[data-v-1acfb03d] {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.5rem 0.5rem;
border-radius: 8px;
cursor: pointer;
transition: background 0.15s;
}
.search-result-item[data-v-1acfb03d]:hover {
background: rgba(255, 255, 255, 0.06);
}
/* ── Avatar ─────────────────────────────────────── */
.result-avatar[data-v-1acfb03d] {
width: 32px;
height: 32px;
border-radius: 50%;
flex-shrink: 0;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.08);
font-size: 0.7rem;
font-weight: 600;
color: var(--text-secondary);
border: 1px solid rgba(255, 255, 255, 0.1);
}
.avatar-lg[data-v-1acfb03d] {
width: 40px;
height: 40px;
font-size: 0.85rem;
}
.result-photo[data-v-1acfb03d] {
width: 100%;
height: 100%;
object-fit: cover;
}
.result-info[data-v-1acfb03d] {
display: flex;
flex-direction: column;
min-width: 0;
}
.result-name[data-v-1acfb03d] {
font-size: 0.85rem;
font-weight: 500;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.result-id[data-v-1acfb03d] {
font-size: 0.7rem;
color: var(--text-muted);
}
.network-badge[data-v-1acfb03d] {
display: inline-block;
padding: 0.1rem 0.35rem;
font-size: 0.6rem;
font-weight: 600;
color: #22d3ee;
background: rgba(34, 211, 238, 0.12);
border: 1px solid rgba(34, 211, 238, 0.4);
border-radius: 4px;
margin-left: 0.25rem;
text-transform: uppercase;
}
.result-tier[data-v-1acfb03d] {
font-size: 0.65rem;
color: var(--neon-purple);
font-weight: 500;
text-transform: uppercase;
}
/* ── Selected Player ────────────────────────────── */
.selected-section[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
}
.selected-player[data-v-1acfb03d] {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.6rem 0.75rem;
background: rgba(0, 245, 255, 0.04);
border: 1px solid rgba(0, 245, 255, 0.12);
border-radius: 10px;
margin-bottom: 0.75rem;
}
.btn-clear[data-v-1acfb03d] {
margin-left: auto;
background: none;
border: none;
color: var(--text-muted);
font-size: 1.3rem;
cursor: pointer;
padding: 0.1rem 0.3rem;
line-height: 1;
border-radius: 4px;
transition: color 0.15s, background 0.15s;
}
.btn-clear[data-v-1acfb03d]:hover {
color: var(--neon-red, #ff4444);
background: rgba(255, 68, 68, 0.1);
}
/* ── Action Buttons ─────────────────────────────── */
.action-buttons[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.5rem;
justify-content: center;
}
.btn-generate[data-v-1acfb03d], .btn-checkin[data-v-1acfb03d] {
width: 100%;
padding: 0.65rem;
font-size: 0.85rem;
text-align: center;
font-weight: 500;
}
.btn-checkin[data-v-1acfb03d] { color: var(--neon-green);
}
/* ── Spinner ────────────────────────────────────── */
.spinner[data-v-1acfb03d] {
display: inline-block;
width: 14px;
height: 14px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top-color: var(--neon-blue);
border-radius: 50%;
animation: spin-1acfb03d 0.6s linear infinite;
vertical-align: middle;
margin-right: 0.4rem;
}
@keyframes spin-1acfb03d {
to { transform: rotate(360deg);
}
}
/* ── QR Display ─────────────────────────────────── */
.qr-display[data-v-1acfb03d] {
flex: 1;
display: flex;
min-height: 0;
}
.qr-row[data-v-1acfb03d] {
display: flex;
gap: 0.75rem;
align-items: flex-start;
width: 100%;
}
.qr-frame[data-v-1acfb03d] {
padding: 0.4rem;
background: rgba(255, 255, 255, 0.06);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
line-height: 0;
flex-shrink: 0;
}
.qr-preview[data-v-1acfb03d] {
width: 130px;
height: 130px;
border-radius: 6px;
}
.qr-side[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.35rem;
min-width: 0;
}
.btn-action[data-v-1acfb03d] {
width: 100%;
padding: 0.5rem;
font-size: 0.8rem;
text-align: center;
font-weight: 500;
}
.btn-print[data-v-1acfb03d] { color: var(--neon-green);
}
.btn-regen[data-v-1acfb03d] { color: var(--neon-blue);
}
.btn-back[data-v-1acfb03d] { color: var(--text-secondary);
}
.qr-expiry[data-v-1acfb03d] {
font-size: 0.7rem;
color: var(--text-muted);
text-align: center;
margin-top: auto;
}
/* ── Check-In Confirmation ──────────────────────── */
.checkin-confirm[data-v-1acfb03d] {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.checkin-success[data-v-1acfb03d] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.checkin-icon[data-v-1acfb03d] { font-size: 1.5rem;
}
.checkin-msg[data-v-1acfb03d] {
font-size: 1.1rem;
font-weight: 600;
color: var(--neon-green);
}
.checkin-detail[data-v-1acfb03d] {
display: flex;
flex-direction: column;
align-items: center;
margin: 0.25rem 0;
}
.checkin-multiplier[data-v-1acfb03d] {
font-size: 2rem;
font-weight: 700;
color: var(--neon-blue);
line-height: 1.1;
}
.checkin-label[data-v-1acfb03d] {
font-size: 0.75rem;
color: var(--text-muted);
}
.checkin-confirm .qr-button-row[data-v-1acfb03d] {
width: 100%;
margin-top: 0.5rem;
}
/* ── Error ──────────────────────────────────────── */
.widget-error[data-v-1acfb03d] {
font-size: 0.8rem;
color: var(--neon-red, #ff4444);
padding: 0.5rem;
text-align: center;
margin-top: 0.5rem;
background: rgba(255, 68, 68, 0.06);
border-radius: 6px;
}
/* ── Network Player ID Validation Banner ────────── */
.network-verify-banner[data-v-1acfb03d] {
margin-top: 0.75rem;
padding: 0.75rem;
background: rgba(251, 191, 36, 0.1);
border: 1px solid rgba(251, 191, 36, 0.4);
border-radius: 0.5rem;
}
.verify-header[data-v-1acfb03d] {
color: #fbbf24;
font-weight: 700;
font-size: 0.8rem;
text-transform: uppercase;
margin-bottom: 0.5rem;
}
.verify-fields[data-v-1acfb03d] {
display: flex;
gap: 0.5rem;
align-items: center;
}
.verify-fields input[data-v-1acfb03d] {
flex: 1;
padding: 0.4rem 0.6rem;
font-size: 0.8rem;
}
.verify-fields button[data-v-1acfb03d] {
white-space: nowrap;
}
.home-dashboard[data-v-33e547cc] {
max-width: 1400px;
margin: 0 auto;
padding: 1rem;
}
/* Page Header */
.view-header[data-v-33e547cc] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem 1.5rem;
margin-bottom: 1.5rem;
position: relative;
z-index: 10;
}
.view-header-content h1[data-v-33e547cc] {
margin-bottom: 0.25rem;
}
.view-header-content p[data-v-33e547cc] {
margin: 0;
color: rgba(255, 255, 255, 0.7);
font-size: 0.875rem;
}
/* Gridstack Dashboard */
.dashboard-grid-section[data-v-33e547cc] {
margin-bottom: 2rem;
}
.grid-toolbar[data-v-33e547cc] {
display: flex;
gap: 0.5rem;
align-items: center;
flex-shrink: 0;
position: relative;
z-index: 10;
}
/* Widget picker dropdown */
.widget-picker-wrapper[data-v-33e547cc] {
position: relative;
}
.widget-picker-dropdown[data-v-33e547cc] {
position: absolute;
top: calc(100% + 0.35rem);
left: 0;
min-width: 180px;
list-style: none;
margin: 0;
padding: 0.35rem;
background: rgba(12, 16, 24, 0.95);
border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.12));
border-radius: 10px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(20px);
z-index: 1000;
}
.widget-picker-item[data-v-33e547cc] {
padding: 0.5rem 0.75rem;
border-radius: 6px;
color: var(--text-primary, #fff);
font-size: 0.85rem;
cursor: pointer;
transition: background 0.15s ease;
}
.widget-picker-item[data-v-33e547cc]:hover {
background: rgba(0, 150, 255, 0.15);
}
/* Per-widget remove button (edit mode) */
.dashboard-edit-mode[data-v-33e547cc] .gs-remove-btn {
position: absolute;
top: 6px;
right: 6px;
z-index: 10;
width: 24px;
height: 24px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 7, 58, 0.7);
color: #fff;
font-size: 16px;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.15s ease, transform 0.15s ease;
backdrop-filter: blur(8px);
}
.dashboard-edit-mode[data-v-33e547cc] .gs-remove-btn:hover {
background: rgba(255, 7, 58, 1);
transform: scale(1.15);
}
[data-v-33e547cc] .grid-stack-item-content {
overflow: visible !important;
background: transparent !important;
inset: 8px !important;
}
[data-v-33e547cc] .grid-stack-item {
overflow: visible !important;
}
.dashboard-edit-mode[data-v-33e547cc] .grid-stack-item-content {
outline: 2px dashed var(--glass-border, rgba(255, 255, 255, 0.15));
outline-offset: -2px;
border-radius: 12px;
}
[data-v-33e547cc] .grid-stack-placeholder > .placeholder-content {
background: rgba(0, 150, 255, 0.08) !important;
border: 2px dashed var(--neon-blue) !important;
border-radius: 12px;
}
/* Quick Actions (FAB) */
.quick-actions[data-v-33e547cc] {
position: fixed;
bottom: 2rem;
right: 2rem;
display: flex;
flex-direction: column;
gap: 1rem;
z-index: 50;
}
.fab[data-v-33e547cc] {
width: 72px;
height: 72px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.8rem;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.2);
backdrop-filter: blur(20px);
min-height: 72px;
min-width: 72px;
position: relative;
}
.fab[data-v-33e547cc]:hover {
transform: translateY(-4px) scale(1.05);
box-shadow: 0 12px 35px rgba(0, 0, 0, 0.4);
}
.fab[data-v-33e547cc]:active {
transform: translateY(-2px) scale(1.02);
transition: all 0.1s ease;
}
.fab.neon-green[data-v-33e547cc] {
background: rgba(57, 255, 20, 0.15);
border-color: var(--neon-green);
}
.fab.neon-green[data-v-33e547cc]:hover {
background: rgba(57, 255, 20, 0.25);
box-shadow: 0 12px 35px rgba(57, 255, 20, 0.3);
}
.fab.neon-blue[data-v-33e547cc] {
background: rgba(0, 150, 255, 0.15);
border-color: var(--neon-blue);
}
.fab.neon-blue[data-v-33e547cc]:hover {
background: rgba(0, 150, 255, 0.25);
box-shadow: 0 12px 35px rgba(0, 150, 255, 0.3);
}
/* Modal Styles */
.modal-overlay[data-v-33e547cc] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
padding: 1rem;
backdrop-filter: blur(4px);
}
.modal-content[data-v-33e547cc] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 600px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.modal-content.large[data-v-33e547cc] {
max-width: 800px;
}
.modal-header[data-v-33e547cc] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-33e547cc] {
margin: 0;
font-size: 1.5rem;
}
.btn-close[data-v-33e547cc] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-33e547cc]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-33e547cc] {
padding: 2rem;
}
.modal-footer[data-v-33e547cc] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Touch-friendly form elements */
.form-group[data-v-33e547cc] {
margin-bottom: 1.5rem;
}
.form-group label[data-v-33e547cc] {
display: block;
color: var(--text-primary);
font-weight: 600;
margin-bottom: 0.75rem;
font-size: 1rem;
}
.input-glass[data-v-33e547cc] {
width: 100%;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 12px;
color: var(--text-primary);
font-size: 1rem;
transition: all 0.3s ease;
min-height: 48px;
}
.input-glass[data-v-33e547cc]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 150, 255, 0.3);
background: rgba(255, 255, 255, 0.08);
}
.input-glass[data-v-33e547cc]::placeholder {
color: var(--text-secondary);
opacity: 0.7;
}
/* Touch-friendly buttons */
.btn-glass[data-v-33e547cc],
.btn-neon[data-v-33e547cc] {
padding: 1rem 1.5rem;
border-radius: 12px;
font-size: 1rem;
font-weight: 600;
min-height: 48px;
min-width: 100px;
cursor: pointer;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.btn-glass[data-v-33e547cc]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
}
.btn-neon[data-v-33e547cc] {
background: linear-gradient(135deg, var(--neon-green), #45d62b);
border-color: var(--neon-green);
color: #000;
box-shadow: 0 4px 15px rgba(57, 255, 20, 0.3);
}
.btn-neon[data-v-33e547cc]:hover:not(:disabled) {
background: linear-gradient(135deg, #45d62b, var(--neon-green));
box-shadow: 0 6px 20px rgba(57, 255, 20, 0.4);
transform: translateY(-2px);
}
.btn-neon[data-v-33e547cc]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
/* Preset buttons */
.preset-buttons[data-v-33e547cc] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 0.75rem;
margin-bottom: 0.5rem;
}
/* Quick Comps Main Layout - 4 buttons in a row: Match Play, Free Play | Food, Beverage */
.preset-buttons.quick-comps-main[data-v-33e547cc] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.75rem;
margin-bottom: 1rem;
}
.preset-buttons.quick-comps-main .preset-btn[data-v-33e547cc] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.35rem;
padding: 1rem 0.75rem;
min-height: 70px;
font-weight: 600;
}
.preset-buttons.quick-comps-main .comp-icon[data-v-33e547cc] {
font-size: 1.5rem;
}
.preset-buttons.quick-comps-main .comp-text[data-v-33e547cc] {
font-size: 0.85rem;
text-align: center;
}
/* Responsive: 2x2 grid on smaller screens */
@media (max-width: 480px) {
.preset-buttons.quick-comps-main[data-v-33e547cc] {
grid-template-columns: repeat(2, 1fr);
}
}
.preset-btn[data-v-33e547cc] {
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 12px;
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.95rem;
font-weight: 600;
min-height: 48px;
display: flex;
align-items: center;
justify-content: center;
}
.preset-btn[data-v-33e547cc]:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
border-color: rgba(255, 255, 255, 0.3);
}
.preset-btn[data-v-33e547cc]:active {
transform: translateY(0);
background: rgba(255, 255, 255, 0.15);
}
.preset-btn.food[data-v-33e547cc] {
border-color: rgba(255, 165, 0, 0.3);
background: rgba(255, 165, 0, 0.08);
color: var(--neon-orange);
}
.preset-btn.food[data-v-33e547cc]:hover {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.15);
box-shadow: 0 4px 15px rgba(255, 165, 0, 0.2);
}
.preset-btn.beverage[data-v-33e547cc] {
border-color: rgba(0, 150, 255, 0.3);
background: rgba(0, 150, 255, 0.08);
color: var(--neon-blue);
}
.preset-btn.beverage[data-v-33e547cc]:hover {
border-color: var(--neon-blue);
background: rgba(0, 150, 255, 0.15);
box-shadow: 0 4px 15px rgba(0, 150, 255, 0.2);
}
.preset-btn.cigarette[data-v-33e547cc] {
border-color: rgba(155, 89, 182, 0.3);
background: rgba(155, 89, 182, 0.08);
color: #9b59b6;
}
.preset-btn.cigarette[data-v-33e547cc]:hover {
border-color: #9b59b6;
background: rgba(155, 89, 182, 0.15);
box-shadow: 0 4px 15px rgba(155, 89, 182, 0.2);
}
.preset-btn.premium-cigs[data-v-33e547cc] {
border-color: rgba(231, 76, 60, 0.3);
background: rgba(231, 76, 60, 0.08);
color: #e74c3c;
}
.preset-btn.premium-cigs[data-v-33e547cc]:hover {
border-color: #e74c3c;
background: rgba(231, 76, 60, 0.15);
box-shadow: 0 4px 15px rgba(231, 76, 60, 0.2);
}
.preset-btn.ecigs[data-v-33e547cc] {
border-color: rgba(26, 188, 156, 0.3);
background: rgba(26, 188, 156, 0.08);
color: #1abc9c;
}
.preset-btn.ecigs[data-v-33e547cc]:hover {
border-color: #1abc9c;
background: rgba(26, 188, 156, 0.15);
box-shadow: 0 4px 15px rgba(26, 188, 156, 0.2);
}
.preset-btn.match-play[data-v-33e547cc] {
border-color: rgba(138, 43, 226, 0.3);
background: rgba(138, 43, 226, 0.08);
color: var(--neon-purple);
}
.preset-btn.match-play[data-v-33e547cc]:hover {
border-color: var(--neon-purple);
background: rgba(138, 43, 226, 0.15);
box-shadow: 0 4px 15px rgba(138, 43, 226, 0.2);
}
.preset-btn.free-play[data-v-33e547cc] {
border-color: var(--neon-purple);
color: var(--neon-purple);
}
.preset-btn.free-play[data-v-33e547cc]:hover {
background: rgba(138, 43, 226, 0.1);
box-shadow: 0 4px 15px rgba(138, 43, 226, 0.2);
}
.preset-btn.industry-comp[data-v-33e547cc] {
border-color: #f39c12;
color: #f39c12;
font-size: 0.85rem;
padding: 0.7rem 0.8rem;
line-height: 1.3;
white-space: normal;
min-height: 60px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 0.25rem;
}
.preset-btn.industry-comp .comp-label[data-v-33e547cc] {
font-weight: 600;
}
.preset-btn.industry-comp .comp-industry[data-v-33e547cc] {
font-size: 0.7rem;
opacity: 0.7;
font-weight: 400;
}
.preset-btn.industry-comp[data-v-33e547cc]:hover {
background: rgba(243, 156, 18, 0.1);
box-shadow: 0 4px 15px rgba(243, 156, 18, 0.2);
}
/* Tobacco section styling */
.tobacco-section[data-v-33e547cc] {
border: 1px solid rgba(255, 165, 0, 0.3);
padding: 0.75rem;
border-radius: 12px;
background: rgba(255, 165, 0, 0.05);
}
.cost-notice[data-v-33e547cc] {
font-size: 0.75rem;
color: var(--neon-orange, #ff9500);
font-weight: 500;
margin-left: 0.5rem;
background: rgba(255, 165, 0, 0.15);
padding: 0.25rem 0.5rem;
border-radius: 6px;
}
.tobacco-cost-note[data-v-33e547cc] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 0.75rem;
padding: 0.75rem;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.2);
border-radius: 8px;
font-size: 0.85rem;
color: var(--text-secondary);
}
.tobacco-cost-note .note-icon[data-v-33e547cc] {
font-size: 1.1rem;
}
.tobacco-cost-note .note-text[data-v-33e547cc] {
flex: 1;
color: var(--text-primary);
}
/* Suggestion items */
.suggestions[data-v-33e547cc] {
margin-top: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
max-height: 300px;
overflow-y: auto;
}
.suggestion-item[data-v-33e547cc] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
cursor: pointer;
background: rgba(255, 255, 255, 0.03);
transition: all 0.3s ease;
min-height: 60px;
}
.suggestion-item[data-v-33e547cc]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.25);
transform: translateY(-1px);
}
.suggestion-item[data-v-33e547cc]:active {
transform: translateY(0);
background: rgba(255, 255, 255, 0.12);
}
.suggestion-item .name[data-v-33e547cc] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.suggestion-item .meta[data-v-33e547cc] {
font-size: 0.85rem;
color: var(--text-secondary);
opacity: 0.8;
}
.suggestion-item .btn-sm[data-v-33e547cc] {
padding: 0.5rem 1rem;
min-height: 36px;
font-size: 0.85rem;
}
/* Additional styling */
.muted[data-v-33e547cc] {
color: var(--text-secondary);
font-size: 0.9rem;
opacity: 0.8;
}
.comp-player-info[data-v-33e547cc] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 2rem;
}
.player-summary[data-v-33e547cc] {
display: flex;
align-items: center;
gap: 1.5rem;
}
.player-details .player-name[data-v-33e547cc] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.5rem;
}
.player-details .player-tier[data-v-33e547cc] {
font-size: 0.9rem;
color: var(--neon-purple);
font-weight: 500;
margin-bottom: 0.25rem;
}
.tier-match-play-info[data-v-33e547cc] {
font-size: 0.85rem;
color: var(--neon-green);
margin-bottom: 0.5rem;
font-weight: 500;
}
.comp-balance[data-v-33e547cc] {
font-size: 1rem;
color: var(--neon-green);
font-weight: 500;
margin-top: 0.25rem;
}
.comp-options h4[data-v-33e547cc] {
color: var(--text-primary);
margin-bottom: 1rem;
margin-top: 2rem;
font-size: 1rem;
}
.comp-options h4[data-v-33e547cc]:first-child {
margin-top: 0;
}
/* New Rating Slip Modal Styles */
.form-section[data-v-33e547cc] {
margin-bottom: 1.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.form-section h3[data-v-33e547cc] {
color: var(--text-primary);
margin: 0 0 1rem 0;
font-size: 1.1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
}
.form-section[data-v-33e547cc]:last-of-type {
margin-bottom: 0;
}
.player-info-card[data-v-33e547cc] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.2);
border-radius: 12px;
}
.player-avatar[data-v-33e547cc] {
width: 64px;
height: 64px;
border-radius: 12px;
background: var(--neon-blue);
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.5rem;
color: var(--bg-primary);
border: 2px solid rgba(0, 245, 255, 0.3);
flex-shrink: 0;
}
.player-name-text[data-v-33e547cc] {
color: var(--text-primary);
font-size: 1.1rem;
font-weight: 600;
margin-bottom: 0.25rem;
}
.player-meta-text[data-v-33e547cc] {
color: var(--neon-blue);
font-size: 0.9rem;
opacity: 0.9;
}
.form-grid[data-v-33e547cc] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.loading-message[data-v-33e547cc] {
color: var(--text-secondary);
font-size: 0.9rem;
padding: 1rem;
text-align: center;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
}
.input-with-prefix[data-v-33e547cc] {
position: relative;
display: flex;
align-items: center;
}
.input-prefix[data-v-33e547cc] {
position: absolute;
left: 1rem;
color: var(--text-secondary);
font-weight: 600;
font-size: 1rem;
pointer-events: none;
z-index: 1;
}
.input-glass.with-prefix[data-v-33e547cc] {
padding-left: 2rem;
}
.confirmation-section[data-v-33e547cc] {
margin-top: 1.5rem;
padding: 1.5rem;
background: rgba(57, 255, 20, 0.05);
border: 1px solid rgba(57, 255, 20, 0.2);
border-radius: 12px;
display: flex;
align-items: flex-start;
gap: 1rem;
}
.confirmation-icon[data-v-33e547cc] {
width: 40px;
height: 40px;
border-radius: 50%;
background: var(--neon-green);
color: var(--bg-primary);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
font-weight: 700;
flex-shrink: 0;
}
.confirmation-details[data-v-33e547cc] {
flex: 1;
}
.confirmation-details p[data-v-33e547cc] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
line-height: 1.5;
}
.confirmation-details p[data-v-33e547cc]:last-child {
margin-bottom: 0;
}
.confirmation-details strong[data-v-33e547cc] {
color: var(--neon-green);
font-weight: 600;
}
.confirmation-meta[data-v-33e547cc] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-top: 0.5rem !important;
}
.custom-comp[data-v-33e547cc] {
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Points Redemption Styles */
.points-redemption[data-v-33e547cc] {
margin-top: 1.5rem;
padding: 1.5rem;
background: rgba(57, 255, 20, 0.03);
border: 1px solid rgba(57, 255, 20, 0.15);
border-radius: 12px;
}
.redemption-header[data-v-33e547cc] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.checkbox-label[data-v-33e547cc] {
display: flex;
align-items: center;
gap: 0.75rem;
cursor: pointer;
font-size: 1rem;
font-weight: 600;
color: var(--text-primary);
}
.checkbox-label input[type="checkbox"][data-v-33e547cc] {
width: 20px;
height: 20px;
cursor: pointer;
}
.points-available[data-v-33e547cc] {
font-size: 0.9rem;
color: var(--neon-green);
font-weight: 500;
}
.redemption-details[data-v-33e547cc] {
display: flex;
flex-direction: column;
gap: 0.75rem;
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(57, 255, 20, 0.15);
}
.redemption-row[data-v-33e547cc] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.95rem;
}
.redemption-row span[data-v-33e547cc]:first-child {
color: var(--text-secondary);
}
.points-cost[data-v-33e547cc] {
color: var(--neon-green);
font-weight: 600;
}
.insufficient[data-v-33e547cc] {
color: var(--neon-red);
font-weight: 600;
}
.partial-points[data-v-33e547cc] {
color: var(--neon-orange);
}
.warning-message[data-v-33e547cc] {
margin-top: 1rem;
padding: 1rem;
background: rgba(255, 165, 0, 0.08);
border: 1px solid rgba(255, 165, 0, 0.25);
border-radius: 12px;
display: flex;
gap: 1rem;
align-items: flex-start;
}
.warning-message.override-available[data-v-33e547cc] {
background: rgba(0, 150, 255, 0.08);
border-color: rgba(0, 150, 255, 0.25);
}
.warning-icon[data-v-33e547cc] {
font-size: 1.5rem;
flex-shrink: 0;
}
.warning-content[data-v-33e547cc] {
flex: 1;
}
.warning-title[data-v-33e547cc] {
font-weight: 600;
color: var(--neon-blue);
margin-bottom: 0.5rem;
}
.warning-text[data-v-33e547cc] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.5rem;
}
.warning-action[data-v-33e547cc] {
color: var(--text-primary);
font-size: 0.85rem;
font-style: italic;
}
.comp-input-group[data-v-33e547cc] {
display: flex;
gap: 0.75rem;
align-items: center;
flex-wrap: wrap;
}
/* Side-by-side layout for Amount and Quantity */
.comp-input-row[data-v-33e547cc] {
display: flex;
gap: 1.5rem;
align-items: flex-start;
margin-bottom: 1rem;
}
.comp-input-row .comp-input-group[data-v-33e547cc] {
flex: 1;
flex-direction: column;
align-items: flex-start;
}
.comp-input-row .quantity-group[data-v-33e547cc] {
flex: 0 0 120px;
}
.input-label[data-v-33e547cc] {
display: block;
margin-bottom: 0.5rem;
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.input-with-prefix[data-v-33e547cc] {
display: flex;
align-items: center;
gap: 0.5rem;
width: 100%;
}
.quantity-info[data-v-33e547cc] {
margin-top: 0.5rem;
}
.quantity-info .info-text[data-v-33e547cc] {
font-size: 0.85rem;
color: var(--neon-green);
font-weight: 500;
}
.input-prefix[data-v-33e547cc] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
min-width: 20px;
}
.comp-type-reason[data-v-33e547cc] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
margin-top: 1.5rem;
}
.comp-type[data-v-33e547cc],
.comp-reason[data-v-33e547cc] {
display: flex;
flex-direction: column;
}
/* Rating Slip Modal Styles */
.form-section[data-v-33e547cc] {
margin-bottom: 1.5rem;
}
.form-section h3[data-v-33e547cc] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.1rem;
font-weight: 600;
}
.form-grid[data-v-33e547cc] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.player-info-display[data-v-33e547cc] {
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
margin-bottom: 1rem;
}
.player-info-display .player-name[data-v-33e547cc] {
font-size: 1.2rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.player-info-display .player-meta[data-v-33e547cc] {
font-size: 0.9rem;
color: var(--text-secondary);
}
.loading-message[data-v-33e547cc] {
color: var(--text-secondary);
padding: 0.5rem;
text-align: center;
font-style: italic;
}
.confirmation-section[data-v-33e547cc] {
background: rgba(57, 255, 20, 0.05);
border: 1px solid rgba(57, 255, 20, 0.2);
border-radius: 12px;
padding: 1rem;
margin-top: 1rem;
}
.confirmation-section h4[data-v-33e547cc] {
color: var(--neon-green);
margin: 0 0 0.75rem 0;
font-size: 1rem;
}
.confirmation-details p[data-v-33e547cc] {
margin: 0.5rem 0;
color: var(--text-primary);
font-size: 0.95rem;
}
.confirmation-details strong[data-v-33e547cc] {
color: var(--text-secondary);
margin-right: 0.5rem;
}
/* Responsive */
@media (max-width: 768px) {
.home-dashboard[data-v-33e547cc] {
padding: 0.5rem;
}
.stats-grid[data-v-33e547cc] {
grid-template-columns: 1fr;
gap: 1rem;
}
.stat-value[data-v-33e547cc] {
font-size: 2rem;
}
.stat-value-dual[data-v-33e547cc] {
grid-template-columns: 1fr;
gap: 1rem;
}
.stat-value-primary[data-v-33e547cc] {
border-right: none;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-right: 0;
padding-bottom: 1rem;
}
.stat-value-medium[data-v-33e547cc] {
font-size: 1.5rem;
}
.activity-header[data-v-33e547cc] {
flex-direction: column;
gap: 1rem;
align-items: stretch;
}
.activity-item[data-v-33e547cc] {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
.activity-meta[data-v-33e547cc] {
flex-direction: column;
gap: 0.25rem;
}
.quick-actions[data-v-33e547cc] {
bottom: 1rem;
right: 1rem;
}
.fab[data-v-33e547cc] {
width: 64px;
height: 64px;
font-size: 1.6rem;
min-width: 64px;
min-height: 64px;
}
.modal-overlay[data-v-33e547cc] {
padding: 0.5rem;
}
.modal-content[data-v-33e547cc] {
max-height: 90vh;
width: 100%;
}
.preset-buttons[data-v-33e547cc] {
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
gap: 0.5rem;
}
.preset-btn[data-v-33e547cc] {
padding: 0.75rem;
min-height: 44px;
font-size: 0.9rem;
}
.comp-input-group[data-v-33e547cc] {
flex-direction: column;
align-items: stretch;
}
.modal-footer[data-v-33e547cc] {
flex-direction: column-reverse;
gap: 0.75rem;
}
.modal-footer .btn-glass[data-v-33e547cc],
.modal-footer .btn-neon[data-v-33e547cc] {
width: 100%;
justify-content: center;
}
}
.player-avatar[data-v-33e547cc] {
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 0.8rem;
color: white;
border: 2px solid rgba(0, 150, 255, 0.3);
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
flex-shrink: 0;
position: relative;
overflow: hidden;
}
.player-thumb[data-v-33e547cc] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
.player-initials[data-v-33e547cc] {
font-size: 0.75rem;
font-weight: 700;
color: white;
z-index: 1;
}
.full-screen-canvas[data-v-7cb8bbfc] {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 0;
pointer-events: none;
background: linear-gradient(135deg, #0a0a0f, #141828 40%, #0e1322 100%);
}
canvas[data-v-7cb8bbfc] {
width: 100% !important;
height: 100% !important;
}
/* Base Landing Page Styles */
.landing-page[data-v-beee1b66] {
min-height: 100vh;
width: 100%;
position: relative;
overflow-x: hidden;
}
.landing-content[data-v-beee1b66] {
position: relative;
z-index: 2;
/* Above canvas */
display: flex;
flex-direction: column;
align-items: center;
padding: 3rem 1.25rem 4rem;
gap: 3rem;
}
/* BARELY ANY overlay - let those stars SHINE */
.landing-page[data-v-beee1b66]::before {
content: '';
position: fixed;
inset: 0;
z-index: 1;
/* Between canvas (0) and content (2) */
background: linear-gradient(135deg, rgba(2, 2, 8, 0.15) 0%, rgba(5, 5, 10, 0.1) 50%, rgba(3, 8, 15, 0.15) 100%);
pointer-events: none;
}
/* Company Header Styles */
.company-header[data-v-beee1b66] {
text-align: center;
margin-bottom: 2rem;
margin-top: 2rem;
/* Add some breathing room from top */
}
.logo-container[data-v-beee1b66] {
margin-bottom: 1.5rem;
}
.company-logo[data-v-beee1b66] {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
margin-bottom: 1rem;
}
.logo-icon[data-v-beee1b66] {
font-size: 4rem;
color: #00ffff;
text-shadow:
0 0 10px #00ffff,
0 0 20px #00ffff,
0 0 30px #00ffff;
animation: pulse-glow-beee1b66 2s ease-in-out infinite alternate;
}
.brand-primary[data-v-beee1b66] {
font-family: 'Orbitron', monospace;
font-size: 3.5rem;
font-weight: 700;
letter-spacing: 0.15em;
margin: 0;
background: linear-gradient(45deg, #4a9eff, #7c3aed);
background-size: 200% 200%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: subtle-gradient-beee1b66 6s ease-in-out infinite;
text-shadow: 0 0 15px rgba(124, 58, 237, 0.3);
}
.company-subtitle[data-v-beee1b66] {
font-family: 'Rajdhani', sans-serif;
display: block;
font-size: 1.2rem;
font-weight: 400;
letter-spacing: 0.4em;
color: #ffffff;
opacity: 0.9;
margin-top: 0.5rem;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.company-motto[data-v-beee1b66] {
margin-top: 1.25rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.motto-text[data-v-beee1b66] {
font-size: 1.2rem;
font-weight: 300;
color: #aafcff;
margin: 0;
font-style: italic;
text-shadow: 0 0 8px rgba(0, 255, 255, 0.25);
}
.motto-underline[data-v-beee1b66] {
width: 180px;
height: 2px;
background: linear-gradient(90deg, transparent, #00ffff, transparent);
margin: 0.5rem auto 0;
animation: glow-pulse-beee1b66 2.5s ease-in-out infinite;
}
/* Company Description Styles */
.company-description[data-v-beee1b66] {
max-width: 1200px;
width: 100%;
}
.description-card[data-v-beee1b66] {
padding: 3rem;
text-align: center;
}
.description-title[data-v-beee1b66] {
font-size: 2.5rem;
font-weight: 700;
color: #ffffff;
margin-bottom: 2rem;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.services-grid[data-v-beee1b66] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1.5rem;
margin-top: 2rem;
}
.service-item[data-v-beee1b66] {
padding: 1.5rem;
border-radius: 12px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(0, 255, 255, 0.2);
transition: all 0.3s ease;
}
.service-item[data-v-beee1b66]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(0, 255, 255, 0.4);
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 255, 255, 0.1);
}
.service-icon[data-v-beee1b66] {
font-size: 2.5rem;
margin-bottom: 0.8rem;
}
.service-item h3[data-v-beee1b66] {
font-size: 1.2rem;
font-weight: 600;
color: #00ffff;
margin-bottom: 0.8rem;
}
.service-item p[data-v-beee1b66] {
font-size: 0.9rem;
color: #cccccc;
line-height: 1.5;
}
.service-item.gaming-highlight[data-v-beee1b66] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(0, 255, 255, 0.2);
}
.service-item.gaming-highlight[data-v-beee1b66]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(0, 255, 255, 0.4);
box-shadow: 0 10px 30px rgba(0, 255, 255, 0.1);
}
.service-item.gaming-highlight .service-icon[data-v-beee1b66] {
font-size: 3rem;
color: #ffab00;
text-shadow: 0 0 20px rgba(255, 171, 0, 0.5);
}
.service-item.gaming-highlight h3[data-v-beee1b66] {
color: #ffab00;
}
/* Industry Statistics Section */
.industry-stats[data-v-beee1b66] {
max-width: 1200px;
width: 100%;
margin-top: 3rem;
}
.stats-container[data-v-beee1b66] {
padding: 3rem;
text-align: center;
}
.stats-title[data-v-beee1b66] {
font-size: 2.5rem;
font-weight: 700;
color: #ffffff;
margin-bottom: 3rem;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.stats-grid[data-v-beee1b66] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 2rem;
margin-bottom: 2rem;
}
.stat-item[data-v-beee1b66] {
padding: 2rem 1rem;
background: rgba(0, 255, 255, 0.05);
border: 1px solid rgba(0, 255, 255, 0.2);
border-radius: 15px;
transition: all 0.3s ease;
}
.stat-item[data-v-beee1b66]:hover {
background: rgba(0, 255, 255, 0.08);
border-color: rgba(0, 255, 255, 0.4);
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(0, 255, 255, 0.15);
}
.stat-number[data-v-beee1b66] {
font-family: 'Orbitron', monospace;
font-size: 3rem;
font-weight: 900;
color: #00ffff;
margin-bottom: 0.5rem;
text-shadow: 0 0 15px rgba(0, 255, 255, 0.5);
}
.stat-label[data-v-beee1b66] {
font-size: 1.1rem;
font-weight: 600;
color: #ffffff;
margin-bottom: 0.5rem;
}
.stat-growth[data-v-beee1b66] {
font-size: 0.9rem;
color: #00ff88;
font-weight: 500;
text-shadow: 0 0 8px rgba(0, 255, 136, 0.3);
}
.stats-footer[data-v-beee1b66] {
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.stats-disclaimer[data-v-beee1b66] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
line-height: 1.5;
max-width: 800px;
margin: 0 auto;
}
/* Authentication Section */
/* Trigger */
.auth-trigger[data-v-beee1b66] {
display: flex;
justify-content: center;
margin-top: 0.5rem;
}
.key-button[data-v-beee1b66] {
display: inline-flex;
align-items: center;
gap: 0.75rem;
padding: 0.9rem 1.4rem;
border-radius: 999px;
border: 1px solid rgba(0, 255, 255, 0.35);
background: linear-gradient(135deg, rgba(0, 255, 255, 0.12), rgba(255, 0, 255, 0.12));
color: #ccffff;
cursor: pointer;
box-shadow: 0 0 20px rgba(0, 255, 255, 0.25);
transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.key-button[data-v-beee1b66]:hover {
transform: translateY(-2px);
box-shadow: 0 0 30px rgba(0, 255, 255, 0.35);
}
.key-icon[data-v-beee1b66] {
font-size: 1.2rem;
filter: drop-shadow(0 0 6px rgba(0, 255, 255, 0.6));
}
.key-text[data-v-beee1b66] {
font-weight: 600;
letter-spacing: 0.05em;
}
/* Modal */
.portal-modal[data-v-beee1b66] {
position: fixed;
inset: 0;
z-index: 2000;
display: grid;
place-items: center;
}
.portal-backdrop[data-v-beee1b66] {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.45);
backdrop-filter: blur(4px);
}
.portal-content[data-v-beee1b66] {
position: relative;
width: min(520px, 92vw);
padding: 2rem;
z-index: 2001;
}
.portal-close[data-v-beee1b66] {
position: absolute;
top: 8px;
right: 12px;
background: none;
border: none;
color: #aafcff;
font-size: 1.5rem;
cursor: pointer;
}
/* Reuse existing auth styles */
.auth-header[data-v-beee1b66] {
margin-bottom: 1.5rem;
}
.auth-header[data-v-beee1b66] {
margin-bottom: 2rem;
}
.auth-title[data-v-beee1b66] {
font-size: 2rem;
font-weight: 700;
color: #ffffff;
margin-bottom: 0.5rem;
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}
.auth-subtitle[data-v-beee1b66] {
font-size: 1rem;
color: #cccccc;
line-height: 1.6;
}
/* Form Styles */
.auth-form[data-v-beee1b66] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
/* FormKit overrides for landing page portal */
.portal-content[data-v-beee1b66] .fk-label {
font-size: 0.9rem;
font-weight: 600;
color: #00ffff;
text-transform: uppercase;
letter-spacing: 0.1em;
}
.portal-content[data-v-beee1b66] .fk-inner {
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(0, 255, 255, 0.2);
border-radius: 10px;
padding: 0;
}
.portal-content[data-v-beee1b66] .fk-inner:focus-within {
border-color: #00ffff;
background: rgba(255, 255, 255, 0.08);
box-shadow: 0 0 20px rgba(0, 255, 255, 0.1);
}
.portal-content[data-v-beee1b66] .fk-input {
padding: 1rem;
font-size: 1rem;
color: #ffffff;
}
.portal-content[data-v-beee1b66] .fk-input::placeholder {
color: rgba(255, 255, 255, 0.4);
}
.portal-content[data-v-beee1b66] [data-invalid] .fk-inner {
border-color: var(--neon-red);
box-shadow: 0 0 12px rgba(255, 7, 58, 0.2);
}
.portal-content[data-v-beee1b66] [data-complete] .fk-inner {
border-color: var(--neon-green);
box-shadow: 0 0 12px rgba(57, 255, 20, 0.15);
}
.portal-content[data-v-beee1b66] [data-disabled] .fk-inner {
opacity: 0.6;
cursor: not-allowed;
}
.portal-content[data-v-beee1b66] .fk-message {
color: var(--neon-red);
font-size: 0.8rem;
margin-top: 0.35rem;
}
.form-actions[data-v-beee1b66] {
margin-top: 1rem;
}
.auth-button[data-v-beee1b66] {
width: 100%;
padding: 1.2rem;
font-size: 1.1rem;
font-weight: 600;
background: linear-gradient(45deg, #00ffff, #0080ff);
border: none;
border-radius: 10px;
color: #000000;
cursor: pointer;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 0.1em;
position: relative;
overflow: hidden;
}
.auth-button[data-v-beee1b66]::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transition: left 0.5s ease;
}
.auth-button[data-v-beee1b66]:hover::before {
left: 100%;
}
.auth-button[data-v-beee1b66]:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(0, 255, 255, 0.3);
}
.auth-button[data-v-beee1b66]:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.auth-button[data-v-beee1b66]:disabled::before {
display: none;
}
/* Loading and Error States */
.loading-spinner[data-v-beee1b66] {
display: inline-block;
width: 20px;
height: 20px;
border: 2px solid transparent;
border-top: 2px solid #ffffff;
border-radius: 50%;
animation: spin-beee1b66 1s linear infinite;
}
.error-message[data-v-beee1b66] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 1rem;
background: rgba(255, 0, 0, 0.1);
border: 1px solid rgba(255, 0, 0, 0.3);
border-radius: 8px;
color: #ff6b6b;
font-size: 0.9rem;
}
.error-message.error-blocked[data-v-beee1b66] {
background: rgba(255, 165, 0, 0.1);
border-color: rgba(255, 165, 0, 0.4);
color: #ffab00;
font-weight: 600;
}
.error-icon[data-v-beee1b66] {
font-size: 1.2rem;
}
.session-info[data-v-beee1b66] {
margin-top: 1rem;
padding: 1rem;
background: rgba(0, 255, 255, 0.05);
border: 1px solid rgba(0, 255, 255, 0.2);
border-radius: 8px;
}
.session-text[data-v-beee1b66] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
font-size: 0.9rem;
color: #00ffff;
margin: 0;
}
.session-icon[data-v-beee1b66] {
font-size: 1rem;
}
/* Location Status Indicator */
.location-status[data-v-beee1b66] {
margin-top: 0.75rem;
font-size: 0.85rem;
}
.location-indicator[data-v-beee1b66] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.6rem 0.8rem;
border-radius: 6px;
background: rgba(100, 100, 255, 0.1);
border: 1px solid rgba(100, 100, 255, 0.3);
transition: all 0.3s ease;
}
.location-indicator.location-success[data-v-beee1b66] {
background: rgba(0, 255, 100, 0.1);
border-color: rgba(0, 255, 100, 0.4);
}
.location-indicator.location-failed[data-v-beee1b66] {
background: rgba(255, 100, 0, 0.1);
border-color: rgba(255, 100, 0, 0.4);
flex-wrap: wrap;
}
.location-icon[data-v-beee1b66] {
font-size: 1rem;
flex-shrink: 0;
}
.location-text[data-v-beee1b66] {
flex: 1;
color: rgba(255, 255, 255, 0.8);
font-size: 0.85rem;
}
.location-retry[data-v-beee1b66] {
padding: 0.25rem 0.75rem;
background: rgba(0, 255, 255, 0.2);
border: 1px solid rgba(0, 255, 255, 0.4);
border-radius: 4px;
color: #00ffff;
font-size: 0.8rem;
cursor: pointer;
transition: all 0.2s ease;
}
.location-retry[data-v-beee1b66]:hover {
background: rgba(0, 255, 255, 0.3);
border-color: rgba(0, 255, 255, 0.6);
}
.location-loading .location-indicator[data-v-beee1b66] {
animation: pulse-beee1b66 2s ease-in-out infinite;
}
@keyframes pulse-beee1b66 {
0%,
100% {
opacity: 0.6;
}
50% {
opacity: 1;
}
}
/* Footer */
.landing-footer[data-v-beee1b66] {
margin-top: auto;
padding: 2rem;
text-align: center;
}
.footer-content[data-v-beee1b66] {
max-width: 800px;
margin: 0 auto;
}
.footer-text[data-v-beee1b66] {
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.footer-links[data-v-beee1b66] {
display: flex;
justify-content: center;
gap: 2rem;
flex-wrap: wrap;
}
.footer-link[data-v-beee1b66] {
color: #00ffff;
text-decoration: none;
font-size: 0.9rem;
transition: all 0.3s ease;
}
.footer-link[data-v-beee1b66]:hover {
color: #ffffff;
text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}
/* Loading Overlay */
.loading-overlay[data-v-beee1b66] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1500;
}
.loading-content[data-v-beee1b66] {
text-align: center;
}
.loading-spinner-large[data-v-beee1b66] {
width: 60px;
height: 60px;
border: 4px solid rgba(0, 255, 255, 0.2);
border-top: 4px solid #00ffff;
border-radius: 50%;
animation: spin-beee1b66 1s linear infinite;
margin: 0 auto 1rem;
}
.loading-text[data-v-beee1b66] {
color: #00ffff;
font-size: 1.2rem;
font-weight: 300;
}
/* Glass Card Effect */
.glass-card[data-v-beee1b66] {
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.3),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
/* Animations */
.modal-fade-enter-active[data-v-beee1b66],
.modal-fade-leave-active[data-v-beee1b66] {
transition: opacity 180ms ease;
}
.modal-fade-enter-from[data-v-beee1b66],
.modal-fade-leave-to[data-v-beee1b66] {
opacity: 0;
}
@keyframes pulse-glow-beee1b66 {
0% {
text-shadow:
0 0 10px #00ffff,
0 0 20px #00ffff,
0 0 30px #00ffff;
}
100% {
text-shadow:
0 0 20px #00ffff,
0 0 30px #00ffff,
0 0 40px #00ffff;
}
}
@keyframes subtle-gradient-beee1b66 {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
@keyframes glow-pulse-beee1b66 {
0% {
opacity: 0.5;
}
50% {
opacity: 1;
}
100% {
opacity: 0.5;
}
}
@keyframes spin-beee1b66 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* Floating Cyphers Logo Button */
.cyphers-logo-button[data-v-beee1b66] {
position: fixed;
bottom: 2rem;
right: 2rem;
width: 80px;
height: 80px;
background: rgba(0, 255, 255, 0.1);
border: 2px solid rgba(0, 255, 255, 0.3);
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
z-index: 1000;
box-shadow: 0 4px 20px rgba(0, 255, 255, 0.2);
}
.cyphers-logo-button[data-v-beee1b66]:hover {
background: rgba(0, 255, 255, 0.2);
border-color: rgba(0, 255, 255, 0.6);
transform: translateY(-5px) scale(1.1);
box-shadow:
0 8px 30px rgba(0, 255, 255, 0.4),
0 0 40px rgba(0, 255, 255, 0.3),
inset 0 0 20px rgba(0, 255, 255, 0.1);
}
.cyphers-logo-button .logo-svg[data-v-beee1b66] {
width: 50px;
height: 50px;
filter: brightness(0) invert(1);
transition: all 0.3s ease;
}
.cyphers-logo-button:hover .logo-svg[data-v-beee1b66] {
filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(0, 255, 255, 0.8));
transform: scale(1.1);
}
/* Responsive Design */
/* Tablet responsive - 2x2 grid */
@media (max-width: 1024px) {
.services-grid[data-v-beee1b66] {
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
}
}
@media (max-width: 768px) {
.landing-content[data-v-beee1b66] {
padding: 1rem 0.75rem;
gap: 1.5rem;
}
.company-name h1[data-v-beee1b66] {
font-size: 2.5rem;
}
.logo-icon[data-v-beee1b66] {
font-size: 2.5rem;
}
.company-logo[data-v-beee1b66] {
flex-direction: column;
gap: 0.5rem;
}
.description-card[data-v-beee1b66],
.auth-container[data-v-beee1b66],
.stats-container[data-v-beee1b66] {
padding: 1.5rem;
}
.services-grid[data-v-beee1b66] {
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
.service-item[data-v-beee1b66] {
padding: 1.2rem;
}
.service-item h3[data-v-beee1b66] {
font-size: 1.1rem;
}
.service-item p[data-v-beee1b66] {
font-size: 0.85rem;
}
.stats-grid[data-v-beee1b66] {
grid-template-columns: 1fr;
}
.stats-title[data-v-beee1b66] {
font-size: 2rem;
}
.stat-number[data-v-beee1b66] {
font-size: 2.5rem;
}
.footer-links[data-v-beee1b66] {
flex-direction: column;
gap: 1rem;
}
}
@media (max-width: 480px) {
.company-name h1[data-v-beee1b66] {
font-size: 2rem;
}
.description-card[data-v-beee1b66],
.auth-container[data-v-beee1b66] {
padding: 1.25rem;
}
.service-item[data-v-beee1b66] {
padding: 1.5rem;
}
/* Mobile adjustments for floating logo */
.cyphers-logo-button[data-v-beee1b66] {
width: 60px;
height: 60px;
bottom: 1rem;
right: 1rem;
}
.cyphers-logo-button .logo-svg[data-v-beee1b66] {
width: 35px;
height: 35px;
}
}
/* Policy Modal Styles */
.policy-modal[data-v-beee1b66] {
position: fixed;
inset: 0;
z-index: 3000;
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
}
.policy-backdrop[data-v-beee1b66] {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.7);
backdrop-filter: blur(8px);
}
.policy-modal-content[data-v-beee1b66] {
position: relative;
width: min(900px, 95vw);
max-height: 85vh;
background: rgba(20, 24, 40, 0.95);
border: 1px solid rgba(0, 255, 255, 0.3);
border-radius: 20px;
overflow: hidden;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.policy-header[data-v-beee1b66] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem 2rem 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.policy-title[data-v-beee1b66] {
font-size: 1.8rem;
font-weight: 700;
color: #00ffff;
margin: 0;
text-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
}
.policy-close[data-v-beee1b66] {
background: none;
border: none;
color: #ffffff;
font-size: 2rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 50%;
transition: all 0.3s ease;
line-height: 1;
}
.policy-close[data-v-beee1b66]:hover {
background: rgba(255, 0, 0, 0.2);
color: #ff6b6b;
}
.policy-body[data-v-beee1b66] {
padding: 2rem;
max-height: 60vh;
overflow-y: auto;
scroll-behavior: smooth;
}
/* Policy Content Styles moved to global.css */
.policy-updated[data-v-beee1b66] {
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
margin-bottom: 2rem;
font-style: italic;
}
.policy-section[data-v-beee1b66] {
margin-bottom: 3rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.policy-section[data-v-beee1b66]:last-child {
border-bottom: none;
margin-bottom: 1rem;
}
.policy-section h3[data-v-beee1b66] {
margin-top: 0;
margin-bottom: 1.5rem;
}
.policy-section ul[data-v-beee1b66] {
margin-bottom: 1.5rem;
}
.policy-section p[data-v-beee1b66] {
margin-bottom: 1.5rem;
}
.policy-section h3[data-v-beee1b66] {
color: #00ffff;
font-size: 1.3rem;
font-weight: 600;
margin-bottom: 1rem;
text-shadow: 0 0 8px rgba(0, 255, 255, 0.2);
}
.policy-section p[data-v-beee1b66] {
margin-bottom: 1rem;
color: rgba(255, 255, 255, 0.9);
}
.policy-section ul[data-v-beee1b66] {
margin-left: 1.5rem;
margin-bottom: 1rem;
}
.policy-section li[data-v-beee1b66] {
margin-bottom: 0.5rem;
color: rgba(255, 255, 255, 0.9);
}
.policy-section a[data-v-beee1b66] {
color: #00ffff;
text-decoration: none;
transition: all 0.3s ease;
}
.policy-section a[data-v-beee1b66]:hover {
color: #ffffff;
text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}
/* Footer link buttons */
.footer-link[data-v-beee1b66] {
background: none;
border: none;
color: #00ffff;
text-decoration: none;
font-size: 0.9rem;
cursor: pointer;
transition: all 0.3s ease;
padding: 0;
font-family: inherit;
}
.footer-link[data-v-beee1b66]:hover {
color: #ffffff;
text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}
/* Mobile modal adjustments */
@media (max-width: 768px) {
.policy-modal-content[data-v-beee1b66] {
width: 95vw;
max-height: 90vh;
}
.policy-header[data-v-beee1b66],
.policy-body[data-v-beee1b66] {
padding: 1.5rem;
}
.policy-title[data-v-beee1b66] {
font-size: 1.5rem;
}
.policy-body[data-v-beee1b66] {
max-height: 70vh;
}
}
.dev-mode-panel[data-v-2d09be58] {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 10000;
font-family: 'Monaco', 'Courier New', monospace;
}
.dev-toggle[data-v-2d09be58] {
width: 50px;
height: 50px;
border-radius: 50%;
background: #333;
color: #fff;
border: 2px solid #666;
font-size: 20px;
cursor: pointer;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
transition: all 0.3s ease;
}
.dev-active .dev-toggle[data-v-2d09be58] {
background: #ff6b35;
border-color: #ffd700;
animation: pulse-2d09be58 2s infinite;
}
@keyframes pulse-2d09be58 {
0%,
100% {
box-shadow: 0 4px 12px rgba(255, 107, 53, 0.5);
}
50% {
box-shadow: 0 4px 20px rgba(255, 215, 0, 0.8);
}
}
.dev-toggle[data-v-2d09be58]:hover {
transform: scale(1.1);
}
.dev-panel-content[data-v-2d09be58] {
position: absolute;
bottom: 60px;
right: 0;
width: 320px;
max-height: 600px;
overflow-y: auto;
background: #1a1a1a;
border: 2px solid #ffd700;
border-radius: 12px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
padding: 16px;
color: #fff;
}
.dev-header[data-v-2d09be58] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid #444;
}
.dev-header h3[data-v-2d09be58] {
margin: 0;
font-size: 18px;
color: #ffd700;
}
.close-btn[data-v-2d09be58] {
background: none;
border: none;
color: #aaa;
font-size: 24px;
cursor: pointer;
padding: 0;
width: 30px;
height: 30px;
line-height: 1;
}
.close-btn[data-v-2d09be58]:hover {
color: #fff;
}
.dev-section[data-v-2d09be58] {
margin-bottom: 16px;
padding: 12px;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
.dev-section h4[data-v-2d09be58] {
margin: 0 0 12px 0;
font-size: 14px;
color: #ffd700;
text-transform: uppercase;
}
.dev-switch[data-v-2d09be58] {
display: flex;
align-items: center;
gap: 12px;
cursor: pointer;
}
.dev-switch input[type="checkbox"][data-v-2d09be58] {
display: none;
}
.dev-switch .slider[data-v-2d09be58] {
flex-shrink: 0;
}
.slider[data-v-2d09be58] {
position: relative;
width: 48px;
height: 24px;
background: #444;
border-radius: 24px;
transition: background 0.3s;
}
.slider[data-v-2d09be58]::after {
content: '';
position: absolute;
top: 2px;
left: 2px;
width: 20px;
height: 20px;
background: #fff;
border-radius: 50%;
transition: transform 0.3s;
}
.dev-switch input:checked+.slider[data-v-2d09be58] {
background: #ff6b35;
}
.dev-switch input:checked+.slider[data-v-2d09be58]::after {
transform: translateX(24px);
}
.label-text[data-v-2d09be58] {
font-size: 14px;
color: #fff;
}
.dev-warning[data-v-2d09be58] {
margin: 8px 0 0 0;
font-size: 12px;
color: #ff6b35;
}
.dev-player-info[data-v-2d09be58] {
font-size: 13px;
line-height: 1.6;
margin-bottom: 12px;
}
.dev-player-info p[data-v-2d09be58] {
margin: 4px 0;
}
.dev-btn[data-v-2d09be58] {
width: 100%;
padding: 10px;
margin: 6px 0;
background: #333;
color: #fff;
border: 1px solid #666;
border-radius: 6px;
cursor: pointer;
font-size: 13px;
transition: all 0.2s;
}
.dev-btn[data-v-2d09be58]:hover {
background: #444;
border-color: #ffd700;
}
.dev-danger[data-v-2d09be58] {
background: #8b0000;
border-color: #ff3333;
}
.dev-danger[data-v-2d09be58]:hover {
background: #a00;
}
.status-badge[data-v-2d09be58] {
display: inline-block;
padding: 4px 8px;
border-radius: 4px;
font-size: 11px;
font-weight: bold;
margin-bottom: 8px;
}
.status-badge.active[data-v-2d09be58] {
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
border: 1px solid #00ff88;
}
.status-badge.inactive[data-v-2d09be58] {
background: rgba(128, 128, 128, 0.2);
color: #888;
border: 1px solid #666;
}
.gps-status[data-v-2d09be58] {
margin-bottom: 8px;
}
.dev-btn.active[data-v-2d09be58] {
background: #ff6b35;
border-color: #ffd700;
font-weight: bold;
}
.dev-info[data-v-2d09be58] {
font-size: 11px;
color: #aaa;
background: rgba(0, 0, 0, 0.3);
}
.dev-info p[data-v-2d09be58] {
margin: 4px 0;
}
/* Mobile adjustments */
@media (max-width: 480px) {
.dev-panel-content[data-v-2d09be58] {
width: calc(100vw - 40px);
right: -10px;
}
}
.landing-screen[data-v-510d0dae] {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
background: #0a0a0a;
}
/* Three.js canvas */
.canvas-container[data-v-510d0dae] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
/* Background gradient (Imperial Palace colors) */
.background-gradient[data-v-510d0dae] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(circle at center,
rgba(139, 0, 0, 0.15) 0%,
/* Dark red glow */
rgba(218, 165, 32, 0.08) 40%,
/* Gold accent */
rgba(0, 0, 0, 0.9) 100%
/* Black edges */
);
z-index: 2;
pointer-events: none;
}
/* Overlay content */
.overlay-content[data-v-510d0dae] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
padding: 8vh 5vw;
z-index: 3;
opacity: 1;
transition: opacity 0.8s ease-out;
}
.overlay-content.fade-out[data-v-510d0dae] {
opacity: 0;
}
/* Brand Container */
.brand-container[data-v-510d0dae] {
text-align: center;
animation: fadeInDown-510d0dae 1.2s ease-out;
}
.brand-title[data-v-510d0dae] {
position: relative;
font-family: 'Cinzel', 'Playfair Display', serif;
font-size: clamp(2.5rem, 8vw, 5rem);
font-weight: 700;
color: #ffd700;
/* Imperial gold */
text-shadow:
0 0 10px rgba(255, 215, 0, 0.5),
0 0 20px rgba(255, 215, 0, 0.3),
0 2px 4px rgba(0, 0, 0, 0.8);
letter-spacing: 0.15em;
margin: 0;
line-height: 1.2;
background:
linear-gradient(135deg, #ffd700 0%, #ffed4e 50%, #ffd700 100%);
background-size: 200% 100%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: goldenShimmer-510d0dae 3s ease-in-out infinite;
}
@keyframes goldenShimmer-510d0dae {
0%,
100% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
}
/* Loading Container */
.loading-container[data-v-510d0dae] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
animation: fadeIn-510d0dae 0.8s ease-out 0.5s both;
}
.loading-spinner[data-v-510d0dae] {
position: relative;
width: 80px;
height: 80px;
}
.spinner-ring[data-v-510d0dae] {
position: absolute;
width: 100%;
height: 100%;
border: 3px solid transparent;
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-510d0dae 1.5s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
}
.spinner-ring[data-v-510d0dae]:nth-child(2) {
border-top-color: #ff3333;
animation-duration: 2s;
animation-delay: 0.3s;
}
@keyframes spin-510d0dae {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.loading-text[data-v-510d0dae] {
font-family: 'Montserrat', sans-serif;
font-size: 1rem;
color: #aaa;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.progress-bar[data-v-510d0dae] {
width: 200px;
height: 3px;
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
overflow: hidden;
}
.progress-fill[data-v-510d0dae] {
height: 100%;
background: linear-gradient(90deg, #ffd700 0%, #ff3333 100%);
transition: width 0.3s ease-out;
box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}
/* Age Gate */
.age-gate[data-v-510d0dae] {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
max-width: 440px;
animation: fadeIn-510d0dae 0.8s ease-out 0.3s both;
}
.age-gate-card[data-v-510d0dae] {
background: linear-gradient(135deg, rgba(26, 26, 26, 0.95) 0%, rgba(20, 20, 20, 0.95) 100%);
border: 2px solid rgba(255, 215, 0, 0.3);
border-radius: 16px;
padding: 2rem;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5), 0 0 20px rgba(255, 215, 0, 0.1);
text-align: center;
width: 100%;
}
.age-gate-title[data-v-510d0dae] {
font-family: 'Cinzel', serif;
font-size: 1.8rem;
color: #ffd700;
margin: 0 0 1rem 0;
letter-spacing: 0.1em;
}
.age-gate-text[data-v-510d0dae] {
font-size: 1rem;
color: #e0e0e0;
margin: 0 0 0.5rem 0;
line-height: 1.5;
}
.age-gate-legal[data-v-510d0dae] {
font-size: 0.85rem;
color: #999;
margin: 0 0 1rem 0;
}
.age-gate-disclaimer[data-v-510d0dae] {
font-size: 0.8rem;
color: rgba(255, 180, 0, 0.7);
margin: 0 0 1.5rem 0;
padding: 0.5rem;
border: 1px solid rgba(255, 180, 0, 0.2);
border-radius: 8px;
background: rgba(255, 180, 0, 0.05);
}
.age-gate-checkbox[data-v-510d0dae] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
text-align: left;
font-size: 0.9rem;
color: #ccc;
cursor: pointer;
margin-bottom: 1.5rem;
line-height: 1.4;
}
.age-gate-checkbox input[type="checkbox"][data-v-510d0dae] {
margin-top: 0.15rem;
width: 18px;
height: 18px;
flex-shrink: 0;
accent-color: #ffd700;
cursor: pointer;
}
.age-gate-checkbox a[data-v-510d0dae] {
color: #ffd700;
text-decoration: underline;
}
.age-gate-btn[data-v-510d0dae] {
width: 100%;
padding: 1rem;
background: linear-gradient(135deg, #ffd700, #e6b800);
border: none;
border-radius: 50px;
font-family: 'Montserrat', sans-serif;
font-size: 1.1rem;
font-weight: 700;
color: #1a1a1a;
cursor: pointer;
letter-spacing: 0.05em;
transition: all 0.3s ease;
}
.age-gate-btn[data-v-510d0dae]:disabled {
background: rgba(255, 255, 255, 0.1);
color: #666;
cursor: not-allowed;
}
.age-gate-btn[data-v-510d0dae]:not(:disabled):hover {
box-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
transform: translateY(-1px);
}
.age-gate-denied-btn[data-v-510d0dae] {
margin-top: 1rem;
width: 100%;
padding: 0.75rem;
background: rgba(255, 50, 50, 0.1);
border: 1px solid rgba(255, 50, 50, 0.3);
border-radius: 8px;
color: #ff5555;
font-size: 0.85rem;
cursor: not-allowed;
}
/* Social Disclaimer */
.social-disclaimer[data-v-510d0dae] {
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.35);
text-align: center;
margin: 0;
line-height: 1.4;
}
/* Casino Selection */
.casino-selection[data-v-510d0dae] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
width: 100%;
max-width: 600px;
animation: fadeIn-510d0dae 0.8s ease-out 0.3s both;
}
.welcome-text[data-v-510d0dae] {
font-family: 'Montserrat', sans-serif;
font-size: clamp(0.85rem, 2.5vw, 1.1rem);
color: #e0e0e0;
text-align: center;
margin: 0;
letter-spacing: 0.05em;
}
/* Casino Pill Selector */
.casino-pills[data-v-510d0dae] {
display: flex;
gap: 0.5rem;
justify-content: center;
flex-wrap: wrap;
}
.casino-pill[data-v-510d0dae] {
padding: 0.55rem 1.1rem;
background: rgba(26, 26, 26, 0.9);
border: 2px solid rgba(255, 215, 0, 0.3);
border-radius: 50px;
font-family: 'Cinzel', serif;
font-size: clamp(0.75rem, 2.2vw, 0.95rem);
font-weight: 700;
color: #ffd700;
cursor: pointer;
transition: all 0.3s ease;
letter-spacing: 0.08em;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.casino-pill.active[data-v-510d0dae] {
background: linear-gradient(135deg, #ffd700, #e6b800);
color: #1a1a1a;
border-color: #ffd700;
box-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
}
.casino-pill[data-v-510d0dae]:not(.active):hover {
border-color: rgba(255, 215, 0, 0.6);
background: rgba(255, 215, 0, 0.1);
}
/* Casino Detail Card */
.casino-detail-card[data-v-510d0dae] {
width: 100%;
background: linear-gradient(135deg, rgba(26, 26, 26, 0.95) 0%, rgba(20, 20, 20, 0.95) 100%);
border: 2px solid rgba(255, 215, 0, 0.3);
border-radius: 16px;
padding: 1rem 1.2rem;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
box-shadow:
0 4px 20px rgba(0, 0, 0, 0.5),
0 0 20px rgba(255, 215, 0, 0.1);
}
.casino-detail-card .casino-address[data-v-510d0dae] {
font-family: 'Montserrat', sans-serif;
font-size: clamp(0.8rem, 2.2vw, 0.95rem);
color: #aaa;
margin: 0 0 0.8rem 0;
text-align: center;
line-height: 1.4;
}
.casino-actions[data-v-510d0dae] {
display: flex;
gap: 0.6rem;
justify-content: center;
}
.action-btn[data-v-510d0dae] {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.35rem;
padding: 0.6rem 0.4rem;
background: rgba(139, 0, 0, 0.3);
border: 1px solid rgba(255, 215, 0, 0.4);
border-radius: 10px;
font-family: 'Montserrat', sans-serif;
font-size: clamp(0.7rem, 1.8vw, 0.85rem);
font-weight: 600;
color: #fff;
cursor: pointer;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.action-btn[data-v-510d0dae]:hover {
background: rgba(139, 0, 0, 0.5);
border-color: #ffd700;
transform: translateY(-2px);
box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
}
.action-btn[data-v-510d0dae]:active {
transform: translateY(0);
}
.action-icon[data-v-510d0dae] {
font-size: 1.3rem;
}
.action-text[data-v-510d0dae] {
font-size: 0.75rem;
}
/* Pill detail transition */
.fade-slide-enter-active[data-v-510d0dae],
.fade-slide-leave-active[data-v-510d0dae] {
transition: all 0.25s ease;
}
.fade-slide-enter-from[data-v-510d0dae] {
opacity: 0;
transform: translateY(8px);
}
.fade-slide-leave-to[data-v-510d0dae] {
opacity: 0;
transform: translateY(-8px);
}
/* Sign In Link */
.sign-in-link[data-v-510d0dae] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 1rem 2rem;
background: transparent;
border: 2px solid rgba(255, 215, 0, 0.5);
border-radius: 50px;
font-family: 'Montserrat', sans-serif;
font-size: clamp(0.9rem, 2.5vw, 1.1rem);
font-weight: 600;
color: #ffd700;
cursor: pointer;
transition: all 0.3s ease;
letter-spacing: 0.05em;
text-decoration: none;
}
.sign-in-link[data-v-510d0dae]:hover {
background: rgba(255, 215, 0, 0.1);
border-color: #ffd700;
box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
}
.arrow[data-v-510d0dae] {
font-size: 1.2rem;
transition: transform 0.3s ease;
}
.sign-in-link:hover .arrow[data-v-510d0dae] {
transform: translateX(5px);
}
/* Animations */
@keyframes fadeIn-510d0dae {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInDown-510d0dae {
from {
opacity: 0;
transform: translateY(-30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* Responsive adjustments */
@media (max-width: 768px) {
.overlay-content[data-v-510d0dae] {
padding: 6vh 4vw;
}
.casino-pills[data-v-510d0dae] {
gap: 0.4rem;
}
.casino-pill[data-v-510d0dae] {
padding: 0.5rem 0.9rem;
}
}
@media (max-width: 480px) {
.overlay-content[data-v-510d0dae] {
padding: 5vh 3vw;
}
.casino-selection[data-v-510d0dae] {
gap: 0.75rem;
}
.casino-pills[data-v-510d0dae] {
gap: 0.35rem;
}
.casino-pill[data-v-510d0dae] {
padding: 0.45rem 0.75rem;
font-size: 0.7rem;
}
.casino-detail-card[data-v-510d0dae] {
padding: 0.8rem 1rem;
}
}
.dragon-background[data-v-b6968ae6] {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 0;
pointer-events: none;
overflow: hidden;
}
.dragon-image[data-v-b6968ae6] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('/PrizePotBackground.jpg');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
/* Slight darkening overlay for better text readability */
filter: brightness(0.85);
}
.particle-canvas[data-v-b6968ae6] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.flappy-dragon[data-v-8a7b0a41] {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: #0a0a0f;
}
canvas[data-v-8a7b0a41] {
border: 2px solid rgba(0, 255, 136, 0.3);
border-radius: 10px;
cursor: pointer;
max-width: 100%;
max-height: 100%;
}
.start-overlay[data-v-8a7b0a41],
.gameover-overlay[data-v-8a7b0a41] {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
background: rgba(10, 15, 42, 0.95);
padding: 3rem;
border-radius: 20px;
border: 2px solid rgba(0, 255, 136, 0.5);
backdrop-filter: blur(10px);
}
.start-overlay h1[data-v-8a7b0a41],
.gameover-overlay h2[data-v-8a7b0a41] {
color: #00ff88;
margin: 0 0 1rem 0;
font-size: 3rem;
}
.start-overlay p[data-v-8a7b0a41],
.gameover-overlay p[data-v-8a7b0a41] {
color: #fff;
margin: 0.5rem 0;
font-size: 1.2rem;
}
.score[data-v-8a7b0a41] {
font-size: 2rem !important;
color: #00ffff;
margin: 1rem 0 !important;
}
.highscore[data-v-8a7b0a41] {
color: #ffd700;
font-weight: bold;
}
.btn-start[data-v-8a7b0a41],
.btn-restart[data-v-8a7b0a41],
.btn-exit[data-v-8a7b0a41] {
margin: 0.5rem;
padding: 1rem 2rem;
font-size: 1.2rem;
border: 2px solid #00ff88;
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: bold;
}
.btn-start[data-v-8a7b0a41]:hover,
.btn-restart[data-v-8a7b0a41]:hover {
background: rgba(0, 255, 136, 0.4);
transform: translateY(-2px);
}
.btn-exit[data-v-8a7b0a41] {
border-color: #ff0088;
color: #ff0088;
background: rgba(255, 0, 136, 0.2);
}
.btn-exit[data-v-8a7b0a41]:hover {
background: rgba(255, 0, 136, 0.4);
}
.hud[data-v-8a7b0a41] {
position: absolute;
top: 2rem;
left: 0;
right: 0;
display: flex;
justify-content: space-between;
padding: 0 4rem;
pointer-events: none;
}
.hud-score[data-v-8a7b0a41],
.hud-high[data-v-8a7b0a41] {
font-size: 1.5rem;
font-weight: bold;
color: #00ff88;
text-shadow: 0 0 10px rgba(0, 255, 136, 0.5);
}
.hud-high[data-v-8a7b0a41] {
color: #ffd700;
}
.hud-score.flash[data-v-8a7b0a41] {
animation: scoreFlash-8a7b0a41 0.2s ease-out;
}
@keyframes scoreFlash-8a7b0a41 {
0% {
transform: scale(1);
color: #00ff88;
}
50% {
transform: scale(1.3);
color: #00ffff;
}
100% {
transform: scale(1);
color: #00ff88;
}
}
.card-memory[data-v-7a8f9693] {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: #0a0a0f;
padding: 1rem;
}
.game-board[data-v-7a8f9693] {
position: relative;
width: 100%;
max-width: 700px;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
/* Overlays */
.start-overlay[data-v-7a8f9693],
.gameover-overlay[data-v-7a8f9693] {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
background: rgba(10, 15, 42, 0.95);
padding: 3rem;
border-radius: 20px;
border: 2px solid rgba(0, 255, 136, 0.5);
backdrop-filter: blur(10px);
z-index: 100;
}
.start-overlay h1[data-v-7a8f9693],
.gameover-overlay h2[data-v-7a8f9693] {
color: #00ff88;
margin: 0 0 1rem 0;
font-size: 3rem;
}
.start-overlay p[data-v-7a8f9693],
.gameover-overlay p[data-v-7a8f9693] {
color: #fff;
margin: 0.5rem 0;
font-size: 1.2rem;
}
.score[data-v-7a8f9693] {
font-size: 1.5rem !important;
color: #00ffff;
margin: 1rem 0 !important;
}
.highscore[data-v-7a8f9693] {
color: #ffd700;
font-weight: bold;
}
.btn-start[data-v-7a8f9693],
.btn-restart[data-v-7a8f9693],
.btn-exit[data-v-7a8f9693] {
margin: 0.5rem;
padding: 1rem 2rem;
font-size: 1.2rem;
border: 2px solid #00ff88;
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: bold;
}
.btn-start[data-v-7a8f9693]:hover,
.btn-restart[data-v-7a8f9693]:hover {
background: rgba(0, 255, 136, 0.4);
transform: translateY(-2px);
}
.btn-exit[data-v-7a8f9693] {
border-color: #ff0088;
color: #ff0088;
background: rgba(255, 0, 136, 0.2);
}
.btn-exit[data-v-7a8f9693]:hover {
background: rgba(255, 0, 136, 0.4);
}
/* HUD */
.hud[data-v-7a8f9693] {
display: flex;
gap: 2rem;
margin-bottom: 2rem;
padding: 1rem 2rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 12px;
border: 1px solid rgba(0, 255, 136, 0.3);
}
.hud-stat[data-v-7a8f9693] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.stat-label[data-v-7a8f9693] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.7);
}
.stat-value[data-v-7a8f9693] {
font-size: 1.5rem;
font-weight: bold;
color: #00ff88;
text-shadow: 0 0 10px rgba(0, 255, 136, 0.5);
}
/* Card Grid */
.card-grid[data-v-7a8f9693] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1rem;
width: 100%;
max-width: 600px;
perspective: 1000px;
}
.card-container[data-v-7a8f9693] {
aspect-ratio: 2.5 / 3.5;
cursor: pointer;
}
.card[data-v-7a8f9693] {
position: relative;
width: 100%;
height: 100%;
transform-style: preserve-3d;
transition: transform 0.6s;
}
.card.flipped[data-v-7a8f9693] {
transform: rotateY(180deg);
}
.card.disabled[data-v-7a8f9693] {
cursor: not-allowed;
}
.card-front[data-v-7a8f9693],
.card-back[data-v-7a8f9693] {
position: absolute;
width: 100%;
height: 100%;
backface-visibility: hidden;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 4rem;
border: 2px solid rgba(255, 255, 255, 0.2);
}
.card-front[data-v-7a8f9693] {
background: linear-gradient(135deg, #1a1f3a, #2a2f4a);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
.card-back-pattern[data-v-7a8f9693] {
font-size: 5rem;
opacity: 0.3;
color: #00ff88;
}
.card-back[data-v-7a8f9693] {
background: linear-gradient(135deg, #2a3a4a, #1a2a3a);
transform: rotateY(180deg);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}
.card.matched .card-back[data-v-7a8f9693] {
background: linear-gradient(135deg, rgba(0, 255, 136, 0.3), rgba(0, 200, 100, 0.3));
border-color: #00ff88;
animation: matchPulse-7a8f9693 0.5s ease-out;
}
@keyframes matchPulse-7a8f9693 {
0% {
transform: rotateY(180deg) scale(1);
}
50% {
transform: rotateY(180deg) scale(1.1);
}
100% {
transform: rotateY(180deg) scale(1);
}
}
/* Responsive */
@media (max-width: 768px) {
.card-grid[data-v-7a8f9693] {
gap: 0.5rem;
max-width: 100%;
}
.card-front[data-v-7a8f9693],
.card-back[data-v-7a8f9693] {
font-size: 3rem;
}
.hud[data-v-7a8f9693] {
gap: 1rem;
padding: 0.75rem 1rem;
}
.stat-value[data-v-7a8f9693] {
font-size: 1.25rem;
}
.start-overlay[data-v-7a8f9693],
.gameover-overlay[data-v-7a8f9693] {
padding: 2rem;
}
.start-overlay h1[data-v-7a8f9693],
.gameover-overlay h2[data-v-7a8f9693] {
font-size: 2rem;
}
}
@media (max-width: 480px) {
.card-front[data-v-7a8f9693],
.card-back[data-v-7a8f9693] {
font-size: 2.5rem;
}
.card-grid[data-v-7a8f9693] {
gap: 0.4rem;
}
}
.blackjack-trainer[data-v-4d26df37] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #0a3d2e, #1a1a2e);
padding: 1rem;
}
.game-board[data-v-4d26df37] {
position: relative;
width: 100%;
max-width: 900px;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
/* Overlays */
.start-overlay[data-v-4d26df37],
.gameover-overlay[data-v-4d26df37] {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
background: rgba(10, 15, 42, 0.95);
padding: 3rem;
border-radius: 20px;
border: 2px solid rgba(0, 255, 136, 0.5);
backdrop-filter: blur(10px);
z-index: 100;
min-width: 400px;
}
.start-overlay h1[data-v-4d26df37],
.gameover-overlay h2[data-v-4d26df37] {
color: #00ff88;
margin: 0 0 1rem 0;
font-size: 2.5rem;
}
.subtitle[data-v-4d26df37] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.6);
margin: 0.5rem 0 2rem 0;
}
.final-stats[data-v-4d26df37] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin: 2rem 0;
}
.stat-item[data-v-4d26df37] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.stat-label[data-v-4d26df37] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.stat-value[data-v-4d26df37] {
font-size: 1.5rem;
font-weight: bold;
color: #00ff88;
}
.btn-start[data-v-4d26df37],
.btn-restart[data-v-4d26df37],
.btn-exit[data-v-4d26df37] {
margin: 0.5rem;
padding: 1rem 2rem;
font-size: 1.2rem;
border: 2px solid #00ff88;
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: bold;
}
.btn-start[data-v-4d26df37]:hover,
.btn-restart[data-v-4d26df37]:hover {
background: rgba(0, 255, 136, 0.4);
transform: translateY(-2px);
}
.btn-exit[data-v-4d26df37] {
border-color: #ff0088;
color: #ff0088;
background: rgba(255, 0, 136, 0.2);
}
.btn-exit[data-v-4d26df37]:hover {
background: rgba(255, 0, 136, 0.4);
}
/* Game Content */
.game-content[data-v-4d26df37] {
width: 100%;
display: flex;
flex-direction: column;
gap: 1.5rem;
}
/* HUD */
.hud[data-v-4d26df37] {
display: flex;
justify-content: space-around;
padding: 1rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 12px;
border: 1px solid rgba(0, 255, 136, 0.3);
}
.hud-stat[data-v-4d26df37] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
/* Card Areas */
.dealer-area[data-v-4d26df37],
.player-area[data-v-4d26df37] {
background: rgba(0, 0, 0, 0.2);
padding: 1.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.dealer-area h3[data-v-4d26df37],
.player-area h3[data-v-4d26df37] {
margin: 0 0 1rem 0;
color: #fff;
font-size: 1.25rem;
}
.hand-value[data-v-4d26df37] {
color: #00ff88;
font-size: 1.5rem;
margin-left: 1rem;
}
.card-hand[data-v-4d26df37] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
justify-content: center;
}
/* Playing Cards */
.playing-card[data-v-4d26df37] {
width: 80px;
height: 112px;
position: relative;
transition: transform 0.3s ease;
}
.playing-card[data-v-4d26df37]:hover {
transform: translateY(-5px);
}
.card-unicode[data-v-4d26df37] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 5rem;
line-height: 1;
background: #ffffff;
border-radius: 8px;
border: 2px solid #333;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
user-select: none;
/* Force color for Unicode playing cards */
color: transparent;
text-shadow: 0 0 0 #000;
}
.card-face[data-v-4d26df37],
.card-back[data-v-4d26df37] {
width: 100%;
height: 100%;
background: white;
border-radius: 8px;
border: 2px solid #333;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
.card-rank[data-v-4d26df37] {
font-size: 2rem;
font-weight: bold;
position: absolute;
top: 5px;
left: 8px;
}
.card-suit[data-v-4d26df37] {
font-size: 3rem;
}
.card-back[data-v-4d26df37] {
background: linear-gradient(135deg, #1a1a2e, #0a3d2e);
padding: 8px;
}
.card-back-image[data-v-4d26df37] {
width: 100%;
height: 100%;
object-fit: contain;
opacity: 0.95;
}
/* Strategy Hint */
.strategy-hint[data-v-4d26df37] {
padding: 1rem 1.5rem;
border-radius: 10px;
border: 2px solid rgba(255, 200, 0, 0.5);
background: rgba(255, 200, 0, 0.1);
display: flex;
align-items: center;
gap: 0.75rem;
transition: all 0.3s ease;
}
.hint-visible[data-v-4d26df37] {
opacity: 1;
}
.hint-hidden[data-v-4d26df37] {
opacity: 0;
height: 0;
padding: 0;
border-width: 0;
overflow: hidden;
}
.hint-icon[data-v-4d26df37] {
font-size: 1.5rem;
}
.strategy-hint p[data-v-4d26df37] {
margin: 0;
color: #ffc800;
font-size: 1rem;
font-weight: 600;
}
/* Action Feedback */
.action-feedback[data-v-4d26df37] {
padding: 1rem;
border-radius: 10px;
text-align: center;
font-size: 1.25rem;
font-weight: bold;
animation: feedbackPulse-4d26df37 0.5s ease-out;
}
.feedback-correct[data-v-4d26df37] {
background: rgba(0, 255, 136, 0.2);
border: 2px solid #00ff88;
color: #00ff88;
}
.feedback-warning[data-v-4d26df37] {
background: rgba(255, 200, 0, 0.2);
border: 2px solid #ffc800;
color: #ffc800;
}
.feedback-error[data-v-4d26df37] {
background: rgba(255, 100, 100, 0.2);
border: 2px solid #ff6464;
color: #ff6464;
}
.feedback-blackjack[data-v-4d26df37] {
background: rgba(255, 215, 0, 0.3);
border: 2px solid #ffd700;
color: #ffd700;
}
@keyframes feedbackPulse-4d26df37 {
0% {
transform: scale(0.9);
opacity: 0;
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
opacity: 1;
}
}
/* Controls */
.betting-controls[data-v-4d26df37],
.action-controls[data-v-4d26df37],
.next-hand-controls[data-v-4d26df37] {
display: flex;
justify-content: center;
gap: 1rem;
flex-wrap: wrap;
}
.bet-display[data-v-4d26df37] {
font-size: 1.5rem;
font-weight: bold;
color: #00ff88;
padding: 0.75rem 1.5rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 8px;
border: 2px solid rgba(0, 255, 136, 0.3);
min-width: 100px;
text-align: center;
}
.btn-bet[data-v-4d26df37],
.btn-deal[data-v-4d26df37],
.btn-action[data-v-4d26df37],
.btn-next[data-v-4d26df37] {
padding: 0.75rem 1.5rem;
font-size: 1rem;
font-weight: 600;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
border: 2px solid;
}
.btn-bet[data-v-4d26df37] {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.3);
color: #fff;
}
.btn-bet[data-v-4d26df37]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.2);
}
.btn-bet[data-v-4d26df37]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.btn-deal[data-v-4d26df37] {
background: linear-gradient(135deg, #00ff88, #00cc6a);
border-color: #00ff88;
color: #000;
}
.btn-deal[data-v-4d26df37]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 255, 136, 0.3);
}
.btn-deal[data-v-4d26df37]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.btn-action[data-v-4d26df37] {
padding: 1rem 2rem;
font-size: 1.1rem;
}
.btn-hit[data-v-4d26df37] {
background: rgba(0, 200, 255, 0.2);
border-color: #00c8ff;
color: #00c8ff;
}
.btn-hit[data-v-4d26df37]:hover {
background: rgba(0, 200, 255, 0.3);
}
.btn-stand[data-v-4d26df37] {
background: rgba(255, 200, 0, 0.2);
border-color: #ffc800;
color: #ffc800;
}
.btn-stand[data-v-4d26df37]:hover {
background: rgba(255, 200, 0, 0.3);
}
.btn-double[data-v-4d26df37] {
background: rgba(255, 100, 255, 0.2);
border-color: #ff64ff;
color: #ff64ff;
}
.btn-double[data-v-4d26df37]:hover:not(:disabled) {
background: rgba(255, 100, 255, 0.3);
}
.btn-double[data-v-4d26df37]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.btn-hint[data-v-4d26df37] {
background: rgba(255, 200, 0, 0.2);
border-color: #ffc800;
color: #ffc800;
}
.btn-hint[data-v-4d26df37]:hover {
background: rgba(255, 200, 0, 0.3);
}
.btn-next[data-v-4d26df37] {
background: linear-gradient(135deg, #00ff88, #00cc6a);
border-color: #00ff88;
color: #000;
font-size: 1.25rem;
padding: 1rem 3rem;
}
.btn-next[data-v-4d26df37]:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 255, 136, 0.3);
}
/* Responsive */
@media (max-width: 768px) {
.playing-card[data-v-4d26df37] {
width: 60px;
height: 84px;
}
.card-unicode[data-v-4d26df37] {
font-size: 3.5rem;
}
.card-rank[data-v-4d26df37] {
font-size: 1.5rem;
top: 3px;
left: 5px;
}
.card-suit[data-v-4d26df37] {
font-size: 2rem;
}
.hud[data-v-4d26df37] {
flex-wrap: wrap;
gap: 0.5rem;
}
.btn-action[data-v-4d26df37] {
padding: 0.75rem 1.25rem;
font-size: 1rem;
}
}
.poker-hands-trainer[data-v-b13ced96] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #0a3d2e, #1a1a2e);
padding: 1rem;
overflow-y: auto;
}
.game-board[data-v-b13ced96] {
position: relative;
width: 100%;
max-width: 1000px;
min-height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: 1rem 0;
}
/* Overlays */
.start-overlay[data-v-b13ced96],
.gameover-overlay[data-v-b13ced96] {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
background: rgba(10, 15, 42, 0.95);
padding: 3rem;
border-radius: 20px;
border: 2px solid rgba(0, 255, 136, 0.5);
backdrop-filter: blur(10px);
z-index: 100;
min-width: 400px;
}
.start-overlay h1[data-v-b13ced96],
.gameover-overlay h2[data-v-b13ced96] {
color: #00ff88;
margin: 0 0 1rem 0;
font-size: 2.5rem;
}
.subtitle[data-v-b13ced96] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.6);
margin: 0.5rem 0 2rem 0;
}
.final-stats[data-v-b13ced96] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin: 2rem 0;
}
.stat-item[data-v-b13ced96] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.stat-label[data-v-b13ced96] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.stat-value[data-v-b13ced96] {
font-size: 1.5rem;
font-weight: bold;
color: #00ff88;
}
.btn-start[data-v-b13ced96],
.btn-restart[data-v-b13ced96],
.btn-exit[data-v-b13ced96] {
margin: 0.5rem;
padding: 1rem 2rem;
font-size: 1.2rem;
border: 2px solid #00ff88;
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: bold;
}
.btn-start[data-v-b13ced96]:hover,
.btn-restart[data-v-b13ced96]:hover {
background: rgba(0, 255, 136, 0.4);
transform: translateY(-2px);
}
.btn-exit[data-v-b13ced96] {
border-color: #ff0088;
color: #ff0088;
background: rgba(255, 0, 136, 0.2);
}
.btn-exit[data-v-b13ced96]:hover {
background: rgba(255, 0, 136, 0.4);
}
/* Game Content */
.game-content[data-v-b13ced96] {
width: 100%;
display: flex;
flex-direction: column;
gap: 1.5rem;
}
/* HUD */
.hud[data-v-b13ced96] {
display: flex;
justify-content: space-around;
padding: 1rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 12px;
border: 1px solid rgba(0, 255, 136, 0.3);
}
.hud-stat[data-v-b13ced96] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.streak[data-v-b13ced96] {
animation: pulse-b13ced96 0.5s ease-in-out;
}
.streak-hot[data-v-b13ced96] {
color: #ffa500;
}
.streak-fire[data-v-b13ced96] {
color: #ff4500;
animation: fire-b13ced96 0.5s ease-in-out infinite;
}
@keyframes pulse-b13ced96 {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
}
@keyframes fire-b13ced96 {
0%,
100% {
text-shadow: 0 0 5px #ff4500, 0 0 10px #ff4500;
}
50% {
text-shadow: 0 0 10px #ff4500, 0 0 20px #ff4500;
}
}
/* Difficulty Selector */
.difficulty-selector[data-v-b13ced96] {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
padding: 1rem;
background: rgba(0, 0, 0, 0.2);
border-radius: 10px;
}
.difficulty-selector label[data-v-b13ced96] {
color: rgba(255, 255, 255, 0.8);
font-weight: 600;
}
.btn-difficulty[data-v-b13ced96] {
padding: 0.5rem 1.5rem;
border: 2px solid rgba(255, 255, 255, 0.3);
background: rgba(255, 255, 255, 0.1);
color: #fff;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
}
.btn-difficulty[data-v-b13ced96]:hover {
background: rgba(255, 255, 255, 0.2);
}
.btn-difficulty.active[data-v-b13ced96] {
background: rgba(0, 255, 136, 0.3);
border-color: #00ff88;
color: #00ff88;
}
/* Hand Area */
.hand-area[data-v-b13ced96] {
background: rgba(0, 0, 0, 0.2);
padding: 1.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.hand-area h3[data-v-b13ced96] {
margin: 0 0 1rem 0;
color: #fff;
font-size: 1.25rem;
text-align: center;
}
.card-hand[data-v-b13ced96] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
justify-content: center;
}
/* Playing Cards */
.playing-card[data-v-b13ced96] {
width: 80px;
height: 112px;
position: relative;
transition: transform 0.3s ease;
}
.playing-card[data-v-b13ced96]:hover {
transform: translateY(-5px);
}
.card-unicode[data-v-b13ced96] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 5rem;
line-height: 1;
background: #ffffff;
border-radius: 8px;
border: 2px solid #333;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
user-select: none;
color: transparent;
text-shadow: 0 0 0 #000;
}
/* Feedback */
.feedback-message[data-v-b13ced96] {
padding: 1.5rem;
border-radius: 12px;
display: flex;
align-items: center;
gap: 1rem;
animation: fadeIn-b13ced96 0.3s ease-out;
}
.feedback-icon[data-v-b13ced96] {
font-size: 2rem;
}
.feedback-content[data-v-b13ced96] {
flex: 1;
}
.feedback-main[data-v-b13ced96] {
margin: 0;
font-size: 1.5rem;
font-weight: bold;
}
.feedback-detail[data-v-b13ced96] {
margin: 0.5rem 0 0 0;
font-size: 1rem;
opacity: 0.9;
}
.feedback-correct[data-v-b13ced96] {
background: rgba(0, 255, 136, 0.2);
border: 2px solid #00ff88;
color: #00ff88;
}
.feedback-wrong[data-v-b13ced96] {
background: rgba(255, 100, 100, 0.2);
border: 2px solid #ff6464;
color: #ff6464;
}
@keyframes fadeIn-b13ced96 {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* Hand Selection Buttons */
.hand-selection[data-v-b13ced96] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 1rem;
}
.btn-hand-type[data-v-b13ced96] {
padding: 1rem;
font-size: 1rem;
font-weight: 600;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
border: 2px solid;
background: rgba(255, 255, 255, 0.1);
color: #fff;
}
.btn-hand-type[data-v-b13ced96]:not(:disabled):hover {
transform: translateY(-2px);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
}
.btn-hand-type[data-v-b13ced96]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.royal-flush[data-v-b13ced96] {
border-color: #ffd700;
}
.royal-flush[data-v-b13ced96]:hover {
background: rgba(255, 215, 0, 0.2);
color: #ffd700;
}
.straight-flush[data-v-b13ced96] {
border-color: #00d4ff;
}
.straight-flush[data-v-b13ced96]:hover {
background: rgba(0, 212, 255, 0.2);
color: #00d4ff;
}
.four-kind[data-v-b13ced96] {
border-color: #ff00ff;
}
.four-kind[data-v-b13ced96]:hover {
background: rgba(255, 0, 255, 0.2);
color: #ff00ff;
}
.full-house[data-v-b13ced96] {
border-color: #00ff88;
}
.full-house[data-v-b13ced96]:hover {
background: rgba(0, 255, 136, 0.2);
color: #00ff88;
}
.flush[data-v-b13ced96] {
border-color: #88ff00;
}
.flush[data-v-b13ced96]:hover {
background: rgba(136, 255, 0, 0.2);
color: #88ff00;
}
.straight[data-v-b13ced96] {
border-color: #ff8800;
}
.straight[data-v-b13ced96]:hover {
background: rgba(255, 136, 0, 0.2);
color: #ff8800;
}
.three-kind[data-v-b13ced96] {
border-color: #ff4444;
}
.three-kind[data-v-b13ced96]:hover {
background: rgba(255, 68, 68, 0.2);
color: #ff4444;
}
.two-pair[data-v-b13ced96] {
border-color: #4488ff;
}
.two-pair[data-v-b13ced96]:hover {
background: rgba(68, 136, 255, 0.2);
color: #4488ff;
}
.one-pair[data-v-b13ced96] {
border-color: #ff88ff;
}
.one-pair[data-v-b13ced96]:hover {
background: rgba(255, 136, 255, 0.2);
color: #ff88ff;
}
.high-card[data-v-b13ced96] {
border-color: #888888;
}
.high-card[data-v-b13ced96]:hover {
background: rgba(136, 136, 136, 0.2);
color: #888;
}
/* Next Button */
.next-controls[data-v-b13ced96] {
display: flex;
justify-content: center;
}
.btn-next[data-v-b13ced96] {
background: linear-gradient(135deg, #00ff88, #00cc6a);
border: 2px solid #00ff88;
color: #000;
font-size: 1.25rem;
padding: 1rem 3rem;
border-radius: 10px;
font-weight: bold;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-next[data-v-b13ced96]:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 255, 136, 0.3);
}
/* Quick Reference */
.quick-reference[data-v-b13ced96] {
background: rgba(0, 0, 0, 0.3);
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.btn-toggle-ref[data-v-b13ced96] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
font-size: 1rem;
}
.btn-toggle-ref[data-v-b13ced96]:hover {
background: rgba(255, 255, 255, 0.2);
}
.reference-content[data-v-b13ced96] {
margin-top: 1rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.ref-item[data-v-b13ced96] {
display: grid;
grid-template-columns: 40px 1fr 2fr;
gap: 1rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 6px;
align-items: center;
}
.ref-rank[data-v-b13ced96] {
font-weight: bold;
color: #00ff88;
font-size: 1.25rem;
}
.ref-name[data-v-b13ced96] {
font-weight: 600;
color: #fff;
}
.ref-desc[data-v-b13ced96] {
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
}
/* Responsive */
@media (max-width: 768px) {
.playing-card[data-v-b13ced96] {
width: 60px;
height: 84px;
}
.card-unicode[data-v-b13ced96] {
font-size: 3.5rem;
}
.hand-selection[data-v-b13ced96] {
grid-template-columns: repeat(2, 1fr);
}
.hud[data-v-b13ced96] {
flex-wrap: wrap;
gap: 0.5rem;
}
.ref-item[data-v-b13ced96] {
grid-template-columns: 30px 1fr;
gap: 0.5rem;
}
.ref-desc[data-v-b13ced96] {
grid-column: 2 / 3;
}
}
.game-container[data-v-bd4c9f9e] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: #000;
position: relative;
}
.game-frame[data-v-bd4c9f9e] {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
/* Game Error */
.game-error[data-v-bd4c9f9e] {
text-align: center;
color: #fff;
padding: 2rem;
}
.game-error h2[data-v-bd4c9f9e] {
margin: 0 0 1rem 0;
color: #ff00ff;
font-size: 2.5rem;
}
.game-error p[data-v-bd4c9f9e] {
margin: 0.5rem 0 2rem 0;
color: rgba(255, 255, 255, 0.8);
font-size: 1.1rem;
}
.btn-browse[data-v-bd4c9f9e] {
padding: 1rem 2rem;
background: linear-gradient(135deg, #00ffff, #ff00ff);
border: none;
color: #fff;
border-radius: 10px;
cursor: pointer;
font-size: 1.1rem;
font-weight: bold;
transition: all 0.3s ease;
}
.btn-browse[data-v-bd4c9f9e]:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(255, 0, 255, 0.4);
}
/* Floating Menu Button */
.btn-floating-menu[data-v-bd4c9f9e] {
position: fixed;
top: 1rem;
right: 1rem;
width: 50px;
height: 50px;
border-radius: 50%;
background: rgba(0, 0, 0, 0.8);
border: 2px solid #00ffff;
color: #00ffff;
font-size: 1.5rem;
cursor: pointer;
z-index: 900;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
display: flex;
align-items: center;
justify-content: center;
}
.btn-floating-menu[data-v-bd4c9f9e]:hover {
background: rgba(0, 255, 255, 0.2);
transform: scale(1.1);
box-shadow: 0 4px 15px rgba(0, 255, 255, 0.5);
}
/* Game Menu Overlay */
.game-menu-overlay[data-v-bd4c9f9e] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.9);
backdrop-filter: blur(10px);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
animation: fadeIn-bd4c9f9e 0.3s ease-out;
}
@keyframes fadeIn-bd4c9f9e {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.game-menu[data-v-bd4c9f9e] {
background: linear-gradient(135deg, rgba(10, 15, 42, 0.95), rgba(20, 24, 40, 0.95));
border: 2px solid rgba(0, 255, 255, 0.5);
border-radius: 20px;
padding: 2rem;
max-width: 600px;
width: 90%;
animation: slideUp-bd4c9f9e 0.3s ease-out;
}
@keyframes slideUp-bd4c9f9e {
from {
transform: translateY(20px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
.game-menu h2[data-v-bd4c9f9e] {
margin: 0 0 1.5rem 0;
font-size: 2rem;
text-align: center;
background: linear-gradient(135deg, #00ffff, #ff00ff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.game-grid[data-v-bd4c9f9e] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin-bottom: 2rem;
}
.game-card[data-v-bd4c9f9e] {
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 12px;
padding: 1.5rem 1rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.game-card[data-v-bd4c9f9e]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: #00ffff;
transform: translateY(-3px);
box-shadow: 0 6px 20px rgba(0, 255, 255, 0.3);
}
.game-card.active[data-v-bd4c9f9e] {
background: rgba(0, 255, 255, 0.2);
border-color: #00ffff;
box-shadow: 0 0 20px rgba(0, 255, 255, 0.5);
}
.game-icon[data-v-bd4c9f9e] {
font-size: 3rem;
display: block;
}
.game-name[data-v-bd4c9f9e] {
color: #fff;
font-size: 1rem;
font-weight: 600;
text-align: center;
}
.menu-actions[data-v-bd4c9f9e] {
display: flex;
gap: 1rem;
justify-content: center;
}
.btn-menu-action[data-v-bd4c9f9e] {
padding: 0.75rem 1.5rem;
background: rgba(0, 255, 255, 0.2);
border: 1px solid #00ffff;
color: #00ffff;
border-radius: 8px;
cursor: pointer;
font-size: 1rem;
font-weight: 600;
transition: all 0.3s ease;
}
.btn-menu-action[data-v-bd4c9f9e]:hover {
background: rgba(0, 255, 255, 0.3);
transform: translateY(-2px);
}
.btn-menu-action.btn-exit[data-v-bd4c9f9e] {
background: rgba(255, 0, 136, 0.2);
border-color: #ff0088;
color: #ff0088;
}
.btn-menu-action.btn-exit[data-v-bd4c9f9e]:hover {
background: rgba(255, 0, 136, 0.3);
}
/* Responsive */
@media (max-width: 768px) {
.game-menu[data-v-bd4c9f9e] {
padding: 1.5rem;
}
.game-menu h2[data-v-bd4c9f9e] {
font-size: 1.5rem;
}
.game-grid[data-v-bd4c9f9e] {
grid-template-columns: 1fr;
}
.btn-floating-menu[data-v-bd4c9f9e] {
width: 45px;
height: 45px;
font-size: 1.3rem;
}
.menu-actions[data-v-bd4c9f9e] {
flex-direction: column;
}
.btn-menu-action[data-v-bd4c9f9e] {
width: 100%;
}
}
.atm-waiting[data-v-070e2874] {
position: relative;
width: 100%;
height: 100%;
background: #0a0a0a;
overflow: hidden;
cursor: pointer;
user-select: none;
-webkit-user-select: none;
}
/* ── Carousel background ── */
.carousel-bg[data-v-070e2874] {
position: absolute;
inset: 0;
}
.carousel-slide[data-v-070e2874] {
position: absolute;
inset: 0;
}
.carousel-img[data-v-070e2874] {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.carousel-vignette[data-v-070e2874] {
position: absolute;
inset: 0;
background: radial-gradient(
ellipse at center,
transparent 30%,
rgba(0, 0, 0, 0.55) 70%,
rgba(0, 0, 0, 0.85) 100%
);
}
.carousel-fallback[data-v-070e2874] {
position: absolute;
inset: 0;
background: radial-gradient(ellipse at 60% 40%, #1a0a00 0%, #0a0a0a 70%);
}
/* ── CTA overlay ── */
.cta-overlay[data-v-070e2874] {
position: absolute;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 3rem;
padding: 2rem;
z-index: 10;
}
.cta-logo[data-v-070e2874] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.logo-img[data-v-070e2874] {
width: 400px;
height: auto;
filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.5));
object-fit: contain;
}
/* ── Touch button ── */
.btn-touch-start[data-v-070e2874] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1.4rem 3.5rem;
background: rgba(255, 215, 0, 0.12);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 2px solid #ffd700;
border-radius: 60px;
color: #ffd700;
font-size: 1.8rem;
font-weight: 900;
letter-spacing: 0.18em;
cursor: pointer;
transition: all 0.3s ease;
text-shadow: 0 0 12px rgba(255, 215, 0, 0.6);
box-shadow:
0 0 30px rgba(255, 215, 0, 0.25),
0 8px 32px rgba(0, 0, 0, 0.4),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
min-height: 80px;
}
.btn-touch-start[data-v-070e2874]:active {
transform: scale(0.96);
box-shadow:
0 0 50px rgba(255, 215, 0, 0.6),
0 4px 16px rgba(0, 0, 0, 0.4),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.btn-touch-start.pulse[data-v-070e2874] {
animation: touch-pulse-070e2874 2.4s ease-in-out infinite;
}
.touch-icon[data-v-070e2874] {
font-size: 1.2rem;
opacity: 0.8;
}
@keyframes touch-pulse-070e2874 {
0%, 100% {
box-shadow:
0 0 30px rgba(255, 215, 0, 0.25),
0 8px 32px rgba(0, 0, 0, 0.4),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
border-color: #ffd700;
}
50% {
box-shadow:
0 0 60px rgba(255, 215, 0, 0.55),
0 8px 32px rgba(0, 0, 0, 0.4),
inset 0 1px 0 rgba(255, 255, 255, 0.15);
border-color: #ffe566;
}
}
.cta-tagline[data-v-070e2874] {
font-size: 1.05rem;
color: rgba(255, 255, 255, 0.55);
letter-spacing: 0.08em;
text-align: center;
margin: 0;
}
/* ── Slide indicators ── */
.slide-indicators[data-v-070e2874] {
position: absolute;
bottom: 2rem;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 0.5rem;
z-index: 10;
}
.slide-dot[data-v-070e2874] {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.3);
transition: all 0.3s ease;
}
.slide-dot.active[data-v-070e2874] {
background: #ffd700;
box-shadow: 0 0 8px rgba(255, 215, 0, 0.6);
width: 24px;
border-radius: 4px;
}
/* ── Carousel transitions ── */
.carousel-fade-enter-active[data-v-070e2874],
.carousel-fade-leave-active[data-v-070e2874] {
transition: opacity 0.8s ease;
}
.carousel-fade-enter-from[data-v-070e2874],
.carousel-fade-leave-to[data-v-070e2874] {
opacity: 0;
}
.atm-interactive[data-v-6f529de5] {
width: 100%;
height: 100%;
background: #0a0a0a;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
gap: 2rem;
overflow: hidden;
}
/* ── Header ── */
.atm-header[data-v-6f529de5] {
display: flex;
align-items: center;
gap: 1rem;
flex-shrink: 0;
}
.header-logo[data-v-6f529de5] {
height: 280px;
width: auto;
filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.5));
object-fit: contain;
}
/* ── Option cards ── */
.option-cards[data-v-6f529de5] {
display: flex;
gap: 4rem;
flex: 0;
width: 100%;
max-width: 1000px;
align-items: stretch;
}
.option-card[data-v-6f529de5] {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.8rem;
padding: 1.5rem 2rem;
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 24px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
cursor: pointer;
transition: all 0.25s ease;
text-align: center;
min-height: 0;
}
.option-card[data-v-6f529de5]:hover,
.option-card[data-v-6f529de5]:focus-visible {
background: rgba(255, 255, 255, 0.09);
border-color: rgba(255, 255, 255, 0.25);
transform: translateY(-4px);
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
outline: none;
}
.option-card[data-v-6f529de5]:active {
transform: scale(0.97);
}
.card-spin[data-v-6f529de5] {
border-color: rgba(255, 215, 0, 0.25);
background: rgba(255, 215, 0, 0.05);
}
.card-spin[data-v-6f529de5]:hover,
.card-spin[data-v-6f529de5]:focus-visible {
border-color: rgba(255, 215, 0, 0.5);
background: rgba(255, 215, 0, 0.09);
box-shadow:
0 16px 48px rgba(0, 0, 0, 0.5),
0 0 40px rgba(255, 215, 0, 0.12);
}
/* ── Card icon ring ── */
.card-icon-ring[data-v-6f529de5] {
width: 64px;
height: 64px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.06);
border: 2px solid rgba(255, 255, 255, 0.15);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.ring-gold[data-v-6f529de5] {
border-color: rgba(255, 215, 0, 0.4);
background: rgba(255, 215, 0, 0.08);
box-shadow: 0 0 20px rgba(255, 215, 0, 0.15);
}
.card-icon[data-v-6f529de5] {
font-size: 2rem;
line-height: 1;
}
/* ── Card text ── */
.card-title[data-v-6f529de5] {
font-size: 1.5rem;
font-weight: 800;
color: #ffffff;
margin: 0;
line-height: 1.2;
}
.card-desc[data-v-6f529de5] {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.55);
margin: 0;
line-height: 1.4;
flex: 0;
}
.card-badges[data-v-6f529de5] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
justify-content: center;
}
.badge-item[data-v-6f529de5] {
padding: 0.25rem 0.75rem;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 20px;
font-size: 0.78rem;
color: rgba(255, 255, 255, 0.7);
letter-spacing: 0.03em;
}
.card-requirement[data-v-6f529de5] {
font-size: 0.83rem;
color: rgba(255, 215, 0, 0.7);
display: flex;
align-items: center;
gap: 0.35rem;
}
.req-icon[data-v-6f529de5] {
font-size: 0.9rem;
}
.card-cta[data-v-6f529de5] {
font-size: 1rem;
font-weight: 700;
color: rgba(255, 255, 255, 0.8);
letter-spacing: 0.05em;
padding: 0.6rem 1.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 30px;
transition: all 0.2s ease;
}
.card-cta-gold[data-v-6f529de5] {
color: #ffd700;
border-color: rgba(255, 215, 0, 0.4);
background: rgba(255, 215, 0, 0.08);
}
/* ── Timeout bar ── */
.timeout-bar[data-v-6f529de5] {
position: absolute;
bottom: 1.5rem;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: 1rem;
width: 100%;
max-width: 500px;
flex-shrink: 0;
}
.timeout-track[data-v-6f529de5] {
flex: 1;
height: 4px;
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
overflow: hidden;
}
.timeout-fill[data-v-6f529de5] {
height: 100%;
background: linear-gradient(90deg, #8b0000, #ffd700);
border-radius: 2px;
transition: width 1s linear;
}
.timeout-label[data-v-6f529de5] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.35);
white-space: nowrap;
min-width: 6ch;
text-align: right;
}
/* ── Portrait / smaller tablets ── */
@media (max-width: 700px) {
.option-cards[data-v-6f529de5] {
flex-direction: column;
max-width: 420px;
}
.option-card[data-v-6f529de5] {
min-height: 0;
padding: 1.8rem 1.5rem;
}
.card-icon-ring[data-v-6f529de5] {
width: 64px;
height: 64px;
}
.card-icon[data-v-6f529de5] {
font-size: 2rem;
}
.card-title[data-v-6f529de5] {
font-size: 1.2rem;
}
}
.atm-download[data-v-f6f5f29d] {
width: 100%;
height: 100%;
background: #0a0a0a;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
position: relative;
overflow: hidden;
}
/* ── Back button ── */
.btn-back[data-v-f6f5f29d] {
position: absolute;
top: 1.5rem;
left: 1.5rem;
padding: 0.6rem 1.2rem;
background: rgba(255, 255, 255, 0.06);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
min-height: 44px;
z-index: 10;
}
.btn-back[data-v-f6f5f29d]:hover {
background: rgba(255, 255, 255, 0.1);
color: #ffffff;
transform: translateX(-2px);
}
/* ── Body ── */
.download-body[data-v-f6f5f29d] {
flex: 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
width: 100%;
max-width: 480px;
padding-top: 3rem;
padding-bottom: 4rem;
margin-bottom: 2rem;
}
/* ── Header ── */
.download-header[data-v-f6f5f29d] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
text-align: center;
}
.header-logo[data-v-f6f5f29d] {
height: 150px;
width: auto;
filter: drop-shadow(0 0 18px rgba(255, 215, 0, 0.5));
object-fit: contain;
}
.header-title[data-v-f6f5f29d] {
font-size: 1.7rem;
font-weight: 800;
color: #ffffff;
margin: 0;
line-height: 1.2;
}
.header-sub[data-v-f6f5f29d] {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.5);
margin: 0;
}
/* ── QR section ── */
.qr-section[data-v-f6f5f29d] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.2rem;
}
.qr-wrapper[data-v-f6f5f29d] {
padding: 1.5rem;
display: flex;
align-items: center;
justify-content: center;
min-width: 220px;
min-height: 220px;
border-radius: 20px;
}
.qr-loading[data-v-f6f5f29d] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.75rem;
color: rgba(255, 255, 255, 0.5);
font-size: 0.9rem;
}
.spinner[data-v-f6f5f29d] {
width: 36px;
height: 36px;
border: 3px solid rgba(255, 215, 0, 0.2);
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-f6f5f29d 0.8s linear infinite;
}
@keyframes spin-f6f5f29d {
to { transform: rotate(360deg);
}
}
.qr-content[data-v-f6f5f29d] {
display: flex;
align-items: center;
justify-content: center;
}
.qr-image[data-v-f6f5f29d] {
width: 200px;
height: 200px;
image-rendering: pixelated;
}
.qr-error[data-v-f6f5f29d] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
color: rgba(255, 100, 60, 0.8);
text-align: center;
}
.error-icon[data-v-f6f5f29d] {
font-size: 2rem;
}
/* ── Scan instruction ── */
.scan-instruction[data-v-f6f5f29d] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.5);
margin: 0;
text-align: center;
}
/* ── Store badges ── */
.store-badges[data-v-f6f5f29d] {
display: flex;
gap: 0.75rem;
justify-content: center;
}
.store-badge[data-v-f6f5f29d] {
padding: 0.4rem 1rem;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 20px;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.7);
letter-spacing: 0.03em;
}
/* ── Account note ── */
.account-note[data-v-f6f5f29d] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
padding: 0.9rem 1.2rem;
border-radius: 12px;
width: 100%;
}
.note-icon[data-v-f6f5f29d] {
font-size: 1.5rem;
color: #ffd700;
flex-shrink: 0;
margin-top: 2px;
}
.note-text[data-v-f6f5f29d] {
font-size: 1.5rem;
color: rgba(255, 255, 255, 0.55);
margin: 0;
line-height: 1.4;
}
/* ── Timeout bar ── */
.timeout-bar[data-v-f6f5f29d] {
position: absolute;
bottom: 0.75rem;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: 1rem;
width: 100%;
max-width: 480px;
}
.timeout-track[data-v-f6f5f29d] {
flex: 1;
height: 4px;
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
overflow: hidden;
}
.timeout-fill[data-v-f6f5f29d] {
height: 100%;
background: linear-gradient(90deg, #8b0000, #ffd700);
border-radius: 2px;
transition: width 1s linear;
}
.timeout-label[data-v-f6f5f29d] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.35);
white-space: nowrap;
min-width: 6ch;
text-align: right;
}
/* ── Compact portrait ── */
@media (max-width: 600px) {
.header-title[data-v-f6f5f29d] {
font-size: 1.3rem;
}
.qr-image[data-v-f6f5f29d] {
width: 160px;
height: 160px;
}
.qr-wrapper[data-v-f6f5f29d] {
min-width: 180px;
min-height: 180px;
padding: 1rem;
}
}
.fw-container[data-v-45b073d4]{position:relative;display:inline-block;font-size:0;overflow:hidden}.fw-container canvas[data-v-45b073d4],.fw-container img[data-v-45b073d4]{display:block;width:100%}.fw-btn[data-v-45b073d4]{position:absolute;top:0;left:0;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.fw-btn__btn[data-v-45b073d4]{position:relative;width:100%;height:100%;background:#fff;border:6px solid #fff;border-radius:50%;background:#15bd96;color:#fff;text-align:center;font-size:42px;font-weight:700;line-height:1;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.fw-btn__btn[data-v-45b073d4]:after{content:"";display:block;width:0;height:0;border-left:18px solid transparent;border-right:18px solid transparent;border-bottom:22px #fff solid;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.fw-btn__btn[data-v-45b073d4]:before{content:"";display:block;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:18px #15BD96 solid;position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(6px);z-index:10}.fw-btn__image[data-v-45b073d4]{display:inline-block}
.spin-wheel-wrapper[data-v-ce21b6aa] {
display: flex;
align-items: center;
justify-content: center;
}
.atm-spin[data-v-2bdbb8c4] {
width: 100%;
height: 100%;
background: #0a0a0a;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
position: relative;
overflow: hidden;
}
/* ── Back button ── */
.btn-back[data-v-2bdbb8c4] {
position: absolute;
top: 1.5rem;
left: 1.5rem;
padding: 0.6rem 1.2rem;
background: rgba(255, 255, 255, 0.06);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
min-height: 44px;
z-index: 10;
}
.btn-back[data-v-2bdbb8c4]:hover {
background: rgba(255, 255, 255, 0.1);
color: #ffffff;
transform: translateX(-2px);
}
/* ── State panels ── */
.state-panel[data-v-2bdbb8c4] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
width: 100%;
max-width: 460px;
text-align: center;
}
/* ── Generating ── */
.state-icon-ring[data-v-2bdbb8c4] {
width: 96px;
height: 96px;
border-radius: 50%;
background: rgba(255, 215, 0, 0.06);
border: 2px solid rgba(255, 215, 0, 0.2);
display: flex;
align-items: center;
justify-content: center;
}
.spinner-gold[data-v-2bdbb8c4] {
width: 40px;
height: 40px;
border: 3px solid rgba(255, 215, 0, 0.2);
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-2bdbb8c4 0.85s linear infinite;
}
@keyframes spin-2bdbb8c4 {
to {
transform: rotate(360deg);
}
}
.state-title[data-v-2bdbb8c4] {
font-size: 1.6rem;
font-weight: 800;
color: #ffffff;
margin: 0;
}
.state-sub[data-v-2bdbb8c4] {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.45);
margin: 0;
}
/* ── Waiting ── */
.header-logo[data-v-2bdbb8c4] {
height: 240px;
width: auto;
filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.5));
object-fit: contain;
margin-bottom: -50px;
}
.waiting-title[data-v-2bdbb8c4] {
font-size: 2rem;
font-weight: 900;
color: #ffffff;
margin: 0;
}
.qr-wrapper[data-v-2bdbb8c4] {
padding: 1.5rem;
display: flex;
align-items: center;
justify-content: center;
min-width: 210px;
min-height: 210px;
border-radius: 20px;
/* gold tint override */
border-color: rgba(255, 215, 0, 0.25) !important;
}
.qr-loading[data-v-2bdbb8c4] {
display: flex;
align-items: center;
justify-content: center;
width: 180px;
height: 180px;
}
.qr-image[data-v-2bdbb8c4] {
width: 200px;
height: 200px;
image-rendering: pixelated;
}
/* ── Scan instructions ── */
.scan-instructions[data-v-2bdbb8c4] {
display: flex;
flex-direction: column;
gap: 0.4rem;
}
.scan-primary[data-v-2bdbb8c4] {
font-size: 1.05rem;
font-weight: 700;
color: #ffffff;
margin: 0;
}
.scan-urgent[data-v-2bdbb8c4] {
font-size: 0.9rem;
font-weight: 600;
color: #ffd700;
margin: 0;
letter-spacing: 0.03em;
}
/* ── Countdown ring ── */
.countdown-ring[data-v-2bdbb8c4] {
position: relative;
width: 80px;
height: 80px;
}
.countdown-svg[data-v-2bdbb8c4] {
width: 80px;
height: 80px;
transform: rotate(-90deg);
}
.countdown-track[data-v-2bdbb8c4] {
stroke: rgba(255, 255, 255, 0.1);
}
.countdown-progress[data-v-2bdbb8c4] {
stroke: #ffd700;
transition: stroke-dashoffset 1s linear;
filter: drop-shadow(0 0 4px rgba(255, 215, 0, 0.6));
}
.countdown-number[data-v-2bdbb8c4] {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.3rem;
font-weight: 800;
color: #ffd700;
}
.account-note[data-v-2bdbb8c4] {
font-size: 0.82rem;
color: rgba(255, 255, 255, 0.4);
margin: 0;
display: flex;
align-items: center;
gap: 0.35rem;
justify-content: center;
}
.note-icon[data-v-2bdbb8c4] {
color: rgba(255, 215, 0, 0.6);
}
/* ── Spinning ── */
.state-spinning[data-v-2bdbb8c4] {
justify-content: center;
gap: 1.5rem;
}
.spin-player-name[data-v-2bdbb8c4] {
font-size: 2rem;
font-weight: 900;
color: #ffd700;
margin: 0;
text-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
animation: pop-in-2bdbb8c4 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.wheel-area[data-v-2bdbb8c4] {
display: flex;
align-items: center;
justify-content: center;
}
/* ── Result ── */
.result-burst[data-v-2bdbb8c4] {
display: flex;
align-items: center;
gap: 1rem;
}
.result-stars[data-v-2bdbb8c4] {
font-size: 1.2rem;
color: #ffd700;
opacity: 0.8;
}
.result-icon[data-v-2bdbb8c4] {
font-size: 4rem;
line-height: 1;
animation: pop-in-2bdbb8c4 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes pop-in-2bdbb8c4 {
from {
transform: scale(0.3);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
.result-congrats[data-v-2bdbb8c4] {
font-size: 2.2rem;
font-weight: 900;
color: #ffffff;
margin: 0;
text-shadow: 0 0 30px rgba(255, 215, 0, 0.3);
}
.result-prize[data-v-2bdbb8c4] {
padding: 1.5rem 2.5rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.4rem;
width: 100%;
border-color: rgba(255, 215, 0, 0.3) !important;
background: rgba(255, 215, 0, 0.06) !important;
}
.result-label[data-v-2bdbb8c4] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.5);
margin: 0;
text-transform: uppercase;
letter-spacing: 0.1em;
}
.result-multiplier[data-v-2bdbb8c4] {
font-size: 2rem;
font-weight: 900;
color: #ffd700;
margin: 0;
text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}
.result-points[data-v-2bdbb8c4] {
font-size: 1.1rem;
font-weight: 700;
color: #39ff14;
margin: 0;
}
.result-check[data-v-2bdbb8c4] {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.55);
margin: 0;
}
/* ── Denied ── */
.denied-icon[data-v-2bdbb8c4] {
font-size: 4rem;
line-height: 1;
}
.denied-title[data-v-2bdbb8c4] {
font-size: 1.8rem;
font-weight: 800;
color: #ffffff;
margin: 0;
}
.denied-message[data-v-2bdbb8c4] {
padding: 1.2rem 1.8rem;
width: 100%;
border-color: rgba(255, 80, 60, 0.2) !important;
}
.denied-message p[data-v-2bdbb8c4] {
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.7);
margin: 0;
line-height: 1.5;
}
.denied-sub[data-v-2bdbb8c4] {
font-size: 0.82rem;
color: rgba(255, 255, 255, 0.35);
margin: 0;
}
/* ── Result / denied auto-close bar ── */
.result-bar[data-v-2bdbb8c4] {
width: 100%;
height: 4px;
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
overflow: hidden;
}
.result-bar-red[data-v-2bdbb8c4] {
margin-top: 0.5rem;
}
.result-bar-fill[data-v-2bdbb8c4] {
height: 100%;
background: linear-gradient(90deg, #ffd700, #ffe566);
border-radius: 2px;
transition: width 1s linear;
}
.red-fill[data-v-2bdbb8c4] {
background: linear-gradient(90deg, #8b0000, #ff4444);
}
.result-closing[data-v-2bdbb8c4] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.3);
margin: 0;
}
/* ── Session timeout bar ── */
.session-timeout-bar[data-v-2bdbb8c4] {
position: absolute;
bottom: 1.5rem;
left: 2rem;
right: 2rem;
display: flex;
align-items: center;
gap: 1rem;
}
.session-track[data-v-2bdbb8c4] {
flex: 1;
height: 3px;
background: rgba(255, 255, 255, 0.08);
border-radius: 2px;
overflow: hidden;
}
.session-fill[data-v-2bdbb8c4] {
height: 100%;
background: rgba(255, 215, 0, 0.5);
border-radius: 2px;
transition: width 1s linear;
}
.session-label[data-v-2bdbb8c4] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.25);
white-space: nowrap;
}
/* ── State transitions ── */
.state-fade-enter-active[data-v-2bdbb8c4],
.state-fade-leave-active[data-v-2bdbb8c4] {
transition: opacity 0.3s ease, transform 0.3s ease;
}
.state-fade-enter-from[data-v-2bdbb8c4] {
opacity: 0;
transform: translateY(12px);
}
.state-fade-leave-to[data-v-2bdbb8c4] {
opacity: 0;
transform: translateY(-12px);
}
/* ── Compact portrait ── */
@media (max-width: 600px) {
.waiting-title[data-v-2bdbb8c4] {
font-size: 1.5rem;
}
.qr-image[data-v-2bdbb8c4] {
width: 160px;
height: 160px;
}
.qr-wrapper[data-v-2bdbb8c4] {
min-width: 180px;
min-height: 180px;
padding: 1rem;
}
.wheel-graphic[data-v-2bdbb8c4] {
font-size: 7rem;
}
.result-congrats[data-v-2bdbb8c4] {
font-size: 1.7rem;
}
}
.elo-waiting[data-v-934eace3] {
position: relative;
width: 100%;
height: 100%;
min-height: 100vh;
background: #0a0a0a;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: none;
user-select: none;
}
/* ===== Numeric code fallback (SAFD: elo-kiosk-repair) ===== */
.numeric-code-panel[data-v-934eace3] {
/* margin-top is intentionally omitted — parent .scan-prompt-area uses
flex `gap` which already controls separation from the QR above. */
padding: 1.1rem 1.75rem 1.25rem;
background: rgba(255, 215, 0, 0.06);
border: 1px solid rgba(255, 215, 0, 0.25);
border-radius: 14px;
text-align: center;
display: flex;
flex-direction: column;
gap: 0.65rem;
align-items: center;
}
.numeric-label[data-v-934eace3] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
margin: 0;
letter-spacing: 0.06em;
text-transform: uppercase;
line-height: 1.2;
}
.numeric-code[data-v-934eace3] {
font-size: 2.1rem;
font-weight: 800;
color: #ffd700;
margin: 0;
letter-spacing: 0.4em;
text-shadow: 0 0 16px rgba(255, 215, 0, 0.45);
font-variant-numeric: tabular-nums;
line-height: 1.1;
/* Wider letter-spacing to keep digits visually unambiguous from across a kiosk */
padding-left: 0.4em; /* offset the trailing letter-spacing for visual centering */
}
/* ===== Background carousel ===== */
.carousel-bg[data-v-934eace3] {
position: absolute;
inset: 0;
z-index: 0;
}
.carousel-slide[data-v-934eace3] {
position: absolute;
inset: 0;
}
.carousel-img[data-v-934eace3] {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.carousel-overlay[data-v-934eace3] {
position: absolute;
inset: 0;
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.65) 0%,
rgba(0, 0, 0, 0.40) 35%,
rgba(0, 0, 0, 0.55) 65%,
rgba(0, 0, 0, 0.80) 100%
);
}
.carousel-fade-enter-active[data-v-934eace3],
.carousel-fade-leave-active[data-v-934eace3] {
transition: opacity 1s ease;
}
.carousel-fade-enter-from[data-v-934eace3],
.carousel-fade-leave-to[data-v-934eace3] {
opacity: 0;
}
/* ===== Foreground ===== */
.waiting-content[data-v-934eace3] {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 36px;
padding: 48px 48px 56px;
width: 100%;
max-width: 900px;
min-height: 100vh;
box-sizing: border-box;
text-align: center;
}
.casino-logo[data-v-934eace3] {
height: 240px;
width: auto;
filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.5));
object-fit: contain;
}
/* ===== Interaction row (holds ad panels + QR card) ===== */
.interaction-row[data-v-934eace3] {
width: 100%;
display: flex;
justify-content: center;
}
/* Ad panels hidden in landscape */
.portrait-ad[data-v-934eace3] {
display: none;
}
/* ===== Rotating welcome text ===== */
.welcome-text-area[data-v-934eace3] {
text-align: center;
min-height: 2.5em;
display: flex;
align-items: center;
justify-content: center;
}
.welcome-text[data-v-934eace3] {
font-size: 1.6rem;
font-weight: 500;
color: rgba(255, 255, 255, 0.85);
margin: 0;
text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
letter-spacing: 0.02em;
}
.welcome-text-fade-enter-active[data-v-934eace3],
.welcome-text-fade-leave-active[data-v-934eace3] {
transition: opacity 0.6s ease, transform 0.6s ease;
}
.welcome-text-fade-enter-from[data-v-934eace3] {
opacity: 0;
transform: translateY(8px);
}
.welcome-text-fade-leave-to[data-v-934eace3] {
opacity: 0;
transform: translateY(-8px);
}
/* ===== Scan prompt ===== */
.scan-prompt-area[data-v-934eace3] {
display: flex;
flex-direction: column;
align-items: center;
gap: 28px;
background: rgba(255, 255, 255, 0.06);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 215, 0, 0.25);
border-radius: 24px;
padding: 40px 56px 48px;
box-shadow: 0 0 40px rgba(255, 215, 0, 0.08), 0 16px 48px rgba(0, 0, 0, 0.5);
width: 100%;
}
.scan-heading[data-v-934eace3] {
font-size: 3rem;
font-weight: 700;
color: #fff;
margin: 0;
text-shadow: 0 2px 16px rgba(0, 0, 0, 0.6);
}
.scan-subheading[data-v-934eace3] {
font-size: 1.4rem;
color: rgba(255, 255, 255, 0.7);
margin: 0;
}
.scan-subheading strong[data-v-934eace3] {
color: #ffd700;
}
/* ===== QR Code ===== */
.qr-wrapper[data-v-934eace3] {
padding: 1rem;
display: flex;
align-items: center;
justify-content: center;
min-width: 260px;
min-height: 260px;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 215, 0, 0.2);
border-radius: 20px;
}
.qr-image[data-v-934eace3] {
width: 240px;
height: 240px;
image-rendering: pixelated;
border-radius: 8px;
}
.qr-loading[data-v-934eace3] {
display: flex;
align-items: center;
justify-content: center;
width: 240px;
height: 240px;
}
.spinner-gold[data-v-934eace3] {
width: 40px;
height: 40px;
border: 3px solid rgba(255, 215, 0, 0.2);
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-934eace3 0.85s linear infinite;
}
@keyframes spin-934eace3 {
to { transform: rotate(360deg);
}
}
.qr-error[data-v-934eace3] {
color: rgba(255, 100, 60, 0.85);
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
padding: 24px 12px;
}
.qr-error p[data-v-934eace3] {
margin: 0;
font-size: 1rem;
font-weight: 600;
}
.qr-error-sub[data-v-934eace3] {
font-size: 0.85rem !important;
font-weight: 400 !important;
color: rgba(255, 255, 255, 0.55);
}
/* ===== Circular countdown ring ===== */
.countdown-ring-wrap[data-v-934eace3] {
position: relative;
width: 100px;
height: 100px;
margin-top: 4px;
display: flex;
align-items: center;
justify-content: center;
filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.25));
}
.countdown-ring[data-v-934eace3] {
width: 100%;
height: 100%;
}
.ring-arc[data-v-934eace3] {
transition: stroke-dashoffset 1s linear;
}
.countdown-number[data-v-934eace3] {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 2.2rem;
font-weight: 700;
color: #ffd700;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
text-shadow: 0 0 10px rgba(255, 215, 0, 0.4);
font-variant-numeric: tabular-nums;
}
.countdown-refresh[data-v-934eace3] {
font-size: 1.4rem;
color: rgba(255, 215, 0, 0.5);
}
/* ===== Footer =====
Static in the flex column flow so the parent's `gap: 36px` separates it
from the card above naturally. Absolute positioning here was the bug:
it pulled the footer into the card's bottom edge regardless of how the
numeric panel + countdown sized themselves. */
.waiting-footer[data-v-934eace3] {
margin-top: auto;
padding: 0 32px;
text-align: center;
width: 100%;
}
.footer-hint[data-v-934eace3] {
font-size: 1.3rem;
color: rgba(255, 255, 255, 0.5);
margin: 0;
}
.footer-highlight[data-v-934eace3] {
color: rgba(255, 215, 0, 0.7);
}
/* ===== Portrait mode (1080×1920 Elo kiosk) ===== */
/* Designer note: upload 1080×1920 portrait images via Media Management.
Place promo text/copy on LEFT and RIGHT edges — the center ~500px
is covered by the QR card. The background carousel is visible through
a lighter overlay so the side content reads clearly. */
@media (orientation: portrait) {
.waiting-content[data-v-934eace3] {
max-width: 100%;
padding: 48px 32px 48px;
gap: 36px;
align-items: center;
/* min-height + box-sizing already inherited from base; explicit here so
changes to base don't silently regress the kiosk's portrait layout. */
min-height: 100vh;
box-sizing: border-box;
}
/* Lighten the overlay so background carousel ads are visible */
.carousel-overlay[data-v-934eace3] {
background: linear-gradient(to bottom,
rgba(0, 0, 0, 0.45) 0%,
rgba(0, 0, 0, 0.20) 30%,
rgba(0, 0, 0, 0.30) 60%,
rgba(0, 0, 0, 0.55) 100%
);
}
/* Logo — 2x bigger, anchored toward top */
.casino-logo[data-v-934eace3] {
height: 720px;
filter: drop-shadow(0 0 40px rgba(255, 215, 0, 0.6));
}
/* Ad panels — stay hidden in portrait (designer puts copy in bg images) */
.portrait-ad[data-v-934eace3] {
display: none;
}
/* Welcome text — big, sits tight under logo */
.welcome-text[data-v-934eace3] {
font-size: 4rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
text-shadow: 0 2px 20px rgba(0, 0, 0, 0.7);
}
.welcome-text-area[data-v-934eace3] {
min-height: 3.5em;
margin-top: -24px;
}
/* QR card — pulled closer to welcome text */
.interaction-row[data-v-934eace3] {
margin-top: 40px;
}
.scan-prompt-area[data-v-934eace3] {
padding: 44px 48px 52px;
gap: 32px;
border-radius: 28px;
width: auto;
max-width: 520px;
background: rgba(0, 0, 0, 0.75);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
border: 1px solid rgba(255, 215, 0, 0.3);
box-shadow: 0 0 60px rgba(0, 0, 0, 0.6), 0 0 30px rgba(255, 215, 0, 0.06);
}
.scan-heading[data-v-934eace3] {
font-size: 3rem;
}
.scan-subheading[data-v-934eace3] {
font-size: 1.5rem;
}
.qr-wrapper[data-v-934eace3] {
min-width: 300px;
min-height: 300px;
padding: 1.2rem;
border-radius: 20px;
}
.qr-image[data-v-934eace3] {
width: 260px;
height: 260px;
}
.qr-loading[data-v-934eace3] {
width: 260px;
height: 260px;
}
.countdown-ring-wrap[data-v-934eace3] {
width: 100px;
height: 100px;
}
.countdown-number[data-v-934eace3] {
font-size: 2.2rem;
}
.countdown-refresh[data-v-934eace3] {
font-size: 1.4rem;
}
.waiting-footer[data-v-934eace3] {
/* `margin-top: auto` from the base rule pushes us to the very bottom
of the 100vh column, so the kiosk's tall portrait viewport gets a
proper gulf between the QR card and the floor-supervisor hint. */
padding: 0 24px;
}
.footer-hint[data-v-934eace3] {
font-size: 1.4rem;
line-height: 1.45;
}
}
/* ===== Layout — fixed overlay on top of EloWaiting ===== */
.elo-welcome[data-v-80ca5979] {
position: fixed;
inset: 0;
z-index: 100;
background: radial-gradient(ellipse at center, rgba(20, 12, 0, 0.94) 0%, rgba(0, 0, 0, 0.96) 75%);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
user-select: none;
}
.ceremony-stage[data-v-80ca5979] {
position: relative;
z-index: 1;
width: 100%;
max-width: 880px;
display: flex;
flex-direction: column;
align-items: center;
gap: 28px;
padding: 56px 64px;
text-align: center;
background: rgba(255, 255, 255, 0.055);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
border: 1px solid rgba(255, 215, 0, 0.22);
border-radius: 30px;
box-shadow:
0 0 60px rgba(255, 215, 0, 0.08),
0 28px 80px rgba(0, 0, 0, 0.75);
animation: stage-entrance-80ca5979 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.stage-welcome[data-v-80ca5979] { cursor: pointer;
}
@keyframes stage-entrance-80ca5979 {
from { opacity: 0; transform: translateY(28px) scale(0.97);
}
to { opacity: 1; transform: translateY(0) scale(1);
}
}
/* ===== Welcome state ===== */
.welcome-brand[data-v-80ca5979] {
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
}
.welcome-property-name[data-v-80ca5979] {
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.32em;
text-transform: uppercase;
margin: 0;
color: rgba(255, 215, 0, 0.85);
text-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
}
.welcome-divider[data-v-80ca5979] {
height: 2px;
width: 80px;
background: linear-gradient(90deg, transparent, #ffd700 50%, transparent);
border-radius: 2px;
}
.welcome-greeting[data-v-80ca5979] {
font-size: 3.8rem;
font-weight: 800;
margin: 0;
line-height: 1.05;
text-shadow: 0 2px 24px rgba(0, 0, 0, 0.6);
}
.welcome-tier[data-v-80ca5979] { margin-top: 4px;
}
.welcome-recap[data-v-80ca5979] {
font-size: 1.5rem;
font-weight: 500;
margin: 0;
max-width: 720px;
color: rgba(255, 255, 255, 0.92);
text-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
}
.welcome-recap-secondary[data-v-80ca5979] {
font-size: 1.15rem;
margin: -16px 0 0;
color: #ffd700;
font-weight: 600;
text-shadow: 0 0 8px rgba(255, 215, 0, 0.35);
}
.loyalty-snapshot[data-v-80ca5979] {
display: flex;
gap: 14px;
flex-wrap: wrap;
justify-content: center;
margin-top: 8px;
}
.snapshot-chip[data-v-80ca5979] {
display: flex;
flex-direction: column;
align-items: center;
padding: 14px 22px;
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 16px;
background: rgba(255, 255, 255, 0.05);
min-width: 130px;
}
.snapshot-value[data-v-80ca5979] {
font-size: 1.6rem;
font-weight: 800;
color: #ffd700;
text-shadow: 0 0 12px rgba(255, 215, 0, 0.45);
line-height: 1;
}
.snapshot-label[data-v-80ca5979] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.14em;
margin-top: 6px;
color: rgba(255, 255, 255, 0.6);
}
.welcome-hint[data-v-80ca5979] {
font-size: 0.95rem;
letter-spacing: 0.06em;
color: rgba(255, 255, 255, 0.45);
margin: 8px 0 0;
animation: hint-pulse-80ca5979 2.2s ease-in-out infinite;
}
@keyframes hint-pulse-80ca5979 {
0%, 100% { opacity: 0.4;
}
50% { opacity: 0.75;
}
}
/* ===== Welcome Continue button + 5s countdown ring (DJ 2026-05-12) ===== */
.welcome-continue-btn[data-v-80ca5979] {
margin-top: 16px;
display: inline-flex;
align-items: center;
gap: 18px;
padding: 14px 32px 14px 18px;
background: linear-gradient(135deg, rgba(255, 215, 0, 0.18), rgba(255, 140, 0, 0.12));
border: 2px solid rgba(255, 215, 0, 0.6);
border-radius: 999px;
color: #fff;
font-family: inherit;
font-size: 1.35rem;
font-weight: 700;
letter-spacing: 0.06em;
cursor: pointer;
box-shadow: 0 0 28px rgba(255, 215, 0, 0.22);
transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease;
animation: continue-pulse-80ca5979 2.4s ease-in-out infinite;
}
.welcome-continue-btn[data-v-80ca5979]:hover,
.welcome-continue-btn[data-v-80ca5979]:focus-visible {
outline: none;
transform: translateY(-2px);
background: linear-gradient(135deg, rgba(255, 215, 0, 0.28), rgba(255, 140, 0, 0.2));
box-shadow: 0 0 44px rgba(255, 215, 0, 0.42);
}
.welcome-continue-btn[data-v-80ca5979]:active { transform: scale(0.97);
}
@keyframes continue-pulse-80ca5979 {
0%, 100% { box-shadow: 0 0 24px rgba(255, 215, 0, 0.2);
}
50% { box-shadow: 0 0 42px rgba(255, 215, 0, 0.38);
}
}
.continue-ring[data-v-80ca5979] {
position: relative;
width: 52px;
height: 52px;
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.continue-ring svg[data-v-80ca5979] {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
/* SVG default origin top-left; rotate so the stroke starts at 12 o'clock */
transform: rotate(-90deg);
}
.continue-ring-track[data-v-80ca5979] {
fill: none;
stroke: rgba(255, 215, 0, 0.18);
stroke-width: 4;
}
.continue-ring-progress[data-v-80ca5979] {
fill: none;
stroke: #ffd700;
stroke-width: 4;
stroke-linecap: round;
/* circumference of r=22 → 2 * π * 22 ≈ 138.23 */
stroke-dasharray: 138.23;
/* stroke-dashoffset is bound to welcomeRingOffset — drains from 0 (full)
to 138.23 (empty) over WELCOME_DWELL_MS */
transition: stroke-dashoffset 0.1s linear;
filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.55));
}
.continue-ring-digit[data-v-80ca5979] {
font-size: 1.4rem;
font-weight: 800;
color: #ffd700;
text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
line-height: 1;
}
.continue-label[data-v-80ca5979] {
text-transform: uppercase;
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
}
/* ===== Options state ===== */
.options-prompt[data-v-80ca5979] {
font-size: 2.2rem;
font-weight: 700;
margin: 0;
text-shadow: 0 2px 14px rgba(0, 0, 0, 0.5);
}
.cta-grid[data-v-80ca5979] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px;
width: 100%;
}
.cta-grid--double[data-v-80ca5979] { grid-template-columns: repeat(2, 1fr);
}
.cta-grid--single[data-v-80ca5979] { grid-template-columns: 1fr; max-width: 380px; margin: 0 auto;
}
.cta-tile[data-v-80ca5979] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
padding: 26px 18px;
background: rgba(255, 255, 255, 0.05);
border: 1.5px solid rgba(255, 255, 255, 0.16);
border-radius: 20px;
color: #fff;
font-family: inherit;
cursor: pointer;
transition: transform 0.12s ease, border-color 0.18s ease, background 0.18s ease;
}
.cta-tile[data-v-80ca5979]:hover,
.cta-tile[data-v-80ca5979]:focus-visible {
outline: none;
border-color: rgba(255, 215, 0, 0.55);
background: rgba(255, 215, 0, 0.07);
transform: translateY(-2px);
}
.cta-tile[data-v-80ca5979]:active { transform: scale(0.97);
}
.cta-spin[data-v-80ca5979] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.18), rgba(255, 140, 0, 0.12));
border-color: rgba(255, 215, 0, 0.55);
box-shadow: 0 0 32px rgba(255, 215, 0, 0.15);
animation: spin-tile-pulse-80ca5979 2.6s ease-in-out infinite;
}
@keyframes spin-tile-pulse-80ca5979 {
0%, 100% { box-shadow: 0 0 24px rgba(255, 215, 0, 0.16);
}
50% { box-shadow: 0 0 48px rgba(255, 215, 0, 0.34);
}
}
.cta-print[data-v-80ca5979] {
background: linear-gradient(135deg, rgba(34, 197, 94, 0.18), rgba(20, 134, 64, 0.12));
border-color: rgba(34, 197, 94, 0.45);
}
.cta-dismiss[data-v-80ca5979] {
background: rgba(255, 255, 255, 0.04);
}
.cta-icon[data-v-80ca5979] {
font-size: 2.6rem;
line-height: 1;
}
.cta-label[data-v-80ca5979] {
font-size: 1.35rem;
font-weight: 700;
margin-top: 2px;
}
.cta-sub[data-v-80ca5979] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.65);
letter-spacing: 0.02em;
}
.acknowledgement[data-v-80ca5979] {
margin-top: 4px;
padding: 18px 26px;
background: rgba(0, 180, 255, 0.06);
border: 1px solid rgba(0, 180, 255, 0.25);
border-radius: 16px;
text-align: center;
max-width: 600px;
}
.acknowledgement p[data-v-80ca5979] {
margin: 4px 0;
font-size: 1.05rem;
color: rgba(255, 255, 255, 0.85);
}
.acknowledgement--empty[data-v-80ca5979] {
margin-top: 28px;
padding: 28px 36px;
max-width: 640px;
}
.acknowledgement--empty .acknowledgement-footer[data-v-80ca5979] {
margin-top: 14px;
font-size: 1.2rem;
font-weight: 600;
color: #ffd700;
text-shadow: 0 0 10px rgba(255, 215, 0, 0.35);
}
.farewell-done-btn[data-v-80ca5979] {
margin-top: 18px;
}
.options-prompt--farewell[data-v-80ca5979] {
color: #ffd700;
text-shadow: 0 0 18px rgba(255, 215, 0, 0.45), 0 2px 14px rgba(0, 0, 0, 0.5);
}
.options-prompt--farewell .player-name[data-v-80ca5979] {
color: #fff;
text-shadow: 0 0 24px rgba(255, 215, 0, 0.6), 0 2px 16px rgba(0, 0, 0, 0.5);
}
.ads-strip[data-v-80ca5979] {
margin-top: 6px;
padding: 14px 22px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
width: 100%;
text-align: center;
min-height: 1.4em;
}
.ad-line[data-v-80ca5979] {
margin: 0;
font-size: 1.05rem;
color: rgba(255, 215, 0, 0.85);
letter-spacing: 0.02em;
text-shadow: 0 0 8px rgba(255, 215, 0, 0.25);
}
.ad-fade-enter-active[data-v-80ca5979],
.ad-fade-leave-active[data-v-80ca5979] { transition: opacity 0.45s ease;
}
.ad-fade-enter-from[data-v-80ca5979],
.ad-fade-leave-to[data-v-80ca5979] { opacity: 0;
}
/* ===== Spin buildup / spinning state — shared canvas, both states use the
same .spin-headline / .spin-sub classes; buildup adds a wheel pulse glow ===== */
.spin-headline[data-v-80ca5979] {
font-size: 2.4rem;
font-weight: 800;
margin: 0;
color: #ffd700;
text-shadow: 0 0 24px rgba(255, 215, 0, 0.45);
animation: pop-in-80ca5979 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.wheel-area[data-v-80ca5979] {
display: flex;
align-items: center;
justify-content: center;
}
.stage-buildup .wheel-area[data-v-80ca5979] { animation: wheel-pulse-80ca5979 1.4s ease-in-out infinite;
}
@keyframes wheel-pulse-80ca5979 {
0%, 100% { filter: drop-shadow(0 0 16px rgba(255, 215, 0, 0.3)); transform: scale(1);
}
50% { filter: drop-shadow(0 0 32px rgba(255, 215, 0, 0.6)); transform: scale(1.015);
}
}
.spin-sub[data-v-80ca5979] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.55);
margin: 0;
letter-spacing: 0.05em;
}
/* ===== Celebrating state ===== */
.celebration-burst[data-v-80ca5979] {
display: flex;
align-items: center;
gap: 1.2rem;
}
.burst-stars[data-v-80ca5979] {
font-size: 1.4rem;
color: #ffd700;
opacity: 0.85;
}
.burst-icon[data-v-80ca5979] {
font-size: 5.5rem;
line-height: 1;
animation: pop-in-80ca5979 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes pop-in-80ca5979 {
from { transform: scale(0.3); opacity: 0;
}
to { transform: scale(1); opacity: 1;
}
}
.celebration-greeting[data-v-80ca5979] {
font-size: 3.6rem;
font-weight: 700;
margin: 0;
text-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
line-height: 1.1;
}
.player-name[data-v-80ca5979] {
color: #ffd700;
text-shadow:
0 0 24px rgba(255, 215, 0, 0.55),
0 2px 16px rgba(0, 0, 0, 0.5);
}
.celebration-prize[data-v-80ca5979] {
padding: 1.5rem 2.5rem;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.4rem;
border: 2px solid rgba(255, 215, 0, 0.35);
background: rgba(255, 215, 0, 0.08);
border-radius: 22px;
min-width: 380px;
}
.prize-label[data-v-80ca5979] {
font-size: 1.4rem;
color: rgba(255, 255, 255, 0.85);
margin: 0;
text-transform: uppercase;
letter-spacing: 0.12em;
font-weight: 700;
}
.prize-multiplier[data-v-80ca5979] {
font-size: 2.4rem;
font-weight: 900;
color: #ffd700;
margin: 0;
text-shadow: 0 0 24px rgba(255, 215, 0, 0.5);
}
/* Celebration intensity tiers — scales animation with prize value
(no loss-disguised-as-win — 1.25× consolation must NOT play jackpot animation) */
.stage-celebrating[data-burst="puff"] .celebration-prize[data-v-80ca5979] {
animation: prize-puff-80ca5979 0.6s ease-out;
}
.stage-celebrating[data-burst="medium"] .celebration-prize[data-v-80ca5979] {
animation: prize-medium-80ca5979 0.8s ease-out;
box-shadow: 0 0 28px rgba(255, 215, 0, 0.25);
}
.stage-celebrating[data-burst="stars"] .celebration-prize[data-v-80ca5979] {
animation: prize-stars-80ca5979 1s ease-out;
box-shadow: 0 0 44px rgba(255, 215, 0, 0.45);
}
.stage-celebrating[data-burst="shower"] .celebration-prize[data-v-80ca5979] {
animation: prize-jackpot-80ca5979 1.4s cubic-bezier(0.34, 1.56, 0.64, 1);
box-shadow: 0 0 72px rgba(255, 215, 0, 0.7), inset 0 0 32px rgba(255, 215, 0, 0.18);
border-color: rgba(255, 215, 0, 0.75);
}
@keyframes prize-puff-80ca5979 {
from { transform: scale(0.95);
}
to { transform: scale(1);
}
}
@keyframes prize-medium-80ca5979 {
from { transform: scale(0.9); opacity: 0.6;
}
to { transform: scale(1); opacity: 1;
}
}
@keyframes prize-stars-80ca5979 {
from { transform: scale(0.85) rotate(-3deg); opacity: 0;
}
to { transform: scale(1) rotate(0); opacity: 1;
}
}
@keyframes prize-jackpot-80ca5979 {
0% { transform: scale(0.5) rotate(-5deg); opacity: 0;
}
60% { transform: scale(1.08) rotate(2deg); opacity: 1;
}
100% { transform: scale(1) rotate(0); opacity: 1;
}
}
/* ===== Printing state ===== */
.printing-content[data-v-80ca5979] {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 22px;
width: 100%;
}
.printing-greeting[data-v-80ca5979] {
font-size: 2.6rem;
font-weight: 700;
margin: 0 0 8px 0;
text-align: center;
}
.status-block[data-v-80ca5979] {
display: flex;
align-items: center;
gap: 28px;
padding: 28px 36px;
border-radius: 18px;
text-align: left;
}
.status-printing-block[data-v-80ca5979] {
background: rgba(255, 215, 0, 0.08);
border: 1px solid rgba(255, 215, 0, 0.35);
box-shadow: 0 0 30px rgba(255, 215, 0, 0.07);
}
.status-printing-block .status-icon[data-v-80ca5979] {
color: #ffd700;
animation: print-bounce-80ca5979 1.2s ease-in-out infinite;
}
@keyframes print-bounce-80ca5979 {
0%, 100% { transform: translateY(0);
}
50% { transform: translateY(-5px);
}
}
.status-already-printed[data-v-80ca5979] {
background: rgba(57, 255, 20, 0.05);
border: 1px solid rgba(57, 255, 20, 0.2);
}
.status-already-printed .status-icon[data-v-80ca5979] { color: #39ff14;
}
.status-deferred[data-v-80ca5979] {
background: rgba(255, 160, 0, 0.07);
border: 1px solid rgba(255, 160, 0, 0.3);
}
.status-deferred .status-icon[data-v-80ca5979] { color: #ffa000;
}
.status-queued[data-v-80ca5979] {
background: rgba(0, 180, 255, 0.08);
border: 1px solid rgba(0, 180, 255, 0.3);
box-shadow: 0 0 20px rgba(0, 180, 255, 0.06);
}
.status-queued .status-icon[data-v-80ca5979] { color: #00b4ff;
}
.status-queued .status-amount[data-v-80ca5979] { color: #00b4ff;
}
.status-icon-wrap[data-v-80ca5979] { flex-shrink: 0;
}
.status-icon[data-v-80ca5979] {
width: 64px;
height: 64px;
}
.status-text-block[data-v-80ca5979] {
display: flex;
flex-direction: column;
gap: 6px;
}
.status-headline[data-v-80ca5979] {
font-size: 2rem;
font-weight: 700;
color: #fff;
margin: 0;
line-height: 1.15;
}
.status-amount[data-v-80ca5979] {
font-size: 1.7rem;
font-weight: 600;
color: #ffd700;
margin: 0;
text-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
}
.status-detail[data-v-80ca5979] {
font-size: 1.2rem;
color: rgba(255, 255, 255, 0.65);
margin: 0;
}
/* Voucher-pickup reminder */
.voucher-pickup-reminder[data-v-80ca5979] {
margin-top: 8px;
padding: 18px 28px;
display: flex;
align-items: center;
gap: 16px;
background: linear-gradient(90deg, rgba(255, 140, 0, 0.18), rgba(255, 215, 0, 0.18));
border: 2px solid rgba(255, 215, 0, 0.55);
border-radius: 16px;
box-shadow: 0 0 24px rgba(255, 140, 0, 0.18);
animation: reminder-pulse-80ca5979 2.4s ease-in-out infinite;
}
.reminder-icon[data-v-80ca5979] {
font-size: 2.2rem;
filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.5));
flex-shrink: 0;
}
.reminder-text[data-v-80ca5979] {
font-size: 1.35rem;
font-weight: 600;
color: #fff;
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
line-height: 1.3;
}
@keyframes reminder-pulse-80ca5979 {
0%, 100% { box-shadow: 0 0 18px rgba(255, 140, 0, 0.18);
}
50% { box-shadow: 0 0 36px rgba(255, 140, 0, 0.34);
}
}
/* ===== Tier badge ===== */
.tier-badge[data-v-80ca5979] {
display: inline-flex;
align-items: center;
gap: 12px;
padding: 12px 32px;
background: rgba(0, 0, 0, 0.35);
border: 2px solid var(--tier-color, #CD7F32);
border-radius: 100px;
box-shadow: 0 0 20px color-mix(in srgb, var(--tier-color, #CD7F32) 25%, transparent);
}
.tier-label[data-v-80ca5979] {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.12em;
color: var(--tier-color, #CD7F32);
text-transform: uppercase;
}
.tier-stars[data-v-80ca5979] {
display: flex;
gap: 3px;
}
.tier-star[data-v-80ca5979] {
font-size: 1.05rem;
color: var(--tier-color, #CD7F32);
filter: drop-shadow(0 0 4px currentColor);
}
/* ===== Portrait mode (1080×1920 Elo kiosk) ===== */
@media (orientation: portrait) {
.ceremony-stage[data-v-80ca5979] {
max-width: 92%;
padding: 48px 36px;
gap: 24px;
border-radius: 32px;
}
.welcome-greeting[data-v-80ca5979] { font-size: 3.2rem;
}
.welcome-recap[data-v-80ca5979] { font-size: 1.3rem;
}
.welcome-continue-btn[data-v-80ca5979] { font-size: 1.2rem; padding: 12px 26px 12px 14px; gap: 14px;
}
.continue-ring[data-v-80ca5979] { width: 44px; height: 44px;
}
.continue-ring-digit[data-v-80ca5979] { font-size: 1.15rem;
}
.options-prompt[data-v-80ca5979] { font-size: 1.9rem;
}
.cta-grid[data-v-80ca5979] { grid-template-columns: 1fr;
}
.cta-grid--double[data-v-80ca5979],
.cta-grid--single[data-v-80ca5979] { grid-template-columns: 1fr;
}
.cta-tile[data-v-80ca5979] { padding: 22px 16px;
}
.cta-icon[data-v-80ca5979] { font-size: 2.2rem;
}
.cta-label[data-v-80ca5979] { font-size: 1.2rem;
}
.cta-sub[data-v-80ca5979] { font-size: 0.78rem;
}
.snapshot-chip[data-v-80ca5979] { min-width: 100px; padding: 10px 14px;
}
.snapshot-value[data-v-80ca5979] { font-size: 1.3rem;
}
.snapshot-label[data-v-80ca5979] { font-size: 0.65rem;
}
.spin-headline[data-v-80ca5979] { font-size: 2rem;
}
.celebration-greeting[data-v-80ca5979] { font-size: 3rem;
}
.printing-greeting[data-v-80ca5979] { font-size: 2.2rem;
}
.status-headline[data-v-80ca5979] { font-size: 1.7rem;
}
.status-amount[data-v-80ca5979] { font-size: 1.5rem;
}
.status-detail[data-v-80ca5979] { font-size: 1.05rem;
}
.reminder-text[data-v-80ca5979] { font-size: 1.15rem;
}
.celebration-prize[data-v-80ca5979] { min-width: auto; padding: 1.2rem 1.8rem;
}
.prize-label[data-v-80ca5979] { font-size: 1.15rem;
}
.prize-multiplier[data-v-80ca5979] { font-size: 2rem;
}
}
/* ════════════════════════════════════════════
ROOT — fills entire parent (65" TV display)
════════════════════════════════════════════ */
.race-root[data-v-e1b65ff9] {
position: absolute;
inset: 0;
display: flex;
flex-direction: column;
background:
radial-gradient(ellipse at 50% 0%, rgba(180, 120, 0, 0.12) 0%, transparent 60%),
radial-gradient(ellipse at 20% 80%, rgba(180, 0, 30, 0.06) 0%, transparent 50%),
radial-gradient(ellipse at 80% 90%, rgba(180, 120, 0, 0.06) 0%, transparent 50%),
#0a0a14;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
color: var(--text-primary);
}
/* Subtle dark gradient overlay for depth */
.race-bg[data-v-e1b65ff9] {
position: absolute;
inset: 0;
background-image:
linear-gradient(rgba(255, 215, 0, 0.015) 1px, transparent 1px),
linear-gradient(90deg, rgba(255, 215, 0, 0.015) 1px, transparent 1px);
background-size: 80px 80px;
pointer-events: none;
}
/* ── Ornamental corner accents ── */
.corner-accent[data-v-e1b65ff9] {
position: absolute;
width: 60px;
height: 60px;
pointer-events: none;
z-index: 5;
opacity: 0.45;
}
.corner-tl[data-v-e1b65ff9] { top: 8px; left: 8px; border-top: 2px solid #daa520; border-left: 2px solid #daa520;
}
.corner-tr[data-v-e1b65ff9] { top: 8px; right: 8px; border-top: 2px solid #daa520; border-right: 2px solid #daa520;
}
.corner-bl[data-v-e1b65ff9] { bottom: 8px; left: 8px; border-bottom: 2px solid #daa520; border-left: 2px solid #daa520;
}
.corner-br[data-v-e1b65ff9] { bottom: 8px; right: 8px; border-bottom: 2px solid #daa520; border-right: 2px solid #daa520;
}
/* ════════════════════════════════════════════
HEADER
════════════════════════════════════════════ */
.race-header[data-v-e1b65ff9] {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 2rem;
padding: 1rem 2.5rem;
margin: 1rem 1rem 0;
border-radius: 18px;
flex-shrink: 0;
border-color: rgba(218, 165, 32, 0.3);
background: rgba(10, 5, 0, 0.65);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
}
/* Top gold hairline accent */
.header-border-top[data-v-e1b65ff9] {
position: absolute;
top: 0;
left: 5%;
right: 5%;
height: 1px;
background: linear-gradient(90deg, transparent, #daa520, #ffd700, #daa520, transparent);
border-radius: 1px;
}
/* Bottom subtle gold hairline */
.header-border-bottom[data-v-e1b65ff9] {
position: absolute;
bottom: 0;
left: 10%;
right: 10%;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(218, 165, 32, 0.4), transparent);
border-radius: 1px;
}
.race-header-left[data-v-e1b65ff9] {
display: flex;
align-items: center;
gap: 1.2rem;
}
.race-icon[data-v-e1b65ff9] {
font-size: 3.2rem;
line-height: 1;
filter: drop-shadow(0 0 14px rgba(255, 215, 0, 0.7));
display: inline-block;
transform: scaleX(-1);
}
.race-titles[data-v-e1b65ff9] {
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.race-title[data-v-e1b65ff9] {
margin: 0;
font-size: 2.6rem;
font-weight: 900;
letter-spacing: 0.04em;
text-transform: uppercase;
background: linear-gradient(135deg, #ffd700 0%, #fff8dc 40%, #daa520 70%, #ffd700 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
filter: drop-shadow(0 0 16px rgba(255, 215, 0, 0.45));
}
.race-subtitle[data-v-e1b65ff9] {
margin: 0;
font-size: 1.15rem;
color: #b09060;
font-weight: 500;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.race-header-right[data-v-e1b65ff9] {
display: flex;
align-items: center;
flex-shrink: 0;
}
/* Prize pills */
.prize-pills[data-v-e1b65ff9] {
display: flex;
gap: 0.7rem;
align-items: center;
flex-wrap: nowrap;
}
.prize-pill[data-v-e1b65ff9] {
display: flex;
align-items: center;
gap: 0.4rem;
padding: 0.45rem 1rem;
border-radius: 100px;
background: rgba(255, 215, 0, 0.08);
border: 1px solid rgba(255, 215, 0, 0.25);
font-size: 1.25rem;
font-weight: 700;
white-space: nowrap;
}
.prize-rank-1[data-v-e1b65ff9] {
background: rgba(255, 215, 0, 0.12);
border-color: rgba(255, 215, 0, 0.45);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.2);
}
.prize-rank-2[data-v-e1b65ff9] {
background: rgba(192, 192, 192, 0.08);
border-color: rgba(192, 192, 192, 0.3);
}
.prize-rank-3[data-v-e1b65ff9] {
background: rgba(205, 127, 50, 0.08);
border-color: rgba(205, 127, 50, 0.3);
}
.prize-pill-rank[data-v-e1b65ff9] {
font-size: 1.3rem;
line-height: 1;
}
.prize-pill-amount[data-v-e1b65ff9] {
color: #ffd700;
font-variant-numeric: tabular-nums;
}
/* ════════════════════════════════════════════
MAIN TRACK AREA
════════════════════════════════════════════ */
.race-track-area[data-v-e1b65ff9] {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
position: relative;
}
/* ── STATE A: Upcoming ── */
.state-upcoming[data-v-e1b65ff9] {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.2rem;
text-align: center;
padding: 2rem;
}
.upcoming-ornament[data-v-e1b65ff9] {
margin-bottom: 0.5rem;
}
.upcoming-trophy[data-v-e1b65ff9] {
font-size: 7rem;
line-height: 1;
filter: drop-shadow(0 0 30px rgba(255, 215, 0, 0.65));
animation: trophy-float-e1b65ff9 4s ease-in-out infinite;
}
@keyframes trophy-float-e1b65ff9 {
0%, 100% { transform: translateY(0) scale(1);
}
50% { transform: translateY(-14px) scale(1.04);
}
}
.upcoming-eyebrow[data-v-e1b65ff9] {
margin: 0;
font-size: 1.2rem;
font-weight: 500;
letter-spacing: 0.2em;
text-transform: uppercase;
color: #b09060;
}
.upcoming-heading[data-v-e1b65ff9] {
margin: 0;
font-size: 3rem;
font-weight: 900;
letter-spacing: 0.12em;
text-transform: uppercase;
background: linear-gradient(135deg, #ffd700 0%, #fff8dc 50%, #daa520 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
filter: drop-shadow(0 0 18px rgba(255, 215, 0, 0.4));
}
.upcoming-countdown[data-v-e1b65ff9] {
margin: 0.5rem 0;
}
.upcoming-tagline[data-v-e1b65ff9] {
margin: 0;
font-size: 1.5rem;
color: var(--text-secondary);
font-style: italic;
letter-spacing: 0.02em;
}
/* ── STATE C / E: Empty states ── */
.state-empty[data-v-e1b65ff9] {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1rem;
text-align: center;
padding: 2rem;
}
.state-empty-icon[data-v-e1b65ff9] {
font-size: 6rem;
line-height: 1;
filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.35));
animation: pulse-gentle-e1b65ff9 3s ease-in-out infinite;
display: inline-block;
transform: scaleX(-1);
}
@keyframes pulse-gentle-e1b65ff9 {
0%, 100% { transform: scale(1); opacity: 0.9;
}
50% { transform: scale(1.06); opacity: 1;
}
}
.state-empty-title[data-v-e1b65ff9] {
margin: 0;
font-size: 2.6rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #ffd700;
filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.3));
}
.state-empty-body[data-v-e1b65ff9] {
margin: 0;
font-size: 1.5rem;
color: var(--text-secondary);
letter-spacing: 0.02em;
}
/* ════════════════════════════════════════════
TRACK CONTAINER (holds finish line + lanes)
════════════════════════════════════════════ */
.track-container[data-v-e1b65ff9] {
flex: 1;
position: relative;
display: flex;
flex-direction: column;
padding: 0.75rem 1rem 0.75rem 1rem;
min-height: 0;
}
/* ── Finish line ── */
.finish-line[data-v-e1b65ff9] {
position: absolute;
right: 1.8rem;
top: 0.5rem;
bottom: 0.5rem;
display: flex;
flex-direction: column;
align-items: center;
z-index: 3;
pointer-events: none;
}
.finish-flag[data-v-e1b65ff9] {
font-size: 2.2rem;
line-height: 1;
filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.5));
margin-bottom: 4px;
}
.finish-line-bar[data-v-e1b65ff9] {
flex: 1;
width: 2px;
background: repeating-linear-gradient(
to bottom,
rgba(255, 255, 255, 0.55) 0px,
rgba(255, 255, 255, 0.55) 7px,
transparent 7px,
transparent 14px
);
border-radius: 1px;
}
/* ════════════════════════════════════════════
RACE LANES
════════════════════════════════════════════ */
.race-lanes[data-v-e1b65ff9] {
display: flex;
flex-direction: column;
gap: 0.4rem;
flex: 1;
/* Right padding so lanes never overlap the finish-line marker */
padding-right: 3rem;
}
.race-lane[data-v-e1b65ff9] {
display: grid;
grid-template-columns: 5rem 14rem 1fr 9rem;
align-items: center;
gap: 1.2rem;
min-height: 55px;
padding: 0 1.25rem;
border-radius: 10px;
border-bottom: 1px solid rgba(255, 215, 0, 0.08);
background: rgba(255, 255, 255, 0.025);
transition: box-shadow 0.4s ease;
position: relative;
overflow: hidden;
}
/* Alternating subtle shade for readability */
.race-lane.lane-alt[data-v-e1b65ff9] {
background: rgba(255, 255, 255, 0.012);
}
/* Top 3 get tinted borders */
.race-lane.lane-gold[data-v-e1b65ff9] { border-color: rgba(255, 215, 0, 0.28); background: rgba(255, 215, 0, 0.04);
}
.race-lane.lane-silver[data-v-e1b65ff9] { border-color: rgba(192, 192, 192, 0.2); background: rgba(192, 192, 192, 0.02);
}
.race-lane.lane-bronze[data-v-e1b65ff9] { border-color: rgba(205, 127, 50, 0.2); background: rgba(205, 127, 50, 0.02);
}
/* Award flash */
.race-lane.just-awarded[data-v-e1b65ff9] {
animation: award-pulse-e1b65ff9 2s ease-out forwards;
}
@keyframes award-pulse-e1b65ff9 {
0% { box-shadow: 0 0 28px rgba(255, 215, 0, 0.85), 0 0 56px rgba(255, 215, 0, 0.4);
}
60% { box-shadow: 0 0 18px rgba(255, 215, 0, 0.5), 0 0 36px rgba(255, 215, 0, 0.25);
}
100% { box-shadow: none;
}
}
/* ── Rank badge ── */
.lane-rank[data-v-e1b65ff9] {
font-size: 1.9rem;
text-align: center;
line-height: 1;
font-weight: 800;
letter-spacing: 0.02em;
}
/* Numeric ranks (#4+) */
.medal-rank-other[data-v-e1b65ff9] {
font-size: 1.5rem;
color: #707070;
font-weight: 700;
}
/* Emoji medal ranks glow slightly */
.medal-rank-1[data-v-e1b65ff9] { filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.7));
}
.medal-rank-2[data-v-e1b65ff9] { filter: drop-shadow(0 0 6px rgba(192, 192, 192, 0.6));
}
.medal-rank-3[data-v-e1b65ff9] { filter: drop-shadow(0 0 6px rgba(205, 127, 50, 0.6));
}
/* ── Player name ── */
.lane-name[data-v-e1b65ff9] {
font-size: 1.75rem;
font-weight: 700;
color: var(--text-primary);
letter-spacing: 0.03em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.race-lane.lane-gold .lane-name[data-v-e1b65ff9] {
color: #ffeaa0;
}
/* ── Track bar ── */
.lane-track[data-v-e1b65ff9] {
position: relative;
height: 26px;
background: rgba(0, 0, 0, 0.45);
border-radius: 13px;
border: 1px solid rgba(255, 255, 255, 0.05);
overflow: visible;
}
.track-progress[data-v-e1b65ff9] {
position: relative;
height: 100%;
border-radius: 13px;
background: linear-gradient(
90deg,
rgba(255, 215, 0, 0.1) 0%,
rgba(255, 215, 0, 0.4) 100%
);
box-shadow: 0 0 8px rgba(255, 215, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.1);
transition: width 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
display: flex;
align-items: center;
justify-content: flex-end;
min-width: 36px;
}
/* Gold 1st place track */
.race-lane.lane-gold .track-progress[data-v-e1b65ff9] {
background: linear-gradient(90deg, rgba(255, 215, 0, 0.15) 0%, rgba(255, 215, 0, 0.65) 100%);
box-shadow: 0 0 14px rgba(255, 215, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
/* Silver 2nd */
.race-lane.lane-silver .track-progress[data-v-e1b65ff9] {
background: linear-gradient(90deg, rgba(192, 192, 192, 0.08) 0%, rgba(192, 192, 192, 0.45) 100%);
box-shadow: 0 0 10px rgba(192, 192, 192, 0.3);
}
/* Bronze 3rd */
.race-lane.lane-bronze .track-progress[data-v-e1b65ff9] {
background: linear-gradient(90deg, rgba(205, 127, 50, 0.08) 0%, rgba(205, 127, 50, 0.45) 100%);
box-shadow: 0 0 10px rgba(205, 127, 50, 0.3);
}
/* ── Lane animal — flipped to face RIGHT via scaleX(-1) ── */
.lane-animal[data-v-e1b65ff9] {
font-size: 1.8rem;
line-height: 1;
position: absolute;
right: -20px;
top: 50%;
/* translateY centers vertically; scaleX(-1) flips emoji to face right */
transform: translateY(-50%) scaleX(-1);
filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.5));
pointer-events: none;
z-index: 2;
}
/* ── Points display ── */
.lane-points[data-v-e1b65ff9] {
display: flex;
align-items: baseline;
gap: 0.35rem;
justify-content: flex-end;
text-align: right;
}
.points-number[data-v-e1b65ff9] {
font-size: 2rem;
font-weight: 800;
color: #ffd700;
font-variant-numeric: tabular-nums;
letter-spacing: -0.02em;
text-shadow: 0 0 12px rgba(255, 215, 0, 0.45);
}
.race-lane.lane-gold .points-number[data-v-e1b65ff9] {
color: #ffe54c;
text-shadow: 0 0 18px rgba(255, 215, 0, 0.7);
}
.points-label[data-v-e1b65ff9] {
font-size: 1.05rem;
color: #806040;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
}
/* ════════════════════════════════════════════
FOOTER — countdown or ended state
════════════════════════════════════════════ */
.race-footer[data-v-e1b65ff9] {
display: flex;
align-items: center;
justify-content: center;
gap: 1.5rem;
padding: 0.6rem 2.5rem;
flex-shrink: 0;
background: rgba(0, 0, 0, 0.5);
border-top: 1px solid rgba(218, 165, 32, 0.15);
}
.footer-label[data-v-e1b65ff9] {
font-size: 1.2rem;
font-weight: 700;
color: #806040;
text-transform: uppercase;
letter-spacing: 0.14em;
flex-shrink: 0;
}
.race-footer-ended[data-v-e1b65ff9] {
justify-content: center;
}
.footer-ended-text[data-v-e1b65ff9] {
font-size: 1.7rem;
font-weight: 700;
letter-spacing: 0.06em;
color: #b09060;
text-transform: uppercase;
}
/* ════════════════════════════════════════════
TRANSITIONGROUP — race-lane rank reordering
════════════════════════════════════════════ */
.race-lane-move[data-v-e1b65ff9] {
transition: transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.race-lane-enter-active[data-v-e1b65ff9],
.race-lane-leave-active[data-v-e1b65ff9] {
transition: opacity 0.4s ease, transform 0.4s ease;
}
.race-lane-enter-from[data-v-e1b65ff9] {
opacity: 0;
transform: translateX(-24px);
}
.race-lane-leave-to[data-v-e1b65ff9] {
opacity: 0;
transform: translateX(24px);
}
/* ════════════════════════════════════════════
WINNER OVERLAY — State D
════════════════════════════════════════════ */
.winner-overlay[data-v-e1b65ff9] {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(4, 2, 0, 0.88);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
z-index: 100;
overflow: hidden;
}
/* Ornamental rules across the overlay */
.winner-rule[data-v-e1b65ff9] {
position: absolute;
left: 5%;
right: 5%;
height: 1px;
background: linear-gradient(90deg, transparent, #daa520 20%, #ffd700 50%, #daa520 80%, transparent);
pointer-events: none;
z-index: 1;
}
.winner-rule-top[data-v-e1b65ff9] { top: 10%;
}
.winner-rule-bottom[data-v-e1b65ff9] { bottom: 10%;
}
/* ── Confetti: gold/crimson shimmer pieces ── */
.confetti[data-v-e1b65ff9] {
position: absolute;
inset: 0;
pointer-events: none;
overflow: hidden;
}
.confetti-piece[data-v-e1b65ff9] {
position: absolute;
top: -50px;
left: calc(var(--i) * 4.2%);
width: 8px;
height: 18px;
border-radius: 3px;
/* Alternate gold and crimson by odd/even --i */
background: hsl(
calc(40 + (var(--i) * 11)),
85%,
60%
);
opacity: 0.8;
animation:
confetti-fall-e1b65ff9 calc(2.8s + var(--i) * 0.13s) linear calc(var(--i) * 0.09s) infinite;
}
@keyframes confetti-fall-e1b65ff9 {
0% { transform: translateY(0) rotate(0deg); opacity: 0.9;
}
70% { opacity: 0.75;
}
100% { transform: translateY(105vh) rotate(600deg); opacity: 0;
}
}
/* ── Winner panel ── */
.winner-content[data-v-e1b65ff9] {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
padding: 3rem 4.5rem;
max-width: 900px;
width: 88%;
/* Override glass-strong defaults for gold theme */
border-color: rgba(218, 165, 32, 0.4);
background: rgba(12, 8, 0, 0.85);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
box-shadow:
0 0 60px rgba(255, 215, 0, 0.15),
0 0 120px rgba(255, 215, 0, 0.07),
inset 0 1px 0 rgba(255, 215, 0, 0.2);
text-align: center;
}
.winner-title[data-v-e1b65ff9] {
margin: 0;
font-size: 3.8rem;
font-weight: 900;
letter-spacing: 0.08em;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 1rem;
background: linear-gradient(135deg, #daa520 0%, #ffd700 30%, #fff8dc 55%, #ffd700 75%, #daa520 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: title-shimmer-e1b65ff9 3s ease-in-out infinite;
}
@keyframes title-shimmer-e1b65ff9 {
0%, 100% { filter: drop-shadow(0 0 18px rgba(255, 215, 0, 0.45));
}
50% { filter: drop-shadow(0 0 38px rgba(255, 215, 0, 0.85));
}
}
.winner-title-trophy[data-v-e1b65ff9] {
font-size: 3.2rem;
-webkit-text-fill-color: initial;
filter: drop-shadow(0 0 16px rgba(255, 215, 0, 0.8));
}
.winner-divider[data-v-e1b65ff9] {
width: 80%;
height: 1px;
background: linear-gradient(90deg, transparent, #daa520, #ffd700, #daa520, transparent);
flex-shrink: 0;
}
/* ── Winner list ── */
.winner-list[data-v-e1b65ff9] {
display: flex;
flex-direction: column;
gap: 1rem;
width: 100%;
}
.winner-entry[data-v-e1b65ff9] {
display: grid;
grid-template-columns: 3.5rem 1fr auto;
align-items: center;
gap: 1.5rem;
padding: 1.1rem 1.75rem;
border-radius: 12px;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
font-size: 1.9rem;
}
.winner-rank-1[data-v-e1b65ff9] {
background: rgba(255, 215, 0, 0.09);
border-color: rgba(255, 215, 0, 0.38);
box-shadow: 0 0 20px rgba(255, 215, 0, 0.12);
}
.winner-rank-2[data-v-e1b65ff9] {
background: rgba(192, 192, 192, 0.06);
border-color: rgba(192, 192, 192, 0.28);
}
.winner-rank-3[data-v-e1b65ff9] {
background: rgba(205, 127, 50, 0.06);
border-color: rgba(205, 127, 50, 0.28);
}
.winner-medal[data-v-e1b65ff9] {
font-size: 2.4rem;
text-align: center;
line-height: 1;
}
.winner-info[data-v-e1b65ff9] {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.15rem;
text-align: left;
min-width: 0;
}
.winner-name[data-v-e1b65ff9] {
font-weight: 800;
font-size: 2rem;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.winner-rank-1 .winner-name[data-v-e1b65ff9] {
color: #ffeaa0;
}
.winner-pts[data-v-e1b65ff9] {
font-size: 1.15rem;
color: #806040;
font-variant-numeric: tabular-nums;
font-weight: 600;
}
.winner-prize[data-v-e1b65ff9] {
font-size: 2.3rem;
font-weight: 900;
color: #39ff14;
text-shadow: 0 0 16px rgba(57, 255, 20, 0.5);
font-variant-numeric: tabular-nums;
letter-spacing: -0.02em;
white-space: nowrap;
}
.winner-congratulations[data-v-e1b65ff9] {
margin: 0;
font-size: 1.3rem;
color: #b09060;
letter-spacing: 0.12em;
text-transform: uppercase;
font-style: italic;
}
/* ── Winner overlay transition ── */
.winner-overlay-enter-active[data-v-e1b65ff9] {
transition: opacity 0.9s ease;
}
.winner-overlay-leave-active[data-v-e1b65ff9] {
transition: opacity 0.5s ease;
}
.winner-overlay-enter-from[data-v-e1b65ff9],
.winner-overlay-leave-to[data-v-e1b65ff9] {
opacity: 0;
}
.hh-root[data-v-44d99e61] {
position: relative;
width: 100%;
height: 100%;
min-height: 100vh;
display: grid;
grid-template-columns: 1fr 280px;
grid-template-rows: auto 1fr auto;
grid-template-areas:
"header header"
"main rail"
"ticker ticker";
gap: 1rem;
padding: 1.5rem;
color: white;
overflow: hidden;
}
.hh-bg[data-v-44d99e61] {
position: absolute; inset: 0; pointer-events: none; z-index: 0;
background:
radial-gradient(ellipse at 50% 30%, rgba(255, 215, 0, 0.06) 0%, transparent 50%),
linear-gradient(135deg, #0a0000 0%, #14060c 50%, #0a0000 100%);
}
.corner-accent[data-v-44d99e61] {
position: absolute; width: 80px; height: 80px; pointer-events: none; z-index: 1;
background: linear-gradient(135deg, #ffd700, transparent 60%);
opacity: 0.4;
}
.corner-tl[data-v-44d99e61] { top: 0; left: 0; clip-path: polygon(0 0, 100% 0, 0 100%);
}
.corner-tr[data-v-44d99e61] { top: 0; right: 0; transform: scaleX(-1); clip-path: polygon(0 0, 100% 0, 0 100%);
}
.corner-bl[data-v-44d99e61] { bottom: 0; left: 0; transform: scaleY(-1); clip-path: polygon(0 0, 100% 0, 0 100%);
}
.corner-br[data-v-44d99e61] { bottom: 0; right: 0; transform: scale(-1, -1); clip-path: polygon(0 0, 100% 0, 0 100%);
}
/* ── HEADER ─────────────────────────────────────────────────────── */
.hh-header[data-v-44d99e61] {
grid-area: header;
position: relative; z-index: 2;
display: flex; justify-content: space-between; align-items: center;
padding: 1rem 1.5rem;
background: rgba(20, 6, 12, 0.85);
border: 1px solid rgba(255, 215, 0, 0.3);
border-radius: 12px;
backdrop-filter: blur(10px);
}
.header-border-top[data-v-44d99e61], .header-border-bottom[data-v-44d99e61] {
position: absolute; left: 8%; right: 8%; height: 2px;
background: linear-gradient(90deg, transparent, #ffd700, transparent);
}
.header-border-top[data-v-44d99e61] { top: -1px;
}
.header-border-bottom[data-v-44d99e61] { bottom: -1px;
}
.hh-header-left[data-v-44d99e61] { display: flex; align-items: center; gap: 1rem;
}
.hh-icon[data-v-44d99e61] { font-size: 2.5rem;
}
.hh-titles[data-v-44d99e61] { line-height: 1.1;
}
.hh-title[data-v-44d99e61] {
font-family: 'Cinzel', 'Trajan Pro', Georgia, serif;
margin: 0; font-size: 2rem; color: #ffd700;
text-shadow: 0 2px 8px rgba(255, 215, 0, 0.4);
letter-spacing: 0.05em;
}
.hh-subtitle[data-v-44d99e61] {
margin: 0.2rem 0 0; font-size: 0.95rem; color: #b0906a;
font-style: italic; letter-spacing: 0.04em;
}
.hh-header-right[data-v-44d99e61] { display: flex; align-items: center; gap: 0.75rem;
}
.min-hand-pill[data-v-44d99e61] {
display: flex; align-items: baseline; gap: 0.4rem;
padding: 0.4rem 0.9rem;
background: rgba(255, 215, 0, 0.1);
border: 1px solid rgba(255, 215, 0, 0.4);
border-radius: 999px;
}
.min-hand-label[data-v-44d99e61] { font-size: 0.7rem; color: #b0906a; letter-spacing: 0.1em;
}
.min-hand-value[data-v-44d99e61] { font-weight: 700; color: #ffd700;
}
.game-family-pill[data-v-44d99e61] {
padding: 0.4rem 0.9rem;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 999px;
font-weight: 600; font-size: 0.85rem;
}
.game-family-pill.fam-paigow[data-v-44d99e61] {
background: rgba(247, 220, 111, 0.12);
border-color: rgba(247, 220, 111, 0.4);
color: #f7dc6f;
}
/* ── MAIN ──────────────────────────────────────────────────────── */
.hh-main[data-v-44d99e61] {
grid-area: main;
position: relative; z-index: 2;
display: flex; flex-direction: column; align-items: center; justify-content: center;
padding: 2rem;
min-height: 0;
}
.state-empty-card[data-v-44d99e61] {
text-align: center; opacity: 0.55;
padding: 4rem 2rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
border: 1px dashed rgba(255, 255, 255, 0.15);
}
.state-empty-icon[data-v-44d99e61] { font-size: 4rem; display: block; margin-bottom: 1rem;
}
.state-upcoming[data-v-44d99e61], .state-between[data-v-44d99e61], .state-no-leader[data-v-44d99e61], .state-leader[data-v-44d99e61] {
text-align: center; width: 100%; max-width: 800px;
}
.upcoming-eyebrow[data-v-44d99e61], .leader-eyebrow[data-v-44d99e61], .cta-eyebrow[data-v-44d99e61] {
color: #b0906a; letter-spacing: 0.2em; font-size: 0.9rem;
text-transform: uppercase; margin: 0 0 1rem;
}
.upcoming-countdown[data-v-44d99e61] { display: flex; justify-content: center; margin-bottom: 1rem;
}
.state-between-icon[data-v-44d99e61] { font-size: 4rem; display: block; opacity: 0.7;
}
.state-between-msg[data-v-44d99e61] { font-size: 2rem; color: #ffd700; margin: 0.5rem 0 0.2rem;
}
.state-between-sub[data-v-44d99e61] { color: #b0906a; font-size: 0.95rem; font-style: italic;
}
.cta-headline[data-v-44d99e61] {
font-family: 'Cinzel', Georgia, serif;
font-size: 5rem; color: #ffd700; margin: 0;
text-shadow: 0 4px 20px rgba(255, 215, 0, 0.5);
letter-spacing: 0.1em;
}
.cta-min-hand[data-v-44d99e61] {
margin: 1rem 0 2rem; font-size: 1.2rem; color: #d8c4a0;
}
.cta-min-hand strong[data-v-44d99e61] { color: #ffd700; font-weight: 700;
}
.prize-display[data-v-44d99e61] {
display: inline-flex; flex-direction: column; align-items: center;
padding: 1.5rem 3rem;
background: linear-gradient(135deg, rgba(255, 215, 0, 0.12), rgba(255, 215, 0, 0.04));
border: 2px solid rgba(255, 215, 0, 0.5);
border-radius: 16px;
box-shadow: 0 0 40px rgba(255, 215, 0, 0.2);
}
.prize-display.compact[data-v-44d99e61] { padding: 1rem 2rem;
}
.prize-amount[data-v-44d99e61] {
font-family: 'Cinzel', Georgia, serif;
font-size: 4rem; color: #ffd700; line-height: 1;
text-shadow: 0 2px 12px rgba(255, 215, 0, 0.6);
}
.prize-display.compact .prize-amount[data-v-44d99e61] { font-size: 2.5rem;
}
.carryover-badge[data-v-44d99e61] {
margin-top: 0.6rem;
padding: 0.3rem 0.8rem;
background: rgba(255, 215, 0, 0.2);
color: #ffd700;
border-radius: 999px;
font-size: 0.85rem;
font-weight: 700;
letter-spacing: 0.08em;
}
.carryover-badge.small[data-v-44d99e61] {
margin-top: 0.4rem; padding: 0.15rem 0.6rem; font-size: 0.7rem;
}
/* Leader state */
.state-leader.leader-flash .leader-hand-card[data-v-44d99e61] {
animation: leader-pulse-44d99e61 0.6s ease-in-out 0s 4;
}
@keyframes leader-pulse-44d99e61 {
0%, 100% { box-shadow: 0 0 30px rgba(255, 215, 0, 0.3);
}
50% { box-shadow: 0 0 60px rgba(255, 215, 0, 0.8);
}
}
.leader-hand-card[data-v-44d99e61] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.12), rgba(220, 20, 60, 0.05));
border: 2px solid rgba(255, 215, 0, 0.5);
border-radius: 16px;
padding: 2rem;
margin-bottom: 1.5rem;
box-shadow: 0 0 30px rgba(255, 215, 0, 0.3);
}
.leader-class-badge[data-v-44d99e61] {
display: inline-block;
padding: 0.4rem 1rem;
background: rgba(255, 255, 255, 0.1);
border-radius: 999px;
font-size: 0.95rem; font-weight: 700; letter-spacing: 0.1em;
margin-bottom: 1rem;
}
.leader-class-badge.hclass-five-aces[data-v-44d99e61], .leader-class-badge.hclass-royal-flush[data-v-44d99e61] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.4), rgba(220, 20, 60, 0.2));
color: #fff;
box-shadow: 0 0 12px rgba(255, 215, 0, 0.5);
}
.leader-description[data-v-44d99e61] {
font-family: 'Cinzel', Georgia, serif;
font-size: 3rem;
color: #ffd700;
margin: 0;
text-shadow: 0 2px 12px rgba(255, 215, 0, 0.5);
letter-spacing: 0.04em;
}
.leader-attribution[data-v-44d99e61] {
margin: 1rem 0 0;
font-size: 1.4rem;
color: #d8c4a0;
}
.leader-table[data-v-44d99e61] { color: #b0906a;
}
.must-beat-strip[data-v-44d99e61] {
display: inline-flex; align-items: center; gap: 0.5rem;
padding: 0.4rem 0.9rem;
background: rgba(220, 20, 60, 0.15);
border: 1px solid rgba(220, 20, 60, 0.4);
border-radius: 999px;
font-style: italic;
color: #ffb0b0;
font-size: 0.95rem;
margin-bottom: 1.5rem;
}
.must-beat-icon[data-v-44d99e61] { font-size: 1.1rem;
}
/* ── RIGHT RAIL ────────────────────────────────────────────────── */
.hh-rail[data-v-44d99e61] {
grid-area: rail;
position: relative; z-index: 2;
background: rgba(20, 6, 12, 0.85);
border: 1px solid rgba(255, 215, 0, 0.3);
border-radius: 12px;
padding: 1.5rem 1rem;
display: flex; flex-direction: column; gap: 1rem;
backdrop-filter: blur(10px);
overflow: hidden;
}
.rail-header-top[data-v-44d99e61], .rail-header-bottom[data-v-44d99e61] {
position: absolute; left: 10%; right: 10%; height: 1px;
background: linear-gradient(90deg, transparent, #ffd700, transparent);
}
.rail-header-top[data-v-44d99e61] { top: 0;
}
.rail-header-bottom[data-v-44d99e61] { bottom: 0;
}
.rail-section[data-v-44d99e61] {
text-align: center;
padding: 0.6rem 0.3rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
}
.rail-eyebrow[data-v-44d99e61] {
margin: 0 0 0.4rem;
color: #b0906a;
font-size: 0.7rem;
letter-spacing: 0.15em;
text-transform: uppercase;
}
.rail-window-num-value[data-v-44d99e61] {
margin: 0; font-size: 2.6rem; line-height: 1; font-weight: 700;
color: #ffd700; font-family: 'Cinzel', Georgia, serif;
}
.rail-window-len-value[data-v-44d99e61], .rail-min-hand-value[data-v-44d99e61] {
margin: 0; font-size: 1.1rem; font-weight: 600; color: white;
}
.rail-countdown.urgent[data-v-44d99e61] { animation: rail-warn-44d99e61 1.5s ease-in-out infinite;
}
@keyframes rail-warn-44d99e61 {
0%, 100% { background-color: rgba(255, 80, 80, 0.05);
}
50% { background-color: rgba(255, 80, 80, 0.18);
}
}
.rail-countdown-clock[data-v-44d99e61] { display: flex; justify-content: center;
}
/* ── BOTTOM TICKER ─────────────────────────────────────────────── */
.hh-ticker[data-v-44d99e61] {
grid-area: ticker;
position: relative; z-index: 2;
display: flex; align-items: center; gap: 1.5rem;
padding: 0.75rem 1.25rem;
background: rgba(20, 6, 12, 0.85);
border: 1px solid rgba(255, 215, 0, 0.25);
border-radius: 12px;
backdrop-filter: blur(10px);
}
.ticker-label[data-v-44d99e61] {
display: flex; align-items: center; gap: 0.4rem;
color: #ffd700; font-weight: 700; font-size: 0.9rem;
letter-spacing: 0.1em;
flex-shrink: 0;
}
.ticker-icon[data-v-44d99e61] { font-size: 1.2rem;
}
.ticker-items[data-v-44d99e61] {
display: flex; gap: 1rem; flex: 1; overflow: hidden;
}
.ticker-item[data-v-44d99e61] {
display: flex; align-items: baseline; gap: 0.4rem;
padding: 0.3rem 0.7rem;
background: rgba(255, 255, 255, 0.04);
border-radius: 8px;
font-size: 0.85rem;
flex-shrink: 0;
}
.ticker-window[data-v-44d99e61] { color: #b0906a; font-weight: 700;
}
.ticker-hand[data-v-44d99e61] { color: white; font-weight: 600;
}
.ticker-by[data-v-44d99e61] { color: #d8c4a0;
}
.ticker-prize[data-v-44d99e61] { color: #ffd700; font-weight: 700; margin-left: auto;
}
/* Suit colors (used if we render cards in future) */
.suit-h[data-v-44d99e61], .suit-d[data-v-44d99e61] { color: #ff6b6b;
}
.suit-s[data-v-44d99e61], .suit-c[data-v-44d99e61] { color: white;
}
/* ── Responsive — collapse for portrait TVs ────────────────────── */
@media (max-width: 1100px) {
.hh-root[data-v-44d99e61] {
grid-template-columns: 1fr;
grid-template-areas: "header" "main" "rail" "ticker";
}
}
.media-display[data-v-48bef738] {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
background: #000;
}
.media-display.fullscreen-mode[data-v-48bef738] {
cursor: none;
}
/* Casino Name Header */
.casino-header[data-v-48bef738] {
position: fixed;
top: 50px;
left: 0;
right: 0;
text-align: center;
font-family: 'Times New Roman', Times, serif;
font-size: 4.5rem;
font-weight: 700;
color: #ffd700;
text-shadow:
0 0 20px rgba(255, 215, 0, 0.6),
0 0 40px rgba(255, 215, 0, 0.4),
0 4px 8px rgba(0, 0, 0, 0.6);
letter-spacing: 0.15em;
z-index: 100;
margin: 0;
pointer-events: none;
}
.casino-header-race[data-v-48bef738] {
top: 50%;
transform: translateY(-50%);
font-size: 5rem;
opacity: 0.12;
letter-spacing: 0.25em;
pointer-events: none;
}
/* Loading/Error/Empty States */
.loading-overlay[data-v-48bef738],
.error-overlay[data-v-48bef738],
.empty-overlay[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
}
.spinner[data-v-48bef738] {
width: 60px;
height: 60px;
border: 4px solid rgba(0, 255, 255, 0.2);
border-top-color: #00ffff;
border-radius: 50%;
animation: spin-48bef738 1s linear infinite;
}
@keyframes spin-48bef738 {
to {
transform: rotate(360deg);
}
}
.loading-overlay p[data-v-48bef738],
.error-card[data-v-48bef738],
.empty-card[data-v-48bef738] {
text-align: center;
color: #fff;
}
.error-card[data-v-48bef738],
.empty-card[data-v-48bef738] {
background: rgba(20, 24, 40, 0.95);
backdrop-filter: blur(20px);
border: 1px solid rgba(0, 255, 255, 0.3);
border-radius: 20px;
padding: 3rem;
max-width: 500px;
}
.error-icon[data-v-48bef738],
.empty-icon[data-v-48bef738] {
font-size: 4rem;
display: block;
margin-bottom: 1rem;
}
.error-card h2[data-v-48bef738],
.empty-card h2[data-v-48bef738] {
margin: 1rem 0;
color: #00ffff;
}
.error-card p[data-v-48bef738],
.empty-card p[data-v-48bef738] {
margin: 0.5rem 0;
color: rgba(255, 255, 255, 0.8);
}
.empty-card .hint[data-v-48bef738] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 1rem;
}
.btn-retry[data-v-48bef738] {
margin-top: 1.5rem;
padding: 0.75rem 2rem;
background: rgba(0, 255, 255, 0.2);
border: 1px solid #00ffff;
color: #00ffff;
border-radius: 8px;
cursor: pointer;
font-size: 1rem;
transition: all 0.3s ease;
}
.btn-retry[data-v-48bef738]:hover {
background: rgba(0, 255, 255, 0.3);
transform: translateY(-2px);
}
/* Content Display */
.content-display[data-v-48bef738] {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
}
/* Carousel */
.carousel-container[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.carousel-slide[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.carousel-image[data-v-48bef738] {
width: 100%;
height: 100%;
object-fit: contain;
background: #000;
}
.carousel-indicators[data-v-48bef738] {
position: absolute;
bottom: 2rem;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 0.75rem;
z-index: 5;
}
.indicator[data-v-48bef738] {
width: 12px;
height: 12px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.3);
cursor: pointer;
transition: all 0.3s ease;
}
.indicator.active[data-v-48bef738] {
background: #00ffff;
box-shadow: 0 0 10px rgba(0, 255, 255, 0.5);
}
.indicator[data-v-48bef738]:hover {
background: rgba(255, 255, 255, 0.6);
}
/* Game Container */
.game-container[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* 3D Scene */
.scene-3d-container[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.coming-soon-overlay[data-v-48bef738] {
text-align: center;
color: #fff;
background: rgba(20, 24, 40, 0.9);
padding: 3rem;
border-radius: 20px;
border: 1px solid rgba(0, 255, 255, 0.3);
}
.coming-soon-overlay h2[data-v-48bef738] {
margin: 0 0 1rem 0;
color: #00ffff;
font-size: 2.5rem;
}
.coming-soon-overlay p[data-v-48bef738] {
margin: 0;
font-size: 1.25rem;
color: rgba(255, 255, 255, 0.7);
}
/* Fullscreen Button */
.btn-fullscreen[data-v-48bef738] {
position: fixed;
bottom: 2rem;
right: 2rem;
width: 50px;
height: 50px;
background: rgba(0, 255, 255, 0.2);
border: 1px solid #00ffff;
color: #00ffff;
border-radius: 10px;
cursor: pointer;
font-size: 1.5rem;
display: flex;
align-items: center;
justify-content: center;
z-index: 100;
transition: all 0.3s ease;
}
.btn-fullscreen[data-v-48bef738]:hover {
background: rgba(0, 255, 255, 0.3);
transform: scale(1.1);
}
.btn-fullscreen.exit[data-v-48bef738] {
background: rgba(255, 0, 255, 0.2);
border-color: #ff00ff;
color: #ff00ff;
}
.btn-fullscreen.exit[data-v-48bef738]:hover {
background: rgba(255, 0, 255, 0.3);
}
/* Transitions */
.fade-enter-active[data-v-48bef738],
.fade-leave-active[data-v-48bef738] {
transition: opacity 0.5s ease;
}
.fade-enter-from[data-v-48bef738],
.fade-leave-to[data-v-48bef738] {
opacity: 0;
}
.carousel-fade-enter-active[data-v-48bef738],
.carousel-fade-leave-active[data-v-48bef738] {
transition: opacity 1s ease;
}
.carousel-fade-enter-from[data-v-48bef738] {
opacity: 0;
}
.carousel-fade-leave-to[data-v-48bef738] {
opacity: 0;
}
/* Responsive */
@media (max-width: 768px) {
.error-card[data-v-48bef738],
.empty-card[data-v-48bef738] {
padding: 2rem;
margin: 1rem;
}
.btn-fullscreen[data-v-48bef738] {
width: 40px;
height: 40px;
bottom: 1rem;
right: 1rem;
}
.carousel-indicators[data-v-48bef738] {
bottom: 1rem;
}
}
/* Prize Pots Display */
.prizes-container[data-v-48bef738] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
padding: 2rem;
box-sizing: border-box;
}
.prizes-header[data-v-48bef738] {
text-align: center;
margin-bottom: 2rem;
}
.prizes-header h1[data-v-48bef738] {
font-size: 3rem;
font-weight: 700;
color: #ffd700;
text-shadow: 0 0 20px rgba(255, 215, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.5);
margin: 0;
}
.prizes-subtitle[data-v-48bef738] {
font-size: 1.25rem;
color: rgba(255, 255, 255, 0.9);
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
margin-top: 0.5rem;
}
.no-prizes[data-v-48bef738] {
text-align: center;
color: rgba(255, 255, 255, 0.8);
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}
.no-prizes-icon[data-v-48bef738] {
font-size: 4rem;
display: block;
margin-bottom: 1rem;
}
.prize-pots-grid[data-v-48bef738] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 380px));
justify-content: center;
gap: 1.5rem;
width: 100%;
max-width: 1400px;
}
.prize-pot-card[data-v-48bef738] {
background: rgba(139, 0, 0, 0.85);
backdrop-filter: blur(20px);
border: 2px solid rgba(255, 215, 0, 0.6);
border-radius: 20px;
padding: 2rem;
text-align: center;
transition: all 0.3s ease;
animation: pot-glow-48bef738 3s ease-in-out infinite alternate;
box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3);
}
.prize-pot-card[data-v-48bef738]:hover {
transform: scale(1.02);
border-color: rgba(255, 215, 0, 0.9);
}
.prize-pot-card.low-funds[data-v-48bef738] {
border-color: rgba(255, 100, 100, 0.7);
animation: pot-warning-48bef738 1.5s ease-in-out infinite alternate;
}
@keyframes pot-glow-48bef738 {
from {
box-shadow: 0 0 20px rgba(255, 215, 0, 0.3), inset 0 0 30px rgba(0, 0, 0, 0.3);
}
to {
box-shadow: 0 0 40px rgba(255, 215, 0, 0.5), inset 0 0 30px rgba(0, 0, 0, 0.3);
}
}
@keyframes pot-warning-48bef738 {
from {
box-shadow: 0 0 20px rgba(255, 100, 100, 0.3);
}
to {
box-shadow: 0 0 40px rgba(255, 100, 100, 0.5);
}
}
.pot-icon[data-v-48bef738] {
font-size: 3rem;
margin-bottom: 0.5rem;
}
.pot-name[data-v-48bef738] {
font-size: 2.2rem;
font-weight: 700;
color: #ffd700;
text-shadow: 0 0 15px rgba(255, 215, 0, 0.5);
margin: 0.75rem 0;
}
.pot-game-type[data-v-48bef738] {
font-size: 1.5rem;
font-weight: 500;
color: rgba(255, 215, 0, 0.95);
text-shadow: 0 0 8px rgba(255, 215, 0, 0.3);
margin-bottom: 1.25rem;
}
.pot-amount[data-v-48bef738] {
font-size: 2.5rem;
font-weight: 700;
color: #fff;
text-shadow: 0 0 15px rgba(255, 215, 0, 0.6), 0 2px 4px rgba(0, 0, 0, 0.5);
margin: 1rem 0;
}
.pot-progress[data-v-48bef738] {
width: 100%;
height: 8px;
background: rgba(0, 0, 0, 0.3);
border-radius: 4px;
overflow: hidden;
margin: 1rem 0;
border: 1px solid rgba(255, 215, 0, 0.3);
}
.pot-progress-bar[data-v-48bef738] {
height: 100%;
background: linear-gradient(90deg, #ffd700, #ffaa00);
border-radius: 4px;
transition: width 0.5s ease;
}
.prize-pot-card.low-funds .pot-progress-bar[data-v-48bef738] {
background: linear-gradient(90deg, #ff6464, #ff9944);
}
.pot-range[data-v-48bef738] {
font-size: 0.85rem;
color: rgba(255, 215, 0, 0.8);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
/* Winner Announcement Overlay */
.winner-announcement-overlay[data-v-48bef738] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.85);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.winner-announcement[data-v-48bef738] {
position: relative;
background: linear-gradient(135deg, rgba(20, 24, 40, 0.95), rgba(40, 50, 80, 0.95));
border: 3px solid #ffd700;
border-radius: 30px;
padding: 4rem;
text-align: center;
animation: winner-pop-48bef738 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
box-shadow: 0 0 60px rgba(255, 215, 0, 0.5);
}
@keyframes winner-pop-48bef738 {
0% {
transform: scale(0);
opacity: 0;
}
100% {
transform: scale(1);
opacity: 1;
}
}
.confetti-burst[data-v-48bef738] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-image:
radial-gradient(circle at 20% 30%, #ffd700 2px, transparent 2px),
radial-gradient(circle at 80% 20%, #ff6b6b 2px, transparent 2px),
radial-gradient(circle at 40% 70%, #00ff88 2px, transparent 2px),
radial-gradient(circle at 60% 80%, #00ffff 2px, transparent 2px),
radial-gradient(circle at 90% 60%, #ff00ff 2px, transparent 2px);
animation: confetti-fall-48bef738 2s ease-out infinite;
}
@keyframes confetti-fall-48bef738 {
0% {
opacity: 1;
transform: translateY(0) rotate(0deg);
}
100% {
opacity: 0;
transform: translateY(100px) rotate(360deg);
}
}
.winner-content[data-v-48bef738] {
position: relative;
z-index: 1;
}
.winner-emoji[data-v-48bef738] {
font-size: 5rem;
animation: bounce-48bef738 0.8s ease-in-out infinite;
}
@keyframes bounce-48bef738 {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(-15px);
}
}
.winner-title[data-v-48bef738] {
font-size: 3rem;
font-weight: 800;
color: #ffd700;
text-shadow: 0 0 30px rgba(255, 215, 0, 0.7);
margin: 1rem 0;
letter-spacing: 0.2em;
}
.winner-name[data-v-48bef738] {
font-size: 2rem;
font-weight: 600;
color: #fff;
margin: 1rem 0;
}
.winner-amount[data-v-48bef738] {
font-size: 4rem;
font-weight: 700;
color: #00ff88;
text-shadow: 0 0 20px rgba(0, 255, 136, 0.6);
margin: 1rem 0;
}
.winner-game[data-v-48bef738] {
font-size: 1.25rem;
color: rgba(0, 255, 255, 0.9);
margin-top: 1rem;
}
.winner-pot[data-v-48bef738] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.6);
margin-top: 0.5rem;
}
/* Winner Announce Transition */
.winner-announce-enter-active[data-v-48bef738] {
transition: all 0.5s ease-out;
}
.winner-announce-leave-active[data-v-48bef738] {
transition: all 0.5s ease-in;
}
.winner-announce-enter-from[data-v-48bef738] {
opacity: 0;
}
.winner-announce-enter-from .winner-announcement[data-v-48bef738] {
transform: scale(0);
}
.winner-announce-leave-to[data-v-48bef738] {
opacity: 0;
}
.winner-announce-leave-to .winner-announcement[data-v-48bef738] {
transform: scale(0.8);
}
/* Elo welcome overlay slide transition */
.elo-welcome-slide-enter-active[data-v-48bef738] {
transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.elo-welcome-slide-leave-active[data-v-48bef738] {
transition: opacity 0.5s ease, transform 0.5s ease;
}
.elo-welcome-slide-enter-from[data-v-48bef738] {
opacity: 0;
transform: scale(0.95);
}
.elo-welcome-slide-leave-to[data-v-48bef738] {
opacity: 0;
transform: scale(0.97);
}
.player-photo-upload[data-v-e392ee7a] {
position: relative;
}
.photo-display[data-v-e392ee7a] {
position: relative;
width: 120px;
height: 120px;
border-radius: 12px;
overflow: hidden;
border: 2px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.05);
}
.current-photo[data-v-e392ee7a] {
position: relative;
width: 100%;
height: 100%;
}
.photo-image[data-v-e392ee7a] {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
}
.photo-overlay[data-v-e392ee7a] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.7);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.3rem;
opacity: 0;
transition: opacity 0.3s ease;
}
.current-photo:hover .photo-overlay[data-v-e392ee7a] {
opacity: 1;
}
.change-photo-btn[data-v-e392ee7a],
.remove-photo-btn[data-v-e392ee7a] {
padding: 0.25rem 0.6rem;
font-size: 0.7rem;
white-space: nowrap;
}
.remove-photo-btn[data-v-e392ee7a]:hover {
background: rgba(255, 7, 58, 0.2);
color: var(--neon-red);
}
.no-photo[data-v-e392ee7a] {
display: grid;
grid-auto-rows: min-content;
align-content: center;
justify-items: center;
height: 100%;
text-align: center;
padding: 0.5rem;
gap: 0.25rem;
}
.no-photo-text[data-v-e392ee7a] {
margin: 0;
color: var(--text-muted);
font-size: 0.7rem;
line-height: 1.1;
}
.add-photo-btn[data-v-e392ee7a] {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.3rem;
padding: 0.25rem 0.6rem;
font-size: 0.7rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(0, 245, 255, 0.12);
color: var(--text-primary);
cursor: pointer;
transition: all 0.2s ease;
width: 100%;
}
.add-photo-btn[data-v-e392ee7a]:hover {
background: rgba(0, 245, 255, 0.18);
border-color: rgba(0, 245, 255, 0.35);
}
.add-photo-btn[data-v-e392ee7a]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.photo-source-buttons[data-v-e392ee7a] {
display: flex;
flex-direction: column;
gap: 0.2rem;
width: 100%;
}
.scan-photo-btn[data-v-e392ee7a] {
background: rgba(0, 255, 136, 0.12);
}
.scan-photo-btn[data-v-e392ee7a]:hover:not(:disabled) {
background: rgba(0, 255, 136, 0.18);
border-color: rgba(0, 255, 136, 0.35);
}
.camera-icon[data-v-e392ee7a] {
display: inline-block;
font-size: 0.75rem;
}
.hidden-file-input[data-v-e392ee7a] {
display: none;
}
/* Crop Modal */
.modal-overlay[data-v-e392ee7a] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(5px);
}
.crop-modal-layer[data-v-e392ee7a] {
z-index: 2200;
}
.crop-modal[data-v-e392ee7a] {
width: 90%;
max-width: 600px;
max-height: 90vh;
overflow-y: auto;
}
.modal-container[data-v-e392ee7a] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
}
.modal-header[data-v-e392ee7a] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-e392ee7a] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.modal-close[data-v-e392ee7a] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.modal-close[data-v-e392ee7a]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-e392ee7a] {
padding: 1.5rem;
}
.crop-area[data-v-e392ee7a] {
margin-bottom: 2rem;
}
.image-preview[data-v-e392ee7a] {
position: relative;
max-width: 100%;
max-height: 600px;
overflow: visible;
border-radius: 8px;
background: #000;
display: flex;
align-items: center;
justify-content: center;
}
.crop-image[data-v-e392ee7a] {
max-width: 100%;
max-height: 600px;
display: block;
position: relative;
}
.crop-overlay[data-v-e392ee7a] {
position: absolute;
top: 0;
left: 0;
pointer-events: none;
}
.crop-box[data-v-e392ee7a] {
position: absolute;
border: 2px solid var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.5);
background: rgba(0, 245, 255, 0.1);
}
.crop-controls[data-v-e392ee7a] {
display: flex;
flex-direction: column;
gap: 1.5rem;
margin-bottom: 2rem;
}
.control-group[data-v-e392ee7a] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.control-group label[data-v-e392ee7a] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.size-buttons[data-v-e392ee7a] {
display: flex;
gap: 0.5rem;
}
.size-btn[data-v-e392ee7a] {
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.85rem;
}
.size-btn[data-v-e392ee7a]:hover {
background: rgba(255, 255, 255, 0.15);
color: var(--text-primary);
}
.size-btn.active[data-v-e392ee7a] {
background: var(--neon-blue);
color: white;
border-color: var(--neon-blue);
}
.size-btn[data-v-e392ee7a]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.size-warning[data-v-e392ee7a] {
color: var(--neon-orange);
font-size: 0.8rem;
font-style: italic;
}
.position-controls[data-v-e392ee7a] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.5rem;
max-width: 200px;
}
.position-controls .btn-glass[data-v-e392ee7a] {
padding: 0.5rem;
font-size: 1rem;
aspect-ratio: 1;
}
.modal-actions[data-v-e392ee7a] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.cancel-btn[data-v-e392ee7a],
.save-btn[data-v-e392ee7a] {
padding: 0.75rem 1.5rem;
}
.save-btn[data-v-e392ee7a] {
font-weight: 600;
}
/* Upload Progress */
.upload-progress[data-v-e392ee7a] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 12px;
gap: 1rem;
}
.progress-bar[data-v-e392ee7a] {
width: 80%;
height: 8px;
background: rgba(255, 255, 255, 0.2);
border-radius: 4px;
overflow: hidden;
}
.progress-fill[data-v-e392ee7a] {
height: 100%;
background: var(--neon-green);
transition: width 0.3s ease;
border-radius: 4px;
}
.upload-progress p[data-v-e392ee7a] {
margin: 0;
color: var(--text-primary);
font-size: 0.9rem;
}
/* Responsive */
@media (max-width: 768px) {
.crop-modal[data-v-e392ee7a] {
width: 95%;
max-height: 95vh;
}
.size-buttons[data-v-e392ee7a] {
flex-wrap: wrap;
}
.modal-actions[data-v-e392ee7a] {
flex-direction: column;
}
}
.modal-overlay[data-v-387543a8] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(5px);
}
.messages-modal[data-v-387543a8] {
width: 90%;
max-width: 600px;
max-height: 80vh;
overflow-y: auto;
}
.modal-container[data-v-387543a8] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
}
.modal-header[data-v-387543a8] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-387543a8] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.modal-close[data-v-387543a8] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.modal-close[data-v-387543a8]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-387543a8] {
padding: 1.5rem;
}
.player-info[data-v-387543a8] {
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
padding: 1rem;
margin-bottom: 1.5rem;
text-align: center;
}
.player-info h4[data-v-387543a8] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.card-number[data-v-387543a8] {
margin: 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.instruction-text[data-v-387543a8] {
color: var(--text-secondary);
margin-bottom: 1rem;
text-align: center;
font-size: 0.95rem;
}
.message-buttons[data-v-387543a8] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 0.75rem;
margin-bottom: 2rem;
}
.message-button[data-v-387543a8] {
padding: 0.75rem 1rem;
text-align: center;
font-size: 0.9rem;
transition: all 0.3s ease;
border: 1px solid transparent;
cursor: pointer;
}
.message-button[data-v-387543a8]:hover {
background: rgba(255, 255, 255, 0.08);
transform: translateY(-2px);
}
.message-button.selected[data-v-387543a8] {
background: rgba(0, 245, 255, 0.15);
border-color: var(--neon-blue);
color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.3);
}
.modal-actions[data-v-387543a8] {
display: flex;
gap: 1rem;
justify-content: center;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.cancel-btn[data-v-387543a8] {
padding: 0.75rem 1.5rem;
opacity: 0.8;
}
.add-btn[data-v-387543a8] {
padding: 0.75rem 1.5rem;
font-weight: 600;
}
.add-btn[data-v-387543a8]:disabled {
opacity: 0.5;
cursor: not-allowed;
background: rgba(255, 255, 255, 0.1);
color: var(--text-muted);
box-shadow: none;
}
.add-btn[data-v-387543a8]:disabled:hover {
transform: none;
box-shadow: none;
}
/* Current Messages Section */
.current-messages-section[data-v-387543a8] {
margin-bottom: 2rem;
}
.current-messages-section h4[data-v-387543a8] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.messages-list[data-v-387543a8] {
display: flex;
flex-direction: column;
gap: 0.75rem;
margin-bottom: 1rem;
}
.message-item[data-v-387543a8] {
display: flex;
align-items: center;
justify-content: space-between;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 0.75rem;
transition: all 0.3s ease;
}
.message-item[data-v-387543a8]:hover {
background: rgba(255, 255, 255, 0.08);
transform: translateY(-1px);
}
.message-content[data-v-387543a8] {
flex: 1;
min-width: 0;
}
.message-text[data-v-387543a8] {
color: var(--text-primary);
font-size: 0.9rem;
margin-bottom: 0.25rem;
}
.message-meta[data-v-387543a8] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.8rem;
color: var(--text-muted);
}
.message-date[data-v-387543a8] {
color: var(--text-secondary);
}
.message-author[data-v-387543a8] {
color: var(--text-muted);
}
.delete-message-btn[data-v-387543a8] {
background: none;
border: none;
color: var(--text-muted);
cursor: pointer;
font-size: 1.2rem;
padding: 0.25rem;
border-radius: 50%;
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
flex-shrink: 0;
}
.delete-message-btn[data-v-387543a8]:hover {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.message-options h4[data-v-387543a8] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
/* Custom Message Input */
.custom-message-section[data-v-387543a8] {
margin: 1.5rem 0;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.custom-message-section h4[data-v-387543a8] {
margin: 0 0 0.75rem 0;
color: var(--text-primary);
font-size: 0.95rem;
}
.custom-message-input[data-v-387543a8] {
width: 100%;
padding: 0.75rem;
background: rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 0.9rem;
transition: all 0.3s ease;
}
.custom-message-input[data-v-387543a8]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.2);
}
.custom-message-input[data-v-387543a8]::placeholder {
color: var(--text-muted);
}
.char-count[data-v-387543a8] {
display: block;
text-align: right;
margin-top: 0.5rem;
color: var(--text-muted);
font-size: 0.75rem;
}
/* Responsive */
@media (max-width: 768px) {
.messages-modal[data-v-387543a8] {
width: 95%;
max-height: 90vh;
}
.message-buttons[data-v-387543a8] {
grid-template-columns: 1fr;
gap: 0.5rem;
}
.modal-actions[data-v-387543a8] {
flex-direction: column;
}
.modal-header[data-v-387543a8] {
padding: 1rem;
}
.modal-body[data-v-387543a8] {
padding: 1rem;
}
}
.modal-overlay[data-v-1b5af3cf] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(5px);
}
.notes-modal[data-v-1b5af3cf] {
width: 90%;
max-width: 800px;
max-height: 90vh;
overflow-y: auto;
}
.modal-container[data-v-1b5af3cf] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
}
.modal-header[data-v-1b5af3cf] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-1b5af3cf] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.modal-close[data-v-1b5af3cf] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.modal-close[data-v-1b5af3cf]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-1b5af3cf] {
padding: 1.5rem;
}
.player-info[data-v-1b5af3cf] {
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
padding: 1rem;
margin-bottom: 1.5rem;
}
.barring-section[data-v-1b5af3cf] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.barring-header[data-v-1b5af3cf] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
margin-bottom: 0.75rem;
}
.barring-header h4[data-v-1b5af3cf] {
margin: 0;
color: var(--text-primary);
}
.status-chip[data-v-1b5af3cf] {
padding: 0.25rem 0.75rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.status-active[data-v-1b5af3cf] {
background: rgba(0, 255, 135, 0.15);
color: var(--neon-green);
border: 1px solid rgba(0, 255, 135, 0.3);
}
.status-temporarily-barred[data-v-1b5af3cf] {
background: rgba(255, 196, 0, 0.12);
color: #facc15;
border: 1px solid rgba(255, 196, 0, 0.3);
}
.status-permanently-barred[data-v-1b5af3cf] {
background: rgba(255, 56, 92, 0.12);
color: var(--neon-red);
border: 1px solid rgba(255, 56, 92, 0.3);
}
.barring-description[data-v-1b5af3cf] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.barring-grid[data-v-1b5af3cf] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 1rem;
margin-bottom: 1rem;
}
.datetime-input[data-v-1b5af3cf] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
}
.datetime-input[data-v-1b5af3cf]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.help-text[data-v-1b5af3cf] {
color: var(--text-muted);
font-size: 0.75rem;
}
.required-indicator[data-v-1b5af3cf] {
color: var(--neon-red);
margin-left: 0.35rem;
}
.barring-actions[data-v-1b5af3cf] {
display: flex;
gap: 1rem;
align-items: center;
margin-top: 1rem;
}
.barring-feedback[data-v-1b5af3cf] {
min-height: 1.2rem;
margin-top: 0.5rem;
}
.success-text[data-v-1b5af3cf] {
color: var(--neon-green);
font-size: 0.85rem;
}
.error-text[data-v-1b5af3cf] {
color: var(--neon-red);
font-size: 0.85rem;
}
.barring-meta[data-v-1b5af3cf] {
margin-top: 0.75rem;
color: var(--text-muted);
font-size: 0.8rem;
}
.player-details h4[data-v-1b5af3cf] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.player-details p[data-v-1b5af3cf] {
margin: 0.25rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.notes-content[data-v-1b5af3cf] {
display: grid;
grid-template-columns: 1fr;
gap: 2rem;
}
/* Notes List Section */
.notes-section[data-v-1b5af3cf] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1.5rem;
}
.notes-header[data-v-1b5af3cf] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
flex-wrap: wrap;
gap: 1rem;
}
.notes-header h4[data-v-1b5af3cf] {
margin: 0;
color: var(--text-primary);
}
.note-type-filters[data-v-1b5af3cf] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.filter-btn[data-v-1b5af3cf] {
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.85rem;
}
.filter-btn[data-v-1b5af3cf]:hover {
background: rgba(255, 255, 255, 0.15);
color: var(--text-primary);
}
.filter-btn.active[data-v-1b5af3cf] {
background: var(--neon-red);
color: white;
border-color: var(--neon-red);
}
.notes-list[data-v-1b5af3cf] {
display: flex;
flex-direction: column;
gap: 1rem;
max-height: 300px;
overflow-y: auto;
}
.note-item[data-v-1b5af3cf] {
display: flex;
justify-content: space-between;
align-items: flex-start;
background: rgba(255, 255, 255, 0.05);
padding: 1rem;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.note-item.front-note[data-v-1b5af3cf] {
border-color: var(--neon-purple);
background: rgba(138, 43, 226, 0.1);
}
.note-content[data-v-1b5af3cf] {
flex: 1;
}
.note-text[data-v-1b5af3cf] {
color: var(--text-primary);
margin-bottom: 0.5rem;
font-size: 0.95rem;
line-height: 1.4;
}
.note-meta[data-v-1b5af3cf] {
display: flex;
gap: 1rem;
font-size: 0.8rem;
color: var(--text-muted);
flex-wrap: wrap;
}
.note-type[data-v-1b5af3cf] {
background: rgba(255, 255, 255, 0.1);
padding: 0.2rem 0.5rem;
border-radius: 4px;
font-weight: 500;
}
.front-indicator[data-v-1b5af3cf] {
margin-top: 0.5rem;
color: var(--neon-purple);
font-size: 0.8rem;
font-weight: 600;
}
.delete-note-btn[data-v-1b5af3cf] {
background: none;
border: none;
color: var(--text-muted);
cursor: pointer;
padding: 0.5rem;
border-radius: 4px;
transition: all 0.3s ease;
}
.delete-note-btn[data-v-1b5af3cf]:hover {
background: rgba(255, 7, 58, 0.2);
color: var(--neon-red);
}
.no-notes[data-v-1b5af3cf] {
text-align: center;
color: var(--text-muted);
font-style: italic;
padding: 2rem;
}
/* Add Note Section */
.add-note-section[data-v-1b5af3cf] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1.5rem;
}
.add-note-section h4[data-v-1b5af3cf] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.note-form[data-v-1b5af3cf] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.form-group[data-v-1b5af3cf] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-1b5af3cf] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.note-type-select[data-v-1b5af3cf] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
font-size: 0.9rem;
}
.note-type-select[data-v-1b5af3cf]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.note-textarea[data-v-1b5af3cf] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
font-size: 0.9rem;
font-family: inherit;
resize: vertical;
min-height: 100px;
}
.note-textarea[data-v-1b5af3cf]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.char-count[data-v-1b5af3cf] {
font-size: 0.8rem;
color: var(--text-muted);
text-align: right;
}
.checkbox-label[data-v-1b5af3cf] {
display: flex;
flex-direction: column;
gap: 0.5rem;
cursor: pointer;
}
.show-front-checkbox[data-v-1b5af3cf] {
width: 18px;
height: 18px;
}
.checkbox-text[data-v-1b5af3cf] {
color: var(--text-primary);
font-weight: 500;
}
.checkbox-help[data-v-1b5af3cf] {
color: var(--text-muted);
font-size: 0.8rem;
line-height: 1.3;
}
.form-actions[data-v-1b5af3cf] {
display: flex;
gap: 1rem;
justify-content: flex-end;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.save-btn[data-v-1b5af3cf] {
padding: 0.75rem 1.5rem;
font-weight: 600;
}
.save-btn[data-v-1b5af3cf]:disabled {
opacity: 0.5;
cursor: not-allowed;
background: rgba(255, 255, 255, 0.1);
color: var(--text-muted);
box-shadow: none;
}
.clear-btn[data-v-1b5af3cf] {
padding: 0.75rem 1.5rem;
opacity: 0.8;
}
/* Responsive */
@media (max-width: 768px) {
.notes-modal[data-v-1b5af3cf] {
width: 95%;
max-height: 95vh;
}
.barring-actions[data-v-1b5af3cf] {
flex-direction: column;
align-items: stretch;
}
.notes-header[data-v-1b5af3cf] {
flex-direction: column;
align-items: stretch;
}
.note-type-filters[data-v-1b5af3cf] {
justify-content: center;
}
.form-actions[data-v-1b5af3cf] {
flex-direction: column;
}
.modal-header[data-v-1b5af3cf] {
padding: 1rem;
}
.modal-body[data-v-1b5af3cf] {
padding: 1rem;
}
}
@media (min-width: 769px) {
.notes-content[data-v-1b5af3cf] {
grid-template-columns: 1fr 1fr;
}
}
.modal-overlay[data-v-8b3db3b9] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(5px);
}
.traits-modal[data-v-8b3db3b9] {
width: 90%;
max-width: 700px;
max-height: 85vh;
overflow-y: auto;
}
.modal-container[data-v-8b3db3b9] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
}
.modal-header[data-v-8b3db3b9] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-8b3db3b9] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.modal-close[data-v-8b3db3b9] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.modal-close[data-v-8b3db3b9]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-8b3db3b9] {
padding: 1.5rem;
}
.player-info[data-v-8b3db3b9] {
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
padding: 1rem;
margin-bottom: 1.5rem;
text-align: center;
}
.player-info h4[data-v-8b3db3b9] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.card-number[data-v-8b3db3b9] {
margin: 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.current-traits-section[data-v-8b3db3b9] {
margin-bottom: 2rem;
}
.current-traits-section h4[data-v-8b3db3b9] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.traits-grid[data-v-8b3db3b9] {
display: grid;
gap: 0.75rem;
margin-bottom: 1rem;
}
.trait-card[data-v-8b3db3b9] {
display: flex;
align-items: center;
justify-content: space-between;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 0.75rem;
transition: all 0.3s ease;
}
.trait-card[data-v-8b3db3b9]:hover {
background: rgba(255, 255, 255, 0.08);
transform: translateY(-1px);
}
.trait-content[data-v-8b3db3b9] {
display: flex;
align-items: center;
gap: 0.5rem;
flex: 1;
}
.trait-category[data-v-8b3db3b9] {
color: var(--neon-blue);
font-weight: 600;
font-size: 0.9rem;
}
.trait-value[data-v-8b3db3b9] {
color: var(--text-primary);
font-size: 0.9rem;
}
.delete-trait-btn[data-v-8b3db3b9] {
background: none;
border: none;
color: var(--text-muted);
cursor: pointer;
font-size: 1.2rem;
padding: 0.25rem;
border-radius: 50%;
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
}
.delete-trait-btn[data-v-8b3db3b9]:hover {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.add-trait-section h4[data-v-8b3db3b9] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.trait-form[data-v-8b3db3b9] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.form-group[data-v-8b3db3b9] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-8b3db3b9] {
color: var(--text-secondary);
font-size: 0.9rem;
font-weight: 500;
}
.trait-category-select[data-v-8b3db3b9],
.trait-select[data-v-8b3db3b9] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.75rem;
color: var(--text-primary);
font-size: 0.9rem;
transition: all 0.3s ease;
}
.trait-category-select[data-v-8b3db3b9]:focus,
.trait-select[data-v-8b3db3b9]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.trait-category-select option[data-v-8b3db3b9],
.trait-select option[data-v-8b3db3b9] {
background: var(--bg-secondary);
color: var(--text-primary);
}
.form-actions[data-v-8b3db3b9] {
display: flex;
gap: 1rem;
justify-content: center;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.save-btn[data-v-8b3db3b9] {
padding: 0.75rem 1.5rem;
font-weight: 600;
}
.save-btn[data-v-8b3db3b9]:disabled {
opacity: 0.5;
cursor: not-allowed;
background: rgba(255, 255, 255, 0.1);
color: var(--text-muted);
box-shadow: none;
}
.save-btn[data-v-8b3db3b9]:disabled:hover {
transform: none;
box-shadow: none;
}
.clear-btn[data-v-8b3db3b9] {
padding: 0.75rem 1.5rem;
opacity: 0.8;
}
/* Responsive */
@media (max-width: 768px) {
.traits-modal[data-v-8b3db3b9] {
width: 95%;
max-height: 90vh;
}
.form-actions[data-v-8b3db3b9] {
flex-direction: column;
}
.modal-header[data-v-8b3db3b9] {
padding: 1rem;
}
.modal-body[data-v-8b3db3b9] {
padding: 1rem;
}
}
.flag-rating-modal[data-v-cd660bcc] {
max-width: 650px;
width: 100%;
}
.modal-body[data-v-cd660bcc] {
padding: 2rem;
}
.modal-footer[data-v-cd660bcc] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.rating-summary[data-v-cd660bcc] {
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
padding: 1.25rem;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.player-info h3[data-v-cd660bcc] {
margin: 0 0 0.5rem 0;
color: var(--neon-blue);
font-size: 1.1rem;
}
.rating-details[data-v-cd660bcc] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.detail-separator[data-v-cd660bcc] {
color: rgba(255, 255, 255, 0.3);
}
.flag-reason-section[data-v-cd660bcc] {
margin-bottom: 1.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.flag-reason-section h3[data-v-cd660bcc] {
margin: 0 0 1rem 0;
font-size: 1rem;
color: rgba(255, 255, 255, 0.9);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
}
.reason-grid[data-v-cd660bcc] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
gap: 0.75rem;
}
.reason-card[data-v-cd660bcc] {
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 0.85rem 0.75rem;
cursor: pointer;
transition: all 0.2s ease;
text-align: center;
}
.reason-card[data-v-cd660bcc]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.reason-card.selected[data-v-cd660bcc] {
background: rgba(255, 126, 0, 0.2);
border-color: var(--neon-orange);
box-shadow: 0 0 20px rgba(255, 126, 0, 0.3);
}
.reason-icon[data-v-cd660bcc] {
font-size: 2rem;
margin-bottom: 0.5rem;
line-height: 1;
}
.reason-name[data-v-cd660bcc] {
font-weight: 600;
font-size: 0.85rem;
margin-bottom: 0.25rem;
color: rgba(255, 255, 255, 0.9);
}
.reason-description[data-v-cd660bcc] {
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.6);
line-height: 1.3;
}
.custom-reason-section[data-v-cd660bcc],
.notes-section[data-v-cd660bcc] {
margin-bottom: 1.5rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.custom-reason-section label[data-v-cd660bcc],
.notes-section label[data-v-cd660bcc] {
display: block;
margin-bottom: 0.75rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
font-size: 0.95rem;
}
.custom-reason-section textarea[data-v-cd660bcc],
.notes-section textarea[data-v-cd660bcc] {
width: 100%;
padding: 0.75rem;
box-sizing: border-box;
}
.char-count[data-v-cd660bcc] {
text-align: right;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 0.5rem;
}
.alert-info[data-v-cd660bcc] {
display: flex;
gap: 0.75rem;
padding: 1.25rem;
background: rgba(255, 191, 0, 0.08);
border-left: 3px solid var(--neon-yellow);
border-radius: 8px;
margin-bottom: 0.5rem;
}
.info-icon[data-v-cd660bcc] {
font-size: 1.25rem;
flex-shrink: 0;
line-height: 1;
}
.info-text[data-v-cd660bcc] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.8);
line-height: 1.5;
}
.modal-overlay[data-v-4251409c] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.85);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(8px);
}
.modal-content[data-v-4251409c] {
background: linear-gradient(135deg, rgba(20, 20, 40, 0.98), rgba(30, 30, 50, 0.98));
border-radius: 16px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
0 0 0 1px rgba(255, 255, 255, 0.1),
inset 0 1px 0 rgba(255, 255, 255, 0.1);
max-width: 600px;
width: 90%;
max-height: 85vh;
display: flex;
flex-direction: column;
overflow: hidden;
}
.modal-header[data-v-4251409c] {
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-header h2[data-v-4251409c] {
font-size: 1.5rem;
margin: 0;
}
.btn-close[data-v-4251409c] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0;
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
transition: all 0.2s ease;
}
.btn-close[data-v-4251409c]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--neon-red);
}
.modal-body[data-v-4251409c] {
padding: 2rem;
overflow-y: auto;
flex: 1;
}
.player-summary-card[data-v-4251409c] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.player-avatar[data-v-4251409c] {
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
font-weight: bold;
color: white;
flex-shrink: 0;
background-size: cover;
background-position: center;
}
.player-info[data-v-4251409c] {
flex: 1;
}
.player-name[data-v-4251409c] {
font-size: 1.25rem;
font-weight: bold;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.player-details[data-v-4251409c] {
display: flex;
gap: 1rem;
color: var(--text-secondary);
font-size: 0.875rem;
}
.time-range-selector[data-v-4251409c] {
margin-bottom: 1.5rem;
}
.time-range-selector label[data-v-4251409c] {
display: block;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.75rem;
font-size: 0.95rem;
}
.range-buttons[data-v-4251409c] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.5rem;
}
.range-btn[data-v-4251409c] {
padding: 0.625rem 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.875rem;
font-weight: 500;
}
.range-btn[data-v-4251409c]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.range-btn.active[data-v-4251409c] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
border-color: var(--neon-blue);
color: white;
box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}
.loading-state[data-v-4251409c] {
text-align: center;
padding: 3rem 2rem;
color: var(--text-secondary);
}
.spinner[data-v-4251409c] {
width: 40px;
height: 40px;
margin: 0 auto 1rem;
border: 3px solid rgba(255, 255, 255, 0.1);
border-top-color: var(--neon-blue);
border-radius: 50%;
animation: spin-4251409c 0.8s linear infinite;
}
@keyframes spin-4251409c {
to {
transform: rotate(360deg);
}
}
.preview-summary h3[data-v-4251409c] {
font-size: 1.1rem;
color: var(--text-primary);
margin-bottom: 1rem;
font-weight: 600;
}
.preview-grid[data-v-4251409c] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
.preview-item[data-v-4251409c] {
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.preview-label[data-v-4251409c] {
display: block;
font-size: 0.813rem;
color: var(--text-secondary);
margin-bottom: 0.25rem;
}
.preview-value[data-v-4251409c] {
display: block;
font-size: 1.25rem;
font-weight: bold;
color: var(--text-primary);
}
.preview-value.positive[data-v-4251409c] {
color: var(--neon-green);
}
.preview-value.negative[data-v-4251409c] {
color: var(--neon-red);
}
.modal-footer[data-v-4251409c] {
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
justify-content: flex-end;
gap: 1rem;
}
.btn-glass[data-v-4251409c],
.btn-neon[data-v-4251409c] {
padding: 0.75rem 1.5rem;
border-radius: 8px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.95rem;
}
.btn-glass[data-v-4251409c] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.btn-glass[data-v-4251409c]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.btn-neon[data-v-4251409c] {
border: none;
color: white;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.btn-neon.neon-blue[data-v-4251409c] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
}
.btn-neon.neon-blue[data-v-4251409c]:hover {
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(59, 130, 246, 0.4);
}
.btn-neon[data-v-4251409c]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none !important;
}
.animate-fade-in[data-v-4251409c] {
animation: fadeIn-4251409c 0.2s ease-out;
}
.animate-scale-in[data-v-4251409c] {
animation: scaleIn-4251409c 0.2s ease-out;
}
@keyframes fadeIn-4251409c {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-4251409c {
from {
transform: scale(0.95);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
/* ─── Modal sizing ─────────────────────────────────────────────────────────── */
.race-award-modal[data-v-6d293eb2] {
width: 500px;
max-width: 95vw;
max-height: 92vh;
overflow-y: auto;
}
/* ─── Header ───────────────────────────────────────────────────────────────── */
.modal-header[data-v-6d293eb2] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-6d293eb2] {
margin: 0;
font-size: 1.4rem;
font-weight: 700;
letter-spacing: 0.02em;
}
.text-gradient[data-v-6d293eb2] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.btn-close[data-v-6d293eb2] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.4rem;
cursor: pointer;
padding: 0.4rem 0.6rem;
border-radius: 8px;
transition: all 0.2s ease;
line-height: 1;
min-height: 44px;
min-width: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-6d293eb2]:hover:not(:disabled) {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.btn-close[data-v-6d293eb2]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
/* ─── Body & footer ────────────────────────────────────────────────────────── */
.modal-body[data-v-6d293eb2] {
padding: 1.5rem 2rem;
display: flex;
flex-direction: column;
gap: 1rem;
}
.modal-footer[data-v-6d293eb2] {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 0.75rem;
padding: 1.25rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* ─── Race banner ──────────────────────────────────────────────────────────── */
.race-banner[data-v-6d293eb2] {
background: rgba(0, 245, 255, 0.06);
border: 1px solid rgba(0, 245, 255, 0.25);
border-radius: 12px;
padding: 1rem 1.25rem;
display: flex;
align-items: center;
gap: 0.75rem;
flex-wrap: wrap;
}
.race-banner-label[data-v-6d293eb2] {
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.12);
padding: 0.2rem 0.5rem;
border-radius: 4px;
flex-shrink: 0;
}
.race-banner-name[data-v-6d293eb2] {
color: var(--text-primary);
font-weight: 600;
font-size: 1rem;
flex: 1;
min-width: 0;
}
.race-banner-time[data-v-6d293eb2] {
display: flex;
align-items: center;
gap: 0.4rem;
color: var(--text-secondary);
font-size: 0.85rem;
flex-shrink: 0;
}
.time-dot[data-v-6d293eb2] {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--neon-green);
box-shadow: 0 0 6px var(--neon-green);
flex-shrink: 0;
}
.time-dot.expiring[data-v-6d293eb2] {
background: var(--neon-orange);
box-shadow: 0 0 8px var(--neon-orange);
animation: pulse-6d293eb2 1.5s ease-in-out infinite;
}
@keyframes pulse-6d293eb2 {
0%, 100% { opacity: 1;
}
50% { opacity: 0.4;
}
}
/* ─── Info card ────────────────────────────────────────────────────────────── */
.info-card[data-v-6d293eb2] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
padding: 1rem;
}
.info-card-title[data-v-6d293eb2] {
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--text-muted);
margin-bottom: 0.6rem;
}
.info-row[data-v-6d293eb2] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.3rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.info-row[data-v-6d293eb2]:last-child {
border-bottom: none;
}
.info-label[data-v-6d293eb2] {
color: var(--text-secondary);
font-size: 0.875rem;
}
.info-value[data-v-6d293eb2] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
text-align: right;
}
.info-mono[data-v-6d293eb2] {
font-family: 'Courier New', Courier, monospace;
letter-spacing: 0.04em;
}
/* ─── Standing row ─────────────────────────────────────────────────────────── */
.standing-row[data-v-6d293eb2] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.6rem 1rem;
background: rgba(0, 245, 255, 0.04);
border: 1px solid rgba(0, 245, 255, 0.12);
border-radius: 8px;
font-size: 0.875rem;
color: var(--text-secondary);
}
.standing-divider[data-v-6d293eb2] {
color: rgba(255, 255, 255, 0.2);
}
.standing-item[data-v-6d293eb2] {
display: flex;
align-items: center;
gap: 0.35rem;
}
.new-entrant[data-v-6d293eb2] {
color: var(--text-muted);
font-style: italic;
justify-content: center;
}
/* ─── Field group ──────────────────────────────────────────────────────────── */
.field-group[data-v-6d293eb2] {
display: flex;
flex-direction: column;
gap: 0.4rem;
}
.field-label[data-v-6d293eb2] {
font-size: 0.8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--text-secondary);
}
.field-select[data-v-6d293eb2],
.field-input[data-v-6d293eb2] {
width: 100%;
font-size: 0.95rem;
}
.field-select[data-v-6d293eb2] {
appearance: none;
-webkit-appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1l5 6 5-6' stroke='%23808080' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 12px center;
padding-right: 36px;
cursor: pointer;
}
.field-select option[data-v-6d293eb2] {
background: #1a1a2e;
color: var(--text-primary);
}
.amount-input-wrapper[data-v-6d293eb2] {
position: relative;
}
.currency-symbol[data-v-6d293eb2] {
position: absolute;
left: 13px;
top: 50%;
transform: translateY(-50%);
color: var(--text-secondary);
font-size: 0.95rem;
pointer-events: none;
z-index: 1;
}
.amount-input[data-v-6d293eb2] {
padding-left: 28px !important;
}
/* Remove number input spinners */
.amount-input[data-v-6d293eb2]::-webkit-inner-spin-button,
.amount-input[data-v-6d293eb2]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.amount-input[type=number][data-v-6d293eb2] {
-moz-appearance: textfield;
}
/* ─── Points preview ───────────────────────────────────────────────────────── */
.points-preview[data-v-6d293eb2] {
text-align: center;
padding: 1.25rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 14px;
transition: all 0.3s ease;
}
.points-preview.active[data-v-6d293eb2] {
background: rgba(255, 215, 0, 0.05);
border-color: rgba(255, 215, 0, 0.3);
box-shadow: 0 0 20px rgba(255, 215, 0, 0.08);
}
.points-preview-label[data-v-6d293eb2] {
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
color: var(--text-muted);
margin-bottom: 0.4rem;
}
.points-preview-value[data-v-6d293eb2] {
font-size: 2.8rem;
font-weight: 800;
line-height: 1;
color: var(--text-secondary);
transition: color 0.3s ease;
letter-spacing: -0.02em;
}
.neon-gold-text[data-v-6d293eb2] {
color: var(--neon-gold) !important;
text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}
.points-preview-formula[data-v-6d293eb2] {
margin-top: 0.4rem;
font-size: 0.8rem;
color: var(--text-muted);
}
/* ─── Award summary (PIN step) ─────────────────────────────────────────────── */
.award-summary[data-v-6d293eb2] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
padding: 1rem;
}
.award-summary-title[data-v-6d293eb2] {
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--text-muted);
margin-bottom: 0.6rem;
}
/* ─── PIN section ──────────────────────────────────────────────────────────── */
.pin-section[data-v-6d293eb2] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.75rem;
padding: 0.5rem 0;
}
.pin-label[data-v-6d293eb2] {
color: var(--text-secondary);
font-size: 0.875rem;
font-weight: 500;
}
.pin-dots[data-v-6d293eb2] {
display: flex;
gap: 1rem;
}
.pin-dot[data-v-6d293eb2] {
width: 18px;
height: 18px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.08);
border: 2px solid rgba(255, 255, 255, 0.2);
transition: all 0.2s ease;
}
.pin-dot.filled[data-v-6d293eb2] {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.6);
}
.pin-dot.error[data-v-6d293eb2] {
background: var(--neon-red);
border-color: var(--neon-red);
box-shadow: 0 0 10px rgba(255, 7, 58, 0.6);
animation: shake-6d293eb2 0.5s ease-in-out;
}
@keyframes shake-6d293eb2 {
0%, 100% { transform: translateX(0);
}
25% { transform: translateX(-5px);
}
75% { transform: translateX(5px);
}
}
.pin-error-msg[data-v-6d293eb2] {
color: var(--neon-red);
font-size: 0.875rem;
text-align: center;
font-weight: 500;
}
/* ─── Keypad ───────────────────────────────────────────────────────────────── */
.keypad[data-v-6d293eb2] {
display: flex;
justify-content: center;
}
.keypad-grid[data-v-6d293eb2] {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.65rem;
max-width: 280px;
width: 100%;
}
.key-button[data-v-6d293eb2] {
width: 100%;
aspect-ratio: 1;
min-height: 72px;
background: var(--glass-bg, rgba(255, 255, 255, 0.05));
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid var(--glass-border, rgba(255, 255, 255, 0.1));
border-radius: 14px;
color: var(--text-primary);
font-size: 1.4rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
}
.key-button[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-1px);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
.key-button[data-v-6d293eb2]:active:not(:disabled) {
transform: translateY(0);
background: rgba(255, 255, 255, 0.15);
}
.key-button[data-v-6d293eb2]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.key-clear[data-v-6d293eb2] {
background: rgba(255, 7, 58, 0.08);
border-color: rgba(255, 7, 58, 0.3);
color: var(--neon-red);
font-size: 0.8rem;
font-weight: 600;
}
.key-clear[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(255, 7, 58, 0.18);
box-shadow: 0 6px 20px rgba(255, 7, 58, 0.2);
}
.key-backspace[data-v-6d293eb2] {
background: rgba(255, 102, 0, 0.08);
border-color: rgba(255, 102, 0, 0.3);
color: var(--neon-orange);
font-size: 1.1rem;
}
.key-backspace[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(255, 102, 0, 0.18);
box-shadow: 0 6px 20px rgba(255, 102, 0, 0.2);
}
/* ─── Error banner ─────────────────────────────────────────────────────────── */
.error-banner[data-v-6d293eb2] {
padding: 0.75rem 1rem;
background: rgba(255, 7, 58, 0.1);
border: 1px solid rgba(255, 7, 58, 0.4);
border-radius: 10px;
color: var(--neon-red);
font-size: 0.875rem;
text-align: center;
}
/* ─── Success state ────────────────────────────────────────────────────────── */
.success-body[data-v-6d293eb2] {
align-items: center;
text-align: center;
padding: 2.5rem 2rem;
gap: 1.25rem;
}
.success-icon[data-v-6d293eb2] {
width: 72px;
height: 72px;
border-radius: 50%;
background: rgba(57, 255, 20, 0.12);
border: 2px solid var(--neon-green);
box-shadow: 0 0 30px rgba(57, 255, 20, 0.3);
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
color: var(--neon-green);
animation: successPop-6d293eb2 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes successPop-6d293eb2 {
from { transform: scale(0); opacity: 0;
}
to { transform: scale(1); opacity: 1;
}
}
.success-headline[data-v-6d293eb2] {
font-size: 1.75rem;
font-weight: 800;
color: var(--neon-green);
text-shadow: 0 0 20px rgba(57, 255, 20, 0.4);
letter-spacing: -0.01em;
}
.success-sub[data-v-6d293eb2] {
font-size: 1rem;
color: var(--text-secondary);
line-height: 1.5;
}
.success-closing[data-v-6d293eb2] {
font-size: 0.8rem;
color: var(--text-muted);
}
/* ─── Footer buttons ───────────────────────────────────────────────────────── */
.btn-glass[data-v-6d293eb2] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 12px;
padding: 0.7rem 1.4rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.2s ease;
font-weight: 500;
font-size: 0.9rem;
min-height: 44px;
}
.btn-glass[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-1px);
}
.btn-glass[data-v-6d293eb2]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.btn-neon[data-v-6d293eb2] {
padding: 0.7rem 1.4rem;
border-radius: 12px;
border: 1px solid;
cursor: pointer;
transition: all 0.2s ease;
font-weight: 600;
font-size: 0.9rem;
display: flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
min-height: 44px;
min-width: 160px;
background: transparent;
}
.btn-neon.btn-primary[data-v-6d293eb2] {
color: var(--neon-blue);
border-color: var(--neon-blue);
background: rgba(0, 245, 255, 0.06);
}
.btn-neon.btn-primary[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(0, 245, 255, 0.14);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.25);
transform: translateY(-1px);
}
.btn-neon.btn-success[data-v-6d293eb2] {
color: var(--neon-green);
border-color: var(--neon-green);
background: rgba(57, 255, 20, 0.06);
}
.btn-neon.btn-success[data-v-6d293eb2]:hover:not(:disabled) {
background: rgba(57, 255, 20, 0.14);
box-shadow: 0 0 20px rgba(57, 255, 20, 0.25);
transform: translateY(-1px);
}
.btn-neon.btn-active-glow[data-v-6d293eb2] {
background: rgba(57, 255, 20, 0.16);
box-shadow: 0 0 24px rgba(57, 255, 20, 0.35);
}
.btn-neon[data-v-6d293eb2]:disabled {
opacity: 0.4;
cursor: not-allowed;
transform: none !important;
box-shadow: none !important;
}
/* ─── Spinner ──────────────────────────────────────────────────────────────── */
.loading-spinner[data-v-6d293eb2] {
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top-color: currentColor;
border-radius: 50%;
animation: spin-6d293eb2 0.7s linear infinite;
flex-shrink: 0;
}
@keyframes spin-6d293eb2 {
to { transform: rotate(360deg);
}
}
/* ─── Utility ──────────────────────────────────────────────────────────────── */
.neon-blue[data-v-6d293eb2] { color: var(--neon-blue);
}
.neon-green[data-v-6d293eb2] { color: var(--neon-green);
}
/* ─── Animations ───────────────────────────────────────────────────────────── */
.animate-fade-in[data-v-6d293eb2] {
animation: fadeIn-6d293eb2 0.25s ease-out;
}
.animate-scale-in[data-v-6d293eb2] {
animation: scaleIn-6d293eb2 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes fadeIn-6d293eb2 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes scaleIn-6d293eb2 {
from { opacity: 0; transform: scale(0.92);
}
to { opacity: 1; transform: scale(1);
}
}
/* ─── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 560px) {
.modal-body[data-v-6d293eb2] {
padding: 1.25rem;
}
.modal-header[data-v-6d293eb2],
.modal-footer[data-v-6d293eb2] {
padding: 1rem 1.25rem;
}
.race-award-modal[data-v-6d293eb2] {
max-height: 98vh;
}
.keypad-grid[data-v-6d293eb2] {
gap: 0.5rem;
}
.key-button[data-v-6d293eb2] {
min-height: 60px;
font-size: 1.2rem;
}
.points-preview-value[data-v-6d293eb2] {
font-size: 2.2rem;
}
}
.high-hand-modal[data-v-7ae15a81] {
width: 720px;
max-width: 96vw;
max-height: 92vh;
overflow-y: auto;
}
.modal-header[data-v-7ae15a81] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.25rem 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-7ae15a81] { margin: 0; font-size: 1.3rem; font-weight: 700;
}
.modal-body[data-v-7ae15a81] { padding: 1.25rem 1.5rem;
}
.modal-footer[data-v-7ae15a81] {
padding: 1rem 1.5rem;
display: flex;
justify-content: flex-end;
gap: 0.75rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Promo banner */
.promo-banner[data-v-7ae15a81] {
background: linear-gradient(135deg, rgba(0, 245, 255, 0.08), rgba(0, 245, 255, 0.02));
border: 1px solid rgba(0, 245, 255, 0.3);
border-radius: 8px;
padding: 0.75rem 1rem;
margin-bottom: 0.75rem;
}
.promo-banner.family-paigow[data-v-7ae15a81] {
background: linear-gradient(135deg, rgba(247, 220, 111, 0.10), rgba(247, 220, 111, 0.02));
border-color: rgba(247, 220, 111, 0.4);
}
.promo-banner-row[data-v-7ae15a81] {
display: flex; justify-content: space-between; align-items: baseline;
}
.promo-banner-row.sub[data-v-7ae15a81] { font-size: 0.85rem; opacity: 0.8; margin-top: 0.25rem;
}
.promo-name[data-v-7ae15a81] { font-weight: 700; font-size: 1.05rem;
}
.promo-prize[data-v-7ae15a81] { color: var(--neon-gold, gold); font-weight: 700;
}
.promo-min[data-v-7ae15a81] { font-style: italic;
}
.promo-family-badge[data-v-7ae15a81] { padding: 0.1rem 0.5rem; border-radius: 999px; background: rgba(255,255,255,0.08);
}
/* Window-context strip */
.window-strip[data-v-7ae15a81] {
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.25);
border-radius: 8px;
padding: 0.6rem 0.85rem;
margin-bottom: 0.75rem;
}
.window-strip.has-leader[data-v-7ae15a81] {
background: rgba(247, 220, 111, 0.08);
border-color: rgba(247, 220, 111, 0.4);
}
.window-strip.expiring[data-v-7ae15a81] {
border-color: rgba(255, 120, 80, 0.6);
animation: pulse-warn-7ae15a81 1.5s ease-in-out infinite;
}
.window-strip.empty[data-v-7ae15a81] {
background: rgba(255, 255, 255, 0.04);
border-style: dashed;
border-color: rgba(255, 255, 255, 0.2);
text-align: center;
font-style: italic;
opacity: 0.7;
}
.window-empty-text[data-v-7ae15a81] { font-size: 0.85rem;
}
@keyframes pulse-warn-7ae15a81 {
0%, 100% { box-shadow: 0 0 0 rgba(255, 120, 80, 0);
}
50% { box-shadow: 0 0 8px rgba(255, 120, 80, 0.4);
}
}
.window-strip-row[data-v-7ae15a81] {
display: flex; align-items: center; gap: 1rem;
font-size: 0.9rem;
}
.window-strip-row.leader-row[data-v-7ae15a81] {
margin-top: 0.4rem;
padding-top: 0.4rem;
border-top: 1px solid rgba(255, 255, 255, 0.06);
font-size: 0.85rem;
}
.window-num[data-v-7ae15a81] { font-weight: 700;
}
.window-timer[data-v-7ae15a81] {
font-family: 'Courier New', monospace;
font-weight: 700;
font-size: 1.05rem;
letter-spacing: 0.05em;
}
.window-timer.urgent[data-v-7ae15a81] { color: var(--neon-red, salmon);
}
.window-pool[data-v-7ae15a81] { margin-left: auto; font-weight: 700; color: var(--neon-gold, gold);
}
.carryover-badge[data-v-7ae15a81] {
margin-left: 0.4rem;
padding: 0.05rem 0.4rem;
background: rgba(247, 220, 111, 0.2);
border-radius: 999px;
font-size: 0.7rem;
font-weight: 700;
color: gold;
cursor: help;
}
.leader-summary[data-v-7ae15a81] { flex: 1;
}
.leader-must-beat[data-v-7ae15a81] {
margin-left: 0.3rem;
font-size: 0.75rem;
opacity: 0.65;
font-style: italic;
}
.leader-empty[data-v-7ae15a81] { opacity: 0.7; font-style: italic;
}
/* Player banner */
.player-banner[data-v-7ae15a81] {
display: flex; justify-content: space-between; align-items: center;
padding: 0.5rem 0.75rem;
background: rgba(255, 255, 255, 0.04);
border-radius: 6px;
margin-bottom: 1rem;
}
.player-id-snapshot[data-v-7ae15a81] { opacity: 0.6; font-size: 0.8rem; margin-left: 0.5rem;
}
.player-table[data-v-7ae15a81] { opacity: 0.85; font-size: 0.9rem;
}
/* Card grid */
.card-grid-section[data-v-7ae15a81] { margin-bottom: 1rem;
}
.section-label[data-v-7ae15a81] {
display: flex; justify-content: space-between; align-items: center;
font-size: 0.9rem; opacity: 0.85; margin-bottom: 0.5rem;
}
.select-progress[data-v-7ae15a81] {
font-weight: 700;
padding: 0.1rem 0.5rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
}
.select-progress.ready[data-v-7ae15a81] { background: rgba(0, 255, 0, 0.2); color: var(--neon-green, lime);
}
.card-grid[data-v-7ae15a81] {
display: grid;
grid-template-columns: repeat(13, 1fr);
gap: 4px;
}
.card-btn[data-v-7ae15a81] {
aspect-ratio: 2 / 3;
display: flex; flex-direction: column; align-items: center; justify-content: center;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 4px;
color: white;
cursor: pointer;
font-weight: 700;
padding: 2px;
transition: all 0.1s ease;
font-size: 0.85rem;
}
.card-btn[data-v-7ae15a81]:hover:not(:disabled) {
background: rgba(255, 255, 255, 0.12);
transform: translateY(-1px);
}
.card-btn.selected[data-v-7ae15a81] {
background: rgba(0, 245, 255, 0.25);
border-color: var(--neon-blue, #00f5ff);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.5);
}
.card-btn.disabled[data-v-7ae15a81], .card-btn[data-v-7ae15a81]:disabled {
opacity: 0.25; cursor: not-allowed; transform: none;
}
.card-rank[data-v-7ae15a81] { font-size: 1rem; line-height: 1;
}
.card-suit[data-v-7ae15a81] { font-size: 0.95rem; line-height: 1; margin-top: 1px;
}
.suit-h[data-v-7ae15a81], .suit-d[data-v-7ae15a81] { color: #ff6b6b;
}
.suit-s[data-v-7ae15a81], .suit-c[data-v-7ae15a81] { color: white;
}
/* Joker row */
.joker-row[data-v-7ae15a81] {
margin-top: 0.75rem;
display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem;
}
.joker-btn[data-v-7ae15a81] {
background: rgba(247, 220, 111, 0.15);
border: 1px solid rgba(247, 220, 111, 0.5);
border-radius: 6px;
color: white;
padding: 0.5rem 1rem;
cursor: pointer;
font-weight: 700;
position: relative;
}
.joker-btn.selected[data-v-7ae15a81] {
background: rgba(247, 220, 111, 0.35);
box-shadow: 0 0 10px rgba(247, 220, 111, 0.6);
}
.joker-btn.disabled[data-v-7ae15a81] { opacity: 0.4; cursor: not-allowed;
}
.badge-selected[data-v-7ae15a81] {
margin-left: 0.4rem;
background: rgba(0, 255, 0, 0.3);
padding: 0.1rem 0.35rem; border-radius: 999px;
font-size: 0.7rem;
}
.joker-acts-as[data-v-7ae15a81] { display: flex; align-items: center; gap: 0.5rem;
}
.acts-as-label[data-v-7ae15a81] { font-size: 0.85rem; opacity: 0.8;
}
.acts-as-select[data-v-7ae15a81] { padding: 0.25rem 0.4rem; font-size: 0.85rem;
}
/* Hand preview */
.hand-preview[data-v-7ae15a81] {
margin-top: 1rem;
padding: 0.75rem;
background: rgba(255,255,255,0.03);
border-radius: 6px;
}
.preview-cards[data-v-7ae15a81] { display: flex; gap: 0.5rem; align-items: stretch;
}
.preview-card[data-v-7ae15a81] {
flex: 0 0 64px; height: 90px;
background: rgba(255, 255, 255, 0.10);
border: 2px solid rgba(255, 255, 255, 0.25);
border-radius: 6px;
display: flex; flex-direction: column; align-items: center; justify-content: center;
font-size: 1.6rem; font-weight: 800;
cursor: pointer;
transition: all 0.15s ease;
position: relative;
}
.preview-card[data-v-7ae15a81]:hover { transform: translateY(-2px);
}
.preview-card.is-hole[data-v-7ae15a81] {
background: rgba(255, 215, 0, 0.18);
border-color: gold;
box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}
.preview-card.is-joker[data-v-7ae15a81] {
background: rgba(247, 220, 111, 0.20);
border-color: rgba(247, 220, 111, 0.7);
}
.preview-card.empty[data-v-7ae15a81] {
background: transparent;
border-style: dashed;
opacity: 0.35;
font-size: 1.5rem;
cursor: default;
}
.preview-rank[data-v-7ae15a81] { font-size: 1.4rem; line-height: 1;
}
.preview-suit[data-v-7ae15a81] { font-size: 1.4rem; line-height: 1; margin-top: 2px;
}
.hole-badge[data-v-7ae15a81] {
position: absolute; bottom: 2px; left: 2px; right: 2px;
background: gold; color: black; font-size: 0.55rem;
font-weight: 700; text-align: center; padding: 1px 0; border-radius: 2px;
}
.hole-hint[data-v-7ae15a81] {
margin-top: 0.5rem; font-size: 0.85rem; opacity: 0.85;
display: flex; justify-content: space-between; align-items: center;
}
.hole-count[data-v-7ae15a81] { padding: 0.1rem 0.5rem; border-radius: 999px; background: rgba(255,255,255,0.1); font-weight: 700;
}
.hole-count.ok[data-v-7ae15a81] { background: rgba(0,255,0,0.25); color: var(--neon-green, lime);
}
/* Low hand */
.low-hand-section[data-v-7ae15a81] { margin-top: 1rem;
}
.low-hand-toggle[data-v-7ae15a81] {
display: flex; align-items: center; gap: 0.5rem;
font-size: 0.9rem; cursor: pointer;
}
.low-hand-entry[data-v-7ae15a81] { margin-top: 0.5rem;
}
.section-label-sub[data-v-7ae15a81] { font-size: 0.85rem; opacity: 0.75; margin-bottom: 0.4rem;
}
.low-card-pickers[data-v-7ae15a81] { display: flex; gap: 0.4rem; align-items: center;
}
.low-card-pickers .input-glass[data-v-7ae15a81] { padding: 0.25rem 0.4rem; font-size: 0.85rem;
}
.low-divider[data-v-7ae15a81] { font-weight: 700; opacity: 0.5;
}
/* Verification */
.verification-section[data-v-7ae15a81] { margin-top: 1rem;
}
.verify-checkbox[data-v-7ae15a81] {
display: flex; align-items: center; gap: 0.5rem;
font-size: 0.9rem; cursor: pointer; margin-bottom: 0.5rem;
}
.notes-row[data-v-7ae15a81] { display: flex; align-items: center; gap: 0.5rem;
}
.notes-label[data-v-7ae15a81] { font-size: 0.85rem; opacity: 0.75; min-width: 110px;
}
.notes-input[data-v-7ae15a81] { flex: 1; padding: 0.4rem;
}
/* Status banner */
.status-banner[data-v-7ae15a81] {
margin-top: 1rem;
padding: 0.75rem 1rem;
border-radius: 6px;
display: flex; align-items: center; gap: 0.6rem;
font-weight: 600;
}
.status-banner.qualifies[data-v-7ae15a81] {
background: rgba(0, 255, 100, 0.12);
border: 1px solid rgba(0, 255, 100, 0.4);
color: var(--neon-green, lime);
}
.status-banner.below-min[data-v-7ae15a81] {
background: rgba(255, 80, 80, 0.12);
border: 1px solid rgba(255, 80, 80, 0.4);
color: var(--neon-red, salmon);
}
.status-banner.pending[data-v-7ae15a81] {
background: rgba(255, 255, 255, 0.05);
border: 1px dashed rgba(255, 255, 255, 0.15);
opacity: 0.7;
}
.status-icon[data-v-7ae15a81] { font-size: 1.2rem;
}
/* Error */
.error-banner[data-v-7ae15a81] {
margin-top: 1rem;
padding: 0.6rem 0.9rem;
background: rgba(255, 50, 50, 0.15);
border: 1px solid rgba(255, 50, 50, 0.4);
border-radius: 6px;
color: var(--neon-red, salmon);
font-size: 0.9rem;
}
/* PIN step (mirrors RaceAwardModal) */
.award-summary[data-v-7ae15a81] {
background: rgba(255,255,255,0.04);
border-radius: 6px;
padding: 0.75rem 1rem;
margin-bottom: 1.25rem;
}
.award-summary-title[data-v-7ae15a81] { font-weight: 700; margin-bottom: 0.5rem; opacity: 0.85;
}
.info-row[data-v-7ae15a81] { display: flex; justify-content: space-between; padding: 0.3rem 0; font-size: 0.95rem;
}
.info-label[data-v-7ae15a81] { opacity: 0.7;
}
.info-value[data-v-7ae15a81] { font-weight: 600;
}
.neon-gold-text[data-v-7ae15a81] { color: var(--neon-gold, gold);
}
.pin-section[data-v-7ae15a81] { text-align: center; margin-bottom: 1.5rem;
}
.pin-label[data-v-7ae15a81] { opacity: 0.85; margin-bottom: 0.75rem;
}
.pin-dots[data-v-7ae15a81] { display: flex; justify-content: center; gap: 1rem; margin-bottom: 0.5rem;
}
.pin-dot[data-v-7ae15a81] {
width: 18px; height: 18px;
border-radius: 50%; border: 2px solid rgba(255,255,255,0.3);
transition: all 0.15s;
}
.pin-dot.filled[data-v-7ae15a81] { background: var(--neon-blue, #00f5ff); border-color: var(--neon-blue, #00f5ff); box-shadow: 0 0 8px rgba(0,245,255,0.6);
}
.pin-dot.error[data-v-7ae15a81] { border-color: var(--neon-red, salmon); background: rgba(255,50,50,0.4);
}
.pin-error-msg[data-v-7ae15a81] { color: var(--neon-red, salmon); font-size: 0.9rem; margin-top: 0.4rem;
}
.keypad[data-v-7ae15a81] { display: flex; justify-content: center;
}
.keypad-grid[data-v-7ae15a81] {
display: grid; grid-template-columns: repeat(3, 80px); gap: 0.6rem;
}
.key-button[data-v-7ae15a81] {
height: 60px; font-size: 1.4rem; font-weight: 700;
background: rgba(255,255,255,0.06);
border: 1px solid rgba(255,255,255,0.15);
border-radius: 8px;
color: white;
cursor: pointer;
}
.key-button[data-v-7ae15a81]:hover:not(:disabled) { background: rgba(255,255,255,0.14);
}
.key-button[data-v-7ae15a81]:disabled { opacity: 0.35; cursor: not-allowed;
}
/* Success */
.success-body[data-v-7ae15a81] { text-align: center; padding: 2rem 1.5rem;
}
.success-icon[data-v-7ae15a81] { font-size: 4rem; margin-bottom: 0.75rem;
}
.success-headline[data-v-7ae15a81] { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; color: var(--neon-gold, gold);
}
.success-sub[data-v-7ae15a81] { opacity: 0.85; margin-bottom: 1.5rem; line-height: 1.4;
}
.not-leader[data-v-7ae15a81] { font-size: 0.85rem; opacity: 0.7;
}
.distribution-modal[data-v-69d8dbc7] {
max-width: 500px;
width: 100%;
}
.modal-body[data-v-69d8dbc7] {
padding: 1.5rem 2rem;
}
.modal-footer[data-v-69d8dbc7] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.25rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.split-grid[data-v-69d8dbc7] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
gap: 0.75rem;
}
.split-card[data-v-69d8dbc7] {
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.25rem 0.75rem;
cursor: pointer;
transition: all 0.2s ease;
text-align: center;
}
.split-card[data-v-69d8dbc7]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.split-card.selected[data-v-69d8dbc7] {
background: rgba(0, 255, 150, 0.15);
border-color: var(--neon-green);
box-shadow: 0 0 20px rgba(0, 255, 150, 0.25);
}
.split-card.current[data-v-69d8dbc7]:not(.selected) {
border-color: rgba(0, 170, 255, 0.4);
background: rgba(0, 170, 255, 0.08);
}
.split-count[data-v-69d8dbc7] {
font-size: 1.2rem;
font-weight: 700;
color: rgba(255, 255, 255, 0.95);
margin-bottom: 0.35rem;
}
.split-label[data-v-69d8dbc7] {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.5px;
color: rgba(255, 255, 255, 0.5);
min-height: 1em;
}
.split-card.current .split-label[data-v-69d8dbc7] {
color: var(--neon-blue);
}
.split-card.selected .split-label[data-v-69d8dbc7] {
color: var(--neon-green);
}
.reset-link[data-v-69d8dbc7] {
margin-top: 1rem;
text-align: center;
}
.btn-text[data-v-69d8dbc7] {
background: none;
border: none;
color: rgba(255, 255, 255, 0.6);
text-decoration: underline;
cursor: pointer;
font-size: 0.85rem;
padding: 0.25rem 0.5rem;
transition: color 0.2s;
}
.btn-text[data-v-69d8dbc7]:hover {
color: var(--neon-blue);
}
.btn-text[data-v-69d8dbc7]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.no-splits-message[data-v-69d8dbc7] {
text-align: center;
color: rgba(255, 255, 255, 0.5);
padding: 2rem;
font-size: 0.95rem;
}
.chip-tracker[data-v-0e7c5bfb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 16px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
/* Header */
.tracker-header[data-v-0e7c5bfb] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.tracker-header h3[data-v-0e7c5bfb] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.tracker-actions[data-v-0e7c5bfb] {
display: flex;
gap: 0.5rem;
}
/* Total Value */
.total-value[data-v-0e7c5bfb] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 2rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
}
.value-display[data-v-0e7c5bfb] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.value-display .label[data-v-0e7c5bfb] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.value-display .amount[data-v-0e7c5bfb] {
font-size: 1.5rem;
font-weight: 700;
}
.change-indicator[data-v-0e7c5bfb] {
font-size: 0.875rem;
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-weight: 600;
}
.change-indicator.positive[data-v-0e7c5bfb] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.change-indicator.negative[data-v-0e7c5bfb] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
/* Chip Grid */
.chip-grid[data-v-0e7c5bfb] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}
.chip-item[data-v-0e7c5bfb] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
transition: all 0.3s ease;
}
.chip-item[data-v-0e7c5bfb]:hover {
background: rgba(255, 255, 255, 0.05);
transform: translateY(-2px);
}
.chip-item.recent-change[data-v-0e7c5bfb] {
animation: chipUpdate-0e7c5bfb 0.5s ease;
border-color: var(--neon-blue);
}
.chip-item.low-stock[data-v-0e7c5bfb] {
border-color: var(--neon-orange);
}
.chip-item.out-of-stock[data-v-0e7c5bfb] {
border-color: var(--neon-red);
opacity: 0.6;
}
.chip-visual[data-v-0e7c5bfb] {
width: 60px;
height: 60px;
border-radius: 50%;
margin: 0 auto 1rem;
display: flex;
align-items: center;
justify-content: center;
position: relative;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}
.chip-value[data-v-0e7c5bfb] {
font-weight: 700;
font-size: 0.9rem;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}
.chip-pattern[data-v-0e7c5bfb] {
position: absolute;
inset: 4px;
border-radius: 50%;
border: 2px dashed;
opacity: 0.6;
}
.chip-info[data-v-0e7c5bfb] {
text-align: center;
}
.chip-count[data-v-0e7c5bfb] {
margin-bottom: 0.5rem;
}
.count-value[data-v-0e7c5bfb] {
font-size: 1.25rem;
font-weight: 700;
color: var(--text-primary);
}
.count-label[data-v-0e7c5bfb] {
font-size: 0.75rem;
color: var(--text-muted);
margin-left: 0.25rem;
}
.chip-amount[data-v-0e7c5bfb] {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 0.75rem;
}
.status-indicator[data-v-0e7c5bfb] {
font-size: 0.75rem;
padding: 0.25rem 0.5rem;
border-radius: 12px;
margin-bottom: 0.75rem;
}
.status-indicator.success[data-v-0e7c5bfb] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.status-indicator.warning[data-v-0e7c5bfb] {
background: rgba(255, 165, 0, 0.1);
color: var(--neon-orange);
}
.status-indicator.error[data-v-0e7c5bfb] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
.chip-actions[data-v-0e7c5bfb] {
display: flex;
justify-content: center;
gap: 0.5rem;
}
.action-btn[data-v-0e7c5bfb] {
width: 28px;
height: 28px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
}
.action-btn[data-v-0e7c5bfb]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.add-btn[data-v-0e7c5bfb]:hover {
border-color: var(--neon-green);
color: var(--neon-green);
}
.remove-btn[data-v-0e7c5bfb]:hover {
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.fill-btn[data-v-0e7c5bfb]:hover {
border-color: var(--neon-blue);
color: var(--neon-blue);
}
/* Player Tracking */
.player-chip-tracking[data-v-0e7c5bfb] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 1.5rem;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
.tracking-section h4[data-v-0e7c5bfb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.tracking-grid[data-v-0e7c5bfb] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 1rem;
}
.tracking-item[data-v-0e7c5bfb] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
}
.chip-mini[data-v-0e7c5bfb] {
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.6rem;
font-weight: 700;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.tracking-count[data-v-0e7c5bfb] {
color: var(--text-primary);
font-weight: 600;
font-size: 0.9rem;
}
.tracking-total[data-v-0e7c5bfb] {
color: var(--text-secondary);
font-weight: 600;
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 0.5rem;
}
.tracking-summary[data-v-0e7c5bfb] {
grid-column: 1 / -1;
text-align: center;
margin-top: 1rem;
}
.net-change[data-v-0e7c5bfb] {
font-size: 1.1rem;
font-weight: 700;
padding: 0.75rem;
border-radius: 8px;
}
.net-change.positive[data-v-0e7c5bfb] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.net-change.negative[data-v-0e7c5bfb] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
.net-change.neutral[data-v-0e7c5bfb] {
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
}
/* Modals */
.modal-overlay[data-v-0e7c5bfb] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(5px);
}
.modal-container[data-v-0e7c5bfb] {
background: rgba(20, 25, 40, 0.95);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
max-height: 90vh;
overflow-y: auto;
}
.history-modal[data-v-0e7c5bfb] {
width: 90%;
max-width: 800px;
}
.adjust-modal[data-v-0e7c5bfb] {
width: 90%;
max-width: 500px;
}
.modal-header[data-v-0e7c5bfb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-0e7c5bfb] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.modal-close[data-v-0e7c5bfb] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.modal-close[data-v-0e7c5bfb]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.modal-body[data-v-0e7c5bfb] {
padding: 1.5rem;
}
/* History Modal */
.history-filters[data-v-0e7c5bfb] {
display: flex;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.filter-btn[data-v-0e7c5bfb] {
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.85rem;
}
.filter-btn[data-v-0e7c5bfb]:hover {
background: rgba(255, 255, 255, 0.15);
color: var(--text-primary);
}
.filter-btn.active[data-v-0e7c5bfb] {
background: var(--neon-blue);
color: white;
border-color: var(--neon-blue);
}
.history-list[data-v-0e7c5bfb] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.history-entry[data-v-0e7c5bfb] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
}
.entry-icon[data-v-0e7c5bfb] {
font-size: 1.5rem;
width: 40px;
text-align: center;
}
.entry-content[data-v-0e7c5bfb] {
flex: 1;
}
.entry-description[data-v-0e7c5bfb] {
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.entry-meta[data-v-0e7c5bfb] {
display: flex;
gap: 1rem;
font-size: 0.8rem;
color: var(--text-muted);
}
.entry-amount[data-v-0e7c5bfb] {
font-weight: 600;
font-size: 1rem;
}
.entry-amount.positive[data-v-0e7c5bfb] {
color: var(--neon-green);
}
.entry-amount.negative[data-v-0e7c5bfb] {
color: var(--neon-red);
}
.entry-amount.neutral[data-v-0e7c5bfb] {
color: var(--text-secondary);
}
/* Adjust Modal */
.adjust-form[data-v-0e7c5bfb] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.form-group[data-v-0e7c5bfb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-0e7c5bfb] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.form-input[data-v-0e7c5bfb],
.form-select[data-v-0e7c5bfb],
.form-textarea[data-v-0e7c5bfb] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 1rem;
}
.form-input[data-v-0e7c5bfb]:focus,
.form-select[data-v-0e7c5bfb]:focus,
.form-textarea[data-v-0e7c5bfb]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.form-textarea[data-v-0e7c5bfb] {
resize: vertical;
min-height: 80px;
}
.form-summary[data-v-0e7c5bfb] {
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.summary-item[data-v-0e7c5bfb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
color: var(--text-secondary);
}
.summary-item.total[data-v-0e7c5bfb] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
margin-top: 0.5rem;
padding-top: 1rem;
font-weight: 600;
color: var(--text-primary);
}
.value-change.positive[data-v-0e7c5bfb] {
color: var(--neon-green);
}
.value-change.negative[data-v-0e7c5bfb] {
color: var(--neon-red);
}
.modal-actions[data-v-0e7c5bfb] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 2rem;
}
.cancel-btn[data-v-0e7c5bfb],
.confirm-btn[data-v-0e7c5bfb] {
padding: 0.75rem 1.5rem;
}
.confirm-btn[data-v-0e7c5bfb]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* Animations */
@keyframes chipUpdate-0e7c5bfb {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
/* Responsive */
@media (max-width: 768px) {
.chip-grid[data-v-0e7c5bfb] {
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.player-chip-tracking[data-v-0e7c5bfb] {
grid-template-columns: 1fr;
gap: 1rem;
}
.modal-container[data-v-0e7c5bfb] {
width: 95%;
margin: 1rem;
}
.history-filters[data-v-0e7c5bfb] {
flex-wrap: wrap;
}
.modal-actions[data-v-0e7c5bfb] {
flex-direction: column;
}
}
.theo-calculator[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.03);
border-radius: 16px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
/* Header */
.calculator-header[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 2rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.calculator-header h3[data-v-e4eb5e1e] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
/* Game Selector - Scrollable wrapper for many games */
.game-selector-wrapper[data-v-e4eb5e1e] {
flex: 1;
min-width: 0; /* Allow shrinking */
overflow-x: auto;
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
-webkit-overflow-scrolling: touch;
margin-left: 1rem; /* Spacing between title and buttons */
}
.game-selector-wrapper[data-v-e4eb5e1e]::-webkit-scrollbar {
height: 6px;
}
.game-selector-wrapper[data-v-e4eb5e1e]::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.05);
border-radius: 3px;
}
.game-selector-wrapper[data-v-e4eb5e1e]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 3px;
}
.game-selector-wrapper[data-v-e4eb5e1e]::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.3);
}
.game-selector[data-v-e4eb5e1e] {
display: flex;
gap: 0.375rem;
flex-wrap: nowrap;
min-width: max-content;
padding-bottom: 0.25rem; /* Space for scrollbar */
}
.game-btn[data-v-e4eb5e1e] {
padding: 0.375rem 0.625rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.75rem;
font-weight: 500;
white-space: nowrap;
flex-shrink: 0;
}
.game-btn[data-v-e4eb5e1e]:hover {
background: rgba(255, 255, 255, 0.15);
color: var(--text-primary);
transform: translateY(-1px);
}
.game-btn.active[data-v-e4eb5e1e] {
background: var(--neon-blue);
color: white;
border-color: var(--neon-blue);
box-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
/* Parameters */
.game-parameters[data-v-e4eb5e1e] {
margin-bottom: 2rem;
}
.parameter-grid[data-v-e4eb5e1e] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.param-group[data-v-e4eb5e1e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.param-group label[data-v-e4eb5e1e] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.param-input[data-v-e4eb5e1e],
.param-select[data-v-e4eb5e1e] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
font-size: 1rem;
}
.param-input[data-v-e4eb5e1e]:focus,
.param-select[data-v-e4eb5e1e]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.input-with-currency[data-v-e4eb5e1e] {
position: relative;
}
.currency-symbol[data-v-e4eb5e1e] {
position: absolute;
left: 0.75rem;
top: 50%;
transform: translateY(-50%);
color: var(--text-secondary);
font-weight: 600;
z-index: 1;
}
.input-with-currency .param-input[data-v-e4eb5e1e] {
padding-left: 2rem;
}
.bet-distribution[data-v-e4eb5e1e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.distribution-item[data-v-e4eb5e1e] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.distribution-item label[data-v-e4eb5e1e] {
min-width: 60px;
font-size: 0.85rem;
}
.percent-input[data-v-e4eb5e1e] {
width: 80px;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
text-align: center;
}
.bet-limit-notice[data-v-e4eb5e1e] {
font-size: 0.75rem;
color: var(--text-muted);
margin-top: 0.25rem;
font-style: italic;
}
.calculator-controls[data-v-e4eb5e1e] {
display: flex;
gap: 1rem;
justify-content: flex-end;
}
/* Results */
.results-section[data-v-e4eb5e1e] {
margin-bottom: 2rem;
}
.results-grid[data-v-e4eb5e1e] {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr;
gap: 1.5rem;
margin-bottom: 2rem;
}
.result-card[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.result-card.primary[data-v-e4eb5e1e] {
background: rgba(0, 245, 255, 0.05);
border-color: rgba(0, 245, 255, 0.2);
}
.result-header[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.result-header h4[data-v-e4eb5e1e] {
margin: 0;
color: var(--text-primary);
font-size: 1rem;
}
.result-confidence[data-v-e4eb5e1e] {
font-size: 0.75rem;
padding: 0.25rem 0.5rem;
border-radius: 12px;
font-weight: 600;
}
.confidence-high[data-v-e4eb5e1e] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
}
.confidence-medium[data-v-e4eb5e1e] {
background: rgba(255, 165, 0, 0.1);
color: var(--neon-orange);
}
.confidence-low[data-v-e4eb5e1e] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
}
.result-value[data-v-e4eb5e1e] {
display: flex;
align-items: baseline;
gap: 0.25rem;
margin-bottom: 1rem;
}
.result-value .currency[data-v-e4eb5e1e] {
font-size: 1.25rem;
color: var(--text-secondary);
}
.result-value .amount[data-v-e4eb5e1e] {
font-size: 2.5rem;
font-weight: 700;
color: var(--neon-blue);
line-height: 1;
}
.result-value.small .amount[data-v-e4eb5e1e] {
font-size: 1.75rem;
}
.result-details[data-v-e4eb5e1e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.detail-item[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.875rem;
}
.detail-item span[data-v-e4eb5e1e]:first-child {
color: var(--text-secondary);
}
.detail-item span[data-v-e4eb5e1e]:last-child {
color: var(--text-primary);
font-weight: 500;
}
.result-subtitle[data-v-e4eb5e1e] {
color: var(--text-muted);
font-size: 0.8rem;
margin-top: 0.5rem;
}
.result-range[data-v-e4eb5e1e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.range-item[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.875rem;
}
.range-label[data-v-e4eb5e1e] {
color: var(--text-secondary);
}
.range-value.positive[data-v-e4eb5e1e] {
color: var(--neon-green);
font-weight: 600;
}
.range-value.negative[data-v-e4eb5e1e] {
color: var(--neon-red);
font-weight: 600;
}
/* Volatility Chart */
.volatility-section[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.volatility-section h4[data-v-e4eb5e1e] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.volatility-chart[data-v-e4eb5e1e] {
position: relative;
margin-bottom: 1rem;
}
.volatility-bar[data-v-e4eb5e1e] {
height: 60px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(90deg, var(--neon-red) 0%, var(--neon-orange) 25%, var(--neon-green) 75%, var(--neon-blue) 100%);
border-radius: 8px;
opacity: 0.3;
}
.probability-range[data-v-e4eb5e1e] {
position: absolute;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
backdrop-filter: blur(2px);
}
.range-99[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.1);
}
.range-95[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.15);
}
.range-68[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.2);
}
.range-label[data-v-e4eb5e1e] {
font-size: 0.75rem;
color: var(--text-primary);
font-weight: 600;
}
.expected-line[data-v-e4eb5e1e] {
position: absolute;
left: 50%;
top: 0;
bottom: 0;
width: 2px;
background: var(--neon-blue);
transform: translateX(-50%);
}
.volatility-labels[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 0.8rem;
margin-top: 0.5rem;
}
.volatility-loss[data-v-e4eb5e1e] {
color: var(--neon-red);
}
.volatility-expected[data-v-e4eb5e1e] {
color: var(--neon-blue);
font-weight: 600;
}
.volatility-win[data-v-e4eb5e1e] {
color: var(--neon-green);
}
/* History */
.history-section[data-v-e4eb5e1e] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.history-header[data-v-e4eb5e1e] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.history-header h4[data-v-e4eb5e1e] {
margin: 0;
color: var(--text-primary);
}
.history-list[data-v-e4eb5e1e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.history-item[data-v-e4eb5e1e] {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 1rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
cursor: pointer;
transition: background 0.3s ease;
font-size: 0.875rem;
}
.history-item[data-v-e4eb5e1e]:hover {
background: rgba(255, 255, 255, 0.05);
}
.history-game[data-v-e4eb5e1e] {
color: var(--text-primary);
font-weight: 500;
}
.history-params[data-v-e4eb5e1e] {
color: var(--text-secondary);
}
.history-result[data-v-e4eb5e1e] {
color: var(--neon-orange);
font-weight: 600;
}
.history-time[data-v-e4eb5e1e] {
color: var(--text-muted);
text-align: right;
}
/* Responsive */
@media (max-width: 1200px) {
.results-grid[data-v-e4eb5e1e] {
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.result-card.primary[data-v-e4eb5e1e] {
grid-column: 1 / -1;
}
}
@media (max-width: 1024px) {
.calculator-header[data-v-e4eb5e1e] {
flex-direction: column;
gap: 0.75rem;
align-items: stretch;
}
.game-selector-wrapper[data-v-e4eb5e1e] {
width: 100%;
margin-left: 0; /* Remove margin when stacked */
}
.game-selector[data-v-e4eb5e1e] {
gap: 0.25rem;
}
.game-btn[data-v-e4eb5e1e] {
padding: 0.35rem 0.5rem;
font-size: 0.7rem;
}
}
@media (max-width: 768px) {
.calculator-header[data-v-e4eb5e1e] {
flex-direction: column;
gap: 0.75rem;
align-items: stretch;
}
.calculator-header h3[data-v-e4eb5e1e] {
font-size: 1rem;
margin-bottom: 0;
}
.game-selector[data-v-e4eb5e1e] {
gap: 0.25rem;
}
.game-btn[data-v-e4eb5e1e] {
padding: 0.3rem 0.4rem;
font-size: 0.65rem;
border-radius: 4px;
}
.parameter-grid[data-v-e4eb5e1e] {
grid-template-columns: 1fr;
}
.results-grid[data-v-e4eb5e1e] {
grid-template-columns: 1fr;
}
.calculator-controls[data-v-e4eb5e1e] {
justify-content: stretch;
}
.calculator-controls button[data-v-e4eb5e1e] {
flex: 1;
}
.history-item[data-v-e4eb5e1e] {
grid-template-columns: 1fr;
gap: 0.5rem;
}
.history-time[data-v-e4eb5e1e] {
text-align: left;
}
}
/* Front Notes styling within Pit Station */
.front-notes-block[data-v-693a50fb] {
margin-top: 1rem;
background: rgba(138, 43, 226, 0.08);
border: 1px solid rgba(138, 43, 226, 0.35);
border-radius: 10px;
padding: 0.75rem;
}
.front-notes-header[data-v-693a50fb] {
color: var(--neon-purple);
font-weight: 700;
margin-bottom: 0.5rem;
}
.front-notes-list[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.front-note-item[data-v-693a50fb] {
display: grid;
grid-template-columns: auto 1fr auto;
gap: 0.5rem 0.75rem;
align-items: baseline;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
padding: 0.5rem 0.75rem;
}
.front-note-type[data-v-693a50fb] {
color: var(--text-secondary);
font-weight: 600;
}
.front-note-text[data-v-693a50fb] {
color: var(--text-primary);
}
.front-note-meta[data-v-693a50fb] {
color: var(--text-muted);
font-size: 0.8rem;
}
/* Flag Alert Banner */
.flag-alert-banner[data-v-693a50fb] {
margin-top: 1rem;
margin-bottom: 1.5rem;
background: linear-gradient(135deg, rgba(255, 126, 0, 0.15), rgba(255, 69, 0, 0.1));
border: 2px solid var(--neon-orange);
border-radius: 12px;
padding: 1rem;
box-shadow: 0 0 20px rgba(255, 126, 0, 0.3), inset 0 0 10px rgba(255, 126, 0, 0.1);
animation: flagPulse-693a50fb 2s ease-in-out infinite;
}
@keyframes flagPulse-693a50fb {
0%,
100% {
box-shadow: 0 0 20px rgba(255, 126, 0, 0.3), inset 0 0 10px rgba(255, 126, 0, 0.1);
}
50% {
box-shadow: 0 0 30px rgba(255, 126, 0, 0.5), inset 0 0 15px rgba(255, 126, 0, 0.15);
}
}
.flag-alert-header[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.flag-icon-large[data-v-693a50fb] {
font-size: 1.8rem;
filter: drop-shadow(0 0 8px rgba(255, 126, 0, 0.6));
}
.flag-title[data-v-693a50fb] {
font-size: 1.1rem;
font-weight: 700;
color: var(--neon-orange);
text-transform: uppercase;
letter-spacing: 0.5px;
text-shadow: 0 0 10px rgba(255, 126, 0, 0.5);
}
.flag-details[data-v-693a50fb] {
margin-bottom: 0.75rem;
padding: 0.75rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 8px;
border: 1px solid rgba(255, 126, 0, 0.2);
}
.flag-reason[data-v-693a50fb] {
color: var(--text-primary);
font-size: 0.95rem;
margin-bottom: 0.5rem;
}
.flag-reason strong[data-v-693a50fb] {
color: var(--neon-orange);
}
.flag-meta[data-v-693a50fb] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
color: var(--text-secondary);
}
.flag-actions[data-v-693a50fb] {
display: flex;
justify-content: flex-end;
}
.flag-actions .btn-glass[data-v-693a50fb] {
background: rgba(34, 197, 94, 0.2);
border-color: rgba(34, 197, 94, 0.5);
color: var(--neon-green);
font-weight: 600;
}
.flag-actions .btn-glass[data-v-693a50fb]:hover {
background: rgba(34, 197, 94, 0.3);
border-color: var(--neon-green);
box-shadow: 0 0 15px rgba(34, 197, 94, 0.4);
}
.pit-station[data-v-693a50fb] {
min-height: 100vh;
padding: 1rem;
max-width: 1800px;
margin: 0 auto;
}
/* Breadcrumb Navigation */
.breadcrumb-nav[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.breadcrumb-link[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
border-radius: 6px;
text-decoration: none;
color: var(--text-secondary);
transition: all 0.3s ease;
background: rgba(255, 255, 255, 0.05);
}
.breadcrumb-link[data-v-693a50fb]:hover {
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
transform: translateY(-1px);
}
.breadcrumb-icon[data-v-693a50fb] {
font-size: 1rem;
}
.breadcrumb-text[data-v-693a50fb] {
font-size: 0.9rem;
font-weight: 500;
}
.breadcrumb-separator[data-v-693a50fb] {
color: var(--text-muted);
font-size: 1.2rem;
font-weight: 300;
}
.breadcrumb-current[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
font-size: 0.95rem;
}
/* Header */
.pit-station-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 2rem;
gap: 2rem;
}
.filter-controls .filter-group[data-v-693a50fb] {
display: flex;
gap: 2rem;
align-items: end;
}
.filter-dropdown[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.filter-dropdown label[data-v-693a50fb] {
font-size: 0.9rem;
font-weight: 500;
color: var(--text-secondary);
}
.filter-select[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 0.75rem 1rem;
color: var(--text-primary);
font-size: 0.95rem;
min-width: 140px;
transition: all 0.3s ease;
}
.filter-select[data-v-693a50fb]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.filter-select option[data-v-693a50fb] {
background: var(--bg-secondary);
color: var(--text-primary);
}
.pit-station-title[data-v-693a50fb] {
text-align: center;
white-space: nowrap;
}
.pit-station-title h1[data-v-693a50fb] {
font-size: 1.75rem;
margin: 0;
}
.subtitle[data-v-693a50fb] {
color: var(--text-secondary);
margin: 0.5rem 0 0 0;
}
.header-actions[data-v-693a50fb] {
display: flex;
gap: 1rem;
align-items: center;
}
/* Alerts System */
.alerts-section[data-v-693a50fb] {
position: relative;
display: flex;
align-items: center;
gap: 0.5rem;
}
.alert-indicator[data-v-693a50fb] {
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
font-weight: 700;
color: white;
position: relative;
animation: pulse-693a50fb 2s infinite;
}
.alert-indicator.priority-high[data-v-693a50fb] {
background: var(--neon-red);
}
.alert-indicator.priority-warning[data-v-693a50fb] {
background: var(--neon-orange);
}
.alert-indicator.priority-info[data-v-693a50fb] {
background: var(--neon-blue);
}
.alert-toggle[data-v-693a50fb] {
padding: 0.5rem 0.75rem;
font-size: 0.85rem;
}
.alerts-dropdown[data-v-693a50fb] {
position: absolute;
top: 100%;
right: 0;
width: 350px;
background: rgba(20, 25, 40, 0.98);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
z-index: 100;
margin-top: 0.5rem;
max-height: 400px;
overflow-y: auto;
}
.alert-item[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: background 0.3s ease;
}
.alert-item[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.05);
}
.alert-item[data-v-693a50fb]:last-child {
border-bottom: none;
}
.alert-item.high[data-v-693a50fb] {
border-left: 3px solid var(--neon-red);
}
.alert-item.warning[data-v-693a50fb] {
border-left: 3px solid var(--neon-orange);
}
.alert-item.info[data-v-693a50fb] {
border-left: 3px solid var(--neon-blue);
}
.alert-icon[data-v-693a50fb] {
font-size: 1.25rem;
flex-shrink: 0;
}
.alert-content[data-v-693a50fb] {
flex: 1;
}
.alert-message[data-v-693a50fb] {
color: var(--text-primary);
font-size: 0.875rem;
margin-bottom: 0.25rem;
}
.alert-time[data-v-693a50fb] {
color: var(--text-muted);
font-size: 0.75rem;
}
.alert-dismiss[data-v-693a50fb] {
background: none;
border: none;
color: var(--text-muted);
font-size: 1.25rem;
cursor: pointer;
padding: 0;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.alert-dismiss[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.alert-more[data-v-693a50fb] {
padding: 0.75rem 1rem;
color: var(--text-secondary);
font-size: 0.8rem;
text-align: center;
background: rgba(255, 255, 255, 0.02);
}
@keyframes pulse-693a50fb {
0% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(1.1);
opacity: 0.8;
}
100% {
transform: scale(1);
opacity: 1;
}
}
/* Main Content - Dual Pane */
.pit-station-content[data-v-693a50fb] {
display: grid;
grid-template-columns: 1fr 1.2fr;
gap: 2rem;
height: calc(100vh - 200px);
}
/* Left Pane: Active Rating Slips */
.active-rating-slips-pane[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.05);
border-radius: 16px;
padding: 1.5rem;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
overflow: hidden;
display: flex;
flex-direction: column;
}
.pane-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.pane-header h3[data-v-693a50fb] {
margin: 0;
color: var(--text-primary);
}
.count-badge[data-v-693a50fb] {
background: var(--neon-blue);
color: var(--bg-primary);
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-weight: 600;
font-size: 0.875rem;
}
.rating-slips-list[data-v-693a50fb] {
flex: 1;
overflow-y: scroll;
overflow-x: hidden;
display: flex;
flex-direction: column;
gap: 0.4rem;
padding-right: 0.5rem;
padding-top: 0.5rem;
}
/* Rating Slip Items - Glassmorphism Design */
.rating-slip-item[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.35rem;
padding: 0.4rem 0.6rem;
min-height: 95px;
width: 100%;
max-width: 100%;
background: linear-gradient(135deg,
rgba(255, 255, 255, 0.08) 0%,
rgba(255, 255, 255, 0.03) 50%,
rgba(255, 255, 255, 0.01) 100%);
border-radius: 16px;
cursor: pointer;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
border: 1px solid rgba(255, 255, 255, 0.12);
margin-bottom: 0;
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
position: relative;
overflow: hidden;
box-shadow:
0 1px 2px rgba(0, 0, 0, 0.08),
0 0 0 1px rgba(255, 255, 255, 0.08),
inset 0 1px 0 rgba(255, 255, 255, 0.12);
flex-shrink: 1;
}
.rating-slip-item[data-v-693a50fb]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 1px;
background: linear-gradient(90deg,
transparent 0%,
rgba(255, 255, 255, 0.3) 50%,
transparent 100%);
}
.rating-slip-item[data-v-693a50fb]:hover {
background: linear-gradient(135deg,
rgba(255, 255, 255, 0.12) 0%,
rgba(255, 255, 255, 0.06) 50%,
rgba(255, 255, 255, 0.03) 100%);
transform: translateY(-4px);
box-shadow:
0 4px 16px rgba(0, 245, 255, 0.15),
0 0 0 1px rgba(0, 245, 255, 0.3),
inset 0 1px 0 rgba(255, 255, 255, 0.2);
border-color: rgba(255, 255, 255, 0.25);
}
.rating-slip-item.selected[data-v-693a50fb] {
background: linear-gradient(135deg,
rgba(0, 245, 255, 0.2) 0%,
rgba(0, 245, 255, 0.08) 50%,
rgba(0, 245, 255, 0.04) 100%);
border-color: var(--neon-blue);
box-shadow:
0 0 24px rgba(0, 245, 255, 0.25),
0 4px 12px rgba(0, 0, 0, 0.1),
inset 0 1px 0 rgba(255, 255, 255, 0.15);
transform: translateY(-4px);
}
.rating-slip-item.selected[data-v-693a50fb]::before {
background: linear-gradient(90deg,
transparent 0%,
var(--neon-blue) 50%,
transparent 100%);
height: 2px;
}
.rating-slip-item.stale[data-v-693a50fb] {
border-color: rgba(255, 193, 7, 0.6);
background: linear-gradient(135deg,
rgba(255, 193, 7, 0.15) 0%,
rgba(255, 193, 7, 0.05) 50%,
rgba(255, 193, 7, 0.02) 100%);
}
.rating-slip-item.stale[data-v-693a50fb]::before {
background: linear-gradient(90deg,
transparent 0%,
rgba(255, 193, 7, 0.6) 50%,
transparent 100%);
height: 2px;
}
.rating-slip-item.paused[data-v-693a50fb] {
background: linear-gradient(135deg,
rgba(255, 152, 0, 0.18) 0%,
rgba(255, 152, 0, 0.08) 50%,
rgba(255, 152, 0, 0.03) 100%);
border-color: rgba(255, 152, 0, 0.6);
}
.rating-slip-item.paused[data-v-693a50fb]::before {
background: linear-gradient(90deg,
transparent 0%,
rgba(255, 152, 0, 0.8) 50%,
transparent 100%);
height: 2px;
}
.player-info .player-name.has-messages[data-v-693a50fb] {
color: #ffc107;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.player-info .player-name.paused[data-v-693a50fb] {
color: #ff9800;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.comp-flag[data-v-693a50fb] {
margin-left: .4rem;
font-size: .7rem;
font-weight: 700;
padding: .15rem .35rem;
border-radius: .35rem;
border: 1px solid transparent;
display: inline-block;
text-align: center;
min-width: 38px;
white-space: nowrap;
}
/* Red badge — appears next to selected player name when Player.flagHistory has unacknowledged entries */
.player-flag-history-badge[data-v-693a50fb] {
margin-left: .5rem;
padding: .25rem .55rem;
background: linear-gradient(135deg, #ff073a, #b8002a);
color: #ffffff;
border: 1px solid rgba(255, 7, 58, 0.55);
border-radius: 999px;
font-size: .78rem;
font-weight: 700;
letter-spacing: .3px;
cursor: pointer;
box-shadow: 0 0 10px rgba(255, 7, 58, 0.45);
transition: transform .15s ease, box-shadow .15s ease;
white-space: nowrap;
vertical-align: middle;
}
.player-flag-history-badge[data-v-693a50fb]:hover {
transform: translateY(-1px);
box-shadow: 0 0 16px rgba(255, 7, 58, 0.7);
}
.player-flag-history-badge[data-v-693a50fb]:active {
transform: translateY(0);
}
.comp-flag.ctr[data-v-693a50fb] {
color: #ea3943;
background: rgba(234, 57, 67, .15);
border-color: rgba(234, 57, 67, .35);
min-width: 42px;
}
.comp-flag.ctr.verified[data-v-693a50fb] {
color: #16c784;
background: rgba(22, 199, 132, .15);
border-color: rgba(22, 199, 132, .35);
}
.comp-flag.ctr.unverified[data-v-693a50fb] {
color: #ea3943;
background: rgba(234, 57, 67, .25);
border-color: rgba(234, 57, 67, .5);
animation: pulse-warning-693a50fb 2s infinite;
}
.comp-flag.mtl[data-v-693a50fb] {
color: #16c784;
background: rgba(22, 199, 132, .15);
border-color: rgba(22, 199, 132, .35);
min-width: 42px;
}
.comp-flag.mtl.verified[data-v-693a50fb] {
color: #16c784;
background: rgba(22, 199, 132, .15);
border-color: rgba(22, 199, 132, .35);
}
.comp-flag.mtl.unverified[data-v-693a50fb] {
color: #ea3943;
background: rgba(234, 57, 67, .25);
border-color: rgba(234, 57, 67, .5);
animation: pulse-warning-693a50fb 2s infinite;
}
.comp-flag.approaching[data-v-693a50fb] {
color: #ffc107;
background: rgba(255, 193, 7, .15);
border-color: rgba(255, 193, 7, .35);
min-width: 48px;
}
.comp-flag.unrated[data-v-693a50fb] {
color: #ff9800;
background: rgba(255, 152, 0, .15);
border-color: rgba(255, 152, 0, .35);
animation: pulse-693a50fb 2s infinite;
min-width: 90px;
}
.pause-indicator[data-v-693a50fb] {
margin-left: 0.5rem;
font-size: 0.9em;
animation: pulse-693a50fb 1.5s infinite;
}
.flag-indicator[data-v-693a50fb] {
margin-left: 0.5rem;
font-size: 1.1em;
cursor: help;
animation: wave-693a50fb 2s ease-in-out infinite;
filter: drop-shadow(0 0 8px rgba(255, 126, 0, 0.8));
display: inline-block;
}
@keyframes wave-693a50fb {
0%,
100% {
transform: rotate(0deg);
}
25% {
transform: rotate(-15deg);
}
75% {
transform: rotate(15deg);
}
}
.rating-slip-item.flagged[data-v-693a50fb] {
border-left: 4px solid var(--neon-orange);
background: linear-gradient(90deg, rgba(255, 126, 0, 0.12), rgba(255, 126, 0, 0.05));
box-shadow: inset 0 0 20px rgba(255, 126, 0, 0.08);
}
@keyframes pulse-693a50fb {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.5;
}
}
/* Rating Slip Item Content Layout */
.rating-slip-item-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 0.35rem;
min-height: 28px;
flex-shrink: 1;
}
.player-info[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.25rem;
flex: 1;
min-width: 0;
flex-shrink: 0;
}
.player-name[data-v-693a50fb] {
font-weight: 700;
color: var(--text-primary);
font-size: 1rem;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.3rem 0.4rem;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.player-name.has-messages[data-v-693a50fb] {
color: var(--neon-yellow);
}
.player-name.paused[data-v-693a50fb] {
color: var(--neon-orange);
}
/* Live "time on floor this gaming day" chip beside the player's name */
.player-playtime[data-v-693a50fb] {
display: inline-flex;
align-items: center;
gap: 0.2rem;
flex-shrink: 0;
font-size: 0.72rem;
font-weight: 600;
color: var(--text-muted);
font-family: 'JetBrains Mono', 'Courier New', monospace;
background: rgba(255, 255, 255, 0.05);
padding: 0.1rem 0.4rem;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.08);
white-space: nowrap;
letter-spacing: 0.3px;
}
/* Long-session escalation reuses the duration palette (3h+ blue, 5h+ purple) */
.player-playtime.duration-blue[data-v-693a50fb] {
color: var(--neon-blue);
border-color: rgba(0, 245, 255, 0.35);
text-shadow: 0 0 6px rgba(0, 245, 255, 0.25);
}
.player-playtime.duration-purple[data-v-693a50fb] {
color: var(--neon-purple);
border-color: rgba(138, 43, 226, 0.4);
text-shadow: 0 0 6px rgba(138, 43, 226, 0.3);
}
/* Wager chip — replaces the old (useless-in-list) card number.
One-tap path to the canonical Update Average Bet modal. */
.wager-chip[data-v-693a50fb] {
display: inline-flex;
align-items: center;
gap: 0.35rem;
width: fit-content;
margin-top: 6px;
font-size: 1rem;
font-weight: 700;
font-family: 'JetBrains Mono', 'Courier New', monospace;
color: var(--text-primary);
background: linear-gradient(135deg, rgba(255, 215, 0, 0.14), rgba(255, 215, 0, 0.05));
border: 1px solid rgba(255, 215, 0, 0.3);
padding: 0.42rem 0.8rem;
border-radius: 10px;
cursor: pointer;
backdrop-filter: blur(10px);
transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.wager-chip[data-v-693a50fb]:hover {
transform: translateY(-1px) scale(1.03);
background: linear-gradient(135deg, rgba(255, 215, 0, 0.22), rgba(255, 215, 0, 0.08));
border-color: rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.25);
}
.wager-chip[data-v-693a50fb]:active {
transform: translateY(0) scale(0.99);
}
/* Magnitude heat — subtle, escalates only at the high end so it reads as signal not noise */
.wager-chip.wager-mid[data-v-693a50fb] {
border-color: rgba(81, 207, 102, 0.4);
color: #b8f5c4;
}
.wager-chip.wager-high[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.28), rgba(255, 165, 0, 0.1));
border-color: rgba(255, 200, 0, 0.6);
color: #ffe89a;
box-shadow: 0 0 10px rgba(255, 200, 0, 0.2);
}
/* Unrated — the chip IS the call-to-action to rate the player */
.wager-chip.unrated[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(255, 170, 0, 0.18), rgba(255, 170, 0, 0.06));
border-color: rgba(255, 170, 0, 0.55);
color: var(--neon-orange, #ffae00);
animation: wager-unrated-pulse-693a50fb 2s ease-in-out infinite;
}
@keyframes wager-unrated-pulse-693a50fb {
0%,
100% {
box-shadow: 0 0 0 rgba(255, 170, 0, 0);
}
50% {
box-shadow: 0 0 12px rgba(255, 170, 0, 0.35);
}
}
/* Unverified — the system auto-assigned this bet from the player's tier and no
supervisor has confirmed it. Dashed amber border + "~" prefix reads as "estimate,
not a real rating." Clears to a solid chip the moment a human saves. */
.wager-chip.unverified[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(255, 200, 0, 0.14), rgba(255, 200, 0, 0.05));
border: 2px dashed rgba(255, 200, 0, 0.85);
color: #ffd84d;
}
.wager-chip.unverified[data-v-693a50fb]:hover {
background: linear-gradient(135deg, rgba(255, 200, 0, 0.22), rgba(255, 200, 0, 0.08));
border-color: rgba(255, 210, 0, 1);
box-shadow: 0 0 12px rgba(255, 200, 0, 0.3);
}
/* Implausible — bet doesn't reconcile with the money/time on the table. Solid red ring +
a gentle pulse so it stands out even unhovered. Independent of provenance (a fat-fingered
human entry trips this too). */
.wager-chip.implausible[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(255, 70, 70, 0.16), rgba(255, 70, 70, 0.05));
border: 2px solid rgba(255, 80, 80, 0.85);
color: #ff9d9d;
animation: wager-check-pulse-693a50fb 1.8s ease-in-out infinite;
}
.wager-chip.implausible[data-v-693a50fb]:hover {
border-color: rgba(255, 90, 90, 1);
box-shadow: 0 0 16px rgba(255, 70, 70, 0.45);
}
/* Over-tier — rated >3× this player's tier-expected avg bet. A heuristic caution (orange), distinct
from the amber VERIFY (unconfirmed estimate) and softer than the red CHECK (objective vs. the
money). No pulse — the pulse is reserved for the objective implausible state. */
.wager-chip.over-tier[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(255, 150, 0, 0.16), rgba(255, 150, 0, 0.05));
border: 2px solid rgba(255, 150, 0, 0.8);
color: #ffc375;
}
.wager-chip.over-tier[data-v-693a50fb]:hover {
border-color: rgba(255, 160, 0, 1);
box-shadow: 0 0 14px rgba(255, 150, 0, 0.4);
}
@keyframes wager-check-pulse-693a50fb {
0%,
100% {
box-shadow: 0 0 0 rgba(255, 70, 70, 0);
}
50% {
box-shadow: 0 0 14px rgba(255, 70, 70, 0.5);
}
}
/* Always-visible warning labels on the chip — no hover/tooltip needed (touch-friendly).
"VERIFY" (amber) = system estimate to confirm; "HIGH" (orange) = >3× tier-expected avg bet;
"CHECK" (red) = implausible vs. the money. */
.wager-tag[data-v-693a50fb] {
display: inline-flex;
align-items: center;
font-size: 0.68rem;
font-weight: 800;
letter-spacing: 0.5px;
padding: 0.12rem 0.4rem;
border-radius: 6px;
white-space: nowrap;
text-transform: uppercase;
}
.wager-tag.verify[data-v-693a50fb] {
color: #1a1205;
background: #ffce33;
box-shadow: 0 0 8px rgba(255, 200, 0, 0.5);
}
.wager-tag.high[data-v-693a50fb] {
color: #2a1500;
background: #ff9f1c;
box-shadow: 0 0 8px rgba(255, 150, 0, 0.55);
}
.wager-tag.check[data-v-693a50fb] {
color: #2a0606;
background: #ff5b5b;
box-shadow: 0 0 8px rgba(255, 70, 70, 0.55);
}
.table-seat-info[data-v-693a50fb] {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 0.25rem;
text-align: right;
}
.table-name[data-v-693a50fb] {
font-weight: 600;
color: var(--neon-blue);
font-size: 0.9rem;
text-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.seat-number[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.75rem;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
padding: 0.2rem 0.5rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
}
.rating-slip-item-body[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
gap: 0.75rem;
align-items: center;
min-width: 0;
}
.metric-item[data-v-693a50fb] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
padding: 0.5rem;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
min-width: 0;
word-break: break-word;
}
.metric-item[data-v-693a50fb]:hover {
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.04));
border-color: rgba(255, 255, 255, 0.15);
transform: translateY(-1px);
}
.metric-label[data-v-693a50fb] {
font-size: 0.7rem;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: 500;
}
.metric-value[data-v-693a50fb] {
font-size: 0.9rem;
font-weight: 600;
color: var(--text-primary);
font-family: 'JetBrains Mono', 'Courier New', monospace;
}
/* Specialized metric styling */
.metric-item.avg-bet .metric-value.bet-red[data-v-693a50fb] {
color: #ff6b6b;
text-shadow: 0 0 8px rgba(255, 107, 107, 0.3);
}
.metric-item.avg-bet .metric-value.bet-green[data-v-693a50fb] {
color: #51cf66;
text-shadow: 0 0 8px rgba(81, 207, 102, 0.3);
}
.metric-item.avg-bet .metric-value.bet-black[data-v-693a50fb] {
color: var(--text-primary);
}
.metric-item.cash-in .metric-value.amount-blue[data-v-693a50fb] {
color: var(--neon-blue);
text-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.metric-item.cash-in .metric-value.amount-purple[data-v-693a50fb] {
color: var(--neon-purple);
text-shadow: 0 0 8px rgba(138, 43, 226, 0.3);
}
.metric-item.duration .metric-value.duration-blue[data-v-693a50fb] {
color: var(--neon-blue);
text-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.metric-item.duration .metric-value.duration-purple[data-v-693a50fb] {
color: var(--neon-purple);
text-shadow: 0 0 8px rgba(138, 43, 226, 0.3);
}
.metric-item.adjust-points .metric-value[data-v-693a50fb] {
color: var(--neon-purple);
text-shadow: 0 0 8px rgba(138, 43, 226, 0.3);
}
.pause-indicator[data-v-693a50fb] {
margin-left: 0.5rem;
font-size: 0.9em;
animation: pulse-693a50fb 1.5s infinite;
filter: drop-shadow(0 0 4px rgba(255, 152, 0, 0.5));
}
@keyframes pulse-693a50fb {
0%,
100% {
opacity: 1;
transform: scale(1);
}
50% {
opacity: 0.6;
transform: scale(0.95);
}
}
/* Right Pane: Rating Slip Detail */
.rating-slip-detail-pane[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.05);
border-radius: 16px;
padding: 1.5rem;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
overflow-y: auto;
overflow-x: hidden;
display: flex;
flex-direction: column;
max-height: 100%;
}
.rating-slip-detail[data-v-693a50fb] {
flex: 1;
display: flex;
flex-direction: column;
gap: 2rem;
}
/* Player Information Section */
.player-information-section[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1.5rem;
}
.section-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1rem;
}
.player-name-tier-wrapper[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.section-header h3[data-v-693a50fb] {
margin: 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.player-photo img[data-v-693a50fb] {
width: 60px;
height: 60px;
border-radius: 8px;
object-fit: cover;
border: 2px solid rgba(255, 255, 255, 0.1);
}
.player-photo-container[data-v-693a50fb] {
flex-shrink: 0;
}
.player-info-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
margin-bottom: 1rem;
}
.info-item[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.info-item label[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.875rem;
font-weight: 500;
}
.info-item span[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
}
.messages-item[data-v-693a50fb] {
grid-column: 1 / -1;
}
.messages-list[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.message-item[data-v-693a50fb] {
background: rgba(255, 193, 7, 0.1);
padding: 0.5rem;
border-radius: 6px;
font-size: 0.875rem;
color: #ffc107;
}
/* Primary Action Buttons (Top) */
.primary-action-buttons[data-v-693a50fb] {
display: grid;
grid-auto-flow: column;
grid-auto-columns: minmax(110px, 1fr);
gap: 0.6rem;
margin-top: 1.5rem;
padding: 0.7rem 0.9rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
align-items: stretch;
overflow-x: auto;
overscroll-behavior-x: contain;
scrollbar-gutter: stable;
}
.primary-action-buttons[data-v-693a50fb]::-webkit-scrollbar {
height: 6px;
}
.primary-action-buttons[data-v-693a50fb]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.15);
border-radius: 999px;
}
.primary-action-buttons .btn-neon[data-v-693a50fb],
.primary-action-buttons .btn-glass[data-v-693a50fb] {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
width: 100%;
min-width: 0;
padding: 0.55rem 0.75rem;
font-size: 0.86rem;
font-weight: 600;
min-height: 40px;
white-space: nowrap;
text-align: center;
}
/* Secondary Action Buttons */
.secondary-action-buttons[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.5rem;
margin-top: 0.75rem;
padding: 0.6rem 0.8rem;
padding-bottom: 0.8rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.05);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.secondary-action-buttons .btn-sm[data-v-693a50fb],
.secondary-action-buttons .btn-glass[data-v-693a50fb] {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.3rem;
padding: 0.45rem 0.5rem;
font-size: 0.82rem;
white-space: nowrap;
min-height: 36px;
}
/* Legacy action-buttons support (for other parts of the code) */
.action-buttons[data-v-693a50fb] {
display: flex;
gap: 1rem;
}
.btn-sm[data-v-693a50fb] {
padding: 0.5rem 1rem;
font-size: 0.875rem;
}
/* Detail Tabs */
.detail-tabs-container[data-v-693a50fb] {
flex: 1;
display: flex;
flex-direction: column;
}
/* Player Tier Display */
.player-tier-display[data-v-693a50fb] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
align-items: center;
}
.tier-value[data-v-693a50fb] {
padding: 0.25rem 0.75rem;
border-radius: 8px;
font-weight: 600;
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.5px;
display: inline-block;
text-shadow: 0 0 8px currentColor;
}
/* Tier-specific colors matching the Players.vue tier badges */
.tier-value.tier-diamond[data-v-693a50fb] {
background: linear-gradient(135deg, #4A90E2, #357ABD);
color: white;
border: 1px solid rgba(74, 144, 226, 0.5);
box-shadow: 0 0 12px rgba(74, 144, 226, 0.3);
}
.tier-value.tier-platinum[data-v-693a50fb] {
background: linear-gradient(135deg, #E8E8E8, #C0C0C0);
color: #333;
border: 1px solid rgba(232, 232, 232, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-gold[data-v-693a50fb] {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #333;
border: 1px solid rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.tier-value.tier-silver[data-v-693a50fb] {
background: linear-gradient(135deg, #C0C0C0, #A8A8A8);
color: #333;
border: 1px solid rgba(192, 192, 192, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-bronze[data-v-693a50fb] {
background: linear-gradient(135deg, #CD7F32, #B8860B);
color: white;
border: 1px solid rgba(205, 127, 50, 0.5);
box-shadow: 0 0 12px rgba(205, 127, 50, 0.3);
}
.tier-value.tier-tier-1[data-v-693a50fb] {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #333;
border: 1px solid rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.tier-value.tier-tier-2[data-v-693a50fb] {
background: linear-gradient(135deg, #C0C0C0, #A8A8A8);
color: #333;
border: 1px solid rgba(192, 192, 192, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-tier-3[data-v-693a50fb] {
background: linear-gradient(135deg, #CD7F32, #B8860B);
color: white;
border: 1px solid rgba(205, 127, 50, 0.5);
box-shadow: 0 0 12px rgba(205, 127, 50, 0.3);
}
.match-play-indicator[data-v-693a50fb] {
display: inline-flex;
align-items: center;
padding: 0.35rem 0.75rem;
border-radius: 6px;
font-size: 0.8rem;
font-weight: 600;
background: rgba(0, 255, 150, 0.1);
border: 1px solid rgba(0, 255, 150, 0.3);
color: var(--neon-green);
box-shadow: 0 0 8px rgba(0, 255, 150, 0.2);
cursor: help;
white-space: nowrap;
min-width: 115px;
}
.match-play-indicator.clickable[data-v-693a50fb] {
cursor: pointer;
transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.match-play-indicator.clickable[data-v-693a50fb]:hover {
border-color: rgba(0, 255, 150, 0.6);
box-shadow: 0 0 16px rgba(0, 255, 150, 0.35);
}
.match-play-indicator.blocked[data-v-693a50fb] {
background: rgba(255, 107, 107, 0.1);
border: 1px solid rgba(255, 107, 107, 0.4);
color: #ff6b6b;
box-shadow: 0 0 12px rgba(255, 107, 107, 0.3);
animation: pulse-red-693a50fb 2s ease-in-out infinite;
}
.match-play-indicator.blocked strong[data-v-693a50fb] {
color: #ff6b6b;
text-transform: uppercase;
letter-spacing: 0.5px;
}
@keyframes pulse-red-693a50fb {
0%,
100% {
box-shadow: 0 0 12px rgba(255, 107, 107, 0.3);
}
50% {
box-shadow: 0 0 20px rgba(255, 107, 107, 0.5);
}
}
.match-play-received-badge[data-v-693a50fb] {
display: inline-flex;
align-items: center;
padding: 0.4rem 0.85rem;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 700;
background: rgba(255, 0, 0, 0.15);
border: 1px solid rgba(255, 0, 0, 0.4);
color: #ff4444;
box-shadow: 0 0 12px rgba(255, 0, 0, 0.3);
cursor: help;
animation: matchPlayPulse-693a50fb 2s ease-in-out infinite;
letter-spacing: 0.5px;
white-space: nowrap;
min-width: 105px;
text-align: center;
}
@keyframes matchPlayPulse-693a50fb {
0%,
100% {
box-shadow: 0 0 12px rgba(255, 0, 0, 0.3);
}
50% {
box-shadow: 0 0 20px rgba(255, 0, 0, 0.5);
}
}
.preferred-game-badge[data-v-693a50fb] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.625rem;
background: rgba(138, 43, 226, 0.15);
border: 1px solid rgba(138, 43, 226, 0.3);
border-radius: 6px;
font-size: 0.8rem;
font-weight: 600;
color: #b794f6;
transition: all 0.2s ease;
white-space: nowrap;
}
.preferred-game-badge[data-v-693a50fb]:hover {
background: rgba(138, 43, 226, 0.25);
border-color: rgba(138, 43, 226, 0.5);
}
.preferred-game-badge.is-override[data-v-693a50fb] {
background: rgba(255, 165, 0, 0.15);
border: 1px solid rgba(255, 165, 0, 0.3);
color: #ffa500;
}
.preferred-game-badge.is-override[data-v-693a50fb]:hover {
background: rgba(255, 165, 0, 0.25);
border-color: rgba(255, 165, 0, 0.5);
}
.preferred-game-badge .override-indicator[data-v-693a50fb] {
font-size: 0.7rem;
opacity: 0.8;
}
.detail-tabs[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
margin-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.tab-btn[data-v-693a50fb] {
padding: 0.75rem 1.5rem;
background: transparent;
border: none;
color: var(--text-secondary);
cursor: pointer;
border-radius: 8px 8px 0 0;
transition: all 0.3s ease;
font-weight: 500;
}
.tab-btn[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.tab-btn.active[data-v-693a50fb] {
background: var(--neon-blue);
color: var(--bg-primary);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.tab-content[data-v-693a50fb] {
flex: 1;
overflow-y: auto;
}
/* Rating Tab */
.rating-tab[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.rating-info-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.info-row[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
}
.info-row label[data-v-693a50fb] {
color: var(--text-secondary);
font-weight: 500;
}
.info-row span[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
}
/* Editable Average Bet Styles */
.avg-bet-editable[data-v-693a50fb] {
position: relative;
}
.editable-field[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.bet-value[data-v-693a50fb] {
cursor: pointer;
padding: 0.25rem 0.5rem;
border-radius: 4px;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
min-width: 80px;
}
.bet-value[data-v-693a50fb]:hover {
background: rgba(0, 245, 255, 0.1);
color: var(--neon-blue);
}
.edit-icon[data-v-693a50fb] {
font-size: 0.8rem;
opacity: 0.6;
transition: opacity 0.3s ease;
}
.bet-value:hover .edit-icon[data-v-693a50fb] {
opacity: 1;
}
/* Provenance / sanity flags on the detail-pane avg bet */
.bet-source-flag[data-v-693a50fb] {
font-size: 0.65rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.4px;
padding: 0.05rem 0.35rem;
border-radius: 6px;
margin-left: 0.4rem;
vertical-align: middle;
}
.bet-source-flag.unverified[data-v-693a50fb] {
color: #ffd84d;
background: rgba(255, 200, 0, 0.12);
border: 1px dashed rgba(255, 200, 0, 0.6);
}
.bet-source-flag.implausible[data-v-693a50fb] {
color: #ff6b6b;
background: rgba(255, 70, 70, 0.12);
border: 1px solid rgba(255, 70, 70, 0.55);
}
.bet-source-flag.over-tier[data-v-693a50fb] {
color: #ffb04d;
background: rgba(255, 150, 0, 0.12);
border: 1px solid rgba(255, 150, 0, 0.55);
}
.bet-edit-controls[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.bet-input[data-v-693a50fb] {
width: 80px;
padding: 0.25rem 0.5rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid var(--neon-blue);
border-radius: 4px;
color: var(--text-primary);
font-size: 0.9rem;
text-align: center;
}
.bet-input[data-v-693a50fb]:focus {
outline: none;
box-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.save-btn[data-v-693a50fb],
.cancel-btn[data-v-693a50fb] {
width: 24px;
height: 24px;
border-radius: 50%;
border: 1px solid;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.8rem;
transition: all 0.3s ease;
}
.save-btn[data-v-693a50fb] {
background: rgba(57, 255, 20, 0.1);
color: var(--neon-green);
border-color: var(--neon-green);
}
.save-btn[data-v-693a50fb]:hover {
background: var(--neon-green);
color: white;
}
.cancel-btn[data-v-693a50fb] {
background: rgba(255, 7, 58, 0.1);
color: var(--neon-red);
border-color: var(--neon-red);
}
.cancel-btn[data-v-693a50fb]:hover {
background: var(--neon-red);
color: white;
}
/* Adjust Points Styles */
.adjust-points-row[data-v-693a50fb] {
border: 1px solid rgba(255, 165, 0, 0.3);
background: rgba(255, 165, 0, 0.05);
}
.points-value[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--neon-purple);
font-weight: 700;
}
.rating-actions[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.primary-actions[data-v-693a50fb] {
display: flex;
gap: 1rem;
justify-content: center;
}
.secondary-actions[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
justify-content: center;
flex-wrap: wrap;
}
.secondary-actions .btn-sm[data-v-693a50fb] {
padding: 0.5rem 0.75rem;
font-size: 0.8rem;
min-width: 70px;
}
/* History Tab */
.history-tab[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
/* History Filter Bar */
.history-filter-bar[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 1rem;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.filter-label[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.85rem;
font-weight: 500;
}
.filter-buttons[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
}
.filter-btn[data-v-693a50fb] {
padding: 0.4rem 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.15);
background: rgba(255, 255, 255, 0.03);
color: var(--text-secondary);
border-radius: 6px;
font-size: 0.8rem;
cursor: pointer;
transition: all 0.2s ease;
}
.filter-btn[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.25);
}
.filter-btn.active[data-v-693a50fb] {
background: rgba(59, 130, 246, 0.2);
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.history-periods[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.period-section[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
padding: 1rem;
}
.period-section h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.history-stats[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 0.75rem;
}
.stat-item[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
}
.recent-rewards[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
padding: 1rem;
margin-bottom: 1.5rem;
}
.recent-rewards h4[data-v-693a50fb] {
margin: 0 0 0.75rem 0;
color: var(--text-primary);
font-size: 0.9rem;
}
.rewards-table[data-v-693a50fb] {
width: 100%;
border-collapse: collapse;
font-size: 0.85rem;
}
.rewards-table thead[data-v-693a50fb] {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.rewards-table th[data-v-693a50fb] {
text-align: left;
padding: 0.5rem;
color: var(--text-secondary);
font-weight: 600;
font-size: 0.8rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.rewards-table td[data-v-693a50fb] {
padding: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.rewards-table tbody tr[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.03);
}
.rewards-table .points[data-v-693a50fb] {
color: var(--neon-purple);
font-weight: 600;
}
.rewards-table .date[data-v-693a50fb] {
color: var(--text-muted);
font-size: 0.8rem;
}
.no-rewards[data-v-693a50fb] {
text-align: center;
color: var(--text-muted);
font-style: italic;
padding: 1rem;
font-size: 0.85rem;
}
/* Transaction History Section - Glassmorphism */
.transaction-history[data-v-693a50fb] {
margin-top: 1rem;
background: rgba(255, 255, 255, 0.04);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-radius: 12px;
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.transaction-history.comps-section[data-v-693a50fb] {
border-color: rgba(139, 92, 246, 0.25);
background: rgba(139, 92, 246, 0.03);
}
.transaction-header[data-v-693a50fb] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.75rem;
}
.transaction-header h4[data-v-693a50fb] {
margin: 0;
color: var(--text-primary);
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1rem;
}
.transaction-count[data-v-693a50fb] {
font-size: 0.75rem;
color: var(--text-muted);
background: rgba(255, 255, 255, 0.08);
padding: 0.25rem 0.6rem;
border-radius: 6px;
border: 1px solid rgba(255, 255, 255, 0.06);
}
/* Scrollable Table Wrapper - Glassmorphism */
.transaction-table-wrapper[data-v-693a50fb] {
max-height: 200px;
overflow-y: auto;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.2);
}
.transaction-table-wrapper.comps-table-wrapper[data-v-693a50fb] {
max-height: 280px;
overflow-x: auto;
}
/* Comps table should NOT use fixed layout - let it expand */
.transaction-table.comps-table[data-v-693a50fb] {
table-layout: auto;
width: max-content;
min-width: 100%;
}
.transaction-table-wrapper[data-v-693a50fb]::-webkit-scrollbar {
width: 6px;
}
.transaction-table-wrapper[data-v-693a50fb]::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.03);
border-radius: 3px;
}
.transaction-table-wrapper[data-v-693a50fb]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.15);
border-radius: 3px;
}
.transaction-table-wrapper[data-v-693a50fb]::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.25);
}
.comp-table[data-v-693a50fb],
.transaction-table[data-v-693a50fb] {
width: 100%;
border-collapse: collapse;
font-size: 0.8rem;
}
.transaction-table.enhanced[data-v-693a50fb] {
table-layout: fixed;
}
/* Table Header - Glass Effect with Blur */
.comp-table thead[data-v-693a50fb],
.transaction-table thead[data-v-693a50fb] {
background: rgba(30, 30, 40, 0.75);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
position: sticky;
top: 0;
z-index: 1;
}
.comp-table th[data-v-693a50fb],
.transaction-table th[data-v-693a50fb] {
padding: 0.6rem 0.5rem;
text-align: left;
font-weight: 600;
color: var(--text-primary);
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.04em;
white-space: nowrap;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.transaction-table th.points-header[data-v-693a50fb] {
text-align: center;
font-size: 0.65rem;
min-width: 80px;
}
/* Notes header - give generous space since comps table scrolls */
.transaction-table th.notes-header[data-v-693a50fb] {
min-width: 280px;
}
/* Compact time column */
.transaction-table .cell-time[data-v-693a50fb] {
width: 95px;
white-space: nowrap;
}
.comp-table td[data-v-693a50fb],
.transaction-table td[data-v-693a50fb] {
padding: 0.5rem 0.4rem;
border-top: 1px solid rgba(255, 255, 255, 0.04);
vertical-align: middle;
color: var(--text-secondary);
}
.comp-table tbody tr[data-v-693a50fb],
.transaction-table tbody tr[data-v-693a50fb] {
transition: background 0.15s ease;
}
.comp-table tbody tr[data-v-693a50fb]:hover,
.transaction-table tbody tr[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.04);
}
.transaction-table tbody tr.voided[data-v-693a50fb] {
opacity: 0.6;
background: rgba(255, 0, 0, 0.03);
}
.transaction-table td.cell-time[data-v-693a50fb] {
font-size: 0.75rem;
color: var(--text-secondary);
white-space: nowrap;
}
.transaction-table td.amount[data-v-693a50fb] {
color: var(--neon-green);
font-weight: 600;
}
/* Employee Info Display */
.cell-employee[data-v-693a50fb] {
min-width: 100px;
}
.employee-info[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.employee-name[data-v-693a50fb] {
font-weight: 500;
color: var(--text-primary);
font-size: 0.8rem;
}
.employee-role[data-v-693a50fb] {
font-size: 0.65rem;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.02em;
}
/* Points Cells */
.cell-points[data-v-693a50fb] {
text-align: center;
min-width: 70px;
}
.points-value[data-v-693a50fb] {
font-weight: 600;
font-size: 0.8rem;
display: block;
}
.points-value.house[data-v-693a50fb] {
color: #f59e0b;
}
.points-value.total[data-v-693a50fb] {
color: var(--neon-blue);
}
.points-none[data-v-693a50fb] {
color: var(--text-muted);
font-size: 0.75rem;
}
.cell-points.highlighted[data-v-693a50fb] {
background: rgba(245, 158, 11, 0.1);
border-left: 2px solid #f59e0b;
}
.points-dollar[data-v-693a50fb] {
display: block;
font-size: 0.6rem;
color: var(--text-muted);
margin-top: 0.1rem;
}
/* Notes Cell - generous width since comps table scrolls horizontally */
.cell-notes[data-v-693a50fb] {
min-width: 280px;
}
.notes-text[data-v-693a50fb] {
display: block;
font-size: 0.75rem;
color: var(--text-secondary);
white-space: normal;
word-wrap: break-word;
max-width: 350px;
}
.notes-none[data-v-693a50fb] {
color: var(--text-muted);
font-size: 0.75rem;
}
/* Compact Amount Styling */
.transaction-table td.amount[data-v-693a50fb] {
font-size: 0.78rem;
white-space: nowrap;
}
/* Comp Type Badge */
.comp-type-badge[data-v-693a50fb] {
display: inline-block;
padding: 0.2rem 0.4rem;
border-radius: 4px;
font-size: 0.65rem;
font-weight: 500;
text-transform: uppercase;
background: rgba(139, 92, 246, 0.2);
color: #a78bfa;
border: 1px solid rgba(139, 92, 246, 0.3);
}
.comp-type-badge.badge-match-play[data-v-693a50fb],
.comp-type-badge.badge-free-play[data-v-693a50fb] {
background: rgba(34, 197, 94, 0.2);
color: #4ade80;
border-color: rgba(34, 197, 94, 0.3);
}
.comp-type-badge.badge-food[data-v-693a50fb],
.comp-type-badge.badge-beverage[data-v-693a50fb] {
background: rgba(251, 146, 60, 0.2);
color: #fb923c;
border-color: rgba(251, 146, 60, 0.3);
}
/* Table Footer Totals - Solid background for sticky footer */
.transaction-table tfoot[data-v-693a50fb] {
background: rgba(30, 30, 40, 0.98);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
position: sticky;
bottom: 0;
z-index: 1;
}
.totals-row td[data-v-693a50fb] {
padding: 0.6rem 0.5rem;
font-weight: 600;
border-top: 2px solid rgba(139, 92, 246, 0.3);
color: var(--text-primary);
}
.totals-label[data-v-693a50fb] {
text-align: right;
color: var(--text-secondary);
font-size: 0.75rem;
text-transform: uppercase;
}
/* Row with house subsidy highlight */
.transaction-table tr.has-house-subsidy[data-v-693a50fb]:not(.voided) {
background: rgba(245, 158, 11, 0.05);
}
.comp-table tr.voided[data-v-693a50fb],
.transaction-table tr.voided[data-v-693a50fb] {
opacity: 0.5;
}
.transaction-table tr.voided td[data-v-693a50fb] {
text-decoration: line-through;
}
.comp-table .amount[data-v-693a50fb],
.transaction-table .amount[data-v-693a50fb] {
font-weight: 600;
color: var(--success);
white-space: nowrap;
}
/* Points Legend - Glassmorphism */
.points-legend[data-v-693a50fb] {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-top: 0.75rem;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.08);
}
.legend-item[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.4rem;
font-size: 0.72rem;
color: var(--text-muted);
}
.legend-icon[data-v-693a50fb] {
font-size: 0.9rem;
}
.legend-text strong[data-v-693a50fb] {
color: var(--text-primary);
}
.transaction-table .description[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.85rem;
font-style: italic;
}
.void-badge[data-v-693a50fb] {
display: inline-block;
padding: 0.125rem 0.5rem;
background: rgba(255, 0, 0, 0.2);
border: 1px solid rgba(255, 0, 0, 0.4);
border-radius: 4px;
font-size: 0.7rem;
font-weight: 600;
color: #ff6b6b;
}
.active-badge[data-v-693a50fb] {
display: inline-block;
padding: 0.125rem 0.5rem;
background: rgba(0, 255, 0, 0.1);
border: 1px solid rgba(0, 255, 0, 0.3);
border-radius: 4px;
font-size: 0.7rem;
font-weight: 600;
color: #51cf66;
}
.void-btn[data-v-693a50fb] {
background: none;
border: none;
color: #ff6b6b;
cursor: pointer;
padding: 0.25rem 0.5rem;
font-size: 1rem;
opacity: 0.6;
transition: opacity 0.2s;
}
.void-btn[data-v-693a50fb]:hover {
opacity: 1;
}
.loading-state[data-v-693a50fb],
.no-transactions[data-v-693a50fb] {
padding: 1rem;
text-align: center;
color: var(--text-secondary);
font-size: 0.85rem;
}
.legacy-history-notice[data-v-693a50fb] {
margin: 1rem 0 1.5rem;
padding: 0.85rem 1rem;
border-radius: 8px;
background: rgba(255, 255, 255, 0.07);
border: 1px solid rgba(255, 255, 255, 0.12);
color: var(--text-secondary);
font-size: 0.85rem;
line-height: 1.4;
}
.legacy-history-notice span[data-v-693a50fb] {
display: block;
}
/* Traits Tab */
.traits-tab[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.traits-section[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.current-traits[data-v-693a50fb],
.general-comment[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
padding: 1rem;
}
.current-traits h4[data-v-693a50fb],
.general-comment h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
}
.traits-list[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.trait-item[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
font-size: 0.875rem;
}
.trait-category[data-v-693a50fb] {
color: var(--text-secondary);
font-weight: 500;
}
.trait-value[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
}
.no-traits[data-v-693a50fb] {
text-align: center;
color: var(--text-muted);
font-style: italic;
padding: 1rem;
}
.general-comment p[data-v-693a50fb] {
margin: 0;
color: var(--text-primary);
font-style: italic;
}
/* Denoms Tab */
.denoms-tab[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 2rem;
min-height: 600px;
}
.denoms-layout[data-v-693a50fb] {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
gap: 2rem;
height: 100%;
}
.player-chips-section[data-v-693a50fb] {
grid-column: 1 / -1;
}
.theo-calculator-section[data-v-693a50fb] {
grid-column: 1 / -1;
}
.table-summary-section[data-v-693a50fb] {
grid-column: 1 / -1;
align-self: start;
}
.summary-card[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
padding: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.summary-card h4[data-v-693a50fb] {
margin: 0 0 1.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.summary-stats[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
.stat-item[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 8px;
}
.stat-label[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.stat-value[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
font-size: 1rem;
}
.stat-value.neon-orange[data-v-693a50fb] {
color: var(--neon-orange);
}
.table-actions[data-v-693a50fb] {
display: flex;
gap: 1rem;
justify-content: flex-end;
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 1rem;
}
/* Empty State */
.empty-detail[data-v-693a50fb] {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
.empty-content[data-v-693a50fb] {
text-align: center;
color: var(--text-muted);
}
.empty-icon[data-v-693a50fb] {
font-size: 4rem;
margin-bottom: 1rem;
opacity: 0.5;
}
.empty-content h3[data-v-693a50fb] {
margin: 0 0 0.5rem 0;
color: var(--text-secondary);
}
.empty-content p[data-v-693a50fb] {
margin: 0;
font-size: 0.875rem;
}
/* Yellow neon button for pause */
.btn-neon.neon-yellow[data-v-693a50fb] {
background: rgba(255, 193, 7, 0.2);
color: #ffc107;
border: 1px solid #ffc107;
}
.btn-neon.neon-yellow[data-v-693a50fb]:hover {
background: #ffc107;
color: #000;
box-shadow: 0 0 20px rgba(255, 193, 7, 0.5);
transform: translateY(-2px);
}
/* Responsive Design */
@media (max-width: 1400px) {
.pit-station-content[data-v-693a50fb] {
grid-template-columns: 1fr;
height: auto;
}
.rating-slip-item[data-v-693a50fb] {
padding: 1rem;
}
.rating-slip-item-body[data-v-693a50fb] {
grid-template-columns: repeat(3, 1fr);
gap: 0.5rem;
}
.player-name[data-v-693a50fb] {
font-size: 1rem;
}
.metric-item[data-v-693a50fb] {
padding: 0.4rem;
}
.metric-value[data-v-693a50fb] {
font-size: 0.85rem;
}
}
@media (max-width: 768px) {
.pit-station-header[data-v-693a50fb] {
flex-direction: column;
gap: 1rem;
}
.pit-station-title h1[data-v-693a50fb] {
font-size: 1.5rem;
}
.rating-slip-item[data-v-693a50fb] {
padding: 1rem;
gap: 1rem;
}
.rating-slip-item-header[data-v-693a50fb] {
flex-direction: column;
align-items: flex-start;
gap: 0.75rem;
}
.table-seat-info[data-v-693a50fb] {
align-items: flex-start;
text-align: left;
}
.rating-slip-item-body[data-v-693a50fb] {
grid-template-columns: repeat(2, 1fr);
gap: 0.5rem;
}
.player-name[data-v-693a50fb] {
font-size: 1rem;
}
.metric-item[data-v-693a50fb] {
padding: 0.5rem;
text-align: center;
}
.metric-label[data-v-693a50fb] {
font-size: 0.65rem;
}
.metric-value[data-v-693a50fb] {
font-size: 0.8rem;
}
.player-info-grid[data-v-693a50fb],
.rating-info-grid[data-v-693a50fb],
.history-stats[data-v-693a50fb] {
grid-template-columns: 1fr;
}
.denoms-layout[data-v-693a50fb] {
grid-template-columns: 1fr;
gap: 1.5rem;
}
.summary-stats[data-v-693a50fb] {
grid-template-columns: 1fr;
}
.table-actions[data-v-693a50fb] {
justify-content: stretch;
}
.table-actions button[data-v-693a50fb] {
flex: 1;
}
}
/* Cash Management Styles */
.cash-management[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 1rem;
}
.cash-btn[data-v-693a50fb] {
padding: 0.25rem 0.5rem;
font-size: 0.7rem;
min-width: auto;
opacity: 0.8;
transition: all 0.2s ease;
}
.cash-btn[data-v-693a50fb]:hover {
opacity: 1;
transform: translateY(-1px);
box-shadow: 0 2px 8px rgba(0, 245, 255, 0.3);
}
.btn-xs[data-v-693a50fb] {
padding: 0.25rem 0.5rem;
font-size: 0.7rem;
min-height: auto;
}
/* New Rating Slip Modal Styles */
.modal-overlay[data-v-693a50fb] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-693a50fb] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 600px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
}
.modal-content.large[data-v-693a50fb] {
max-width: 800px;
}
.modal-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-693a50fb] {
margin: 0;
color: var(--text-primary);
}
.btn-close[data-v-693a50fb] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-693a50fb]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-693a50fb] {
padding: 2rem;
}
.modal-footer[data-v-693a50fb] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.form-section[data-v-693a50fb] {
margin-bottom: 2rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.form-section h3[data-v-693a50fb] {
color: var(--text-primary);
margin: 0 0 1rem 0;
font-size: 1.1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 0.5rem;
}
.form-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.form-group[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.form-group .help-text[data-v-693a50fb] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: -0.25rem;
font-style: italic;
}
/* Info Message Box */
.info-message[data-v-693a50fb] {
display: flex;
gap: 12px;
padding: 14px 16px;
background: rgba(255, 200, 100, 0.1);
border: 1px solid rgba(255, 200, 100, 0.25);
border-radius: 10px;
margin-bottom: 1rem;
}
.info-message .info-icon[data-v-693a50fb] {
font-size: 1.2rem;
flex-shrink: 0;
line-height: 1.4;
}
.info-message .info-content p[data-v-693a50fb] {
margin: 0 0 4px 0;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.85);
line-height: 1.4;
}
.info-message .info-content p[data-v-693a50fb]:last-child {
margin-bottom: 0;
}
/* Preview Note */
.preview-note[data-v-693a50fb] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
margin-top: 0.75rem;
font-style: italic;
}
/* Seat Selection Grid */
.seat-grid-container[data-v-693a50fb] {
width: 100%;
overflow-x: hidden;
overflow-y: visible;
}
.seat-selection-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
gap: 0.5rem;
margin-top: 0.5rem;
max-width: 100%;
overflow: hidden;
}
.seat-btn[data-v-693a50fb] {
position: relative;
aspect-ratio: 1;
min-height: 50px;
max-width: 80px;
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-weight: 600;
color: var(--text-primary);
}
.seat-btn[data-v-693a50fb]:hover:not(:disabled) {
background: rgba(0, 245, 255, 0.15);
border-color: var(--neon-blue);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 245, 255, 0.3);
}
.seat-btn.selected[data-v-693a50fb] {
background: rgba(0, 245, 255, 0.25);
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.5);
color: var(--neon-blue);
}
.seat-btn.occupied[data-v-693a50fb] {
background: rgba(255, 69, 0, 0.15);
border-color: rgba(255, 69, 0, 0.4);
cursor: not-allowed;
opacity: 0.6;
}
.seat-btn[data-v-693a50fb]:disabled {
cursor: not-allowed;
}
.seat-number[data-v-693a50fb] {
font-size: 1.2rem;
font-weight: 700;
}
.occupied-icon[data-v-693a50fb] {
font-size: 0.8rem;
margin-top: 0.15rem;
}
.typeahead[data-v-693a50fb] {
position: relative;
}
.suggestions[data-v-693a50fb] {
position: absolute;
top: calc(100% + 4px);
left: 0;
right: 0;
background: rgba(20, 25, 35, 0.98);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
max-height: 260px;
overflow-y: auto;
z-index: 1001;
}
.suggestion-item[data-v-693a50fb] {
padding: 0.5rem 0.75rem;
cursor: pointer;
}
.suggestion-item[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.06);
}
.suggestion-item.muted[data-v-693a50fb] {
color: var(--text-secondary);
cursor: default;
}
/* Cross-property search styles */
/* Divider separating local results from the "Other IPC properties" section */
.cross-property-divider[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.6rem;
margin: 0.5rem 0.25rem 0.35rem;
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--text-secondary);
}
.cross-property-divider[data-v-693a50fb]::before,
.cross-property-divider[data-v-693a50fb]::after {
content: '';
flex: 1;
height: 1px;
background: rgba(255, 255, 255, 0.12);
}
/* The guided, always-visible reveal link (replaces the old mode toggle) */
.cross-property-link[data-v-693a50fb] {
display: block;
width: 100%;
text-align: left;
padding: 0.6rem 0.75rem;
font-size: 0.85rem;
font-weight: 600;
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.06);
border: 1px dashed rgba(0, 245, 255, 0.35);
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease;
}
.cross-property-link[data-v-693a50fb]:hover {
background: rgba(0, 245, 255, 0.12);
border-color: var(--neon-blue);
}
/* Subtle tint so cross-property rows read as "from elsewhere" */
.suggestion-item.cross-property-row[data-v-693a50fb] {
background: rgba(168, 85, 247, 0.04);
}
.casino-badge[data-v-693a50fb] {
display: inline-block;
padding: 0.2rem 0.5rem;
font-size: 0.7rem;
font-weight: 600;
border-radius: 6px;
text-transform: uppercase;
letter-spacing: 0.5px;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
border: 1px solid rgba(255, 255, 255, 0.15);
backdrop-filter: blur(10px);
color: var(--neon-blue);
text-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.casino-badge.current-casino[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(46, 213, 115, 0.2), rgba(46, 213, 115, 0.1));
border-color: rgba(46, 213, 115, 0.4);
color: #2ed573;
text-shadow: 0 0 8px rgba(46, 213, 115, 0.4);
}
.import-badge[data-v-693a50fb] {
display: inline-block;
padding: 0.2rem 0.5rem;
font-size: 0.7rem;
font-weight: 600;
border-radius: 6px;
background: linear-gradient(135deg, rgba(255, 184, 0, 0.2), rgba(255, 184, 0, 0.1));
border: 1px solid rgba(255, 184, 0, 0.4);
color: #ffb800;
text-shadow: 0 0 8px rgba(255, 184, 0, 0.3);
animation: pulse-import-693a50fb 2s infinite;
}
@keyframes pulse-import-693a50fb {
0%,
100% {
opacity: 1;
box-shadow: 0 0 8px rgba(255, 184, 0, 0.2);
}
50% {
opacity: 0.85;
box-shadow: 0 0 12px rgba(255, 184, 0, 0.3);
}
}
.btn-glass.active[data-v-693a50fb] {
background: linear-gradient(135deg, rgba(0, 245, 255, 0.15), rgba(138, 43, 226, 0.15));
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.3);
}
.suggest-line[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
align-items: center;
justify-content: flex-start;
}
.suggest-line .name[data-v-693a50fb] {
color: var(--text-primary);
}
.suggest-line .name-flex[data-v-693a50fb] {
flex: 0 0 auto;
min-width: 150px;
}
.suggest-line .meta[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.suggest-line .birthdate[data-v-693a50fb] {
color: var(--neon-blue);
font-weight: 500;
}
.suggest-line .no-birthdate[data-v-693a50fb] {
color: #ff6b6b;
font-weight: 600;
animation: pulse-warning-693a50fb 2s infinite;
}
@keyframes pulse-warning-693a50fb {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.6;
}
}
.player-flag[data-v-693a50fb] {
display: inline-flex;
align-items: center;
gap: 0.2rem;
white-space: nowrap;
flex-shrink: 0;
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 0.2rem 0.45rem;
border-radius: 999px;
margin-left: 0.35rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.06);
}
.player-flag.vip[data-v-693a50fb] {
color: #FFD700;
background: rgba(255, 215, 0, 0.15);
border-color: rgba(255, 215, 0, 0.6);
text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
}
.player-flag.hosted[data-v-693a50fb] {
color: var(--neon-green);
border-color: rgba(0, 255, 150, 0.5);
}
.player-flag.tourney[data-v-693a50fb] {
color: #c084fc;
background: rgba(168, 85, 247, 0.18);
border-color: rgba(168, 85, 247, 0.55);
}
.player-flag.event[data-v-693a50fb] {
color: #f472b6;
background: rgba(244, 114, 182, 0.18);
border-color: rgba(244, 114, 182, 0.55);
}
.player-flag.excluded[data-v-693a50fb] {
color: #ff4757;
background: rgba(255, 71, 87, 0.15);
border-color: rgba(255, 71, 87, 0.5);
animation: pulse-excluded-693a50fb 2s infinite;
}
.player-flag.network[data-v-693a50fb] {
color: #22d3ee;
background: rgba(34, 211, 238, 0.12);
border-color: rgba(34, 211, 238, 0.45);
}
.player-flag.network-missing-id[data-v-693a50fb] {
color: #fbbf24;
background: rgba(251, 191, 36, 0.12);
border-color: rgba(251, 191, 36, 0.45);
}
/* Name-only cross-property match — supervisor must verify identity before import */
.player-flag.verify[data-v-693a50fb] {
color: #ff7849;
background: rgba(255, 120, 73, 0.14);
border-color: rgba(255, 120, 73, 0.5);
}
@keyframes pulse-excluded-693a50fb {
0%, 100% { opacity: 1;
}
50% { opacity: 0.7;
}
}
.compliance-verified-badge[data-v-693a50fb] {
margin-top: 8px;
text-align: center;
font-size: 12px;
font-weight: 600;
color: var(--neon-green);
background: rgba(22, 199, 132, 0.15);
border: 1px solid rgba(22, 199, 132, 0.35);
border-radius: 12px;
padding: 4px 8px;
white-space: nowrap;
}
.scan-hint[data-v-693a50fb] {
margin-top: 0.4rem;
color: var(--text-secondary);
font-size: 0.85rem;
}
.scan-actions[data-v-693a50fb] {
margin-top: 0.5rem;
display: flex;
gap: 0.5rem;
justify-content: flex-end;
/* Right-align buttons to prevent accidental property toggle clicks */
}
.input-glass[data-v-693a50fb] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
.input-glass[data-v-693a50fb]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
.confirmation-section[data-v-693a50fb] {
background: rgba(0, 255, 150, 0.05);
border: 1px solid rgba(0, 255, 150, 0.2);
border-radius: 8px;
padding: 1rem;
margin-top: 1rem;
}
.confirmation-section h4[data-v-693a50fb] {
color: var(--neon-green);
margin: 0 0 0.75rem 0;
}
.confirmation-details p[data-v-693a50fb] {
margin: 0.25rem 0;
color: var(--text-primary);
font-size: 0.9rem;
}
.confirmation-details strong[data-v-693a50fb] {
color: var(--neon-blue);
}
.loading-message[data-v-693a50fb] {
color: var(--text-secondary);
text-align: center;
padding: 1rem;
font-style: italic;
}
/* Animations */
.animate-fade-in[data-v-693a50fb] {
animation: fadeIn-693a50fb 0.3s ease-out;
}
.animate-scale-in[data-v-693a50fb] {
animation: scaleIn-693a50fb 0.3s ease-out;
}
@keyframes fadeIn-693a50fb {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-693a50fb {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
@media (max-width: 768px) {
.form-grid[data-v-693a50fb] {
grid-template-columns: 1fr;
}
.modal-content.large[data-v-693a50fb] {
max-width: 95vw;
}
.modal-body[data-v-693a50fb] {
padding: 1rem;
}
.modal-header[data-v-693a50fb],
.modal-footer[data-v-693a50fb] {
padding: 1rem;
}
}
/* Error Boundary */
.error-boundary[data-v-693a50fb] {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: var(--bg-primary);
}
.error-content[data-v-693a50fb] {
text-align: center;
padding: 2rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
}
.error-content h2[data-v-693a50fb] {
color: var(--neon-red);
margin-bottom: 1rem;
}
.player-avatar[data-v-693a50fb] {
display: flex;
align-items: center;
justify-content: center;
min-width: 24px;
width: 24px;
height: 24px;
flex-shrink: 0;
}
.player-thumb[data-v-693a50fb] {
width: 24px;
height: 24px;
border-radius: 50%;
object-fit: cover;
}
.player-initials[data-v-693a50fb] {
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--neon-blue);
color: white;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
font-weight: 700;
}
.error-content p[data-v-693a50fb] {
color: var(--text-secondary);
margin-bottom: 2rem;
}
/* Comp Modal styles are now in CompModal.vue component */
/* Error State Styles */
.error-state[data-v-693a50fb] {
display: flex;
align-items: center;
justify-content: center;
min-height: 60vh;
padding: 2rem;
}
.error-content[data-v-693a50fb] {
text-align: center;
background: rgba(255, 255, 255, 0.05);
border-radius: 16px;
padding: 3rem;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
}
.error-content h2[data-v-693a50fb] {
color: var(--neon-red);
margin-bottom: 1rem;
font-size: 1.5rem;
}
.error-content p[data-v-693a50fb] {
color: var(--text-secondary);
margin-bottom: 2rem;
}
/* Move Rating Modal Styles */
.move-rating-modal[data-v-693a50fb] {
max-width: 800px;
width: 90vw;
max-height: 85vh;
overflow-y: auto;
}
.current-player-info[data-v-693a50fb] {
background: rgba(0, 245, 255, 0.05);
border: 1px solid rgba(0, 245, 255, 0.2);
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 2rem;
}
.player-card[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 1rem;
}
.current-player-info .player-avatar[data-v-693a50fb] {
width: 64px;
height: 64px;
border-radius: 12px;
background: var(--neon-blue);
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 1.5rem;
color: var(--bg-primary);
background-size: cover;
background-position: center;
border: 2px solid rgba(0, 245, 255, 0.3);
}
.current-player-info .player-details h3[data-v-693a50fb] {
margin: 0 0 0.5rem 0;
color: var(--text-primary);
font-size: 1.25rem;
}
.current-location[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.9rem;
}
.current-label[data-v-693a50fb] {
color: var(--text-secondary);
}
.current-table[data-v-693a50fb] {
color: var(--neon-blue);
font-weight: 600;
}
.current-seat[data-v-693a50fb] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
padding: 0.25rem 0.75rem;
border-radius: 6px;
font-weight: 600;
}
.table-selection-section[data-v-693a50fb] {
margin-bottom: 2rem;
}
.table-selection-section h3[data-v-693a50fb] {
margin: 0 0 1.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.table-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 0.75rem;
}
.table-card[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 10px;
padding: 0.75rem;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.table-card[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(0, 245, 255, 0.3);
transform: translateY(-2px);
}
.table-card.selected[data-v-693a50fb] {
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.2);
}
.table-card.selected[data-v-693a50fb]::before {
content: '✓';
position: absolute;
top: 0.75rem;
right: 0.75rem;
width: 24px;
height: 24px;
background: var(--neon-blue);
color: var(--bg-primary);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 0.9rem;
}
.table-header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
}
.table-name[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 700;
font-size: 1.05rem;
}
.game-type[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.75rem;
text-transform: capitalize;
font-weight: 500;
}
.table-seats[data-v-693a50fb] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 0.5rem;
}
.seats-list[data-v-693a50fb] {
display: flex;
gap: 0.375rem;
flex-wrap: wrap;
}
.seat-badge[data-v-693a50fb] {
background: rgba(57, 255, 20, 0.2);
color: var(--neon-green);
padding: 0.25rem 0.5rem;
border-radius: 6px;
font-weight: 600;
font-size: 0.8rem;
min-width: 28px;
text-align: center;
border: 1px solid rgba(57, 255, 20, 0.3);
}
.no-tables[data-v-693a50fb] {
text-align: center;
padding: 3rem 1rem;
color: var(--text-muted);
}
.no-tables i[data-v-693a50fb] {
font-size: 3rem;
margin-bottom: 1rem;
color: var(--neon-orange);
}
.no-tables p[data-v-693a50fb] {
margin: 0.5rem 0;
}
.sub-text[data-v-693a50fb] {
font-size: 0.85rem;
opacity: 0.7;
}
.seat-selection-section[data-v-693a50fb] {
margin-bottom: 2rem;
}
.seat-selection-section h3[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.seat-buttons[data-v-693a50fb] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
}
.seat-btn[data-v-693a50fb] {
width: 48px;
height: 48px;
border: 2px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
color: var(--text-primary);
font-weight: 700;
font-size: 1.1rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.seat-btn[data-v-693a50fb]:hover {
border-color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
transform: translateY(-2px);
}
.seat-btn.selected[data-v-693a50fb] {
border-color: var(--neon-blue);
background: var(--neon-blue);
color: var(--bg-primary);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.4);
}
.move-summary[data-v-693a50fb] {
background: rgba(57, 255, 20, 0.05);
border: 1px solid rgba(57, 255, 20, 0.2);
border-radius: 12px;
padding: 1.5rem;
}
.move-summary .summary-card h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--neon-green);
font-size: 1rem;
}
.move-details[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
}
.from-location[data-v-693a50fb],
.to-location[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.25rem;
flex: 1;
min-width: 200px;
}
.move-details .label[data-v-693a50fb] {
font-size: 0.8rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: 600;
}
.move-details .location[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
font-size: 0.95rem;
}
.arrow[data-v-693a50fb] {
color: var(--neon-green);
font-size: 1.5rem;
margin: 0 0.5rem;
}
.loading-message[data-v-693a50fb] {
text-align: center;
padding: 3rem 1rem;
color: var(--text-secondary);
}
.loading-message i[data-v-693a50fb] {
font-size: 2rem;
margin-bottom: 1rem;
color: var(--neon-blue);
}
@media (max-width: 768px) {
.move-rating-modal[data-v-693a50fb] {
width: 95vw;
max-width: none;
}
.table-grid[data-v-693a50fb] {
grid-template-columns: 1fr;
}
.move-details[data-v-693a50fb] {
flex-direction: column;
align-items: stretch;
}
.arrow[data-v-693a50fb] {
align-self: center;
transform: rotate(90deg);
}
.from-location[data-v-693a50fb],
.to-location[data-v-693a50fb] {
min-width: auto;
}
}
/* Pause Player Modal Styles */
.pause-player-modal[data-v-693a50fb] {
max-width: 700px;
width: 90vw;
max-height: 85vh;
overflow-y: auto;
}
.pause-reason-section[data-v-693a50fb] {
margin-bottom: 2rem;
}
.pause-reason-section h3[data-v-693a50fb] {
margin: 0 0 1.5rem 0;
color: var(--text-primary);
font-size: 1.1rem;
}
.reason-grid[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 1rem;
}
.reason-card[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 1rem;
position: relative;
}
.reason-card[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 193, 7, 0.3);
transform: translateY(-2px);
}
.reason-card.selected[data-v-693a50fb] {
background: rgba(255, 193, 7, 0.1);
border-color: var(--neon-yellow);
box-shadow: 0 0 20px rgba(255, 193, 7, 0.2);
}
.reason-card.selected[data-v-693a50fb]::before {
content: '✓';
position: absolute;
top: 0.75rem;
right: 0.75rem;
width: 20px;
height: 20px;
background: var(--neon-yellow);
color: var(--bg-primary);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 0.8rem;
}
.reason-icon[data-v-693a50fb] {
font-size: 2rem;
flex-shrink: 0;
}
.reason-info[data-v-693a50fb] {
flex: 1;
}
.reason-name[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
font-size: 1rem;
margin-bottom: 0.25rem;
}
.reason-description[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.85rem;
}
.custom-reason-section[data-v-693a50fb] {
margin-bottom: 2rem;
}
.custom-reason-section h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.duration-section[data-v-693a50fb] {
margin-bottom: 2rem;
}
.duration-section h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--text-primary);
font-size: 1rem;
}
.duration-options[data-v-693a50fb] {
display: flex;
gap: 0.75rem;
align-items: center;
flex-wrap: wrap;
}
.duration-btn[data-v-693a50fb] {
padding: 0.5rem 1rem;
border: 2px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
color: var(--text-primary);
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
min-width: 50px;
}
.duration-btn[data-v-693a50fb]:hover {
border-color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
transform: translateY(-1px);
}
.duration-btn.selected[data-v-693a50fb] {
border-color: var(--neon-blue);
background: var(--neon-blue);
color: var(--bg-primary);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.4);
}
.custom-duration[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-left: 1rem;
}
.duration-input[data-v-693a50fb] {
width: 70px;
padding: 0.5rem;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
text-align: center;
}
.duration-input[data-v-693a50fb]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 8px rgba(0, 245, 255, 0.3);
}
.custom-duration span[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.pause-summary[data-v-693a50fb] {
background: rgba(255, 193, 7, 0.05);
border: 1px solid rgba(255, 193, 7, 0.2);
border-radius: 12px;
padding: 1.5rem;
}
.pause-summary .summary-card h4[data-v-693a50fb] {
margin: 0 0 1rem 0;
color: var(--neon-yellow);
font-size: 1rem;
}
.pause-details[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.detail-row[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
}
.detail-row .label[data-v-693a50fb] {
font-size: 0.9rem;
color: var(--text-secondary);
font-weight: 500;
}
.detail-row .value[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 600;
}
.detail-row .value.warning[data-v-693a50fb] {
color: var(--neon-orange);
font-style: italic;
}
/* Yellow neon button styling (already exists but ensuring it's there) */
.btn-neon.neon-yellow[data-v-693a50fb] {
background: rgba(255, 193, 7, 0.2);
color: #ffc107;
border: 1px solid #ffc107;
}
.btn-neon.neon-yellow[data-v-693a50fb]:hover {
background: #ffc107;
color: #000;
box-shadow: 0 0 20px rgba(255, 193, 7, 0.5);
transform: translateY(-2px);
}
@media (max-width: 768px) {
.pause-player-modal[data-v-693a50fb] {
width: 95vw;
max-width: none;
}
.reason-grid[data-v-693a50fb] {
grid-template-columns: 1fr;
}
.duration-options[data-v-693a50fb] {
flex-direction: column;
align-items: stretch;
}
.custom-duration[data-v-693a50fb] {
margin-left: 0;
justify-content: center;
}
}
/* Close Rating Modal Styles */
.close-rating-summary[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 1.5rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.player-summary h3[data-v-693a50fb] {
margin: 0 0 0.5rem 0;
color: var(--neon-blue);
font-size: 1.2rem;
}
.player-summary p[data-v-693a50fb] {
margin: 0.25rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
.financial-summary[data-v-693a50fb] {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.summary-row[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.summary-row[data-v-693a50fb]:last-child {
border-bottom: none;
}
.summary-row.total-in[data-v-693a50fb] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
font-weight: 600;
color: var(--neon-green);
}
.summary-row label[data-v-693a50fb] {
color: var(--text-secondary);
font-size: 0.9rem;
}
.summary-row .amount[data-v-693a50fb] {
color: var(--text-primary);
font-weight: 500;
font-family: 'Courier New', monospace;
}
.calculated-results[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
padding: 1rem;
margin-top: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.result-row[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 1.1rem;
font-weight: 600;
}
.result-row label[data-v-693a50fb] {
color: var(--text-primary);
}
.result-row .amount[data-v-693a50fb] {
font-family: 'Courier New', monospace;
font-size: 1.2rem;
}
.result-row .amount.positive[data-v-693a50fb] {
color: var(--neon-green);
}
.result-row .amount.negative[data-v-693a50fb] {
color: #ff6b6b;
}
/* Quick Play Speed Control */
.play-speed-control[data-v-693a50fb] {
margin-top: 1rem;
}
.play-speed-control label[data-v-693a50fb] {
display: block;
color: var(--text-secondary);
font-size: 0.85rem;
margin-bottom: 0.5rem;
}
.speed-options[data-v-693a50fb] {
display: flex;
gap: 0.5rem;
}
.speed-chip[data-v-693a50fb] {
padding: 0.4rem 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 999px;
cursor: pointer;
transition: all 0.2s ease;
}
.speed-chip.active[data-v-693a50fb] {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
}
/* Professional Modal Styles */
.modal-overlay[data-v-693a50fb] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.75);
backdrop-filter: blur(8px);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
padding: 20px;
}
.modal-content[data-v-693a50fb] {
background: rgba(15, 23, 42, 0.95);
border: 1px solid rgba(148, 163, 184, 0.2);
border-radius: 16px;
box-shadow:
0 25px 50px -12px rgba(0, 0, 0, 0.5),
0 0 20px rgba(59, 130, 246, 0.1);
backdrop-filter: blur(16px);
max-width: 480px;
width: 100%;
max-height: 90vh;
overflow-y: auto;
transform: scale(0.95);
transition: all 0.2s ease;
}
.modal-header[data-v-693a50fb] {
padding: 24px 24px 0;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid rgba(148, 163, 184, 0.1);
margin-bottom: 24px;
}
.modal-header h2[data-v-693a50fb] {
margin: 0;
font-size: 1.5rem;
font-weight: 600;
}
.btn-close[data-v-693a50fb] {
background: none;
border: none;
color: #94a3b8;
font-size: 24px;
cursor: pointer;
padding: 8px;
margin: -8px;
border-radius: 8px;
transition: all 0.2s ease;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.btn-close[data-v-693a50fb]:hover {
background: rgba(248, 113, 113, 0.1);
color: #f87171;
}
.modal-body[data-v-693a50fb] {
padding: 0 24px;
}
.modal-footer[data-v-693a50fb] {
padding: 24px;
display: flex;
gap: 12px;
justify-content: flex-end;
border-top: 1px solid rgba(148, 163, 184, 0.1);
margin-top: 24px;
}
.player-summary-compact[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: flex-start;
background: rgba(59, 130, 246, 0.05);
border: 1px solid rgba(59, 130, 246, 0.2);
border-radius: 12px;
padding: 16px;
margin-bottom: 24px;
}
.player-info h3[data-v-693a50fb] {
margin: 0 0 4px;
color: #e2e8f0;
font-size: 1.1rem;
font-weight: 600;
}
.player-info p[data-v-693a50fb] {
margin: 0;
color: #94a3b8;
font-size: 0.9rem;
}
.current-bet[data-v-693a50fb],
.summary-row[data-v-693a50fb],
.current-cash[data-v-693a50fb] {
display: flex;
flex-direction: column;
align-items: flex-end;
text-align: right;
}
.current-bet .label[data-v-693a50fb],
.summary-row .label[data-v-693a50fb],
.current-cash .label[data-v-693a50fb] {
font-size: 0.8rem;
color: #94a3b8;
margin-bottom: 2px;
}
.current-bet .amount[data-v-693a50fb],
.summary-row .amount[data-v-693a50fb],
.current-cash .amount[data-v-693a50fb] {
font-size: 1rem;
font-weight: 600;
color: #e2e8f0;
}
.session-summary[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 8px;
}
.summary-row.total[data-v-693a50fb] {
border-top: 1px solid rgba(148, 163, 184, 0.2);
padding-top: 8px;
margin-top: 4px;
}
.summary-row.current[data-v-693a50fb] {
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
border-radius: 8px;
padding: 8px 12px;
margin-top: 8px;
}
.summary-row.current .amount[data-v-693a50fb] {
color: #22c55e;
}
.form-group[data-v-693a50fb] {
margin-bottom: 20px;
}
.form-group label[data-v-693a50fb] {
display: block;
margin-bottom: 8px;
color: #e2e8f0;
font-weight: 500;
}
.amount-input-group[data-v-693a50fb] {
position: relative;
display: flex;
align-items: center;
}
.currency-symbol[data-v-693a50fb] {
position: absolute;
left: 16px;
color: #94a3b8;
font-weight: 600;
z-index: 2;
pointer-events: none;
}
.amount-input[data-v-693a50fb] {
padding-left: 40px !important;
font-size: 1.1rem;
font-weight: 600;
text-align: left;
}
.input-glass[data-v-693a50fb] {
width: 100%;
padding: 14px 16px;
background: rgba(30, 41, 59, 0.8);
border: 1px solid rgba(148, 163, 184, 0.2);
border-radius: 12px;
color: #e2e8f0;
font-size: 1rem;
transition: all 0.2s ease;
backdrop-filter: blur(8px);
min-height: 44px;
}
.input-glass[data-v-693a50fb]:focus {
outline: none;
border-color: rgba(59, 130, 246, 0.5);
box-shadow: 0 0 20px rgba(59, 130, 246, 0.2);
background: rgba(30, 41, 59, 0.9);
}
.input-glass[data-v-693a50fb]::placeholder {
color: #64748b;
}
.input-hint[data-v-693a50fb] {
margin-top: 6px;
font-size: 0.8rem;
color: #64748b;
}
/* Avg Bet Warning System — tiered visual feedback */
.input-warning[data-v-693a50fb] {
border-color: rgba(245, 158, 11, 0.6) !important;
box-shadow: 0 0 8px rgba(245, 158, 11, 0.2) !important;
}
.input-danger[data-v-693a50fb] {
border-color: rgba(239, 68, 68, 0.7) !important;
box-shadow: 0 0 10px rgba(239, 68, 68, 0.3) !important;
animation: pulse-danger-693a50fb 1.5s ease-in-out infinite;
}
@keyframes pulse-danger-693a50fb {
0%, 100% { box-shadow: 0 0 10px rgba(239, 68, 68, 0.3);
}
50% { box-shadow: 0 0 16px rgba(239, 68, 68, 0.5);
}
}
.avg-bet-warning[data-v-693a50fb] {
margin-top: 6px;
padding: 6px 10px;
border-radius: 6px;
font-size: 0.8rem;
font-weight: 500;
display: flex;
align-items: center;
gap: 6px;
}
.avg-bet-warning.warning-yellow[data-v-693a50fb] {
background: rgba(245, 158, 11, 0.1);
border: 1px solid rgba(245, 158, 11, 0.3);
color: #f59e0b;
}
.avg-bet-warning.warning-red[data-v-693a50fb] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: #ef4444;
}
.preview-section[data-v-693a50fb],
.result-preview[data-v-693a50fb] {
margin: 20px 0;
}
.preview-card[data-v-693a50fb],
.result-card[data-v-693a50fb] {
background: rgba(30, 41, 59, 0.6);
border: 1px solid rgba(148, 163, 184, 0.1);
border-radius: 12px;
padding: 16px;
display: flex;
align-items: center;
justify-content: space-between;
}
.preview-item[data-v-693a50fb] {
display: flex;
flex-direction: column;
align-items: center;
}
.preview-label[data-v-693a50fb],
.result-label[data-v-693a50fb] {
font-size: 0.8rem;
color: #94a3b8;
margin-bottom: 4px;
}
.preview-value[data-v-693a50fb] {
font-size: 1.1rem;
font-weight: 600;
color: #e2e8f0;
}
.preview-arrow[data-v-693a50fb] {
color: #3b82f6;
font-size: 1.5rem;
margin: 0 16px;
}
.balance-warning[data-v-693a50fb] {
margin-top: 8px;
padding: 8px 12px;
background: rgba(239, 68, 68, 0.15);
border: 1px solid rgba(239, 68, 68, 0.4);
border-radius: 8px;
color: #fca5a5;
font-size: 0.85rem;
text-align: center;
}
.result-card[data-v-693a50fb] {
justify-content: center;
flex-direction: column;
text-align: center;
}
.result-amount[data-v-693a50fb] {
font-size: 1.3rem;
font-weight: 700;
margin-top: 4px;
}
.result-amount.positive[data-v-693a50fb] {
color: #22c55e;
}
.result-amount.negative[data-v-693a50fb] {
color: #ef4444;
}
.result-amount.neutral[data-v-693a50fb] {
color: #94a3b8;
}
/* Record Cash Out modal polish */
.record-cash-out-modal[data-v-693a50fb] {
max-width: 520px;
}
.record-cash-out-modal .modal-body[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 14px;
}
.record-cash-out-modal .player-summary-compact[data-v-693a50fb] {
flex-direction: column;
align-items: flex-start;
gap: 10px;
background: rgba(59, 130, 246, 0.08);
border-color: rgba(59, 130, 246, 0.3);
}
.record-cash-out-modal .player-summary-compact .player-info h3[data-v-693a50fb] {
margin: 0 0 4px 0;
line-height: 1.25;
}
.record-cash-out-modal .player-summary-compact .player-info p[data-v-693a50fb] {
margin: 0;
line-height: 1.3;
color: #cbd5e1;
}
.record-cash-out-modal .info-banner[data-v-693a50fb] {
display: grid;
grid-template-columns: auto 1fr;
align-items: flex-start;
gap: 12px;
width: 100%;
background: linear-gradient(135deg, rgba(59, 130, 246, 0.18), rgba(109, 40, 217, 0.14));
border: 1px solid rgba(124, 58, 237, 0.35);
border-radius: 14px;
padding: 14px 16px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.record-cash-out-modal .info-banner .banner-icon[data-v-693a50fb] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 12px;
font-size: 1.3rem;
color: #c084fc;
background: rgba(255, 255, 255, 0.08);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.record-cash-out-modal .info-banner .banner-content p[data-v-693a50fb] {
margin: 2px 0;
color: #e2e8f0;
line-height: 1.55;
}
.record-cash-out-modal .form-group[data-v-693a50fb] {
margin-bottom: 14px;
}
.record-cash-out-modal label[data-v-693a50fb] {
color: #e2e8f0;
font-weight: 700;
letter-spacing: 0.01em;
}
.record-cash-out-modal .amount-input-group[data-v-693a50fb] {
position: relative;
display: flex;
align-items: center;
}
.record-cash-out-modal .currency-symbol[data-v-693a50fb] {
left: 14px;
font-weight: 800;
color: #a5b4fc;
}
.record-cash-out-modal .amount-input[data-v-693a50fb] {
padding-left: 42px !important;
font-size: 1.2rem;
font-weight: 800;
height: 54px;
border: 1px solid rgba(165, 180, 252, 0.4);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.record-cash-out-modal .notes-input[data-v-693a50fb] {
min-height: 110px;
}
.record-cash-out-modal .input-hint[data-v-693a50fb] {
margin-top: 8px;
color: #94a3b8;
}
.record-cash-out-modal .preview-section[data-v-693a50fb] {
margin: 12px 0 4px;
}
.record-cash-out-modal .preview-card[data-v-693a50fb] {
display: grid;
grid-template-columns: auto 1fr;
gap: 12px;
align-items: center;
background: linear-gradient(135deg, rgba(109, 40, 217, 0.16), rgba(59, 130, 246, 0.12));
border: 1px solid rgba(124, 58, 237, 0.35);
border-radius: 14px;
padding: 14px 16px;
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}
.record-cash-out-modal .preview-icon[data-v-693a50fb] {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border-radius: 12px;
font-size: 1.25rem;
color: #c084fc;
background: rgba(255, 255, 255, 0.08);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.record-cash-out-modal .preview-label[data-v-693a50fb] {
font-size: 0.9rem;
letter-spacing: 0.01em;
display: inline-block;
margin-bottom: 2px;
}
.record-cash-out-modal .preview-value[data-v-693a50fb] {
font-size: 1.25rem;
font-weight: 800;
color: #e9d5ff;
line-height: 1.35;
}
.record-cash-out-modal .preview-note[data-v-693a50fb] {
grid-column: 1 / -1;
font-size: 0.92rem;
color: #cbd5e1;
margin-top: 6px;
}
.record-cash-out-modal .modal-footer[data-v-693a50fb] {
padding: 20px 24px;
border-top: 1px solid rgba(148, 163, 184, 0.1);
}
.btn-glass[data-v-693a50fb] {
padding: 12px 24px;
background: rgba(30, 41, 59, 0.8);
border: 1px solid rgba(148, 163, 184, 0.2);
border-radius: 12px;
color: #e2e8f0;
font-weight: 500;
cursor: pointer;
transition: all 0.2s ease;
backdrop-filter: blur(8px);
min-height: 44px;
min-width: 100px;
}
.btn-glass[data-v-693a50fb]:hover {
background: rgba(30, 41, 59, 0.9);
border-color: rgba(148, 163, 184, 0.3);
transform: translateY(-1px);
}
.btn-neon[data-v-693a50fb] {
padding: 12px 24px;
border: none;
border-radius: 12px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
position: relative;
overflow: hidden;
min-height: 44px;
min-width: 120px;
}
.btn-neon[data-v-693a50fb]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none !important;
}
.btn-neon.neon-green[data-v-693a50fb] {
background: linear-gradient(135deg, #22c55e, #16a34a);
color: white;
box-shadow: 0 0 20px rgba(34, 197, 94, 0.3);
}
.btn-neon.neon-green[data-v-693a50fb]:hover:not(:disabled) {
box-shadow: 0 0 30px rgba(34, 197, 94, 0.5);
transform: translateY(-2px);
}
/* Primary action bar overrides: keep buttons compact and centered */
.primary-action-buttons .btn-neon[data-v-693a50fb],
.primary-action-buttons .btn-glass[data-v-693a50fb] {
padding: 10px 12px;
min-height: 40px;
font-size: 0.85rem;
justify-content: center;
}
/* Animation Classes */
.animate-fade-in[data-v-693a50fb] {
animation: modalFadeIn-693a50fb 0.2s ease-out;
}
.animate-scale-in[data-v-693a50fb] {
animation: modalScaleIn-693a50fb 0.2s ease-out;
}
@keyframes modalFadeIn-693a50fb {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes modalScaleIn-693a50fb {
from {
opacity: 0;
transform: scale(0.9) translateY(20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
/* Mobile Responsiveness for Modals */
@media (max-width: 640px) {
.modal-content[data-v-693a50fb] {
margin: 10px;
max-height: 95vh;
}
.modal-header[data-v-693a50fb],
.modal-body[data-v-693a50fb],
.modal-footer[data-v-693a50fb] {
padding-left: 16px;
padding-right: 16px;
}
.player-summary-compact[data-v-693a50fb] {
flex-direction: column;
gap: 12px;
}
.current-bet[data-v-693a50fb],
.summary-row[data-v-693a50fb] {
align-items: flex-start;
text-align: left;
}
.modal-footer[data-v-693a50fb] {
flex-direction: column-reverse;
}
.btn-glass[data-v-693a50fb],
.btn-neon[data-v-693a50fb] {
width: 100%;
}
}
/* Quick Move Modal Styles */
.quick-move-modal[data-v-693a50fb] {
max-width: 600px;
}
.seat-grid-quick[data-v-693a50fb] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 16px;
margin: 24px 0;
}
.seat-btn-quick[data-v-693a50fb] {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 24px 16px;
background: rgba(255, 255, 255, 0.03);
border: 2px solid rgba(148, 163, 184, 0.2);
border-radius: 12px;
cursor: pointer;
transition: all 0.2s ease;
min-height: 100px;
}
.seat-btn-quick .seat-number[data-v-693a50fb] {
font-size: 2rem;
font-weight: 700;
color: #e2e8f0;
margin-bottom: 8px;
}
.seat-btn-quick .seat-label[data-v-693a50fb] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #94a3b8;
font-weight: 600;
}
/* Current seat styling */
.seat-btn-quick.current[data-v-693a50fb] {
background: rgba(59, 130, 246, 0.1);
border-color: rgba(59, 130, 246, 0.5);
}
.seat-btn-quick.current .seat-number[data-v-693a50fb] {
color: #3b82f6;
}
.seat-btn-quick.current .seat-label[data-v-693a50fb] {
color: #3b82f6;
}
/* Occupied seat styling */
.seat-btn-quick.occupied[data-v-693a50fb] {
background: rgba(239, 68, 68, 0.05);
border-color: rgba(239, 68, 68, 0.3);
cursor: not-allowed;
opacity: 0.5;
}
.seat-btn-quick.occupied .seat-number[data-v-693a50fb] {
color: #ef4444;
}
.seat-btn-quick.occupied .seat-label[data-v-693a50fb] {
color: #ef4444;
}
/* Available seat hover */
.seat-btn-quick.available[data-v-693a50fb]:hover:not(:disabled) {
background: rgba(34, 197, 94, 0.1);
border-color: rgba(34, 197, 94, 0.5);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(34, 197, 94, 0.2);
}
.seat-btn-quick.available:hover:not(:disabled) .seat-number[data-v-693a50fb] {
color: #22c55e;
}
/* Selected seat styling */
.seat-btn-quick.selected[data-v-693a50fb] {
background: rgba(34, 197, 94, 0.15);
border-color: #22c55e;
box-shadow: 0 0 20px rgba(34, 197, 94, 0.3);
}
.seat-btn-quick.selected .seat-number[data-v-693a50fb] {
color: #22c55e;
}
.seat-btn-quick.selected .seat-label[data-v-693a50fb] {
color: #22c55e;
}
/* Move summary compact */
.move-summary-compact[data-v-693a50fb] {
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
padding: 20px;
background: rgba(59, 130, 246, 0.05);
border: 1px solid rgba(59, 130, 246, 0.2);
border-radius: 12px;
margin-top: 24px;
}
.move-summary-compact .summary-row[data-v-693a50fb] {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.move-summary-compact .label[data-v-693a50fb] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #94a3b8;
font-weight: 600;
}
.move-summary-compact .value[data-v-693a50fb] {
font-size: 1.5rem;
font-weight: 700;
color: #e2e8f0;
}
.move-summary-compact .arrow-icon[data-v-693a50fb] {
font-size: 2rem;
color: #3b82f6;
font-weight: bold;
}
/* Clickable seat number in rating slip list */
.seat-number.clickable[data-v-693a50fb] {
cursor: pointer;
transition: all 0.2s ease;
padding: 4px 8px;
border-radius: 6px;
}
.seat-number.clickable[data-v-693a50fb]:hover {
background: rgba(59, 130, 246, 0.1);
color: #3b82f6;
transform: scale(1.05);
}
/* Loading state */
.loading-message[data-v-693a50fb] {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding: 40px 20px;
color: #94a3b8;
font-size: 0.95rem;
}
.loading-message i[data-v-693a50fb] {
font-size: 1.5rem;
color: #3b82f6;
}
/* Responsive adjustments for Quick Move */
@media (max-width: 640px) {
.seat-grid-quick[data-v-693a50fb] {
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
.seat-btn-quick[data-v-693a50fb] {
min-height: 80px;
padding: 16px 12px;
}
.seat-btn-quick .seat-number[data-v-693a50fb] {
font-size: 1.5rem;
}
.move-summary-compact[data-v-693a50fb] {
flex-direction: column;
gap: 12px;
}
.move-summary-compact .arrow-icon[data-v-693a50fb] {
transform: rotate(90deg);
}
}
/* ============================================
AUTO-PRINT TOGGLE STYLES
============================================ */
.auto-print-toggle[data-v-693a50fb] {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 16px;
background: rgba(0, 0, 0, 0.3);
border: 2px solid rgba(100, 100, 100, 0.4);
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
user-select: none;
}
.auto-print-toggle[data-v-693a50fb]:hover {
background: rgba(0, 0, 0, 0.4);
border-color: rgba(150, 150, 150, 0.5);
}
.auto-print-toggle.active[data-v-693a50fb] {
background: rgba(57, 255, 20, 0.15);
border-color: var(--neon-green);
box-shadow: 0 0 15px rgba(57, 255, 20, 0.3);
}
.auto-print-toggle input[type="checkbox"][data-v-693a50fb] {
appearance: none;
-webkit-appearance: none;
width: 18px;
height: 18px;
border: 2px solid rgba(150, 150, 150, 0.5);
border-radius: 4px;
background: rgba(0, 0, 0, 0.3);
cursor: pointer;
transition: all 0.2s ease;
position: relative;
}
.auto-print-toggle input[type="checkbox"][data-v-693a50fb]:checked {
background: var(--neon-green);
border-color: var(--neon-green);
}
.auto-print-toggle input[type="checkbox"][data-v-693a50fb]:checked::after {
content: '✓';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #000;
font-size: 12px;
font-weight: bold;
}
.auto-print-toggle .toggle-label[data-v-693a50fb] {
font-size: 0.9rem;
font-weight: 500;
color: rgba(255, 255, 255, 0.8);
white-space: nowrap;
}
.auto-print-toggle.active .toggle-label[data-v-693a50fb] {
color: var(--neon-green);
}
/* Responsive adjustments for toggle */
@media (max-width: 768px) {
.auto-print-toggle[data-v-693a50fb] {
padding: 6px 12px;
}
.auto-print-toggle .toggle-label[data-v-693a50fb] {
font-size: 0.8rem;
}
}
/* ═══════════════════════════════════════════════════════════════════════════
RECORD CASH OUT MODAL - BEM-style unique classes
═══════════════════════════════════════════════════════════════════════════ */
.cash-out-modal-overlay[data-v-693a50fb] {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.7);
backdrop-filter: blur(4px);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.cash-out-modal[data-v-693a50fb] {
background: linear-gradient(145deg, rgba(30, 35, 45, 0.98), rgba(20, 25, 35, 0.98));
border: 1px solid rgba(100, 200, 255, 0.3);
border-radius: 16px;
width: 90%;
max-width: 480px;
max-height: 90vh;
overflow-y: auto;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(100, 200, 255, 0.1);
}
.cash-out-modal__header[data-v-693a50fb] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 24px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.cash-out-modal__title[data-v-693a50fb] {
font-size: 1.4rem;
font-weight: 600;
color: #fff;
display: flex;
align-items: center;
gap: 10px;
margin: 0;
}
.cash-out-modal__close-btn[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.15);
border: 1px solid rgba(255, 255, 255, 0.2);
color: rgba(255, 255, 255, 0.9);
width: 32px;
height: 32px;
border-radius: 8px;
cursor: pointer;
font-size: 1rem;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
}
.cash-out-modal__close-btn[data-v-693a50fb]:hover {
background: rgba(255, 80, 80, 0.4);
border-color: rgba(255, 80, 80, 0.6);
color: #fff;
transform: scale(1.05);
}
.cash-out-modal__body[data-v-693a50fb] {
padding: 24px;
display: flex;
flex-direction: column;
gap: 20px;
}
.cash-out-modal__player-card[data-v-693a50fb] {
background: rgba(100, 200, 255, 0.1);
border: 1px solid rgba(100, 200, 255, 0.2);
border-radius: 12px;
padding: 16px;
display: flex;
flex-direction: column;
gap: 4px;
}
.cash-out-modal__player-name[data-v-693a50fb] {
font-size: 1.25rem;
font-weight: 700;
color: #fff;
margin: 0;
line-height: 1.3;
}
.cash-out-modal__player-location[data-v-693a50fb] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.6);
margin: 0;
}
.cash-out-modal__info-banner[data-v-693a50fb] {
background: rgba(255, 200, 100, 0.15);
border: 1px solid rgba(255, 200, 100, 0.3);
border-radius: 10px;
padding: 14px 16px;
display: flex;
align-items: flex-start;
gap: 12px;
}
.cash-out-modal__info-icon[data-v-693a50fb] {
font-size: 1.2rem;
flex-shrink: 0;
line-height: 1.4;
}
.cash-out-modal__info-text[data-v-693a50fb] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.85);
line-height: 1.5;
margin: 0;
}
.cash-out-modal__field[data-v-693a50fb] {
display: flex;
flex-direction: column;
gap: 8px;
}
.cash-out-modal__label[data-v-693a50fb] {
font-size: 0.95rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
display: flex;
align-items: center;
gap: 8px;
}
.cash-out-modal__amount-wrapper[data-v-693a50fb] {
display: flex;
align-items: center;
background: rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
padding: 0 16px;
transition: border-color 0.2s ease;
}
.cash-out-modal__amount-wrapper[data-v-693a50fb]:focus-within {
border-color: rgba(100, 200, 255, 0.5);
}
.cash-out-modal__currency[data-v-693a50fb] {
font-size: 1.5rem;
font-weight: 700;
color: var(--neon-green, #00ff88);
margin-right: 8px;
}
.cash-out-modal__amount-input[data-v-693a50fb] {
flex: 1;
background: transparent;
border: none;
color: #fff;
font-size: 1.8rem;
font-weight: 700;
padding: 16px 0;
outline: none;
overflow: hidden;
appearance: textfield;
-moz-appearance: textfield;
}
.cash-out-modal__amount-input[data-v-693a50fb]::-webkit-outer-spin-button,
.cash-out-modal__amount-input[data-v-693a50fb]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.cash-out-modal__amount-input[data-v-693a50fb]::placeholder {
color: rgba(255, 255, 255, 0.3);
}
.cash-out-modal__hint[data-v-693a50fb] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 4px;
}
.cash-out-modal__notes[data-v-693a50fb] {
width: 100%;
min-height: 80px;
background: rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
padding: 14px 16px;
color: #fff;
font-size: 0.95rem;
resize: vertical;
outline: none;
transition: border-color 0.2s ease;
}
.cash-out-modal__notes[data-v-693a50fb]:focus {
border-color: rgba(100, 200, 255, 0.5);
}
.cash-out-modal__notes[data-v-693a50fb]::placeholder {
color: rgba(255, 255, 255, 0.4);
}
.cash-out-modal__preview[data-v-693a50fb] {
background: rgba(0, 200, 150, 0.1);
border: 1px solid rgba(0, 200, 150, 0.3);
border-radius: 12px;
padding: 16px;
display: flex;
flex-direction: column;
gap: 12px;
}
.cash-out-modal__preview-row[data-v-693a50fb] {
display: flex;
align-items: center;
gap: 12px;
}
.cash-out-modal__preview-icon[data-v-693a50fb] {
font-size: 1.3rem;
flex-shrink: 0;
}
.cash-out-modal__preview-label[data-v-693a50fb] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
white-space: nowrap;
}
.cash-out-modal__preview-amount[data-v-693a50fb] {
font-size: 1.4rem;
font-weight: 700;
color: var(--neon-green, #00ff88);
margin-left: auto;
}
.cash-out-modal__preview-note[data-v-693a50fb] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
font-style: italic;
word-break: break-word;
}
.cash-out-modal__footer[data-v-693a50fb] {
display: flex;
gap: 12px;
padding: 20px 24px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.cash-out-modal__btn[data-v-693a50fb] {
flex: 1;
padding: 14px 24px;
border-radius: 10px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
border: none;
}
.cash-out-modal__btn--cancel[data-v-693a50fb] {
background: rgba(255, 255, 255, 0.1);
color: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.cash-out-modal__btn--cancel[data-v-693a50fb]:hover {
background: rgba(255, 255, 255, 0.15);
color: #fff;
}
.cash-out-modal__btn--submit[data-v-693a50fb] {
background: linear-gradient(135deg, var(--neon-green, #00ff88), #00cc66);
color: #000;
}
.cash-out-modal__btn--submit[data-v-693a50fb]:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(0, 255, 136, 0.3);
}
.cash-out-modal__btn--submit[data-v-693a50fb]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.modal-overlay[data-v-3a6520b9] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.75);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
padding: 1rem;
backdrop-filter: blur(8px);
animation: fadeIn-3a6520b9 0.2s ease;
}
@keyframes fadeIn-3a6520b9 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.modal-container[data-v-3a6520b9] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 16px;
max-width: 95vw;
max-height: 95vh;
width: 1400px;
display: flex;
flex-direction: column;
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
animation: slideUp-3a6520b9 0.3s ease;
}
@keyframes slideUp-3a6520b9 {
from {
transform: translateY(30px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
.modal-header[data-v-3a6520b9] {
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(100, 255, 218, 0.2);
display: flex;
justify-content: space-between;
align-items: center;
background: rgba(100, 255, 218, 0.05);
}
.header-content h2[data-v-3a6520b9] {
margin: 0;
color: #64ffda;
font-size: 1.75rem;
font-weight: 600;
}
.player-meta[data-v-3a6520b9] {
margin: 0.25rem 0 0 0;
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
}
.btn-close[data-v-3a6520b9] {
background: transparent;
border: none;
color: rgba(255, 255, 255, 0.8);
font-size: 2rem;
cursor: pointer;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.2s;
}
.btn-close[data-v-3a6520b9]:hover {
background: rgba(244, 67, 54, 0.2);
color: #f44336;
transform: rotate(90deg);
}
.modal-body[data-v-3a6520b9] {
padding: 2rem;
overflow-y: auto;
flex: 1;
}
.modal-footer[data-v-3a6520b9] {
padding: 1rem 2rem;
border-top: 1px solid rgba(100, 255, 218, 0.2);
display: flex;
justify-content: flex-end;
gap: 1rem;
}
/* Filters Section */
.filters-section[data-v-3a6520b9] {
padding: 1.5rem;
margin-bottom: 1.5rem;
}
.filters-section h3[data-v-3a6520b9] {
margin: 0 0 1rem 0;
color: #64ffda;
font-size: 1.1rem;
}
.filters-grid[data-v-3a6520b9] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
align-items: end;
}
.filter-group label[data-v-3a6520b9] {
display: block;
color: rgba(255, 255, 255, 0.8);
font-size: 0.9rem;
margin-bottom: 0.5rem;
}
.input-glass[data-v-3a6520b9] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
color: #fff;
font-size: 0.95rem;
transition: all 0.2s;
}
.input-glass[data-v-3a6520b9]:focus {
outline: none;
border-color: #64ffda;
background: rgba(255, 255, 255, 0.08);
box-shadow: 0 0 0 3px rgba(100, 255, 218, 0.1);
}
.period-meta[data-v-3a6520b9] {
margin-top: 1rem;
text-align: center;
}
.badge[data-v-3a6520b9] {
display: inline-block;
padding: 0.5rem 1rem;
background: rgba(100, 255, 218, 0.1);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 20px;
color: #64ffda;
font-size: 0.9rem;
font-weight: 500;
}
/* Summary Grid */
.summary-grid[data-v-3a6520b9] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
.stat[data-v-3a6520b9] {
padding: 1.25rem;
display: flex;
align-items: center;
gap: 1rem;
transition: transform 0.2s;
}
.stat[data-v-3a6520b9]:hover {
transform: translateY(-2px);
}
.stat-icon[data-v-3a6520b9] {
font-size: 2rem;
}
.stat-content[data-v-3a6520b9] {
flex: 1;
}
.stat-label[data-v-3a6520b9] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
margin-bottom: 0.25rem;
}
.stat-value[data-v-3a6520b9] {
font-size: 1.5rem;
font-weight: 700;
color: #fff;
}
.stat-sublabel[data-v-3a6520b9] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 0.25rem;
}
.stat-compact .stat-value[data-v-3a6520b9] {
font-size: 1.25rem;
}
.positive[data-v-3a6520b9] {
color: #4caf50 !important;
}
.negative[data-v-3a6520b9] {
color: #f44336 !important;
}
.neutral[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.6) !important;
}
/* Tier History Styling */
.row-promotion[data-v-3a6520b9] {
background: rgba(76, 175, 80, 0.08) !important;
}
.row-demotion[data-v-3a6520b9] {
background: rgba(244, 67, 54, 0.08) !important;
}
.badge-tier[data-v-3a6520b9] {
display: inline-block;
padding: 2px 8px;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.badge-tier.promotion[data-v-3a6520b9] {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.badge-tier.demotion[data-v-3a6520b9] {
background: rgba(244, 67, 54, 0.2);
color: #f44336;
}
.badge-tier.lateral[data-v-3a6520b9] {
background: rgba(255, 193, 7, 0.2);
color: #ffc107;
}
.badge-tier.auto[data-v-3a6520b9] {
background: rgba(33, 150, 243, 0.2);
color: #2196f3;
}
.badge-tier.manual[data-v-3a6520b9] {
background: rgba(156, 39, 176, 0.2);
color: #ce93d8;
}
/* Loading State */
.loading-state[data-v-3a6520b9] {
text-align: center;
padding: 3rem;
color: rgba(255, 255, 255, 0.6);
}
.spinner[data-v-3a6520b9] {
width: 50px;
height: 50px;
border: 4px solid rgba(100, 255, 218, 0.2);
border-top-color: #64ffda;
border-radius: 50%;
animation: spin-3a6520b9 1s linear infinite;
margin: 0 auto 1rem;
}
@keyframes spin-3a6520b9 {
to {
transform: rotate(360deg);
}
}
/* Error Box */
.error-box[data-v-3a6520b9] {
padding: 1rem;
background: rgba(244, 67, 54, 0.1);
border: 1px solid rgba(244, 67, 54, 0.3);
border-radius: 8px;
color: #f44336;
margin-bottom: 1.5rem;
}
/* Tabs */
.tabs-container[data-v-3a6520b9] {
padding: 0;
overflow: hidden;
}
.tabs-header[data-v-3a6520b9] {
display: flex;
gap: 0.5rem;
padding: 1rem 1rem 0;
overflow-x: auto;
border-bottom: 1px solid rgba(100, 255, 218, 0.2);
}
.tab-button[data-v-3a6520b9] {
padding: 0.75rem 1.5rem;
background: transparent;
border: none;
border-bottom: 2px solid transparent;
color: rgba(255, 255, 255, 0.6);
font-size: 0.95rem;
cursor: pointer;
white-space: nowrap;
transition: all 0.2s;
}
.tab-button[data-v-3a6520b9]:hover {
color: #64ffda;
background: rgba(100, 255, 218, 0.05);
}
.tab-button.active[data-v-3a6520b9] {
color: #64ffda;
border-bottom-color: #64ffda;
background: rgba(100, 255, 218, 0.1);
}
.tabs-content[data-v-3a6520b9] {
padding: 1.5rem;
}
.tab-pane[data-v-3a6520b9] {
animation: fadeIn-3a6520b9 0.3s ease;
}
/* Table Controls */
.table-controls[data-v-3a6520b9] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
gap: 1rem;
}
.search-input[data-v-3a6520b9] {
flex: 1;
max-width: 400px;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
color: #fff;
font-size: 0.95rem;
}
.search-input[data-v-3a6520b9]:focus {
outline: none;
border-color: #64ffda;
box-shadow: 0 0 0 3px rgba(100, 255, 218, 0.1);
}
/* Table */
.table-responsive[data-v-3a6520b9] {
overflow-x: auto;
}
.data-table[data-v-3a6520b9] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.data-table.sortable th[data-v-3a6520b9] {
cursor: pointer;
user-select: none;
transition: all 0.2s;
}
.data-table.sortable th[data-v-3a6520b9]:hover {
background: rgba(100, 255, 218, 0.2);
}
.data-table th[data-v-3a6520b9] {
padding: 0.75rem 0.6rem;
text-align: left;
background: rgba(30, 35, 45, 0.95);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
color: #64ffda;
font-weight: 600;
font-size: 0.8rem;
border-bottom: 2px solid rgba(100, 255, 218, 0.3);
white-space: nowrap;
position: sticky;
top: 0;
z-index: 1;
}
.data-table td[data-v-3a6520b9] {
padding: 0.65rem 0.6rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
color: rgba(255, 255, 255, 0.9);
font-size: 0.85rem;
}
.data-table tbody tr[data-v-3a6520b9] {
transition: background 0.2s;
}
.data-table tbody tr[data-v-3a6520b9]:hover {
background: rgba(100, 255, 218, 0.05);
}
.data-table tbody tr.has-house-subsidy[data-v-3a6520b9] {
background: rgba(245, 158, 11, 0.05);
}
/* Points Cells */
.points-header[data-v-3a6520b9] {
text-align: center;
font-size: 0.75rem;
}
.cell-points[data-v-3a6520b9] {
text-align: center;
min-width: 70px;
}
.points-value[data-v-3a6520b9] {
font-weight: 600;
font-size: 0.85rem;
color: #64ffda;
}
.points-value.house[data-v-3a6520b9] {
color: #f59e0b;
}
.points-value.total[data-v-3a6520b9] {
color: #60a5fa;
}
.points-none[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.3);
font-size: 0.8rem;
}
.cell-points.highlighted[data-v-3a6520b9] {
background: rgba(245, 158, 11, 0.15);
border-left: 2px solid #f59e0b;
}
.notes-cell[data-v-3a6520b9] {
max-width: 150px;
min-width: 60px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 0.78rem;
color: rgba(255, 255, 255, 0.65);
}
.serial-cell[data-v-3a6520b9] {
font-family: 'Courier New', monospace;
font-size: 0.8rem;
}
.serial-cell code[data-v-3a6520b9] {
background: rgba(100, 255, 218, 0.1);
padding: 0.25rem 0.5rem;
border-radius: 4px;
color: #64ffda;
font-weight: 600;
}
.type-badge[data-v-3a6520b9] {
display: inline-block;
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-size: 0.8rem;
font-weight: 600;
text-transform: capitalize;
}
.type-comp[data-v-3a6520b9] {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.type-buy-in[data-v-3a6520b9] {
background: rgba(33, 150, 243, 0.2);
color: #2196f3;
}
.type-cash-out[data-v-3a6520b9] {
background: rgba(255, 152, 0, 0.2);
color: #ff9800;
}
.type-adjustment[data-v-3a6520b9] {
background: rgba(156, 39, 176, 0.2);
color: #9c27b0;
}
.role-badge[data-v-3a6520b9] {
display: inline-block;
margin-left: 0.5rem;
padding: 0.125rem 0.5rem;
background: rgba(100, 255, 218, 0.15);
border-radius: 8px;
font-size: 0.7rem;
color: rgba(100, 255, 218, 0.8);
text-transform: uppercase;
font-weight: 500;
}
/* Pagination */
.pagination[data-v-3a6520b9] {
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
margin-top: 1.5rem;
padding: 1rem;
}
.pagination button[data-v-3a6520b9] {
padding: 0.5rem 1rem;
background: rgba(100, 255, 218, 0.1);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
color: #64ffda;
cursor: pointer;
transition: all 0.2s;
}
.pagination button[data-v-3a6520b9]:hover:not(:disabled) {
background: rgba(100, 255, 218, 0.2);
transform: translateY(-1px);
}
.pagination button[data-v-3a6520b9]:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.pagination span[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.8);
font-size: 0.9rem;
}
/* Notes List */
.notes-list[data-v-3a6520b9] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.note-card[data-v-3a6520b9] {
padding: 1rem;
animation: slideIn-3a6520b9 0.3s ease;
}
@keyframes slideIn-3a6520b9 {
from {
opacity: 0;
transform: translateX(-10px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
.note-header[data-v-3a6520b9] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.75rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(100, 255, 218, 0.2);
}
.note-author[data-v-3a6520b9] {
font-weight: 600;
color: #64ffda;
}
.note-date[data-v-3a6520b9] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
}
.note-content[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.9);
line-height: 1.6;
}
.note-footer[data-v-3a6520b9] {
margin-top: 0.75rem;
padding-top: 0.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.note-category[data-v-3a6520b9] {
display: inline-block;
padding: 0.25rem 0.75rem;
background: rgba(100, 255, 218, 0.1);
border-radius: 12px;
font-size: 0.8rem;
color: #64ffda;
}
/* Alerts List */
.alerts-list[data-v-3a6520b9] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.alert-card[data-v-3a6520b9] {
padding: 1rem;
border-left: 4px solid;
animation: slideIn-3a6520b9 0.3s ease;
}
.alert-card.alert-high[data-v-3a6520b9] {
border-left-color: #f44336;
background: rgba(244, 67, 54, 0.1);
}
.alert-card.alert-medium[data-v-3a6520b9] {
border-left-color: #ff9800;
background: rgba(255, 152, 0, 0.1);
}
.alert-card.alert-low[data-v-3a6520b9] {
border-left-color: #2196f3;
background: rgba(33, 150, 243, 0.1);
}
.alert-header[data-v-3a6520b9] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.75rem;
}
.alert-type[data-v-3a6520b9] {
font-weight: 600;
color: #64ffda;
text-transform: uppercase;
font-size: 0.85rem;
}
.alert-date[data-v-3a6520b9] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
}
.alert-content[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.9);
line-height: 1.6;
}
.alert-footer[data-v-3a6520b9] {
margin-top: 0.75rem;
padding-top: 0.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.resolved-badge[data-v-3a6520b9] {
display: inline-block;
padding: 0.25rem 0.75rem;
background: rgba(76, 175, 80, 0.2);
border-radius: 12px;
font-size: 0.8rem;
color: #4caf50;
}
/* No Data */
.no-data[data-v-3a6520b9] {
text-align: center;
padding: 3rem;
color: rgba(255, 255, 255, 0.5);
font-style: italic;
}
/* Buttons */
.btn-neon[data-v-3a6520b9],
.btn-glass[data-v-3a6520b9] {
padding: 0.75rem 1.5rem;
border: none;
border-radius: 8px;
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s;
}
.btn-neon.btn-primary[data-v-3a6520b9] {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: #fff;
box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}
.btn-neon.btn-primary[data-v-3a6520b9]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}
.btn-neon.btn-primary[data-v-3a6520b9]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.btn-glass[data-v-3a6520b9] {
background: rgba(100, 255, 218, 0.1);
border: 1px solid rgba(100, 255, 218, 0.3);
color: #64ffda;
}
.btn-glass[data-v-3a6520b9]:hover {
background: rgba(100, 255, 218, 0.2);
transform: translateY(-1px);
}
.btn-sm[data-v-3a6520b9] {
padding: 0.5rem 1rem;
font-size: 0.85rem;
}
/* Export Dropdown */
.export-dropdown[data-v-3a6520b9] {
position: relative;
display: inline-block;
}
.export-dropdown .btn-glass[data-v-3a6520b9] {
cursor: pointer;
}
.export-dropdown .dropdown-menu[data-v-3a6520b9] {
position: absolute;
right: 0;
top: 100%;
margin-top: 0.25rem;
background: rgba(30, 30, 40, 0.95);
backdrop-filter: blur(10px);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
min-width: 120px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
z-index: 1000;
}
.export-dropdown .dropdown-menu a[data-v-3a6520b9] {
display: block;
padding: 0.5rem 1rem;
color: rgba(255, 255, 255, 0.8);
text-decoration: none;
transition: all 0.2s;
cursor: pointer;
}
.export-dropdown .dropdown-menu a[data-v-3a6520b9]:hover {
background: rgba(100, 255, 218, 0.1);
color: #64ffda;
}
.export-dropdown .dropdown-menu a[data-v-3a6520b9]:first-child {
border-radius: 8px 8px 0 0;
}
.export-dropdown .dropdown-menu a[data-v-3a6520b9]:last-child {
border-radius: 0 0 8px 8px;
}
.card-glass[data-v-3a6520b9],
.card-glass-strong[data-v-3a6520b9] {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(10px);
border: 1px solid rgba(100, 255, 218, 0.2);
border-radius: 12px;
}
.card-glass-strong[data-v-3a6520b9] {
background: rgba(255, 255, 255, 0.05);
border-width: 2px;
}
/* Compliance Modal */
.modal-md[data-v-3a6520b9] {
max-width: 600px;
width: 90%;
}
.form-group[data-v-3a6520b9] {
margin-bottom: 1.25rem;
}
.form-group label[data-v-3a6520b9] {
display: block;
margin-bottom: 0.5rem;
color: #64ffda;
font-weight: 600;
font-size: 0.9rem;
}
.form-hint[data-v-3a6520b9] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 0.25rem;
}
.form-row[data-v-3a6520b9] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.input-glass[data-v-3a6520b9] {
width: 100%;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
color: #fff;
font-size: 0.95rem;
transition: all 0.2s;
}
.input-glass[data-v-3a6520b9]:focus {
outline: none;
border-color: #64ffda;
background: rgba(255, 255, 255, 0.08);
}
.form-actions[data-v-3a6520b9] {
display: flex;
justify-content: flex-end;
gap: 0.75rem;
margin-top: 1.5rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(100, 255, 218, 0.2);
}
.required[data-v-3a6520b9] {
color: #ff6b6b;
}
.btn-success[data-v-3a6520b9] {
background: rgba(76, 175, 80, 0.2);
border-color: rgba(76, 175, 80, 0.5);
color: #4caf50;
}
.btn-success[data-v-3a6520b9]:hover:not(:disabled) {
background: rgba(76, 175, 80, 0.3);
border-color: rgba(76, 175, 80, 0.7);
}
.btn-primary[data-v-3a6520b9] {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: #fff;
border: none;
}
.btn-primary[data-v-3a6520b9]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}
.btn-primary[data-v-3a6520b9]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* Compliance Alert Card */
.compliance-alert[data-v-3a6520b9] {
margin: 1.5rem 0;
padding: 1.5rem;
border-left: 4px solid #ff6b6b;
}
.compliance-alert.alert-critical[data-v-3a6520b9] {
border-left-color: #ff3860;
background: rgba(255, 56, 96, 0.1);
}
.compliance-alert.alert-high[data-v-3a6520b9] {
border-left-color: #ffb23e;
background: rgba(255, 178, 62, 0.1);
}
.compliance-alert-header[data-v-3a6520b9] {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1rem;
}
.compliance-icon[data-v-3a6520b9] {
font-size: 1.5rem;
}
.compliance-title[data-v-3a6520b9] {
font-size: 1.1rem;
font-weight: 700;
color: #fff;
}
.compliance-details[data-v-3a6520b9] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
padding: 1rem;
background: rgba(0, 0, 0, 0.2);
border-radius: 8px;
}
.compliance-amount[data-v-3a6520b9],
.compliance-total[data-v-3a6520b9],
.compliance-period[data-v-3a6520b9] {
color: rgba(255, 255, 255, 0.9);
}
.compliance-total[data-v-3a6520b9] {
font-size: 1.1rem;
color: #64ffda;
}
.compliance-actions[data-v-3a6520b9] {
display: flex;
justify-content: flex-end;
gap: 0.75rem;
}
.btn-warning[data-v-3a6520b9] {
background: rgba(255, 178, 62, 0.2);
border-color: rgba(255, 178, 62, 0.5);
color: #ffb23e;
font-weight: 600;
}
.btn-warning[data-v-3a6520b9]:hover:not(:disabled) {
background: rgba(255, 178, 62, 0.3);
border-color: rgba(255, 178, 62, 0.7);
transform: translateY(-1px);
}
.compliance-docs-modal[data-v-d0b690af] {
width: 90vw;
max-width: 960px;
max-height: 90vh;
display: flex;
flex-direction: column;
}
.modal-header[data-v-d0b690af] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24px 32px 16px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-d0b690af] {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.btn-close[data-v-d0b690af] {
background: rgba(255, 255, 255, 0.1);
border: none;
color: white;
width: 32px;
height: 32px;
border-radius: 50%;
cursor: pointer;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s;
}
.btn-close[data-v-d0b690af]:hover {
background: rgba(255, 0, 58, 0.3);
transform: scale(1.1);
}
/* Player Info */
.player-info-section[data-v-d0b690af] {
padding: 12px 32px;
}
.player-summary[data-v-d0b690af] {
display: flex;
gap: 16px;
align-items: center;
padding: 12px 16px;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
}
.player-avatar[data-v-d0b690af] {
width: 48px;
height: 48px;
border-radius: 50%;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
font-weight: 700;
color: white;
background-size: cover;
background-position: center;
flex-shrink: 0;
}
.player-details[data-v-d0b690af] {
flex: 1;
min-width: 0;
}
.player-name[data-v-d0b690af] {
font-size: 16px;
font-weight: 600;
color: white;
}
.player-id[data-v-d0b690af] {
font-size: 12px;
color: var(--text-secondary);
margin-bottom: 4px;
}
.compliance-status[data-v-d0b690af] {
font-size: 12px;
font-weight: 500;
padding: 2px 10px;
border-radius: 10px;
display: inline-block;
}
.status-complete[data-v-d0b690af] {
background: rgba(57, 255, 20, 0.15);
color: var(--neon-green);
}
.status-incomplete[data-v-d0b690af] {
background: rgba(255, 102, 0, 0.15);
color: var(--neon-orange);
}
/* Tabs */
.tabs-bar[data-v-d0b690af] {
display: flex;
gap: 0;
padding: 0 32px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.tab-btn[data-v-d0b690af] {
background: none;
border: none;
color: var(--text-secondary);
padding: 12px 20px;
font-size: 13px;
font-weight: 500;
cursor: pointer;
border-bottom: 2px solid transparent;
transition: all 0.2s;
position: relative;
}
.tab-btn[data-v-d0b690af]:hover {
color: white;
background: rgba(255, 255, 255, 0.03);
}
.tab-btn.active[data-v-d0b690af] {
color: var(--neon-blue);
border-bottom-color: var(--neon-blue);
}
.tab-badge[data-v-d0b690af] {
background: var(--neon-blue);
color: #000;
font-size: 10px;
font-weight: 700;
padding: 1px 6px;
border-radius: 8px;
margin-left: 6px;
}
/* Modal body */
.modal-body[data-v-d0b690af] {
flex: 1;
padding: 20px 32px;
overflow-y: auto;
}
.modal-footer[data-v-d0b690af] {
padding: 12px 32px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
display: flex;
justify-content: flex-end;
}
/* Generate form */
.generate-form .form-row[data-v-d0b690af] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px;
}
.form-group[data-v-d0b690af] {
display: flex;
flex-direction: column;
gap: 6px;
}
.form-group.full-width[data-v-d0b690af] {
grid-column: 1 / -1;
}
.form-group label[data-v-d0b690af] {
font-size: 12px;
font-weight: 500;
color: var(--text-secondary);
}
.required[data-v-d0b690af] {
color: var(--neon-red, #ff073a);
}
/* Section labels */
.section-label[data-v-d0b690af] {
font-size: 13px;
font-weight: 600;
color: var(--neon-blue);
margin-bottom: 12px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
/* Auto-fill section */
.autofill-section[data-v-d0b690af] {
padding: 16px;
margin-bottom: 16px;
border-radius: 10px;
}
.autofill-grid[data-v-d0b690af] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
}
.autofill-field[data-v-d0b690af] {
display: flex;
flex-direction: column;
gap: 2px;
}
.af-label[data-v-d0b690af] {
font-size: 11px;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.3px;
}
.af-value[data-v-d0b690af] {
font-size: 13px;
color: white;
font-weight: 500;
}
.af-missing[data-v-d0b690af] {
color: var(--neon-orange);
font-style: italic;
}
/* Financial section */
.financial-section[data-v-d0b690af] {
margin-bottom: 16px;
padding-top: 16px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
/* SSN input */
.ssn-input-group[data-v-d0b690af] {
display: flex;
align-items: center;
gap: 6px;
}
.ssn-part[data-v-d0b690af] {
width: 60px;
text-align: center;
letter-spacing: 2px;
font-family: monospace;
font-size: 15px;
}
.ssn-last[data-v-d0b690af] {
width: 80px;
}
.ssn-dash[data-v-d0b690af] {
color: var(--text-secondary);
font-size: 18px;
}
/* Currency input */
.currency-input[data-v-d0b690af] {
position: relative;
display: flex;
align-items: center;
}
.currency-symbol[data-v-d0b690af] {
position: absolute;
left: 12px;
color: var(--text-secondary);
font-size: 14px;
pointer-events: none;
z-index: 1;
}
.currency-field[data-v-d0b690af] {
padding-left: 28px !important;
font-family: monospace;
}
/* Field hints */
.field-hint[data-v-d0b690af] {
font-size: 11px;
color: var(--text-muted);
margin-top: 2px;
}
.hint-link[data-v-d0b690af] {
color: var(--neon-blue);
cursor: pointer;
background: none;
border: none;
font-size: 11px;
padding: 0;
text-decoration: underline;
}
.hint-link[data-v-d0b690af]:hover {
color: white;
}
/* Data warnings */
.data-warnings[data-v-d0b690af] {
padding: 12px 16px;
margin-bottom: 16px;
border-radius: 10px;
border-left: 3px solid var(--neon-orange);
}
.warning-header[data-v-d0b690af] {
font-size: 12px;
font-weight: 600;
color: var(--neon-orange);
margin-bottom: 6px;
text-transform: uppercase;
}
.warning-item[data-v-d0b690af] {
font-size: 12px;
color: var(--text-secondary);
padding: 2px 0;
}
.warning-field[data-v-d0b690af] {
color: var(--neon-orange);
font-weight: 500;
}
/* Validation errors */
.validation-errors[data-v-d0b690af] {
padding: 12px 16px;
margin-bottom: 16px;
background: rgba(255, 7, 58, 0.1);
border-radius: 10px;
border-left: 3px solid var(--neon-red, #ff073a);
}
.error-item[data-v-d0b690af] {
font-size: 12px;
color: var(--neon-red, #ff073a);
padding: 2px 0;
}
/* Generate actions */
.generate-actions[data-v-d0b690af] {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 16px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.save-checkbox[data-v-d0b690af] {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--text-secondary);
cursor: pointer;
}
.save-checkbox input[type="checkbox"][data-v-d0b690af] {
accent-color: var(--neon-blue);
}
.action-buttons[data-v-d0b690af] {
display: flex;
gap: 10px;
}
.btn-outline[data-v-d0b690af] {
color: var(--text-secondary);
border: 1px solid rgba(255, 255, 255, 0.15);
text-decoration: none;
padding: 8px 16px;
font-size: 13px;
display: inline-flex;
align-items: center;
}
.btn-outline[data-v-d0b690af]:hover {
color: white;
border-color: rgba(255, 255, 255, 0.3);
}
.btn-primary[data-v-d0b690af] {
color: var(--neon-blue);
border: 1px solid var(--neon-blue);
}
.btn-primary[data-v-d0b690af]:hover:not(:disabled) {
background: rgba(0, 245, 255, 0.1);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
}
.btn-primary[data-v-d0b690af]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
/* Upload section */
.upload-section[data-v-d0b690af] {
padding: 24px;
}
.upload-section h3[data-v-d0b690af] {
margin: 0 0 20px 0;
font-size: 16px;
font-weight: 600;
color: white;
}
.upload-form .form-row[data-v-d0b690af] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px;
}
.file-input[data-v-d0b690af] {
padding: 8px;
cursor: pointer;
}
.file-name[data-v-d0b690af] {
font-size: 12px;
color: var(--text-secondary);
}
.upload-actions[data-v-d0b690af] {
display: flex;
justify-content: flex-end;
}
/* Documents section */
.loading-state[data-v-d0b690af] {
text-align: center;
padding: 32px;
color: var(--text-secondary);
}
.no-documents[data-v-d0b690af] {
text-align: center;
padding: 40px 24px;
color: var(--text-secondary);
}
.empty-icon[data-v-d0b690af] {
font-size: 16px;
margin-bottom: 8px;
}
.text-muted[data-v-d0b690af] {
color: var(--text-muted);
font-size: 13px;
}
.documents-grid[data-v-d0b690af] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 12px;
}
.document-card[data-v-d0b690af] {
padding: 14px;
border-radius: 10px;
}
.doc-header[data-v-d0b690af] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
}
.doc-type-badge[data-v-d0b690af] {
font-size: 11px;
font-weight: 600;
padding: 3px 10px;
border-radius: 6px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.badge-w2g[data-v-d0b690af] {
background: rgba(0, 245, 255, 0.15);
color: var(--neon-blue);
}
.badge-w9[data-v-d0b690af] {
background: rgba(138, 43, 226, 0.15);
color: var(--neon-purple);
}
.badge-1099[data-v-d0b690af] {
background: rgba(255, 215, 0, 0.15);
color: var(--neon-gold);
}
.badge-other[data-v-d0b690af] {
background: rgba(255, 255, 255, 0.08);
color: var(--text-secondary);
}
.btn-delete[data-v-d0b690af] {
background: rgba(255, 7, 58, 0.15);
border: none;
color: var(--neon-red, #ff073a);
padding: 4px 8px;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
font-weight: 600;
transition: all 0.2s;
}
.btn-delete[data-v-d0b690af]:hover {
background: rgba(255, 7, 58, 0.3);
}
.doc-body[data-v-d0b690af] {
display: flex;
gap: 10px;
margin-bottom: 10px;
}
.doc-icon[data-v-d0b690af] {
font-size: 11px;
font-weight: 700;
color: var(--text-muted);
background: rgba(255, 255, 255, 0.06);
padding: 8px;
border-radius: 6px;
display: flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
}
.doc-info[data-v-d0b690af] {
flex: 1;
min-width: 0;
}
.doc-filename[data-v-d0b690af] {
font-size: 13px;
font-weight: 500;
color: white;
margin-bottom: 2px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.doc-meta[data-v-d0b690af] {
font-size: 11px;
color: var(--text-secondary);
display: flex;
gap: 10px;
}
.doc-uploader[data-v-d0b690af] {
font-size: 11px;
color: var(--text-muted);
margin-top: 2px;
}
.doc-notes[data-v-d0b690af] {
font-size: 11px;
color: var(--text-secondary);
margin-top: 6px;
padding: 6px 8px;
background: rgba(255, 255, 255, 0.03);
border-radius: 4px;
font-style: italic;
}
.doc-actions[data-v-d0b690af] {
display: flex;
gap: 6px;
}
.btn-small[data-v-d0b690af] {
padding: 5px 12px;
font-size: 12px;
flex: 1;
}
/* Responsive */
@media (max-width: 768px) {
.compliance-docs-modal[data-v-d0b690af] {
width: 95vw;
}
.modal-header[data-v-d0b690af],
.player-info-section[data-v-d0b690af],
.tabs-bar[data-v-d0b690af],
.modal-body[data-v-d0b690af],
.modal-footer[data-v-d0b690af] {
padding-left: 16px;
padding-right: 16px;
}
.generate-form .form-row[data-v-d0b690af],
.upload-form .form-row[data-v-d0b690af] {
grid-template-columns: 1fr;
}
.autofill-grid[data-v-d0b690af] {
grid-template-columns: 1fr;
}
.documents-grid[data-v-d0b690af] {
grid-template-columns: 1fr;
}
.generate-actions[data-v-d0b690af] {
flex-direction: column;
gap: 12px;
align-items: stretch;
}
.action-buttons[data-v-d0b690af] {
justify-content: flex-end;
}
}
.player-detail-view[data-v-1254bea8] {
max-width: 1400px;
margin: 0 auto;
padding: 1rem;
}
.view-header[data-v-1254bea8] {
padding: 2rem;
text-align: center;
margin-bottom: 2rem;
}
.loading[data-v-1254bea8],
.error[data-v-1254bea8] {
padding: 1.25rem;
text-align: center;
}
.content-grid[data-v-1254bea8] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.profile-card .profile-header[data-v-1254bea8] {
display: flex;
align-items: center;
gap: 1rem;
}
.avatar[data-v-1254bea8] {
width: 80px;
height: 80px;
border-radius: 50%;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: 700;
font-size: 1.25rem;
background-size: cover;
background-position: center;
}
.avatar-wrapper[data-v-1254bea8] {
width: 120px;
height: 120px;
}
.identity .name[data-v-1254bea8] {
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.identity .meta[data-v-1254bea8] {
display: flex;
gap: 0.75rem;
color: var(--text-secondary);
font-size: 0.9rem;
flex-wrap: wrap;
}
.profile-actions[data-v-1254bea8] {
display: flex;
gap: 0.5rem;
margin-top: 1rem;
flex-wrap: wrap;
}
.profile-actions .btn-neon[data-v-1254bea8] {
flex: 1 1 auto;
min-width: 150px;
}
.stats[data-v-1254bea8] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.75rem;
margin-top: 1rem;
}
.stat label[data-v-1254bea8] {
color: var(--text-secondary);
font-size: 0.8rem;
}
.stat div[data-v-1254bea8] {
font-weight: 700;
color: var(--text-primary);
}
.section-header[data-v-1254bea8] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.header-controls[data-v-1254bea8] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.view-toggle[data-v-1254bea8] {
display: flex;
gap: 0.25rem;
background: rgba(255, 255, 255, 0.05);
padding: 0.25rem;
border-radius: 8px;
}
.toggle-btn[data-v-1254bea8] {
padding: 0.375rem 0.75rem;
font-size: 0.8rem;
border-radius: 6px;
transition: all 0.2s ease;
opacity: 0.6;
}
.toggle-btn.active[data-v-1254bea8] {
opacity: 1;
background: rgba(100, 200, 255, 0.2);
border-color: rgba(100, 200, 255, 0.4);
}
.toggle-btn[data-v-1254bea8]:hover:not(.active) {
opacity: 0.8;
}
.history-grid[data-v-1254bea8] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 0.75rem;
}
.comps-summary[data-v-1254bea8] {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.75rem;
}
.metric label[data-v-1254bea8] {
color: var(--text-secondary);
font-size: 0.8rem;
}
.metric div[data-v-1254bea8] {
font-weight: 700;
color: var(--text-primary);
}
.recent-comps[data-v-1254bea8] {
margin-top: 1rem;
}
.comp-transactions[data-v-1254bea8] {
margin-top: 1rem;
}
.comp-table[data-v-1254bea8] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.comp-table thead[data-v-1254bea8] {
background: rgba(30, 30, 40, 0.95);
backdrop-filter: blur(8px);
}
.comp-table th[data-v-1254bea8] {
padding: 0.5rem;
text-align: left;
font-weight: 600;
color: var(--text-secondary);
font-size: 0.85rem;
position: sticky;
top: 0;
z-index: 1;
}
.comp-table td[data-v-1254bea8] {
padding: 0.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.comp-table tr.voided[data-v-1254bea8] {
opacity: 0.5;
text-decoration: line-through;
}
.comp-table tr[data-v-1254bea8]:hover:not(.voided) {
background: rgba(255, 255, 255, 0.03);
}
.comp-table tr.has-house-subsidy[data-v-1254bea8] {
background: rgba(251, 191, 36, 0.08);
}
.comp-table tr.has-house-subsidy[data-v-1254bea8]:hover {
background: rgba(251, 191, 36, 0.12);
}
.comp-table.enhanced[data-v-1254bea8] {
table-layout: auto;
}
.comp-table .amount[data-v-1254bea8] {
font-weight: 600;
color: var(--success);
}
/* Points header styling */
.points-header[data-v-1254bea8] {
text-align: left;
cursor: help;
}
.points-none[data-v-1254bea8] {
color: var(--text-secondary);
opacity: 0.5;
}
.notes-none[data-v-1254bea8] {
color: var(--text-secondary);
opacity: 0.5;
}
.notes-text[data-v-1254bea8] {
color: var(--text-secondary);
font-style: italic;
}
.highlighted[data-v-1254bea8] {
background: rgba(251, 191, 36, 0.1);
border-radius: 4px;
}
.void-badge[data-v-1254bea8] {
display: inline-block;
padding: 0.125rem 0.5rem;
background: rgba(255, 0, 0, 0.2);
border: 1px solid rgba(255, 0, 0, 0.4);
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
color: #ff6b6b;
}
.active-badge[data-v-1254bea8] {
display: inline-block;
padding: 0.125rem 0.5rem;
background: rgba(0, 255, 0, 0.1);
border: 1px solid rgba(0, 255, 0, 0.3);
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
color: #51cf66;
}
/* Pull Tab Stats Summary */
.pull-tab-stats[data-v-1254bea8] {
display: flex;
gap: 1.5rem;
margin-bottom: 1rem;
padding: 0.75rem 1rem;
background: rgba(155, 89, 182, 0.1);
border: 1px solid rgba(155, 89, 182, 0.3);
border-radius: 8px;
}
.pull-tab-stat[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.pull-tab-stat .stat-label[data-v-1254bea8] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
text-transform: uppercase;
letter-spacing: 0.5px;
}
.pull-tab-stat .stat-value[data-v-1254bea8] {
font-size: 1.1rem;
font-weight: 600;
color: #9b59b6;
}
/* Comps Card - Full Width */
.comps-card[data-v-1254bea8] {
grid-column: 1 / -1;
}
/* Comp Restrictions Card Styles */
.comp-restrictions-card[data-v-1254bea8] {
grid-column: 1 / -1;
}
.comp-restrictions-card .no-restrictions[data-v-1254bea8] {
padding: 2rem;
text-align: center;
}
.comp-restrictions-card .restrictions-active[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.comp-restrictions-card .restrictions-grid[data-v-1254bea8] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.comp-restrictions-card .restriction-badge[data-v-1254bea8] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 1rem 1.25rem;
background: rgba(255, 107, 107, 0.1);
border: 1px solid rgba(255, 107, 107, 0.3);
border-radius: 8px;
}
.comp-restrictions-card .restriction-icon[data-v-1254bea8] {
font-size: 1.5rem;
flex-shrink: 0;
}
.comp-restrictions-card .restriction-label[data-v-1254bea8] {
font-weight: 700;
font-size: 1.05rem;
color: #ff6b6b;
}
.comp-restrictions-card .restriction-metadata[data-v-1254bea8] {
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.comp-restrictions-card .restriction-metadata p[data-v-1254bea8] {
margin: 0.5rem 0;
color: rgba(255, 255, 255, 0.8);
font-size: 0.95rem;
}
.comp-restrictions-card .restriction-metadata p[data-v-1254bea8]:first-child {
margin-top: 0;
}
.comp-restrictions-card .restriction-metadata p[data-v-1254bea8]:last-child {
margin-bottom: 0;
}
.comp-restrictions-card .restriction-metadata strong[data-v-1254bea8] {
color: rgba(255, 255, 255, 0.9);
font-weight: 600;
}
/* Comp Restrictions Modal */
.comp-restrictions-modal[data-v-1254bea8] {
width: 90%;
max-width: 600px;
max-height: 90vh;
overflow-y: auto;
background: rgba(20, 25, 40, 0.95);
backdrop-filter: blur(20px);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
}
.comp-restrictions-modal .modal-header[data-v-1254bea8] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.comp-restrictions-modal .modal-header h2[data-v-1254bea8] {
margin: 0;
font-size: 1.25rem;
}
.comp-restrictions-modal .modal-close[data-v-1254bea8] {
background: none;
border: none;
color: var(--text-muted);
font-size: 2rem;
cursor: pointer;
padding: 0;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: all 0.3s ease;
}
.comp-restrictions-modal .modal-close[data-v-1254bea8]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
}
.comp-restrictions-modal .modal-body[data-v-1254bea8] {
padding: 1.5rem 2rem;
}
.comp-restrictions-modal .modal-description[data-v-1254bea8] {
margin-bottom: 1.5rem;
color: rgba(255, 255, 255, 0.8);
line-height: 1.6;
}
.comp-restrictions-modal .checkbox-group[data-v-1254bea8] {
margin-bottom: 1.5rem;
}
.comp-restrictions-modal .checkbox-label[data-v-1254bea8] {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1rem;
cursor: pointer;
}
.comp-restrictions-modal .checkbox-label[data-v-1254bea8]:last-child {
margin-bottom: 0;
}
.comp-restrictions-modal .checkbox-label input[type="checkbox"][data-v-1254bea8] {
width: auto;
margin: 0;
}
.comp-restrictions-modal .checkbox-text[data-v-1254bea8] {
font-size: 1.1rem;
font-weight: 600;
}
.comp-restrictions-modal .form-group[data-v-1254bea8] {
margin-bottom: 1.5rem;
}
.comp-restrictions-modal .form-group[data-v-1254bea8]:last-child {
margin-bottom: 0;
}
.comp-restrictions-modal .form-label[data-v-1254bea8] {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
}
.comp-restrictions-modal .required-indicator[data-v-1254bea8] {
color: #ff6b6b;
}
.comp-restrictions-modal .form-hint[data-v-1254bea8] {
color: rgba(255, 255, 255, 0.6);
display: block;
margin-top: 0.5rem;
font-size: 0.9rem;
line-height: 1.4;
}
.comp-restrictions-modal .input-glass[data-v-1254bea8] {
width: 100%;
}
.comp-restrictions-modal textarea.input-glass[data-v-1254bea8] {
resize: vertical;
}
.comp-restrictions-modal .pin-input[data-v-1254bea8] {
font-family: monospace;
font-size: 1.2rem;
letter-spacing: 0.5rem;
text-align: center;
}
.comp-restrictions-modal .current-restrictions-notice[data-v-1254bea8] {
margin-top: 1.5rem;
padding: 1rem;
background: rgba(255, 165, 0, 0.1);
border: 1px solid rgba(255, 165, 0, 0.3);
border-radius: 8px;
}
.comp-restrictions-modal .notice-title[data-v-1254bea8] {
margin: 0 0 0.5rem 0;
font-weight: 600;
color: #ffa500;
}
.comp-restrictions-modal .restrictions-list[data-v-1254bea8] {
margin: 0;
padding-left: 1.5rem;
color: rgba(255, 255, 255, 0.8);
}
.comp-restrictions-modal .notice-meta[data-v-1254bea8] {
margin: 0.5rem 0 0 0;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.comp-restrictions-modal .modal-footer[data-v-1254bea8] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.comp-restrictions-modal .modal-footer .btn-glass[data-v-1254bea8],
.comp-restrictions-modal .modal-footer .btn-neon[data-v-1254bea8] {
padding: 0.75rem 1.5rem;
font-weight: 600;
}
.btn-neon.neon-orange[data-v-1254bea8] {
background: linear-gradient(135deg, rgba(255, 165, 0, 0.2), rgba(255, 140, 0, 0.2));
border: 2px solid #ffa500;
color: #ffa500;
}
.btn-neon.neon-orange[data-v-1254bea8]:hover:not(:disabled) {
background: linear-gradient(135deg, rgba(255, 165, 0, 0.3), rgba(255, 140, 0, 0.3));
box-shadow: 0 0 20px rgba(255, 165, 0, 0.4);
}
.preferred-game-badge[data-v-1254bea8] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.625rem;
background: rgba(138, 43, 226, 0.15);
border: 1px solid rgba(138, 43, 226, 0.3);
border-radius: 6px;
font-size: 0.8rem;
font-weight: 600;
color: #b794f6;
transition: all 0.2s ease;
}
.preferred-game-badge[data-v-1254bea8]:hover {
background: rgba(138, 43, 226, 0.25);
border-color: rgba(138, 43, 226, 0.5);
}
.preferred-game-badge.is-override[data-v-1254bea8] {
background: rgba(255, 165, 0, 0.15);
border: 1px solid rgba(255, 165, 0, 0.3);
color: #ffa500;
}
.preferred-game-badge.is-override[data-v-1254bea8]:hover {
background: rgba(255, 165, 0, 0.25);
border-color: rgba(255, 165, 0, 0.5);
}
.preferred-game-badge .override-indicator[data-v-1254bea8] {
font-size: 0.7rem;
opacity: 0.8;
}
.match-play-indicator[data-v-1254bea8] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.625rem;
background: rgba(74, 222, 128, 0.15);
border: 1px solid rgba(74, 222, 128, 0.3);
border-radius: 6px;
font-size: 0.8rem;
font-weight: 600;
color: #4ade80;
}
.match-play-indicator.clickable[data-v-1254bea8] {
cursor: pointer;
transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.match-play-indicator.clickable[data-v-1254bea8]:hover {
border-color: rgba(74, 222, 128, 0.6);
box-shadow: 0 0 12px rgba(74, 222, 128, 0.3);
}
.match-play-indicator.blocked[data-v-1254bea8] {
background: rgba(248, 113, 113, 0.15);
border-color: rgba(248, 113, 113, 0.3);
color: #f87171;
}
.match-play-indicator .voucher-count-badge[data-v-1254bea8] {
font-size: 0.7rem;
opacity: 0.8;
}
.match-play-indicator .override-indicator[data-v-1254bea8] {
font-size: 0.7rem;
color: #fbbf24;
}
.void-btn[data-v-1254bea8] {
background: none;
border: none;
color: #ff6b6b;
cursor: pointer;
padding: 0.25rem 0.5rem;
font-size: 1rem;
opacity: 0.6;
transition: opacity 0.2s;
}
.void-btn[data-v-1254bea8]:hover {
opacity: 1;
}
.loading-state[data-v-1254bea8],
.no-transactions[data-v-1254bea8] {
padding: 1rem;
text-align: center;
color: var(--text-secondary);
font-size: 0.9rem;
}
.comp-row[data-v-1254bea8] {
display: grid;
grid-template-columns: 1fr 1fr 2fr 1fr;
gap: 0.5rem;
padding: 0.5rem;
}
.comp-row.header[data-v-1254bea8] {
font-weight: 600;
background: rgba(255, 255, 255, 0.05);
border-radius: 8px;
}
/* Transaction History Card */
.transactions-card[data-v-1254bea8] {
grid-column: 1 / -1;
}
.transaction-section[data-v-1254bea8] {
margin-top: 1.5rem;
}
.transaction-section[data-v-1254bea8]:first-child {
margin-top: 0;
}
.transaction-section h3[data-v-1254bea8] {
margin-bottom: 0.75rem;
color: var(--text-primary);
font-size: 1.1rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.transaction-table[data-v-1254bea8] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.transaction-table thead[data-v-1254bea8] {
background: rgba(30, 30, 40, 0.95);
backdrop-filter: blur(8px);
}
.transaction-table th[data-v-1254bea8] {
padding: 0.5rem;
text-align: left;
font-weight: 600;
color: var(--text-secondary);
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.05em;
position: sticky;
top: 0;
z-index: 1;
}
.transaction-table td[data-v-1254bea8] {
padding: 0.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.transaction-table tr.voided[data-v-1254bea8] {
opacity: 0.5;
text-decoration: line-through;
}
.transaction-table tr[data-v-1254bea8]:hover:not(.voided) {
background: rgba(255, 255, 255, 0.03);
}
.transaction-table .amount[data-v-1254bea8] {
font-weight: 600;
color: var(--success);
}
.transaction-table .description[data-v-1254bea8] {
color: var(--text-secondary);
font-size: 0.85rem;
font-style: italic;
}
/* Enhanced table wrapper */
.transaction-table-wrapper[data-v-1254bea8] {
max-height: 400px;
overflow-y: auto;
border-radius: 6px;
background: rgba(20, 20, 30, 0.4);
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}
.transaction-table-wrapper[data-v-1254bea8]::-webkit-scrollbar {
width: 6px;
}
.transaction-table-wrapper[data-v-1254bea8]::-webkit-scrollbar-track {
background: transparent;
}
.transaction-table-wrapper[data-v-1254bea8]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 3px;
}
.transaction-table.enhanced[data-v-1254bea8] {
table-layout: auto;
}
/* Transaction count badge */
.transaction-count[data-v-1254bea8] {
background: rgba(100, 100, 255, 0.2);
padding: 0.15rem 0.5rem;
border-radius: 10px;
font-size: 0.75rem;
font-weight: 600;
color: var(--text-secondary);
margin-left: 0.5rem;
}
/* Points cells */
.cell-points[data-v-1254bea8] {
text-align: left;
white-space: nowrap;
}
.points-value[data-v-1254bea8] {
font-weight: 600;
font-size: 0.85rem;
}
.points-value.player[data-v-1254bea8] {
color: #4ade80;
}
.points-value.house[data-v-1254bea8] {
color: #fbbf24;
}
.points-value.total[data-v-1254bea8] {
color: #60a5fa;
}
/* Employee info cell */
.cell-employee[data-v-1254bea8] {
min-width: 100px;
}
.employee-info[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.employee-name[data-v-1254bea8] {
font-weight: 500;
font-size: 0.85rem;
}
.employee-role[data-v-1254bea8] {
color: var(--text-secondary);
font-size: 0.75rem;
font-style: italic;
}
/* Notes cell */
.cell-notes[data-v-1254bea8] {
max-width: 180px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: var(--text-secondary);
font-size: 0.85rem;
font-style: italic;
}
/* Comp type badges */
.comp-type-badge[data-v-1254bea8] {
display: inline-block;
padding: 0.15rem 0.5rem;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
background: rgba(100, 100, 100, 0.3);
color: var(--text-primary);
}
.badge-match-play[data-v-1254bea8] {
background: rgba(168, 85, 247, 0.25);
color: #c084fc;
}
.badge-free-play[data-v-1254bea8] {
background: rgba(34, 197, 94, 0.25);
color: #4ade80;
}
.badge-fnb[data-v-1254bea8] {
background: rgba(249, 115, 22, 0.25);
color: #fb923c;
}
.badge-retail[data-v-1254bea8] {
background: rgba(59, 130, 246, 0.25);
color: #60a5fa;
}
.badge-other[data-v-1254bea8] {
background: rgba(107, 114, 128, 0.25);
color: #9ca3af;
}
/* Editable Form Styles */
.form-card[data-v-1254bea8] {
grid-column: 1 / -1;
}
.form-actions[data-v-1254bea8] {
display: flex;
gap: 0.5rem;
}
.form-grid[data-v-1254bea8] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
.form-group[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-1254bea8] {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.9rem;
}
.span-2[data-v-1254bea8] {
grid-column: span 2;
}
.speed-selector[data-v-1254bea8] {
display: flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
}
.speed-button[data-v-1254bea8] {
width: 40px;
height: 40px;
border: 2px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
}
.speed-button.active[data-v-1254bea8] {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
}
.speed-label[data-v-1254bea8] {
color: var(--text-secondary);
margin-left: 0.5rem;
}
@media (max-width: 900px) {
.content-grid[data-v-1254bea8] {
grid-template-columns: 1fr;
}
.history-grid[data-v-1254bea8],
.comps-summary[data-v-1254bea8] {
grid-template-columns: 1fr 1fr;
}
.form-grid[data-v-1254bea8] {
grid-template-columns: 1fr;
}
}
.btn-glass-success[data-v-1254bea8] {
padding: 0.75rem 1.5rem;
background: linear-gradient(135deg, rgba(74, 222, 128, 0.2), rgba(34, 197, 94, 0.2));
border: 1px solid rgba(74, 222, 128, 0.4);
border-radius: 0.5rem;
color: #4ade80;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
}
.btn-glass-success[data-v-1254bea8]:hover:not(:disabled) {
background: linear-gradient(135deg, rgba(74, 222, 128, 0.3), rgba(34, 197, 94, 0.3));
border-color: rgba(74, 222, 128, 0.6);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(74, 222, 128, 0.2);
}
.btn-glass-success[data-v-1254bea8]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* SMS Consent Checkbox Styling */
.sms-consent-label[data-v-1254bea8] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
cursor: pointer;
padding: 0.75rem;
border-radius: 8px;
transition: background 0.2s ease;
}
.sms-consent-label[data-v-1254bea8]:hover {
background: rgba(236, 72, 153, 0.05);
}
.sms-consent-label input[type="checkbox"][data-v-1254bea8] {
margin-top: 0.25rem;
width: 18px;
height: 18px;
cursor: pointer;
}
.sms-consent-label .checkbox-text[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 0.25rem;
font-weight: 500;
color: var(--text-primary);
}
.consent-timestamp[data-v-1254bea8] {
font-size: 0.85rem;
color: var(--text-secondary);
font-weight: 400;
}
.consent-timestamp.opted-out[data-v-1254bea8] {
color: var(--warning);
}
.input-hint.muted[data-v-1254bea8] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
}
/* Temp Player Conversion Styling */
.required-field[data-v-1254bea8] {
border: 2px solid rgba(255, 165, 0, 0.6) !important;
box-shadow: 0 0 8px rgba(255, 165, 0, 0.3);
}
.required-field[data-v-1254bea8]:focus {
border-color: rgba(255, 165, 0, 0.8) !important;
box-shadow: 0 0 12px rgba(255, 165, 0, 0.5);
}
/* Host Assignment Styles */
.host-history-details[data-v-1254bea8] {
margin-top: 0.75rem;
padding: 0.75rem;
background: rgba(139, 92, 246, 0.05);
border-radius: 0.5rem;
border: 1px solid rgba(139, 92, 246, 0.15);
}
.host-history-details summary[data-v-1254bea8] {
cursor: pointer;
font-size: 0.9rem;
color: var(--text-secondary);
user-select: none;
}
.host-history-details summary[data-v-1254bea8]:hover {
color: var(--text-primary);
}
.host-history-list[data-v-1254bea8] {
margin-top: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.host-history-entry[data-v-1254bea8] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 0.375rem;
border-left: 3px solid rgba(139, 92, 246, 0.4);
}
.host-history-entry[data-v-1254bea8]:first-child {
border-left-color: var(--neon-purple);
}
.host-name[data-v-1254bea8] {
font-weight: 600;
color: var(--text-primary);
display: flex;
align-items: center;
gap: 0.5rem;
}
.current-badge[data-v-1254bea8] {
font-size: 0.7rem;
padding: 0.15rem 0.4rem;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
color: white;
border-radius: 0.25rem;
font-weight: 500;
text-transform: uppercase;
}
.host-dates[data-v-1254bea8] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-top: 0.25rem;
}
.host-reason[data-v-1254bea8] {
font-size: 0.85rem;
color: var(--text-secondary);
font-style: italic;
margin-top: 0.25rem;
}
.host-info[data-v-1254bea8] {
font-size: 0.8rem;
color: var(--text-muted);
margin-top: 0.25rem;
}
.permission-note[data-v-1254bea8] {
font-size: 0.75rem;
color: var(--warning-color, #f0ad4e);
margin-top: 0.25rem;
display: block;
}
/* Industry & Discounts + Special Guest Status sections. Bordered-fieldset
layout from KIOSK_AND_PLAYER_IDENTITY_REFACTOR_MAY_2026.md §4.3.
The two fieldsets each occupy `span-2` of the parent form-grid. */
.player-section[data-v-1254bea8] {
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 10px;
padding: 1rem 1.25rem;
margin: 0.25rem 0;
background: rgba(255, 255, 255, 0.015);
}
.player-section > legend[data-v-1254bea8] {
padding: 0 0.5rem;
font-size: 0.85rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--text-secondary);
}
.player-section-grid[data-v-1254bea8] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem 1rem;
margin-top: 0.25rem;
}
.player-section-grid .form-group.span-2[data-v-1254bea8] {
grid-column: 1 / -1;
}
/* FormKit Pro dropdown (Industry) and taglist (Event Types) — local outer
wrapper visual tweaks. Anything that targets FormKit's own DOM (selector,
listbox, options, chips) lives in `frontend/src/styles/formkit-glass.css`
so it survives Vue's scoped-style boundary. */
/* The .industries-dropdown / .event-types-taglist classes land on the FormKit
`outer` element via the `outer-class` prop. That element IS in this
component's render tree and DOES carry the scope attribute, so styling
the outer wrapper here is fine. */
.industries-dropdown[data-v-1254bea8],
.event-types-taglist[data-v-1254bea8] {
margin-top: 0.4rem;
}
.industry-empty[data-v-1254bea8] {
padding: 0.5rem 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
margin-top: 0.4rem;
}
.event-toplabel[data-v-1254bea8] {
display: inline-flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
user-select: none;
}
.event-toplabel input[type="checkbox"][data-v-1254bea8] {
width: 1rem;
height: 1rem;
}
.event-guest-block[data-v-1254bea8] {
margin-top: 0.25rem;
}
.event-details[data-v-1254bea8] {
margin-top: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
padding: 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 8px;
background: rgba(255, 255, 255, 0.02);
}
.event-name-row[data-v-1254bea8] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.event-name-row input[data-v-1254bea8] {
width: 100%;
}
.event-name-warning[data-v-1254bea8] {
color: #f59e0b;
font-size: 0.75rem;
}
.event-sublabel[data-v-1254bea8] {
display: block;
font-size: 0.75rem;
color: var(--text-muted);
margin-bottom: 0.25rem;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.event-dates-row[data-v-1254bea8] {
display: flex;
gap: 0.75rem;
}
.event-date-field[data-v-1254bea8] {
flex: 1;
}
.event-date-field[data-v-1254bea8] {
flex: 1;
}
.setting-hint[data-v-1254bea8] {
font-size: 0.75rem;
color: var(--text-muted);
margin-top: 0.25rem;
display: block;
}
/* Adjust Loyalty Points modal */
.points-stat label[data-v-1254bea8] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
}
.adjust-points-btn[data-v-1254bea8] {
background: transparent;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 6px;
padding: 2px 6px;
font-size: 0.85rem;
cursor: pointer;
color: var(--text-muted);
transition: all 0.15s ease;
}
.adjust-points-btn[data-v-1254bea8]:hover {
border-color: var(--neon-blue, #00f5ff);
color: var(--neon-blue, #00f5ff);
}
.adjust-points-modal .current-balance-box[data-v-1254bea8] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem 1rem;
background: rgba(0, 0, 0, 0.25);
border-radius: 8px;
margin-bottom: 1rem;
}
.adjust-points-modal .current-balance-box .label[data-v-1254bea8] {
color: var(--text-muted);
font-size: 0.9rem;
}
.adjust-points-modal .current-balance-box .amount[data-v-1254bea8] {
font-weight: 600;
font-size: 1.2rem;
}
.adjust-points-modal .mode-toggle[data-v-1254bea8] {
display: flex;
gap: 0.5rem;
}
.adjust-points-modal .mode-btn[data-v-1254bea8] {
flex: 1;
padding: 0.5rem 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
color: var(--text-muted);
cursor: pointer;
transition: all 0.15s ease;
}
.adjust-points-modal .mode-btn.active[data-v-1254bea8] {
background: rgba(0, 245, 255, 0.1);
border-color: var(--neon-blue, #00f5ff);
color: var(--neon-blue, #00f5ff);
}
.adjust-points-modal .mode-btn[data-v-1254bea8]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.adjust-points-modal .input-warning[data-v-1254bea8] {
border-color: #ffc107;
box-shadow: 0 0 0 1px rgba(255, 193, 7, 0.3);
}
.adjust-points-modal .input-danger[data-v-1254bea8] {
border-color: #ff4757;
box-shadow: 0 0 0 1px rgba(255, 71, 87, 0.4);
}
.adjust-points-modal .adjust-warning[data-v-1254bea8] {
padding: 0.75rem 1rem;
border-radius: 6px;
font-size: 0.9rem;
margin: 0.5rem 0 1rem 0;
line-height: 1.4;
}
.adjust-points-modal .warning-yellow[data-v-1254bea8] {
background: rgba(255, 193, 7, 0.1);
border: 1px solid rgba(255, 193, 7, 0.3);
color: #ffc107;
}
.adjust-points-modal .warning-red[data-v-1254bea8] {
background: rgba(255, 71, 87, 0.1);
border: 1px solid rgba(255, 71, 87, 0.4);
color: #ff4757;
}
.adjust-points-modal .preview-box[data-v-1254bea8] {
background: rgba(0, 0, 0, 0.2);
padding: 0.75rem 1rem;
border-radius: 8px;
margin-top: 0.5rem;
}
.adjust-points-modal .preview-row[data-v-1254bea8] {
display: flex;
justify-content: space-between;
padding: 0.25rem 0;
}
.adjust-points-modal .preview-label[data-v-1254bea8] {
color: var(--text-muted);
}
.adjust-points-modal .preview-value[data-v-1254bea8] {
font-weight: 600;
}
.adjust-points-modal .link-btn[data-v-1254bea8] {
background: none;
border: none;
color: var(--neon-blue, #00f5ff);
cursor: pointer;
padding: 0;
text-decoration: underline;
font-size: inherit;
}
.player-login[data-v-7a32ffcf] {
position: relative;
width: 100vw;
min-height: 100vh;
background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
overflow-x: hidden;
overflow-y: auto;
}
.background-overlay[data-v-7a32ffcf] {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(circle at center,
rgba(139, 0, 0, 0.1) 0%,
rgba(0, 0, 0, 0.9) 100%);
pointer-events: none;
z-index: 0;
}
.login-container[data-v-7a32ffcf] {
position: relative;
z-index: 1;
max-width: 600px;
margin: 0 auto;
padding: 2rem 1.5rem;
margin-top: 2rem;
}
/* Header */
.header[data-v-7a32ffcf] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 2rem;
}
.back-button[data-v-7a32ffcf] {
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
color: rgba(255, 255, 255, 0.7);
width: 44px;
height: 44px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.3rem;
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}
.back-button[data-v-7a32ffcf]:hover {
background: rgba(255, 215, 0, 0.12);
border-color: rgba(255, 215, 0, 0.3);
color: #ffd700;
transform: scale(1.05);
}
.title[data-v-7a32ffcf] {
font-family: 'Cinzel', serif;
font-size: clamp(1.5rem, 5vw, 2rem);
color: #ffd700;
text-align: center;
margin: 0;
}
.spacer[data-v-7a32ffcf] {
width: 40px;
}
/* Method Tabs */
.method-tabs[data-v-7a32ffcf] {
display: flex;
gap: 1rem;
margin-bottom: 2rem;
background: rgba(255, 255, 255, 0.05);
padding: 0.5rem;
border-radius: 12px;
backdrop-filter: blur(10px);
}
.method-tab[data-v-7a32ffcf] {
flex: 1;
padding: 1rem;
background: transparent;
border: 1px solid transparent;
border-radius: 8px;
color: #aaa;
font-size: 1rem;
cursor: pointer;
transition: all 0.3s ease;
}
.method-tab.active[data-v-7a32ffcf] {
background: rgba(255, 215, 0, 0.1);
border-color: rgba(255, 215, 0, 0.3);
color: #ffd700;
}
.method-tab[data-v-7a32ffcf]:hover:not(.active) {
background: rgba(255, 255, 255, 0.05);
color: #fff;
}
/* QR Scanner */
.qr-scanner-container[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.scanner-info[data-v-7a32ffcf] {
background: rgba(255, 215, 0, 0.1);
border: 1px solid rgba(255, 215, 0, 0.3);
border-radius: 12px;
padding: 1rem;
}
.info-text[data-v-7a32ffcf] {
color: #f5deb3;
font-size: 0.95rem;
line-height: 1.5;
margin: 0;
}
.scanner-viewport[data-v-7a32ffcf] {
position: relative;
width: 100%;
aspect-ratio: 1;
background: rgba(0, 0, 0, 0.8);
border: 2px solid rgba(255, 215, 0, 0.3);
border-radius: 16px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.scanner-placeholder[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
}
.qr-icon[data-v-7a32ffcf] {
font-size: 4rem;
opacity: 0.5;
}
.start-scan-btn[data-v-7a32ffcf] {
background: rgba(139, 0, 0, 0.8);
border: 1px solid rgba(255, 215, 0, 0.5);
color: #ffd700;
padding: 1rem 2rem;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}
.start-scan-btn[data-v-7a32ffcf]:hover {
background: rgba(139, 0, 0, 1);
transform: scale(1.05);
box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
}
.scanner-overlay[data-v-7a32ffcf] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1rem;
}
.scan-frame[data-v-7a32ffcf] {
width: 200px;
height: 200px;
border: 3px solid #ffd700;
border-radius: 16px;
box-shadow:
0 0 0 4px rgba(0, 0, 0, 0.5),
0 0 20px rgba(255, 215, 0, 0.5);
animation: pulse-7a32ffcf 2s ease-in-out infinite;
}
@keyframes pulse-7a32ffcf {
0%,
100% {
opacity: 1;
transform: scale(1);
}
50% {
opacity: 0.7;
transform: scale(1.05);
}
}
.scan-instruction[data-v-7a32ffcf] {
color: #ffd700;
font-size: 0.9rem;
text-align: center;
background: rgba(0, 0, 0, 0.7);
padding: 0.5rem 1rem;
border-radius: 8px;
}
.stop-scan-btn[data-v-7a32ffcf] {
background: rgba(139, 0, 0, 0.3);
border: 1px solid rgba(255, 215, 0, 0.3);
color: #ffd700;
padding: 0.75rem 1.5rem;
border-radius: 8px;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.3s ease;
}
.stop-scan-btn[data-v-7a32ffcf]:hover {
background: rgba(139, 0, 0, 0.5);
border-color: rgba(255, 215, 0, 0.5);
}
/* Web Scanner (vue-qrcode-reader) */
.web-scanner-stream[data-v-7a32ffcf] {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
border-radius: 16px;
overflow: hidden;
}
.web-scanner-stream[data-v-7a32ffcf] video {
border-radius: 16px;
object-fit: cover;
}
/* Phone Entry */
.phone-entry-container[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.sms-unavailable-notice[data-v-7a32ffcf] {
background: rgba(255, 165, 0, 0.1);
border: 2px solid rgba(255, 165, 0, 0.5);
border-radius: 12px;
padding: 1.5rem;
display: flex;
gap: 1rem;
align-items: flex-start;
}
.notice-icon[data-v-7a32ffcf] {
font-size: 2rem;
flex-shrink: 0;
}
.notice-content h3[data-v-7a32ffcf] {
color: #ffa500;
font-size: 1.1rem;
margin: 0 0 0.5rem 0;
}
.notice-content p[data-v-7a32ffcf] {
color: #ffcc80;
font-size: 0.9rem;
line-height: 1.5;
margin: 0.25rem 0;
}
.notice-content strong[data-v-7a32ffcf] {
color: #ffd700;
}
.disabled-section[data-v-7a32ffcf] {
opacity: 0.4;
pointer-events: none;
filter: grayscale(0.5);
}
.phone-step[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.input-group[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.input-group label[data-v-7a32ffcf] {
color: #ffd700;
font-size: 0.9rem;
font-weight: 600;
}
.input-group input[data-v-7a32ffcf] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 215, 0, 0.3);
border-radius: 8px;
padding: 1rem;
color: #fff;
font-size: 1.1rem;
text-align: center;
transition: all 0.3s ease;
}
.input-group input[data-v-7a32ffcf]:focus {
outline: none;
border-color: rgba(255, 215, 0, 0.6);
background: rgba(255, 255, 255, 0.08);
box-shadow: 0 0 15px rgba(255, 215, 0, 0.2);
}
.input-group input[data-v-7a32ffcf]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.helper-text[data-v-7a32ffcf] {
color: #aaa;
font-size: 0.9rem;
line-height: 1.5;
margin: 0;
}
.button-group[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.primary-btn[data-v-7a32ffcf],
.secondary-btn[data-v-7a32ffcf] {
padding: 1rem;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.primary-btn[data-v-7a32ffcf] {
background: rgba(139, 0, 0, 0.8);
border: 1px solid rgba(255, 215, 0, 0.5);
color: #ffd700;
}
.primary-btn[data-v-7a32ffcf]:hover:not(:disabled) {
background: rgba(139, 0, 0, 1);
transform: translateY(-2px);
box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
}
.primary-btn[data-v-7a32ffcf]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.secondary-btn[data-v-7a32ffcf] {
background: transparent;
border: 1px solid rgba(255, 215, 0, 0.3);
color: #ffd700;
}
.secondary-btn[data-v-7a32ffcf]:hover:not(:disabled) {
background: rgba(255, 215, 0, 0.1);
border-color: rgba(255, 215, 0, 0.5);
}
.spinner-small[data-v-7a32ffcf] {
width: 20px;
height: 20px;
border: 2px solid rgba(255, 215, 0, 0.3);
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-7a32ffcf 0.6s linear infinite;
}
@keyframes spin-7a32ffcf {
to {
transform: rotate(360deg);
}
}
/* Messages */
.error-banner[data-v-7a32ffcf],
.success-banner[data-v-7a32ffcf] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 1rem;
border-radius: 8px;
margin-top: 1.5rem;
animation: slideIn-7a32ffcf 0.3s ease-out;
}
@keyframes slideIn-7a32ffcf {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.error-banner[data-v-7a32ffcf] {
background: rgba(220, 38, 38, 0.1);
border: 1px solid rgba(220, 38, 38, 0.3);
color: #fca5a5;
}
.success-banner[data-v-7a32ffcf] {
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
color: #86efac;
}
.error-icon[data-v-7a32ffcf],
.success-icon[data-v-7a32ffcf] {
font-size: 1.2rem;
}
.error-close[data-v-7a32ffcf] {
margin-left: auto;
background: transparent;
border: none;
color: #fca5a5;
font-size: 1.5rem;
cursor: pointer;
padding: 0;
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: background 0.2s ease;
}
.error-close[data-v-7a32ffcf]:hover {
background: rgba(220, 38, 38, 0.2);
}
/* Demo Mode */
.demo-container[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1.5rem;
}
.demo-info[data-v-7a32ffcf] {
text-align: center;
padding: 2rem 1rem;
}
.demo-icon[data-v-7a32ffcf] {
font-size: 3.5rem;
margin-bottom: 0.5rem;
}
.demo-title[data-v-7a32ffcf] {
font-family: 'Cinzel', serif;
font-size: 1.4rem;
color: #ffd700;
margin: 0 0 0.75rem 0;
}
.demo-text[data-v-7a32ffcf] {
color: rgba(255, 255, 255, 0.6);
font-size: 0.95rem;
line-height: 1.6;
margin: 0;
max-width: 320px;
}
.demo-start-btn[data-v-7a32ffcf] {
width: 100%;
max-width: 300px;
padding: 1.1rem;
font-size: 1.1rem;
}
.demo-disclaimer[data-v-7a32ffcf] {
color: rgba(255, 255, 255, 0.3);
font-size: 0.75rem;
text-align: center;
margin: 0;
font-style: italic;
}
/* Responsive */
@media (max-width: 768px) {
.login-container[data-v-7a32ffcf] {
padding: 1.5rem 1rem;
}
.title[data-v-7a32ffcf] {
font-size: 1.5rem;
}
.method-tab[data-v-7a32ffcf] {
font-size: 0.9rem;
padding: 0.75rem;
}
}
/* ── Geofence Suspended State ── */
.suspended-container[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 1rem;
padding: 2rem 1rem;
}
.suspended-icon[data-v-7a32ffcf] {
font-size: 3.5rem;
line-height: 1;
}
.suspended-title[data-v-7a32ffcf] {
font-size: 1.5rem;
font-weight: 800;
color: #fff;
margin: 0;
}
.suspended-text[data-v-7a32ffcf] {
font-size: 1rem;
color: rgba(255, 255, 255, 0.6);
margin: 0;
max-width: 300px;
}
.restoring-state[data-v-7a32ffcf] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
color: #ffd700;
}
.spinner-small[data-v-7a32ffcf] {
width: 28px;
height: 28px;
border: 3px solid rgba(255, 215, 0, 0.2);
border-top-color: #ffd700;
border-radius: 50%;
animation: spin-7a32ffcf 0.8s linear infinite;
}
@keyframes spin-7a32ffcf {
to { transform: rotate(360deg);
}
}
.monitoring-indicator[data-v-7a32ffcf] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.5);
}
.pulse-dot[data-v-7a32ffcf] {
width: 8px;
height: 8px;
border-radius: 50%;
background: #22c55e;
animation: pulse-dot-7a32ffcf 1.5s ease-in-out infinite;
}
@keyframes pulse-dot-7a32ffcf {
0%, 100% { opacity: 1; transform: scale(1);
}
50% { opacity: 0.5; transform: scale(1.3);
}
}
.suspended-hint[data-v-7a32ffcf] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.35);
margin: 0.5rem 0 0;
}
.login-instead-btn[data-v-7a32ffcf] {
margin-top: 1rem;
padding: 0.5rem 1.5rem;
background: none;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 10px;
color: rgba(255, 255, 255, 0.4);
font-size: 0.8rem;
cursor: pointer;
}
.license-scanner[data-v-90489e63] {
width: 100%;
}
/* Isolated Scan Capture Overlay - Prevents browser autofill interference */
.scan-capture-overlay[data-v-90489e63] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.95);
display: flex;
align-items: center;
justify-content: center;
z-index: 10000;
backdrop-filter: blur(10px);
animation: fadeIn 0.2s ease-out;
}
.scan-capture-container[data-v-90489e63] {
background: linear-gradient(135deg, rgba(20, 25, 35, 0.98), rgba(30, 35, 45, 0.98));
border: 2px solid rgba(72, 187, 120, 0.5);
border-radius: 20px;
padding: 3rem;
max-width: 500px;
width: 90%;
text-align: center;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(72, 187, 120, 0.2);
}
.scan-capture-icon[data-v-90489e63] {
font-size: 4rem;
margin-bottom: 1rem;
animation: pulse-90489e63 2s ease-in-out infinite;
}
@keyframes pulse-90489e63 {
0%,
100% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(1.1);
opacity: 0.8;
}
}
.scan-capture-container h2[data-v-90489e63] {
color: var(--text-primary);
margin-bottom: 0.5rem;
font-size: 1.5rem;
}
.scan-capture-container p[data-v-90489e63] {
color: var(--text-secondary);
margin-bottom: 2rem;
font-size: 1.1rem;
}
.scan-capture-progress[data-v-90489e63] {
width: 100%;
height: 8px;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
overflow: hidden;
margin-bottom: 2rem;
}
.progress-bar[data-v-90489e63] {
height: 100%;
background: linear-gradient(90deg, rgb(72, 187, 120), rgb(34, 197, 94));
border-radius: 4px;
transition: width 0.1s ease-out;
box-shadow: 0 0 10px rgba(72, 187, 120, 0.5);
}
.isolated-scan-input[data-v-90489e63] {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
/* Hidden input for keyboard wedge scanner (LEGACY) */
.scanner-input-hidden[data-v-90489e63] {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.scanner-tabs[data-v-90489e63] {
display: flex;
gap: 0.5rem;
margin-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.tab-button[data-v-90489e63] {
padding: 0.75rem 1.5rem;
background: transparent;
border: none;
color: var(--text-secondary);
cursor: pointer;
border-radius: 8px 8px 0 0;
transition: all 0.3s ease;
font-size: 0.9rem;
font-weight: 500;
}
.tab-button[data-v-90489e63]:hover {
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.tab-button.active[data-v-90489e63] {
background: rgba(var(--neon-blue-rgb), 0.1);
color: var(--neon-blue);
border-bottom: 2px solid var(--neon-blue);
}
.tab-button.hardware[data-v-90489e63] {
background: linear-gradient(135deg, rgba(72, 187, 120, 0.1), rgba(16, 185, 129, 0.1));
border-color: rgba(72, 187, 120, 0.3);
}
.tab-button.hardware.active[data-v-90489e63] {
background: rgba(72, 187, 120, 0.15);
color: rgb(72, 187, 120);
border-bottom-color: rgb(72, 187, 120);
}
.tab-button.disabled[data-v-90489e63] {
opacity: 0.5;
cursor: not-allowed;
}
.device-status[data-v-90489e63] {
margin-bottom: 1rem;
padding: 1rem;
border-radius: 8px;
font-size: 0.9rem;
}
.status-message.success[data-v-90489e63] {
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
color: rgb(34, 197, 94);
}
.status-message.warning[data-v-90489e63] {
background: rgba(245, 158, 11, 0.1);
border: 1px solid rgba(245, 158, 11, 0.3);
color: rgb(245, 158, 11);
}
.status-message.error[data-v-90489e63] {
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
color: rgb(239, 68, 68);
}
.hardware-scanner[data-v-90489e63] {
display: flex;
flex-direction: column;
gap: 1.5rem;
align-items: center;
text-align: center;
}
.hardware-viewport[data-v-90489e63] {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
padding: 2rem;
border: 2px dashed rgba(72, 187, 120, 0.3);
border-radius: 12px;
background: rgba(72, 187, 120, 0.05);
min-height: 200px;
justify-content: center;
}
.hardware-icon[data-v-90489e63] {
font-size: 4rem;
opacity: 0.8;
color: rgb(72, 187, 120);
}
.hardware-instructions h3[data-v-90489e63] {
color: var(--text-primary);
margin-bottom: 0.5rem;
font-size: 1.2rem;
}
.hardware-instructions p[data-v-90489e63] {
color: var(--text-secondary);
margin-bottom: 0.5rem;
font-size: 1rem;
}
.instruction-text[data-v-90489e63] {
font-style: italic;
opacity: 0.8;
}
.scan-status[data-v-90489e63] {
margin-top: 1rem;
padding: 0.75rem;
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
border-radius: 6px;
color: rgb(34, 197, 94);
font-weight: 600;
font-size: 0.95rem;
}
.scan-status.processing[data-v-90489e63] {
background: rgba(245, 158, 11, 0.1);
border-color: rgba(245, 158, 11, 0.3);
color: rgb(245, 158, 11);
}
.camera-scanner[data-v-90489e63] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.scanner-viewport[data-v-90489e63] {
position: relative;
width: 100%;
height: 300px;
background: #000;
border-radius: 12px;
overflow: hidden;
border: 2px solid rgba(var(--neon-blue-rgb), 0.3);
}
.scanner-overlay[data-v-90489e63] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
pointer-events: none;
}
.scan-frame[data-v-90489e63] {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 280px;
height: 180px;
border: 2px solid var(--neon-green);
border-radius: 8px;
background: rgba(0, 255, 136, 0.1);
}
.scan-corners[data-v-90489e63] {
position: relative;
width: 100%;
height: 100%;
}
.corner[data-v-90489e63] {
position: absolute;
width: 20px;
height: 20px;
border: 3px solid var(--neon-green);
}
.corner.top-left[data-v-90489e63] {
top: -2px;
left: -2px;
border-right: none;
border-bottom: none;
border-radius: 8px 0 0 0;
}
.corner.top-right[data-v-90489e63] {
top: -2px;
right: -2px;
border-left: none;
border-bottom: none;
border-radius: 0 8px 0 0;
}
.corner.bottom-left[data-v-90489e63] {
bottom: -2px;
left: -2px;
border-right: none;
border-top: none;
border-radius: 0 0 0 8px;
}
.corner.bottom-right[data-v-90489e63] {
bottom: -2px;
right: -2px;
border-left: none;
border-top: none;
border-radius: 0 0 8px 0;
}
.scan-instructions[data-v-90489e63] {
position: absolute;
bottom: -40px;
left: 50%;
transform: translateX(-50%);
color: var(--neon-green);
font-size: 0.9rem;
text-align: center;
text-shadow: 0 0 10px var(--neon-green);
}
video[data-v-90489e63] {
width: 100%;
height: 100%;
object-fit: cover;
}
.scanner-controls[data-v-90489e63] {
display: flex;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
.manual-entry[data-v-90489e63] {
min-height: 200px;
}
/* Button styles (inherited from global styles) */
.btn-neon[data-v-90489e63] {
padding: 0.75rem 1.5rem;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: 600;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-neon.neon-blue[data-v-90489e63] {
background: linear-gradient(135deg, var(--neon-blue), rgba(var(--neon-blue-rgb), 0.8));
color: white;
box-shadow: 0 0 20px rgba(var(--neon-blue-rgb), 0.5);
}
.btn-neon.neon-blue[data-v-90489e63]:hover {
transform: translateY(-2px);
box-shadow: 0 5px 30px rgba(var(--neon-blue-rgb), 0.7);
}
.btn-neon.neon-green[data-v-90489e63] {
background: linear-gradient(135deg, var(--neon-green), rgba(var(--neon-green-rgb), 0.8));
color: white;
box-shadow: 0 0 20px rgba(var(--neon-green-rgb), 0.5);
}
.btn-neon.neon-green[data-v-90489e63]:hover {
transform: translateY(-2px);
box-shadow: 0 5px 30px rgba(var(--neon-green-rgb), 0.7);
}
.btn-neon.neon-orange[data-v-90489e63] {
background: linear-gradient(135deg, var(--neon-orange), rgba(255, 165, 0, 0.8));
color: white;
box-shadow: 0 0 20px rgba(255, 165, 0, 0.5);
}
.btn-neon.neon-orange[data-v-90489e63]:hover:not(:disabled) {
transform: translateY(-2px);
box-shadow: 0 5px 30px rgba(255, 165, 0, 0.7);
}
.btn-neon[data-v-90489e63]:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none !important;
}
.btn-glass[data-v-90489e63] {
padding: 0.75rem 1.5rem;
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
font-weight: 500;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-glass[data-v-90489e63]:hover {
background: rgba(255, 255, 255, 0.15);
border-color: rgba(255, 255, 255, 0.3);
transform: translateY(-1px);
}
.btn-icon[data-v-90489e63] {
margin-right: 0.25rem;
}
.scanner-modal[data-v-17c9858c] {
width: 560px;
max-width: 95vw;
}
/* Scanner status bar */
.scanner-status-bar[data-v-17c9858c] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 1rem;
background: rgba(255, 255, 255, 0.04);
border-radius: 8px;
margin-bottom: 1rem;
font-size: 0.8rem;
}
.status-dot[data-v-17c9858c] {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255, 80, 80, 0.8);
margin-left: 0.75rem;
}
.status-dot[data-v-17c9858c]:first-child {
margin-left: 0;
}
.status-dot.active[data-v-17c9858c] {
background: rgba(80, 255, 120, 0.9);
box-shadow: 0 0 6px rgba(80, 255, 120, 0.5);
}
.status-label[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.6);
}
/* Connect button */
.connect-btn[data-v-17c9858c] {
margin-top: 1.25rem;
padding: 0.6rem 1.5rem;
font-size: 0.95rem;
}
/* Step indicator */
.step-indicator[data-v-17c9858c] {
display: flex;
align-items: center;
justify-content: center;
gap: 0;
margin-bottom: 1.5rem;
}
.step-dot[data-v-17c9858c] {
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 0.9rem;
background: rgba(255, 255, 255, 0.08);
border: 2px solid rgba(255, 255, 255, 0.15);
color: rgba(255, 255, 255, 0.4);
transition: all 0.3s ease;
}
.step-dot.active[data-v-17c9858c] {
background: rgba(0, 200, 255, 0.15);
border-color: var(--neon-blue);
color: var(--neon-blue);
box-shadow: 0 0 12px rgba(0, 200, 255, 0.3);
}
.step-dot.done[data-v-17c9858c] {
background: rgba(80, 255, 120, 0.15);
border-color: var(--neon-green);
color: var(--neon-green);
}
.step-line[data-v-17c9858c] {
width: 60px;
height: 2px;
background: rgba(255, 255, 255, 0.1);
transition: background 0.3s ease;
}
.step-line.done[data-v-17c9858c] {
background: var(--neon-green);
}
/* Scan instruction block */
.scan-step[data-v-17c9858c] {
min-height: 200px;
}
.scan-instruction[data-v-17c9858c] {
text-align: center;
padding: 2rem 1rem;
}
.scan-icon[data-v-17c9858c] {
font-size: 3rem;
margin-bottom: 0.75rem;
}
.scan-icon.spinning[data-v-17c9858c] {
animation: spin-17c9858c 1.5s linear infinite;
}
@keyframes spin-17c9858c {
from { transform: rotate(0deg);
}
to { transform: rotate(360deg);
}
}
.scan-instruction h3[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 0.5rem;
font-size: 1.2rem;
}
.scan-instruction p[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.55);
font-size: 0.9rem;
margin-bottom: 0.25rem;
}
.scan-hint[data-v-17c9858c] {
color: rgba(0, 200, 255, 0.7) !important;
font-style: italic;
}
.scan-warning[data-v-17c9858c] {
color: rgba(255, 180, 50, 0.9);
background: rgba(255, 180, 50, 0.1);
border: 1px solid rgba(255, 180, 50, 0.2);
border-radius: 8px;
padding: 0.5rem 1rem;
margin-top: 1rem;
font-size: 0.85rem;
}
/* Pulsing indicator */
.scan-pulse[data-v-17c9858c] {
width: 12px;
height: 12px;
border-radius: 50%;
background: var(--neon-blue);
margin: 1.5rem auto 0;
animation: pulse-17c9858c 2s ease-in-out infinite;
}
@keyframes pulse-17c9858c {
0%, 100% { opacity: 0.3; transform: scale(1);
}
50% { opacity: 1; transform: scale(1.4); box-shadow: 0 0 16px rgba(0, 200, 255, 0.6);
}
}
/* Scan error */
.scan-error[data-v-17c9858c] {
text-align: center;
padding: 2rem 1rem;
}
.scan-error h3[data-v-17c9858c] {
color: rgba(255, 100, 100, 0.9);
margin-bottom: 0.5rem;
}
.scan-error p[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.55);
margin-bottom: 1rem;
font-size: 0.9rem;
}
/* Parsed data summary */
.parsed-summary[data-v-17c9858c] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.75rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.04);
border-radius: 10px;
margin-bottom: 1rem;
}
.parsed-field[data-v-17c9858c] {
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.field-label[data-v-17c9858c] {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: rgba(255, 255, 255, 0.4);
}
.field-value[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.9);
font-size: 0.95rem;
}
/* Existing player match */
.existing-match[data-v-17c9858c] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
background: rgba(0, 200, 255, 0.08);
border: 1px solid rgba(0, 200, 255, 0.2);
border-radius: 8px;
margin-bottom: 1rem;
}
.match-badge[data-v-17c9858c] {
background: rgba(0, 200, 255, 0.2);
color: var(--neon-blue);
padding: 0.2rem 0.6rem;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
white-space: nowrap;
}
.match-name[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
}
.match-card[data-v-17c9858c] {
color: rgba(255, 255, 255, 0.5);
font-size: 0.85rem;
margin-left: auto;
}
/* Photo capture area */
.photo-capture-area[data-v-17c9858c] {
min-height: 180px;
}
.manual-capture-btn[data-v-17c9858c] {
margin-top: 1rem;
font-size: 0.85rem;
}
.photo-preview[data-v-17c9858c] {
text-align: center;
}
.scanned-photo[data-v-17c9858c] {
max-width: 100%;
max-height: 300px;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}
.retake-btn[data-v-17c9858c] {
margin-top: 0.75rem;
font-size: 0.85rem;
}
/* Responsive */
@media (max-width: 600px) {
.scanner-modal[data-v-17c9858c] {
width: 100%;
}
.parsed-summary[data-v-17c9858c] {
grid-template-columns: 1fr;
}
.existing-match[data-v-17c9858c] {
flex-wrap: wrap;
}
.match-card[data-v-17c9858c] {
margin-left: 0;
}
}
.kpi-card[data-v-493677ff] {
flex: 1 1 100px;
min-width: 90px;
padding: 0.6rem 0.75rem;
border-radius: 8px;
text-align: center;
display: flex;
flex-direction: column;
gap: 0.2rem;
margin: 0;
}
.kpi-icon[data-v-493677ff] {
margin-bottom: 0.15rem;
color: rgba(255, 255, 255, 0.6);
}
.kpi-value[data-v-493677ff] {
font-size: 1.1rem;
font-weight: 700;
color: var(--text-primary);
}
.kpi-label[data-v-493677ff] {
font-size: 0.7rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: rgba(255, 255, 255, 0.55);
}
.kpi-trend[data-v-493677ff] {
font-size: 0.7rem;
font-weight: 600;
}
.trend-up[data-v-493677ff] {
color: #34d399;
}
.trend-down[data-v-493677ff] {
color: #f87171;
}
.kpi-success .kpi-value[data-v-493677ff] {
color: #34d399;
}
.kpi-danger .kpi-value[data-v-493677ff] {
color: #f87171;
}
.kpi-warning .kpi-value[data-v-493677ff] {
color: #fbbf24;
}
.apex-chart-wrapper[data-v-6e032d57] {
padding: 1rem;
border-radius: 12px;
margin: 0;
}
.chart-title[data-v-6e032d57] {
font-size: 0.85rem;
font-weight: 600;
color: var(--text-secondary);
margin-bottom: 0.5rem;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.data-table-widget[data-v-bf2f2a6d] {
padding: 1rem;
border-radius: 12px;
margin: 0;
}
.dt-header h3[data-v-bf2f2a6d] {
margin: 0 0 0.75rem 0;
font-size: 1rem;
font-weight: 600;
color: var(--text-primary, #fff);
}
.dt-scroll-wrapper[data-v-bf2f2a6d] {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.dt-table[data-v-bf2f2a6d] {
width: 100%;
border-collapse: collapse;
font-size: 0.85rem;
}
.dt-table th[data-v-bf2f2a6d] {
text-align: left;
padding: 0.5rem 0.75rem;
color: var(--text-secondary, rgba(255, 255, 255, 0.6));
font-weight: 600;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
white-space: nowrap;
}
.dt-table td[data-v-bf2f2a6d] {
padding: 0.5rem 0.75rem;
color: var(--text-primary, #fff);
white-space: nowrap;
}
.dt-row-alt[data-v-bf2f2a6d] {
background: rgba(255, 255, 255, 0.06);
}
.dt-table tbody tr[data-v-bf2f2a6d]:hover {
background: rgba(255, 255, 255, 0.08);
}
.dt-empty[data-v-bf2f2a6d] {
display: flex;
align-items: center;
justify-content: center;
min-height: 80px;
color: var(--text-secondary, rgba(255, 255, 255, 0.5));
font-size: 0.85rem;
}
.stat-grid[data-v-b2a72dde] {
padding: 1rem;
border-radius: 12px;
margin: 0;
}
.glass-panel[data-v-17aea217] {
padding: var(--7f08989a);
border-radius: 12px;
margin: 0;
}
.gp-title[data-v-17aea217] {
margin: 0 0 0.75rem 0;
font-size: 1rem;
font-weight: 600;
color: rgba(255, 215, 0, 0.85);
}
.rendered-specs[data-v-d8538508] {
margin-top: 0.75rem;
}
.inline-form-spec[data-v-e7d0ef9f] {
padding: 1rem;
border-radius: 10px;
margin-top: 0.75rem;
border: 1px solid rgba(255, 215, 0, 0.15);
}
.inline-form-spec[data-v-e7d0ef9f] .formkit-form {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.inline-form-spec[data-v-e7d0ef9f] .formkit-actions {
margin-top: 0.5rem;
}
.inline-form-spec[data-v-e7d0ef9f] .formkit-actions button {
padding: 0.4rem 1.2rem;
border-radius: 6px;
background: rgba(255, 215, 0, 0.15);
border: 1px solid rgba(255, 215, 0, 0.4);
color: rgba(255, 215, 0, 0.95);
cursor: pointer;
font-size: 0.85rem;
transition: all 0.2s;
}
.inline-form-spec[data-v-e7d0ef9f] .formkit-actions button:hover {
background: rgba(255, 215, 0, 0.25);
border-color: rgba(255, 215, 0, 0.7);
}
.chat-modal[data-v-8fe35312] {
width: min(1400px, 96vw);
height: 95vh;
padding: 0;
display: flex;
flex-direction: column;
background: rgba(12, 13, 24, 0.92);
border: 1px solid rgba(255, 215, 0, 0.35);
box-shadow: 0 40px 80px rgba(0, 0, 0, 0.5);
}
.chat-header[data-v-8fe35312] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem 1.25rem;
border-bottom: 1px solid rgba(255, 215, 0, 0.12);
background: linear-gradient(135deg, rgba(255, 215, 0, 0.12), rgba(185, 28, 28, 0.08));
}
.chat-title[data-v-8fe35312] {
display: flex;
gap: 0.65rem;
align-items: center;
}
.chat-icon[data-v-8fe35312] {
font-size: 1.4rem;
}
.chat-subtitle[data-v-8fe35312] {
margin: 0;
font-size: 0.8rem;
color: var(--text-secondary);
}
.chat-header h2[data-v-8fe35312] {
margin: 0;
font-size: 1.15rem;
}
.header-actions[data-v-8fe35312] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.templates-panel[data-v-8fe35312] {
border-bottom: 1px solid rgba(255, 215, 0, 0.15);
padding: 0.75rem 1.25rem;
background: rgba(17, 24, 39, 0.95);
max-height: 240px;
overflow-y: auto;
}
.templates-header[data-v-8fe35312] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
}
.templates-header h3[data-v-8fe35312] {
margin: 0;
font-size: 0.9rem;
color: rgba(255, 215, 0, 0.9);
}
.templates-loading[data-v-8fe35312],
.templates-empty[data-v-8fe35312] {
font-size: 0.82rem;
color: rgba(255, 255, 255, 0.5);
padding: 0.5rem 0;
}
.templates-list[data-v-8fe35312] {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.template-item[data-v-8fe35312] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.4rem 0.6rem;
border-radius: 6px;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.06);
transition: background 0.15s;
}
.template-item[data-v-8fe35312]:hover {
background: rgba(255, 215, 0, 0.06);
border-color: rgba(255, 215, 0, 0.15);
}
.template-info[data-v-8fe35312] {
cursor: pointer;
flex: 1;
display: flex;
flex-direction: column;
gap: 0.1rem;
min-width: 0;
}
.template-title[data-v-8fe35312] {
font-size: 0.82rem;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.template-date[data-v-8fe35312] {
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.4);
}
.template-actions[data-v-8fe35312] {
display: flex;
gap: 0.25rem;
flex-shrink: 0;
margin-left: 0.5rem;
}
.chat-history[data-v-8fe35312] {
flex: 1;
overflow-y: auto;
padding: 1.5rem;
display: flex;
flex-direction: column;
gap: 1rem;
background: radial-gradient(circle at top, rgba(185, 28, 28, 0.12), transparent 60%);
}
.chat-row[data-v-8fe35312] {
display: flex;
gap: 0.75rem;
align-items: flex-start;
}
.chat-row.assistant[data-v-8fe35312] {
flex-direction: row;
}
.chat-row.user[data-v-8fe35312] {
flex-direction: row-reverse;
}
.avatar[data-v-8fe35312] {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.2rem;
background: rgba(255, 255, 255, 0.08);
}
.avatar.user[data-v-8fe35312] {
background: rgba(239, 68, 68, 0.15);
}
.bubble[data-v-8fe35312] {
max-width: 80%;
padding: 1rem;
border-radius: 12px;
position: relative;
border: 1px solid rgba(255, 215, 0, 0.08);
background: rgba(17, 24, 39, 0.9);
color: var(--text-primary);
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
}
.bubble.assistant[data-v-8fe35312] {
border-color: rgba(255, 215, 0, 0.32);
background: rgba(30, 41, 59, 0.92);
}
.bubble.user[data-v-8fe35312] {
border-color: rgba(239, 68, 68, 0.4);
background: rgba(127, 29, 29, 0.35);
}
.message-content[data-v-8fe35312] p {
margin: 0 0 0.5rem;
}
.message-content[data-v-8fe35312] ul {
margin: 0.5rem 0;
padding-left: 1.2rem;
}
.message-content[data-v-8fe35312] li {
margin-bottom: 0.25rem;
}
.message-export-actions[data-v-8fe35312] {
display: flex;
gap: 0.35rem;
margin-top: 0.5rem;
padding-top: 0.5rem;
border-top: 1px solid rgba(255, 215, 0, 0.1);
}
.message-export-actions .btn-xs[data-v-8fe35312] {
padding: 0.15rem 0.5rem;
font-size: 0.72rem;
border-radius: 4px;
opacity: 0.7;
transition: opacity 0.15s;
}
.message-export-actions .btn-xs[data-v-8fe35312]:hover {
opacity: 1;
}
.timestamp[data-v-8fe35312] {
margin-top: 0.5rem;
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.45);
}
.typing[data-v-8fe35312] {
display: inline-flex;
gap: 0.35rem;
align-items: center;
}
.dot[data-v-8fe35312] {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.5);
animation: typing-8fe35312 1.4s infinite ease-in-out;
}
.dot[data-v-8fe35312]:nth-child(2) {
animation-delay: 0.2s;
}
.dot[data-v-8fe35312]:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes typing-8fe35312 {
0%,
80%,
100% {
opacity: 0.2;
transform: translateY(0);
}
40% {
opacity: 1;
transform: translateY(-3px);
}
}
.query-log[data-v-8fe35312] {
border-top: 1px solid rgba(255, 215, 0, 0.15);
padding: 1rem 1.75rem;
background: rgba(17, 24, 39, 0.85);
}
.query-log h3[data-v-8fe35312] {
margin: 0 0 0.5rem;
font-size: 0.95rem;
}
.query-log ul[data-v-8fe35312] {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.query-log li[data-v-8fe35312] {
display: grid;
grid-template-columns: 120px 1fr;
gap: 0.75rem;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.8);
}
.query-name[data-v-8fe35312] {
font-weight: 600;
color: rgba(255, 215, 0, 0.85);
}
.query-input[data-v-8fe35312] {
font-family: 'Source Code Pro', monospace;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.timeframe-section[data-v-8fe35312] {
border-top: 1px solid rgba(255, 215, 0, 0.15);
padding: 0.6rem 1.75rem;
background: rgba(10, 14, 28, 0.95);
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem 0.75rem;
}
.timeframe-section h3[data-v-8fe35312] {
margin: 0;
font-size: 0.9rem;
}
.timeframe-note[data-v-8fe35312] {
margin: 0;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.4);
}
.timeframe-presets[data-v-8fe35312] {
display: flex;
flex-wrap: wrap;
gap: 0.35rem;
}
.preset-button[data-v-8fe35312] {
padding: 0.25rem 0.7rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.2);
background: transparent;
color: rgba(255, 255, 255, 0.85);
cursor: pointer;
font-size: 0.8rem;
transition: all 0.2s ease-in-out;
}
.preset-button[data-v-8fe35312]:hover {
border-color: rgba(255, 215, 0, 0.5);
color: rgba(255, 215, 0, 0.9);
}
.preset-button.active[data-v-8fe35312] {
background: rgba(255, 215, 0, 0.12);
border-color: rgba(255, 215, 0, 0.8);
color: rgba(255, 215, 0, 1);
box-shadow: 0 0 10px rgba(255, 215, 0, 0.25);
}
.custom-date-input input[data-v-8fe35312] {
background: rgba(17, 24, 39, 0.8);
border: 1px solid rgba(255, 215, 0, 0.25);
border-radius: 6px;
padding: 0.25rem 0.5rem;
color: var(--text-primary);
font-size: 0.8rem;
}
.summary-value[data-v-8fe35312] {
font-size: 0.8rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.85);
}
.timeframe-error[data-v-8fe35312] {
margin: 0.35rem 0 0;
color: #fca5a5;
font-size: 0.8rem;
}
.debug-section[data-v-8fe35312] {
margin-top: 1rem;
padding: 0.75rem;
background: rgba(185, 28, 28, 0.08);
border: 1px solid rgba(255, 215, 0, 0.2);
border-radius: 8px;
}
.debug-section summary[data-v-8fe35312] {
cursor: pointer;
font-weight: 600;
font-size: 0.9rem;
color: rgba(255, 215, 0, 0.9);
padding: 0.25rem;
user-select: none;
}
.debug-section summary[data-v-8fe35312]:hover {
color: rgba(255, 215, 0, 1);
}
.debug-content[data-v-8fe35312] {
margin-top: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.debug-row[data-v-8fe35312] {
display: grid;
grid-template-columns: 120px 1fr;
gap: 0.75rem;
font-size: 0.85rem;
align-items: center;
}
.debug-label[data-v-8fe35312] {
font-weight: 600;
color: rgba(255, 255, 255, 0.7);
}
.debug-value[data-v-8fe35312] {
color: rgba(255, 255, 255, 0.9);
font-family: 'Source Code Pro', monospace;
}
.debug-value.warn[data-v-8fe35312] {
color: #fca5a5;
}
.warn-badge[data-v-8fe35312] {
margin-left: 0.5rem;
padding: 0.2rem 0.5rem;
background: rgba(185, 28, 28, 0.3);
border: 1px solid rgba(248, 113, 113, 0.4);
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
}
.debug-warning[data-v-8fe35312] {
padding: 0.75rem;
background: rgba(185, 28, 28, 0.2);
border: 1px solid rgba(248, 113, 113, 0.4);
border-radius: 6px;
color: #fca5a5;
font-size: 0.85rem;
font-weight: 600;
}
.tool-calls-list[data-v-8fe35312],
.tool-results-list[data-v-8fe35312] {
margin-top: 0.75rem;
}
.tool-calls-list h4[data-v-8fe35312],
.tool-results-list h4[data-v-8fe35312] {
margin: 0 0 0.5rem;
font-size: 0.85rem;
color: rgba(255, 215, 0, 0.8);
}
.tool-call-item[data-v-8fe35312],
.tool-result-item[data-v-8fe35312] {
margin-bottom: 0.75rem;
padding: 0.75rem;
background: rgba(17, 24, 39, 0.5);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
}
.tool-call-name[data-v-8fe35312] {
font-weight: 600;
color: rgba(34, 211, 238, 0.9);
margin-bottom: 0.5rem;
font-size: 0.85rem;
}
.tool-call-args[data-v-8fe35312],
.tool-result-preview[data-v-8fe35312] {
margin: 0;
padding: 0.5rem;
background: rgba(0, 0, 0, 0.3);
border-radius: 4px;
font-family: 'Source Code Pro', monospace;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.8);
overflow-x: auto;
white-space: pre-wrap;
word-break: break-all;
}
.tool-result-header[data-v-8fe35312] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
}
.tool-result-name[data-v-8fe35312] {
font-weight: 600;
color: rgba(34, 211, 238, 0.9);
font-size: 0.85rem;
}
.tool-result-length[data-v-8fe35312] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
font-family: 'Source Code Pro', monospace;
}
.chat-composer[data-v-8fe35312] {
padding: 1.25rem 1.75rem 1.5rem;
display: flex;
flex-direction: column;
gap: 0.85rem;
border-top: 1px solid rgba(255, 215, 0, 0.15);
background: rgba(12, 16, 32, 0.95);
}
.composer-actions[data-v-8fe35312] {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.composer-buttons[data-v-8fe35312] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
align-items: center;
}
.email-input-inline[data-v-8fe35312] {
display: inline-flex;
gap: 0.35rem;
align-items: center;
}
.email-input-inline .input-sm[data-v-8fe35312] {
width: 200px;
padding: 0.25rem 0.5rem;
font-size: 0.82rem;
}
.composer-hint[data-v-8fe35312] {
margin: 0;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.55);
}
.composer-input[data-v-8fe35312] {
display: flex;
gap: 1rem;
align-items: flex-end;
}
.composer-input textarea[data-v-8fe35312] {
flex: 1;
resize: none;
min-height: 90px;
}
.send-button[data-v-8fe35312] {
min-width: 120px;
}
.error-banner[data-v-8fe35312] {
padding: 0.75rem 1rem;
border-radius: 8px;
background: rgba(185, 28, 28, 0.2);
border: 1px solid rgba(248, 113, 113, 0.4);
color: #fca5a5;
font-size: 0.85rem;
}
/* Markdown table styling */
.message-content[data-v-8fe35312] table {
width: 100%;
border-collapse: collapse;
margin: 0.75rem 0;
font-size: 0.85rem;
}
.message-content[data-v-8fe35312] th {
background: rgba(255, 215, 0, 0.1);
border-bottom: 1px solid rgba(255, 215, 0, 0.3);
padding: 0.5rem 0.75rem;
text-align: left;
font-weight: 600;
color: rgba(255, 215, 0, 0.9);
}
.message-content[data-v-8fe35312] td {
padding: 0.4rem 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.message-content[data-v-8fe35312] tr:hover td {
background: rgba(255, 255, 255, 0.04);
}
/* Chart panel */
.chart-panel[data-v-8fe35312] {
margin-top: 0.75rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.chart-wrapper[data-v-8fe35312] {
background: rgba(17, 24, 39, 0.6);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 10px;
padding: 0.75rem;
}
.chart-title[data-v-8fe35312] {
margin: 0 0 0.5rem;
font-size: 0.85rem;
font-weight: 600;
color: rgba(255, 215, 0, 0.85);
}
/* KPI row */
.kpi-row[data-v-8fe35312] {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
/* Streaming indicator */
.streaming-indicator[data-v-8fe35312] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-top: 0.5rem;
}
.streaming-status[data-v-8fe35312] {
font-size: 0.8rem;
font-style: italic;
color: rgba(255, 215, 0, 0.85);
animation: pulse-status-8fe35312 2s ease-in-out infinite;
}
.cursor-blink[data-v-8fe35312] {
font-weight: bold;
color: rgba(255, 215, 0, 0.9);
animation: blink-8fe35312 1s step-end infinite;
}
@keyframes pulse-status-8fe35312 {
0%, 100% { opacity: 0.6;
}
50% { opacity: 1;
}
}
@keyframes blink-8fe35312 {
0%, 100% { opacity: 1;
}
50% { opacity: 0;
}
}
.btn-stop[data-v-8fe35312] {
background: rgba(185, 28, 28, 0.3) !important;
border-color: rgba(248, 113, 113, 0.5) !important;
}
@media (max-width: 768px) {
.bubble[data-v-8fe35312] {
max-width: 80%;
}
.composer-actions[data-v-8fe35312] {
flex-direction: column;
align-items: flex-start;
}
.composer-input[data-v-8fe35312] {
flex-direction: column;
align-items: stretch;
}
.send-button[data-v-8fe35312] {
width: 100%;
}
}
/* Merge modal specific styles */
.merge-modal[data-v-64a1c974] {
max-width: 1200px;
width: 95vw;
max-height: 90vh;
}
.modal-header[data-v-64a1c974] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-64a1c974] {
margin: 0;
display: flex;
align-items: center;
gap: 0.75rem;
}
.btn-close[data-v-64a1c974] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
color: var(--text-secondary);
font-size: 1.25rem;
font-weight: 400;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
border-radius: 8px;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
}
.btn-close[data-v-64a1c974]:hover {
color: var(--text-primary);
background: rgba(255, 59, 48, 0.15);
border-color: rgba(255, 59, 48, 0.3);
transform: scale(1.05);
}
.modal-body[data-v-64a1c974] {
padding: 1.5rem 2rem;
}
.modal-footer[data-v-64a1c974] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.step-indicator[data-v-64a1c974] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
margin-bottom: 1.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
}
.step-number[data-v-64a1c974] {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.1);
color: rgba(255, 255, 255, 0.5);
font-weight: bold;
font-size: 1.1rem;
}
.step-number.active[data-v-64a1c974] {
background: var(--neon-blue);
color: white;
box-shadow: 0 0 20px rgba(0, 157, 255, 0.5);
}
.step-number.completed[data-v-64a1c974] {
background: var(--neon-green);
color: white;
}
.step-label[data-v-64a1c974] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.warning-box[data-v-64a1c974] {
display: flex;
gap: 0.75rem;
padding: 0.875rem;
background: rgba(255, 193, 7, 0.1);
border: 1px solid rgba(255, 193, 7, 0.3);
border-radius: 8px;
margin-bottom: 1.25rem;
}
.warning-box.danger[data-v-64a1c974] {
background: rgba(255, 59, 48, 0.1);
border-color: rgba(255, 59, 48, 0.3);
}
.warning-icon[data-v-64a1c974] {
color: #ffc107;
font-size: 1.5rem;
flex-shrink: 0;
}
.player-selection-grid[data-v-64a1c974] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.5rem;
margin-bottom: 1.25rem;
}
.selection-panel[data-v-64a1c974] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 1.25rem;
}
.source-panel h3[data-v-64a1c974] {
color: #ff3b30;
}
.target-panel h3[data-v-64a1c974] {
color: #34c759;
}
.panel-description[data-v-64a1c974] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
margin-bottom: 1rem;
}
.player-search[data-v-64a1c974] {
margin-bottom: 1rem;
}
.selected-player-card[data-v-64a1c974] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
padding: 0.875rem;
}
.player-header[data-v-64a1c974] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.player-avatar[data-v-64a1c974] {
width: 60px;
height: 60px;
border-radius: 50%;
overflow: hidden;
background: rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
}
.player-avatar img[data-v-64a1c974] {
width: 100%;
height: 100%;
object-fit: cover;
}
.default-avatar[data-v-64a1c974] {
font-size: 2rem;
color: rgba(255, 255, 255, 0.5);
}
.player-info[data-v-64a1c974] {
flex: 1;
}
.player-info h4[data-v-64a1c974] {
margin: 0 0 0.5rem 0;
font-size: 1.1rem;
}
.player-meta[data-v-64a1c974] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.7);
}
.btn-remove[data-v-64a1c974] {
background: rgba(255, 59, 48, 0.2);
border: 1px solid rgba(255, 59, 48, 0.4);
color: #ff3b30;
padding: 0.5rem;
border-radius: 6px;
cursor: pointer;
transition: all 0.2s;
}
.btn-remove[data-v-64a1c974]:hover {
background: rgba(255, 59, 48, 0.3);
}
.player-stats-grid[data-v-64a1c974] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 0.75rem;
margin-bottom: 1rem;
}
.stat-item[data-v-64a1c974] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.stat-label[data-v-64a1c974] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
text-transform: uppercase;
letter-spacing: 0.5px;
}
.stat-value[data-v-64a1c974] {
font-size: 1rem;
font-weight: bold;
color: var(--neon-blue);
}
.record-counts[data-v-64a1c974] {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.record-counts h5[data-v-64a1c974] {
font-size: 0.85rem;
margin-bottom: 0.5rem;
color: rgba(255, 255, 255, 0.8);
}
.record-counts ul[data-v-64a1c974] {
list-style: none;
padding: 0;
margin: 0;
}
.record-counts li[data-v-64a1c974] {
font-size: 0.85rem;
padding: 0.25rem 0;
color: rgba(255, 255, 255, 0.7);
}
.player-search-results[data-v-64a1c974] {
max-height: 400px;
overflow-y: auto;
}
.search-hint[data-v-64a1c974] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem 2rem;
text-align: center;
color: rgba(255, 255, 255, 0.5);
gap: 1rem;
}
.search-hint p[data-v-64a1c974] {
margin: 0;
font-size: 0.95rem;
}
.player-option[data-v-64a1c974] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
margin-bottom: 0.5rem;
cursor: pointer;
transition: all 0.2s;
}
.player-option[data-v-64a1c974]:hover {
background: rgba(255, 255, 255, 0.07);
border-color: var(--neon-blue);
}
.player-option-info[data-v-64a1c974] {
display: flex;
align-items: center;
gap: 0.75rem;
}
.player-avatar-small[data-v-64a1c974] {
width: 40px;
height: 40px;
border-radius: 50%;
overflow: hidden;
background: rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
}
.player-avatar-small img[data-v-64a1c974] {
width: 100%;
height: 100%;
object-fit: cover;
}
.player-name[data-v-64a1c974] {
font-weight: 600;
margin-bottom: 0.25rem;
}
.error-message[data-v-64a1c974] {
color: #ff3b30;
font-size: 0.85rem;
margin-top: 0.5rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.error-message-banner[data-v-64a1c974] {
background: rgba(255, 59, 48, 0.1);
border: 1px solid rgba(255, 59, 48, 0.3);
color: #ff3b30;
padding: 1rem;
border-radius: 8px;
margin-top: 1rem;
display: flex;
align-items: center;
gap: 0.75rem;
}
.merge-preview[data-v-64a1c974] {
padding: 0.875rem;
}
.merge-preview h3[data-v-64a1c974] {
margin-bottom: 1.5rem;
text-align: center;
}
.merge-flow-diagram[data-v-64a1c974] {
display: flex;
align-items: center;
justify-content: center;
gap: 1.5rem;
margin: 1.5rem 0;
padding: 1.25rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
}
.flow-source[data-v-64a1c974],
.flow-target[data-v-64a1c974] {
text-align: center;
padding: 1rem;
border-radius: 8px;
}
.flow-source[data-v-64a1c974] {
background: rgba(255, 59, 48, 0.1);
border: 1px solid rgba(255, 59, 48, 0.3);
}
.flow-target[data-v-64a1c974] {
background: rgba(52, 199, 89, 0.1);
border: 1px solid rgba(52, 199, 89, 0.3);
}
.flow-arrow[data-v-64a1c974] {
font-size: 2rem;
color: var(--neon-blue);
}
.consolidated-preview[data-v-64a1c974],
.actions-preview[data-v-64a1c974] {
margin: 1.5rem 0;
padding: 1.25rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 12px;
}
.consolidated-preview h4[data-v-64a1c974],
.actions-preview h4[data-v-64a1c974] {
margin-bottom: 1rem;
color: rgba(255, 255, 255, 0.9);
}
.balance-comparison[data-v-64a1c974] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.balance-row[data-v-64a1c974] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 6px;
}
.balance-label[data-v-64a1c974] {
font-weight: 600;
color: rgba(255, 255, 255, 0.8);
}
.balance-calc[data-v-64a1c974] {
font-family: 'Courier New', monospace;
color: rgba(255, 255, 255, 0.7);
}
.balance-calc strong[data-v-64a1c974] {
color: var(--neon-green);
font-size: 1.1rem;
}
.action-list[data-v-64a1c974] {
list-style: none;
padding: 0;
margin: 0;
}
.action-list li[data-v-64a1c974] {
padding: 0.75rem;
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.95rem;
}
.success-icon[data-v-64a1c974] {
color: var(--neon-green);
}
.warning-icon[data-v-64a1c974] {
color: #ffc107;
}
.confirmation-section[data-v-64a1c974] {
margin-top: 2rem;
}
.confirmation-input[data-v-64a1c974] {
margin-top: 1.5rem;
}
.confirmation-input label[data-v-64a1c974] {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
}
.loading-overlay[data-v-64a1c974] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
}
.loading-spinner[data-v-64a1c974] {
text-align: center;
}
.loading-spinner .spinning[data-v-64a1c974] {
font-size: 3rem;
color: var(--neon-blue);
animation: spin-64a1c974 1s linear infinite;
}
.loading-spinner p[data-v-64a1c974] {
margin-top: 1rem;
font-size: 1.1rem;
}
@keyframes spin-64a1c974 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Tier badge colors */
.tier-bronze[data-v-64a1c974] {
background: #cd7f32;
color: white;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.tier-silver[data-v-64a1c974] {
background: #c0c0c0;
color: #333;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.tier-gold[data-v-64a1c974] {
background: #ffd700;
color: #333;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.tier-platinum[data-v-64a1c974] {
background: #e5e4e2;
color: #333;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
.tier-diamond[data-v-64a1c974] {
background: #b9f2ff;
color: #333;
padding: 0.25rem 0.5rem;
border-radius: 4px;
}
/* Responsive adjustments */
@media (max-width: 1024px) {
.player-selection-grid[data-v-64a1c974] {
grid-template-columns: 1fr;
}
.merge-modal[data-v-64a1c974] {
width: 98vw;
}
}
.players-view[data-v-d6870524] {
max-width: 1400px;
margin: 0 auto;
padding: 1.5rem 2rem;
}
.view-header[data-v-d6870524] {
padding: 1.5rem 2rem;
text-align: center;
margin-bottom: 1.5rem;
}
/* Quick Actions */
.quick-actions[data-v-d6870524] {
display: flex;
gap: 0.75rem;
margin-bottom: 1.5rem;
flex-wrap: wrap;
}
.dragon-button[data-v-d6870524] {
box-shadow: 0 0 18px rgba(255, 99, 71, 0.35);
border: 1px solid rgba(255, 140, 0, 0.5);
}
.dragon-button[data-v-d6870524]:hover {
box-shadow: 0 0 24px rgba(255, 99, 71, 0.55);
transform: translateY(-2px);
}
.btn-icon[data-v-d6870524] {
margin-right: 0.5rem;
}
.search-hint[data-v-d6870524] {
margin-top: 0.5rem;
font-size: 0.85rem;
color: var(--text-secondary);
}
.search-hint.error[data-v-d6870524] {
color: var(--neon-red);
}
.search-results[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 1.5rem;
}
.search-result[data-v-d6870524] {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 1rem;
padding: 1rem;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.03);
}
.result-main[data-v-d6870524] {
flex: 1;
}
.result-name[data-v-d6870524] {
font-weight: 600;
color: var(--text-primary);
}
.result-meta[data-v-d6870524] {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
font-size: 0.85rem;
color: var(--text-secondary);
opacity: 0.8;
margin-top: 0.25rem;
}
.result-actions[data-v-d6870524] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
justify-content: flex-end;
}
.result-actions .btn-small[data-v-d6870524] {
border-color: rgba(255, 255, 255, 0.2);
}
.player-flags[data-v-d6870524] {
display: flex;
gap: 0.35rem;
margin-top: 0.15rem;
}
.player-flag[data-v-d6870524] {
font-size: 0.65rem;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 0.2rem 0.5rem;
border-radius: 999px;
font-weight: 600;
background: rgba(255, 255, 255, 0.08);
}
.player-flag.vip[data-v-d6870524] {
color: #FFD700;
background: rgba(255, 215, 0, 0.15);
border: 1px solid rgba(255, 215, 0, 0.6);
text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
}
.player-flag.hosted[data-v-d6870524] {
color: var(--neon-green);
border: 1px solid rgba(0, 255, 150, 0.4);
}
.player-flag.tourney[data-v-d6870524] {
color: #7dd3fc;
background: rgba(125, 211, 252, 0.12);
border: 1px solid rgba(125, 211, 252, 0.45);
}
.player-flag.event[data-v-d6870524] {
color: #f472b6;
background: rgba(244, 114, 182, 0.12);
border: 1px solid rgba(244, 114, 182, 0.45);
}
.player-flag.excluded[data-v-d6870524] {
color: #ff4757;
background: rgba(255, 71, 87, 0.15);
border-color: rgba(255, 71, 87, 0.5);
animation: pulse-excluded-d6870524 2s infinite;
}
@keyframes pulse-excluded-d6870524 {
0%, 100% { opacity: 1;
}
50% { opacity: 0.7;
}
}
.flag-toggle-group[data-v-d6870524] {
display: flex;
gap: 1rem;
flex-wrap: wrap;
}
.flag-toggle[data-v-d6870524] {
display: flex;
align-items: center;
gap: 0.4rem;
font-weight: 600;
color: var(--text-primary);
}
.flag-toggle input[data-v-d6870524] {
width: 18px;
height: 18px;
}
/* Player Stats */
.player-stats[data-v-d6870524] {
margin-bottom: 1.5rem;
}
.stats-grid[data-v-d6870524] {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 0.75rem;
}
.stat-card[data-v-d6870524] {
display: flex;
align-items: center;
padding: 0.875rem;
gap: 0.625rem;
}
.stat-icon[data-v-d6870524] {
font-size: 1.5rem;
padding: 0.6rem;
border-radius: 10px;
background: rgba(255, 255, 255, 0.1);
flex-shrink: 0;
}
.stat-info[data-v-d6870524] {
flex: 1;
min-width: 0;
}
.stat-value[data-v-d6870524] {
font-size: 1.35rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.125rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.stat-label[data-v-d6870524] {
font-size: 0.75rem;
color: var(--text-secondary);
opacity: 0.8;
white-space: nowrap;
}
/* Players Section */
.players-section[data-v-d6870524] {
padding: 1.5rem;
}
.section-header[data-v-d6870524] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.section-header h2[data-v-d6870524] {
color: var(--text-primary);
margin: 0;
}
.section-actions[data-v-d6870524] {
display: flex;
gap: 1rem;
}
.input-glass.small[data-v-d6870524] {
padding: 0.5rem 1rem;
font-size: 0.9rem;
}
/* Players Table */
.players-table[data-v-d6870524] {
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
overflow: hidden;
}
.table-header[data-v-d6870524],
.table-row[data-v-d6870524] {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr 0.8fr 1fr;
gap: 1rem;
align-items: center;
}
.table-header[data-v-d6870524] {
background: rgba(255, 255, 255, 0.05);
padding: 0.75rem 1rem;
font-weight: 600;
color: var(--text-primary);
border-bottom: 2px solid rgba(255, 255, 255, 0.1);
}
.player-row[data-v-d6870524] {
padding: 0.75rem 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: all 0.3s ease;
}
.player-row[data-v-d6870524]:hover {
background: rgba(255, 255, 255, 0.02);
transform: translateX(5px);
}
.table-cell[data-v-d6870524] {
color: var(--text-primary);
}
/* Player Info */
.player-info[data-v-d6870524] {
display: flex;
align-items: center;
gap: 1rem;
}
.player-avatar[data-v-d6870524] {
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
border: 2px solid rgba(0, 150, 255, 0.3);
flex-shrink: 0;
position: relative;
overflow: hidden;
}
.player-details[data-v-d6870524] {
flex: 1;
}
.player-name[data-v-d6870524] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.player-id[data-v-d6870524],
.player-license[data-v-d6870524] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.7;
}
/* Tier Badge */
.tier-badge[data-v-d6870524] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 500;
display: inline-flex;
align-items: center;
gap: 0.25rem;
}
.tier-badge.bronze[data-v-d6870524] {
background: linear-gradient(135deg, #CD7F32, #B8860B);
color: white;
}
.tier-badge.silver[data-v-d6870524] {
background: linear-gradient(135deg, #C0C0C0, #A8A8A8);
color: #333;
}
.tier-badge.gold[data-v-d6870524] {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #333;
}
.tier-badge.platinum[data-v-d6870524] {
background: linear-gradient(135deg, #E5E4E2, #C9C0BB);
color: #333;
}
.tier-badge.vip[data-v-d6870524] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.25), rgba(255, 193, 7, 0.2));
color: #FFD700;
border: 1px solid rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
text-shadow: 0 0 6px rgba(255, 215, 0, 0.3);
}
/* Speed Rating */
.speed-rating[data-v-d6870524] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.speed-stars[data-v-d6870524] {
display: flex;
gap: 0.125rem;
}
.speed-star[data-v-d6870524] {
font-size: 0.8rem;
opacity: 0.3;
transition: all 0.3s ease;
}
.speed-star.active[data-v-d6870524] {
opacity: 1;
color: var(--neon-orange);
text-shadow: 0 0 5px rgba(255, 165, 0, 0.5);
}
.speed-label[data-v-d6870524] {
font-size: 0.7rem;
color: var(--text-secondary);
opacity: 0.8;
}
/* Table Info */
.table-info[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.table-name[data-v-d6870524] {
font-weight: 600;
color: var(--neon-green);
}
.table-duration[data-v-d6870524] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.8;
}
.no-table[data-v-d6870524] {
color: var(--text-secondary);
opacity: 0.6;
font-style: italic;
}
/* Session Info */
.session-info[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.session-time[data-v-d6870524] {
font-weight: 600;
color: var(--neon-blue);
font-family: monospace;
}
.session-bet[data-v-d6870524] {
font-size: 0.8rem;
color: var(--text-secondary);
}
.inactive[data-v-d6870524] {
color: var(--text-secondary);
opacity: 0.6;
font-style: italic;
}
/* Comp Info */
.comp-info[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.comp-balance[data-v-d6870524] {
font-weight: 600;
color: var(--neon-green);
}
.comp-earned[data-v-d6870524] {
font-size: 0.8rem;
color: var(--neon-orange);
}
/* Raffle Info */
.raffle-info[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 0.25rem;
align-items: center;
}
.raffle-count[data-v-d6870524] {
font-weight: 600;
color: var(--text-secondary);
font-size: 1.1rem;
}
.raffle-count.has-entries[data-v-d6870524] {
color: var(--neon-purple, #9c27b0);
font-weight: 700;
}
.raffle-label[data-v-d6870524] {
font-size: 0.75rem;
color: var(--text-secondary);
opacity: 0.8;
}
/* Player Actions */
.player-actions[data-v-d6870524] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-small[data-v-d6870524] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
}
.btn-small[data-v-d6870524]:hover {
background: rgba(255, 255, 255, 0.1);
}
.btn-primary[data-v-d6870524] {
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.btn-primary[data-v-d6870524]:hover {
background: rgba(0, 150, 255, 0.1);
}
.btn-success[data-v-d6870524] {
border-color: var(--neon-green);
color: var(--neon-green);
}
.btn-success[data-v-d6870524]:hover {
background: rgba(0, 255, 150, 0.1);
}
.btn-warning[data-v-d6870524] {
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.btn-warning[data-v-d6870524]:hover {
background: rgba(255, 165, 0, 0.1);
}
/* Modal Styles */
.modal-overlay[data-v-d6870524] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-d6870524] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 500px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
}
.modal-content.large[data-v-d6870524] {
max-width: 800px;
}
.modal-header[data-v-d6870524] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-d6870524] {
margin: 0;
}
.btn-close[data-v-d6870524] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-d6870524]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-d6870524] {
padding: 1.5rem;
}
.modal-footer[data-v-d6870524] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Form styles */
.scanner-section[data-v-d6870524] {
margin-bottom: 2rem;
}
.form-grid[data-v-d6870524] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.form-group[data-v-d6870524] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
/* FormKit overrides for form-grid context */
.form-grid[data-v-d6870524] .fk-outer {
margin-bottom: 0;
}
.form-grid[data-v-d6870524] .fk-label {
font-size: 0.85rem;
font-weight: 600;
color: var(--text-secondary);
}
.form-grid[data-v-d6870524] .fk-inner {
background: rgba(255, 255, 255, 0.05);
border: 1px solid var(--glass-border);
border-radius: 10px;
}
.form-grid[data-v-d6870524] .fk-inner:focus-within {
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.1);
}
.setup-grid[data-v-d6870524] .fk-outer {
margin-bottom: 0;
}
.setup-grid[data-v-d6870524] .fk-label {
font-size: 0.85rem;
font-weight: 600;
color: var(--text-secondary);
}
.setup-grid[data-v-d6870524] .fk-inner {
background: rgba(255, 255, 255, 0.05);
border: 1px solid var(--glass-border);
border-radius: 10px;
}
.setup-grid[data-v-d6870524] .fk-inner:focus-within {
border-color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.1);
}
.form-group label[data-v-d6870524] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.input-glass[data-v-d6870524] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
.input-glass[data-v-d6870524]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
.input-glass[data-v-d6870524]::placeholder {
color: var(--text-secondary);
opacity: 0.6;
}
/* Player Setup */
.player-setup[data-v-d6870524] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 2rem;
margin-top: 2rem;
}
.player-setup h3[data-v-d6870524] {
color: var(--text-primary);
margin-bottom: 1rem;
}
.setup-grid[data-v-d6870524] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.speed-selector[data-v-d6870524] {
display: flex;
gap: 0.5rem;
}
.speed-button[data-v-d6870524] {
width: 40px;
height: 40px;
border: 2px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
}
.speed-button.active[data-v-d6870524] {
border-color: var(--neon-orange);
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
}
.speed-button[data-v-d6870524]:hover {
background: rgba(255, 255, 255, 0.1);
}
/* Comp Modal styles removed - using shared CompModal component */
/* Animations */
.animate-fade-in[data-v-d6870524] {
animation: fadeIn-d6870524 0.3s ease-out;
}
.animate-scale-in[data-v-d6870524] {
animation: scaleIn-d6870524 0.3s ease-out;
}
@keyframes fadeIn-d6870524 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-d6870524 {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.table-header[data-v-d6870524],
.table-row[data-v-d6870524] {
grid-template-columns: 1fr;
gap: 0.5rem;
}
.table-cell[data-v-d6870524] {
padding: 0.5rem 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.quick-actions[data-v-d6870524] {
flex-direction: column;
}
.stats-grid[data-v-d6870524] {
grid-template-columns: repeat(3, 1fr);
}
.form-grid[data-v-d6870524] {
grid-template-columns: 1fr;
}
.preset-buttons[data-v-d6870524] {
grid-template-columns: repeat(2, 1fr);
}
}
.search-result .player-avatar[data-v-d6870524] {
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 0.8rem;
color: white;
border: 2px solid rgba(0, 150, 255, 0.3);
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
flex-shrink: 0;
position: relative;
overflow: hidden;
}
.player-thumb[data-v-d6870524] {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
object-position: center;
}
.player-initials[data-v-d6870524] {
font-size: 0.75rem;
font-weight: 700;
color: white;
z-index: 1;
}
.pull-tabs-view[data-v-131e112c] {
padding: 1.5rem;
max-width: 1600px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.view-header[data-v-131e112c] {
text-align: center;
margin-bottom: 0.5rem;
}
.view-header h1[data-v-131e112c] {
font-size: 2.5rem;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 0.25rem;
}
.view-subtitle[data-v-131e112c] {
color: rgba(255, 255, 255, 0.6);
font-size: 1rem;
}
/* Bar Location Tabs */
.bar-location-tabs[data-v-131e112c] {
padding: 1rem;
}
.tabs-header[data-v-131e112c] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
}
.tab-btn[data-v-131e112c] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
color: rgba(255, 255, 255, 0.7);
cursor: pointer;
transition: all 0.3s ease;
}
.tab-btn[data-v-131e112c]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(0, 212, 255, 0.3);
}
.tab-btn.active[data-v-131e112c] {
background: rgba(0, 212, 255, 0.15);
border-color: rgba(0, 212, 255, 0.5);
color: #fff;
}
.tab-icon[data-v-131e112c] {
font-size: 1.25rem;
}
.tab-name[data-v-131e112c] {
font-weight: 600;
}
.tab-count[data-v-131e112c] {
background: rgba(0, 0, 0, 0.3);
padding: 0.2rem 0.5rem;
border-radius: 8px;
font-size: 0.8rem;
}
.quick-buy-tab[data-v-131e112c] {
background: rgba(123, 44, 191, 0.15);
border-color: rgba(123, 44, 191, 0.3);
}
.quick-buy-tab.active[data-v-131e112c] {
background: rgba(123, 44, 191, 0.25);
border-color: rgba(123, 44, 191, 0.5);
}
/* Bar Seating Section */
.bar-seating-section[data-v-131e112c] {
padding: 1.5rem;
}
.section-header[data-v-131e112c] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.25rem;
}
.section-header h3[data-v-131e112c] {
margin: 0;
font-size: 1.25rem;
}
.bar-stools-grid[data-v-131e112c] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
gap: 1rem;
}
.bar-stool[data-v-131e112c] {
aspect-ratio: 1;
background: rgba(255, 255, 255, 0.03);
border: 2px dashed rgba(255, 255, 255, 0.15);
border-radius: 16px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
padding: 1rem;
}
.bar-stool[data-v-131e112c]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(0, 212, 255, 0.4);
}
.bar-stool.occupied[data-v-131e112c] {
background: rgba(0, 212, 255, 0.08);
border: 2px solid rgba(0, 212, 255, 0.3);
}
.bar-stool.selected[data-v-131e112c] {
background: rgba(0, 212, 255, 0.15);
border-color: rgba(0, 212, 255, 0.6);
box-shadow: 0 0 20px rgba(0, 212, 255, 0.2);
}
.stool-number[data-v-131e112c] {
position: absolute;
top: 0.5rem;
left: 0.5rem;
background: rgba(0, 0, 0, 0.4);
padding: 0.2rem 0.5rem;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 600;
}
.stool-empty[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
color: rgba(255, 255, 255, 0.4);
}
.empty-avatar[data-v-131e112c] {
width: 48px;
height: 48px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
}
.empty-label[data-v-131e112c] {
font-size: 0.8rem;
}
.stool-occupied[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
text-align: center;
}
.player-avatar-wrapper[data-v-131e112c] {
position: relative;
}
.player-photo[data-v-131e112c] {
width: 56px;
height: 56px;
border-radius: 50%;
object-fit: cover;
border: 2px solid rgba(0, 212, 255, 0.5);
}
.player-avatar-placeholder[data-v-131e112c] {
width: 56px;
height: 56px;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
font-weight: 700;
color: white;
}
.tier-dot[data-v-131e112c] {
position: absolute;
bottom: 0;
right: 0;
width: 16px;
height: 16px;
border-radius: 50%;
border: 2px solid rgba(0, 0, 0, 0.5);
}
.tier-dot.tier-diamond[data-v-131e112c] {
background: linear-gradient(135deg, #b9f2ff, #00d4ff);
}
.tier-dot.tier-platinum[data-v-131e112c] {
background: linear-gradient(135deg, #e5e5e5, #a0a0a0);
}
.tier-dot.tier-gold[data-v-131e112c] {
background: linear-gradient(135deg, #ffd700, #ffb347);
}
.tier-dot.tier-silver[data-v-131e112c] {
background: linear-gradient(135deg, #c0c0c0, #808080);
}
.tier-dot.tier-bronze[data-v-131e112c] {
background: linear-gradient(135deg, #cd7f32, #8b4513);
}
.player-name-display[data-v-131e112c] {
font-weight: 600;
font-size: 0.9rem;
line-height: 1.2;
}
.player-name-stacked[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
line-height: 1.1;
margin-top: 0.25rem;
}
.stool-first-name[data-v-131e112c] {
font-weight: 600;
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.95);
}
.stool-last-name[data-v-131e112c] {
font-weight: 400;
font-size: 0.7rem;
color: rgba(255, 255, 255, 0.6);
}
.player-session-info[data-v-131e112c] {
display: flex;
gap: 0.5rem;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
}
.session-total[data-v-131e112c] {
color: #00d4ff;
font-weight: 600;
}
/* Seated Player Actions Panel */
.seated-player-actions[data-v-131e112c] {
margin-top: 1.5rem;
padding: 1.5rem;
border-radius: 16px;
animation: slideUp-131e112c 0.3s ease;
}
@keyframes slideUp-131e112c {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.selected-player-header[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1.5rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.player-avatar-large[data-v-131e112c] {
width: 72px;
height: 72px;
flex-shrink: 0;
}
.player-avatar-large img[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
border: 3px solid rgba(0, 212, 255, 0.5);
}
.avatar-placeholder-large[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.75rem;
font-weight: 700;
color: white;
}
.player-details[data-v-131e112c] {
flex: 1;
}
.player-details h3[data-v-131e112c] {
margin: 0 0 0.5rem 0;
font-size: 1.5rem;
}
.player-meta-row[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
flex-wrap: wrap;
}
.tier-badge[data-v-131e112c] {
padding: 0.25rem 0.75rem;
border-radius: 12px;
font-size: 0.85rem;
font-weight: 600;
}
.tier-badge.tier-diamond[data-v-131e112c] {
background: linear-gradient(135deg, rgba(185, 242, 255, 0.2), rgba(0, 212, 255, 0.2));
border: 1px solid rgba(0, 212, 255, 0.5);
color: #00d4ff;
}
.tier-badge.tier-platinum[data-v-131e112c] {
background: linear-gradient(135deg, rgba(229, 229, 229, 0.2), rgba(160, 160, 160, 0.2));
border: 1px solid rgba(160, 160, 160, 0.5);
color: #e5e5e5;
}
.tier-badge.tier-gold[data-v-131e112c] {
background: linear-gradient(135deg, rgba(255, 215, 0, 0.2), rgba(255, 179, 71, 0.2));
border: 1px solid rgba(255, 215, 0, 0.5);
color: #ffd700;
}
.tier-badge.tier-silver[data-v-131e112c] {
background: linear-gradient(135deg, rgba(192, 192, 192, 0.2), rgba(128, 128, 128, 0.2));
border: 1px solid rgba(192, 192, 192, 0.5);
color: #c0c0c0;
}
.tier-badge.tier-bronze[data-v-131e112c] {
background: linear-gradient(135deg, rgba(205, 127, 50, 0.2), rgba(139, 69, 19, 0.2));
border: 1px solid rgba(205, 127, 50, 0.5);
color: #cd7f32;
}
.points-balance[data-v-131e112c] {
color: #00ff88;
font-weight: 600;
}
.player-id-small[data-v-131e112c] {
color: rgba(255, 255, 255, 0.4);
font-size: 0.85rem;
}
.btn-close[data-v-131e112c] {
background: rgba(255, 255, 255, 0.1);
border: none;
color: rgba(255, 255, 255, 0.6);
width: 36px;
height: 36px;
border-radius: 50%;
cursor: pointer;
font-size: 1.25rem;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
}
.btn-close[data-v-131e112c]:hover {
background: rgba(255, 0, 0, 0.2);
color: #ff4444;
}
/* Purchase Form */
.purchase-form[data-v-131e112c] {
display: flex;
flex-direction: column;
gap: 1.25rem;
}
.amount-input-group label[data-v-131e112c] {
display: block;
margin-bottom: 0.5rem;
color: rgba(255, 255, 255, 0.7);
font-weight: 500;
}
.amount-presets[data-v-131e112c] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
margin-bottom: 0.5rem;
}
.preset-btn[data-v-131e112c] {
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
color: white;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
}
.preset-btn[data-v-131e112c]:hover {
background: rgba(0, 212, 255, 0.1);
border-color: rgba(0, 212, 255, 0.4);
}
.preset-btn.active[data-v-131e112c] {
background: rgba(0, 212, 255, 0.2);
border-color: rgba(0, 212, 255, 0.6);
color: #00d4ff;
}
.amount-custom[data-v-131e112c] {
width: 120px;
}
.transaction-preview-inline[data-v-131e112c] {
display: flex;
gap: 2rem;
padding: 1rem 1.5rem;
background: rgba(0, 212, 255, 0.1);
border-radius: 12px;
border: 1px solid rgba(0, 212, 255, 0.2);
}
.preview-stat[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.preview-stat .label[data-v-131e112c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
}
.preview-stat .value[data-v-131e112c] {
font-size: 1.5rem;
font-weight: 700;
}
.preview-stat.highlight .value[data-v-131e112c] {
color: #00ff88;
}
.action-buttons[data-v-131e112c] {
display: flex;
gap: 1rem;
}
.btn-large[data-v-131e112c] {
padding: 1rem 2rem;
font-size: 1.1rem;
}
.btn-danger[data-v-131e112c] {
color: #ff4444;
border-color: rgba(255, 68, 68, 0.3);
}
.btn-danger[data-v-131e112c]:hover {
background: rgba(255, 68, 68, 0.1);
border-color: rgba(255, 68, 68, 0.5);
}
/* Quick Buy Search Section */
.quick-buy-section[data-v-131e112c] {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.search-section[data-v-131e112c] {
padding: 1.5rem;
}
.search-section h3[data-v-131e112c] {
margin: 0 0 1rem 0;
}
.search-input-wrapper[data-v-131e112c] {
position: relative;
margin-bottom: 1rem;
}
.search-input[data-v-131e112c] {
width: 100%;
padding-right: 40px;
}
.clear-search-btn[data-v-131e112c] {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
background: none;
border: none;
color: rgba(255, 255, 255, 0.5);
cursor: pointer;
font-size: 1.25rem;
}
.search-results-grid[data-v-131e112c] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 1rem;
}
.player-card[data-v-131e112c] {
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
padding: 1.25rem;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.75rem;
text-align: center;
}
.player-card[data-v-131e112c]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(0, 212, 255, 0.4);
transform: translateY(-3px);
}
.player-card.selected[data-v-131e112c] {
background: rgba(0, 212, 255, 0.15);
border-color: rgba(0, 212, 255, 0.6);
}
.player-card-avatar[data-v-131e112c] {
position: relative;
width: 72px;
height: 72px;
}
.player-card-avatar img[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
border: 3px solid rgba(0, 212, 255, 0.3);
}
.avatar-placeholder[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
font-weight: 700;
color: white;
}
.tier-indicator[data-v-131e112c] {
position: absolute;
bottom: 2px;
right: 2px;
width: 20px;
height: 20px;
border-radius: 50%;
border: 3px solid rgba(0, 0, 0, 0.5);
}
.tier-indicator.tier-diamond[data-v-131e112c] {
background: linear-gradient(135deg, #b9f2ff, #00d4ff);
}
.tier-indicator.tier-platinum[data-v-131e112c] {
background: linear-gradient(135deg, #e5e5e5, #a0a0a0);
}
.tier-indicator.tier-gold[data-v-131e112c] {
background: linear-gradient(135deg, #ffd700, #ffb347);
}
.tier-indicator.tier-silver[data-v-131e112c] {
background: linear-gradient(135deg, #c0c0c0, #808080);
}
.tier-indicator.tier-bronze[data-v-131e112c] {
background: linear-gradient(135deg, #cd7f32, #8b4513);
}
.player-card-info[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.player-name[data-v-131e112c] {
font-weight: 600;
font-size: 1.1rem;
line-height: 1.2;
}
.player-card-meta[data-v-131e112c] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.tier-text[data-v-131e112c] {
font-size: 0.85rem;
font-weight: 600;
}
.tier-text.tier-diamond[data-v-131e112c] {
color: #00d4ff;
}
.tier-text.tier-platinum[data-v-131e112c] {
color: #e5e5e5;
}
.tier-text.tier-gold[data-v-131e112c] {
color: #ffd700;
}
.tier-text.tier-silver[data-v-131e112c] {
color: #c0c0c0;
}
.tier-text.tier-bronze[data-v-131e112c] {
color: #cd7f32;
}
.player-points-display[data-v-131e112c] {
display: flex;
align-items: baseline;
gap: 0.25rem;
}
.points-value[data-v-131e112c] {
font-size: 1.25rem;
font-weight: 700;
color: #00ff88;
}
.points-label[data-v-131e112c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
}
.no-results[data-v-131e112c],
.searching-indicator[data-v-131e112c] {
text-align: center;
padding: 2rem;
color: rgba(255, 255, 255, 0.5);
}
.spinner[data-v-131e112c] {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top-color: #00d4ff;
border-radius: 50%;
animation: spin-131e112c 0.8s linear infinite;
margin-right: 0.5rem;
}
@keyframes spin-131e112c {
to {
transform: rotate(360deg);
}
}
/* Transaction Form */
.transaction-form[data-v-131e112c] {
padding: 1.5rem;
}
.form-header[data-v-131e112c] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1.5rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.selected-player-preview[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
}
.player-avatar-medium[data-v-131e112c] {
width: 56px;
height: 56px;
}
.player-avatar-medium img[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
}
.avatar-placeholder-medium[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
font-weight: 700;
color: white;
}
.form-grid[data-v-131e112c] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.form-group label[data-v-131e112c] {
display: block;
margin-bottom: 0.5rem;
color: rgba(255, 255, 255, 0.7);
font-weight: 500;
}
.transaction-preview[data-v-131e112c] {
background: rgba(0, 212, 255, 0.1);
border: 1px solid rgba(0, 212, 255, 0.3);
border-radius: 12px;
padding: 1.25rem;
margin-bottom: 1.5rem;
display: flex;
justify-content: space-around;
}
.preview-item[data-v-131e112c] {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
}
.preview-item span[data-v-131e112c] {
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
}
.preview-item strong[data-v-131e112c] {
font-size: 1.5rem;
}
.form-actions[data-v-131e112c] {
display: flex;
gap: 1rem;
justify-content: flex-end;
}
/* Transactions List */
.transactions-section[data-v-131e112c] {
padding: 1.5rem;
}
.btn-small[data-v-131e112c] {
padding: 0.5rem 1rem;
font-size: 0.9rem;
}
.transactions-list[data-v-131e112c] {
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.transaction-item[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
transition: all 0.2s ease;
}
.transaction-item[data-v-131e112c]:hover {
background: rgba(255, 255, 255, 0.08);
}
.transaction-item.voided[data-v-131e112c] {
opacity: 0.5;
background: rgba(255, 0, 0, 0.05);
}
.tx-player[data-v-131e112c] {
display: flex;
align-items: center;
gap: 0.75rem;
flex: 1;
}
.tx-avatar[data-v-131e112c] {
width: 44px;
height: 44px;
flex-shrink: 0;
}
.tx-avatar img[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
}
.tx-avatar-placeholder[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
background: linear-gradient(135deg, rgba(0, 212, 255, 0.3), rgba(123, 44, 191, 0.3));
display: flex;
align-items: center;
justify-content: center;
font-size: 0.9rem;
font-weight: 600;
}
.tx-player-info[data-v-131e112c] {
display: flex;
flex-direction: column;
}
.tx-name[data-v-131e112c] {
font-size: 1rem;
}
.tx-location[data-v-131e112c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.5);
}
.tx-details[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1.5rem;
}
.tx-amount[data-v-131e112c] {
font-size: 1.25rem;
font-weight: 700;
color: #00d4ff;
min-width: 80px;
}
.tx-points[data-v-131e112c] {
color: #00ff88;
font-weight: 600;
min-width: 80px;
}
.tx-time[data-v-131e112c] {
color: rgba(255, 255, 255, 0.5);
font-size: 0.85rem;
min-width: 120px;
}
.tx-actions[data-v-131e112c] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-void[data-v-131e112c] {
width: 32px;
height: 32px;
border-radius: 50%;
background: rgba(255, 68, 68, 0.1);
border: 1px solid rgba(255, 68, 68, 0.3);
color: #ff4444;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 1rem;
transition: all 0.2s ease;
}
.btn-void[data-v-131e112c]:hover {
background: rgba(255, 68, 68, 0.2);
border-color: rgba(255, 68, 68, 0.5);
}
.void-badge[data-v-131e112c] {
background: rgba(255, 68, 68, 0.2);
border: 1px solid rgba(255, 68, 68, 0.4);
padding: 0.25rem 0.5rem;
border-radius: 6px;
font-size: 0.75rem;
color: #ff4444;
font-weight: 600;
}
/* Summary Section */
.summary-section[data-v-131e112c] {
padding: 1.5rem;
}
.summary-section h3[data-v-131e112c] {
margin: 0 0 1.25rem 0;
}
.summary-grid[data-v-131e112c] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 1rem;
}
.summary-item[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1.25rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
}
.summary-item.highlight[data-v-131e112c] {
background: rgba(0, 255, 136, 0.1);
border: 1px solid rgba(0, 255, 136, 0.2);
}
.summary-icon[data-v-131e112c] {
font-size: 2rem;
}
.summary-content[data-v-131e112c] {
display: flex;
flex-direction: column;
}
.summary-value[data-v-131e112c] {
font-size: 1.75rem;
font-weight: 700;
}
.summary-label[data-v-131e112c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
}
/* Loading & Empty States */
.loading-state[data-v-131e112c],
.empty-state[data-v-131e112c] {
text-align: center;
padding: 3rem;
color: rgba(255, 255, 255, 0.5);
display: flex;
flex-direction: column;
align-items: center;
gap: 0.75rem;
}
.empty-icon[data-v-131e112c] {
font-size: 3rem;
opacity: 0.5;
}
/* Modals */
.modal-overlay[data-v-131e112c] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.7);
backdrop-filter: blur(4px);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-131e112c] {
width: 90%;
max-width: 500px;
max-height: 80vh;
overflow-y: auto;
border-radius: 20px;
animation: modalIn-131e112c 0.3s ease;
}
.modal-small[data-v-131e112c] {
max-width: 400px;
}
@keyframes modalIn-131e112c {
from {
opacity: 0;
transform: scale(0.95) translateY(-20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
.modal-header[data-v-131e112c] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.25rem 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h3[data-v-131e112c] {
margin: 0;
font-size: 1.25rem;
}
.modal-body[data-v-131e112c] {
padding: 1.5rem;
}
.modal-footer[data-v-131e112c] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1rem 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.seat-search-results[data-v-131e112c] {
display: flex;
flex-direction: column;
gap: 0.5rem;
max-height: 300px;
overflow-y: auto;
}
.seat-player-option[data-v-131e112c] {
display: flex;
align-items: center;
gap: 1rem;
padding: 0.75rem 1rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 10px;
cursor: pointer;
transition: all 0.2s ease;
}
.seat-player-option[data-v-131e112c]:hover {
background: rgba(0, 212, 255, 0.1);
}
.option-avatar[data-v-131e112c] {
width: 40px;
height: 40px;
}
.option-avatar img[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
}
.avatar-placeholder-small[data-v-131e112c] {
width: 100%;
height: 100%;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #7b2cbf);
display: flex;
align-items: center;
justify-content: center;
font-size: 0.9rem;
font-weight: 600;
}
.option-info[data-v-131e112c] {
flex: 1;
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.option-name[data-v-131e112c] {
font-weight: 600;
}
.option-name-stacked[data-v-131e112c] {
display: flex;
flex-direction: column;
line-height: 1.2;
}
.option-name-stacked .first-name[data-v-131e112c] {
font-weight: 600;
font-size: 0.95rem;
color: rgba(255, 255, 255, 0.95);
text-transform: capitalize;
}
.option-name-stacked .last-name[data-v-131e112c] {
font-weight: 400;
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.6);
text-transform: capitalize;
}
.option-tier[data-v-131e112c] {
font-size: 0.8rem;
}
.option-points[data-v-131e112c] {
color: #00ff88;
font-weight: 600;
}
.void-warning[data-v-131e112c] {
color: #ff4444;
font-weight: 500;
margin-top: 0.5rem;
}
.neon-green[data-v-131e112c] {
color: #00ff88;
}
.neon-red[data-v-131e112c] {
background: linear-gradient(135deg, rgba(255, 68, 68, 0.2), rgba(255, 0, 0, 0.1));
border-color: rgba(255, 68, 68, 0.5);
color: #ff4444;
}
.neon-red[data-v-131e112c]:hover {
background: linear-gradient(135deg, rgba(255, 68, 68, 0.3), rgba(255, 0, 0, 0.2));
}
/* Responsive */
@media (max-width: 768px) {
.pull-tabs-view[data-v-131e112c] {
padding: 1rem;
}
.form-grid[data-v-131e112c] {
grid-template-columns: 1fr;
}
.bar-stools-grid[data-v-131e112c] {
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
}
.search-results-grid[data-v-131e112c] {
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
.tx-details[data-v-131e112c] {
flex-wrap: wrap;
gap: 0.75rem;
}
.summary-grid[data-v-131e112c] {
grid-template-columns: repeat(2, 1fr);
}
}
.no-wrap[data-v-19f8af4c] {
white-space: nowrap;
}
.comp-audit-table th[data-v-19f8af4c]:last-child,
.comp-audit-table td.notes-cell[data-v-19f8af4c] {
max-width: 220px;
width: 220px;
}
.modal-overlay[data-v-19f8af4c] {
align-items: flex-start;
padding-top: 2vh;
}
.modal-container[data-v-19f8af4c] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
}
.comp-audit-modal[data-v-19f8af4c] {
width: 95vw;
max-width: 1600px;
height: auto;
max-height: 94vh;
}
.modal-body[data-v-19f8af4c] {
max-height: calc(94vh - 80px);
overflow-y: auto;
padding: 1.5rem;
}
.modal-header[data-v-19f8af4c] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem;
border-bottom: 2px solid rgba(255, 255, 255, 0.1);
background: linear-gradient(135deg, rgba(0, 245, 255, 0.05), rgba(156, 39, 176, 0.05));
}
.modal-header h2[data-v-19f8af4c] {
margin: 0;
font-size: 1.5rem;
color: var(--neon-blue);
text-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.btn-close[data-v-19f8af4c] {
background: rgba(244, 67, 54, 0.1);
border: 2px solid rgba(244, 67, 54, 0.3);
border-radius: 50%;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #f44336;
font-size: 28px;
font-weight: 300;
line-height: 1;
transition: all 0.3s ease;
padding: 0;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.btn-close[data-v-19f8af4c]:hover {
background: rgba(244, 67, 54, 0.2);
border-color: #f44336;
transform: rotate(90deg) scale(1.1);
box-shadow: 0 0 15px rgba(244, 67, 54, 0.4);
}
.btn-close[data-v-19f8af4c]:active {
transform: rotate(90deg) scale(0.95);
}
.filters-section[data-v-19f8af4c] {
margin-bottom: 1.5rem;
padding: 1.5rem;
}
.filters-section h3[data-v-19f8af4c] {
margin-bottom: 1rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.filters-grid[data-v-19f8af4c] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 1rem;
}
.filter-group-full[data-v-19f8af4c] {
grid-column: 1 / -1;
}
.filter-group label[data-v-19f8af4c] {
display: block;
font-size: 0.9rem;
font-weight: 600;
margin-bottom: 0.5rem;
color: var(--text-primary);
}
.filter-group .input-glass[data-v-19f8af4c] {
width: 100%;
}
/* Comp Type Chips */
.comp-type-chips[data-v-19f8af4c] {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin-top: 0.5rem;
}
.chip-toggle[data-v-19f8af4c] {
padding: 0.75rem 1.25rem;
background: rgba(255, 255, 255, 0.03);
border: 2px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.9rem;
font-weight: 500;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.chip-toggle[data-v-19f8af4c]:hover {
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.25);
transform: translateY(-1px);
}
/* Color-specific chip styles */
.chip-all.active[data-v-19f8af4c] {
background: rgba(0, 245, 255, 0.15);
border-color: var(--neon-blue);
color: var(--neon-blue);
box-shadow: 0 0 15px rgba(0, 245, 255, 0.3);
}
.chip-match-play[data-v-19f8af4c],
.chip-free-play[data-v-19f8af4c],
.chip-cigarette[data-v-19f8af4c] {
border-color: rgba(156, 39, 176, 0.3);
}
.chip-match-play.active[data-v-19f8af4c],
.chip-free-play.active[data-v-19f8af4c],
.chip-cigarette.active[data-v-19f8af4c] {
background: rgba(156, 39, 176, 0.15);
border-color: #9c27b0;
color: #ce93d8;
box-shadow: 0 0 15px rgba(156, 39, 176, 0.3);
}
.chip-ecigs[data-v-19f8af4c] {
border-color: rgba(26, 188, 156, 0.3);
}
.chip-ecigs.active[data-v-19f8af4c] {
background: rgba(26, 188, 156, 0.15);
border-color: #1abc9c;
color: #1abc9c;
box-shadow: 0 0 15px rgba(26, 188, 156, 0.3);
}
.chip-food[data-v-19f8af4c] {
border-color: rgba(255, 152, 0, 0.3);
}
.chip-food.active[data-v-19f8af4c] {
background: rgba(255, 152, 0, 0.15);
border-color: #ff9800;
color: #ffb74d;
box-shadow: 0 0 15px rgba(255, 152, 0, 0.3);
}
.chip-beverage[data-v-19f8af4c] {
border-color: rgba(33, 150, 243, 0.3);
}
.chip-beverage.active[data-v-19f8af4c] {
background: rgba(33, 150, 243, 0.15);
border-color: #2196f3;
color: #64b5f6;
box-shadow: 0 0 15px rgba(33, 150, 243, 0.3);
}
/* Custom Checkbox Styling */
.toggle-options[data-v-19f8af4c] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin-top: 0.5rem;
}
.checkbox-label-custom[data-v-19f8af4c] {
display: flex;
align-items: center;
gap: 0.75rem;
cursor: pointer;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
transition: all 0.3s ease;
}
.checkbox-label-custom[data-v-19f8af4c]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.15);
}
.checkbox-input[data-v-19f8af4c] {
display: none;
}
.checkbox-custom[data-v-19f8af4c] {
width: 30px;
height: 30px;
min-width: 20px;
padding: 10px;
top: 8px;
flex-shrink: 0;
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 4px;
position: relative;
transition: all 0.3s ease;
float: right;
}
.checkbox-input:checked+.checkbox-custom[data-v-19f8af4c] {
background: var(--neon-blue);
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.5);
}
.checkbox-input:checked+.checkbox-custom[data-v-19f8af4c]::after {
content: '✓';
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: white;
font-weight: bold;
font-size: 14px;
}
.checkbox-text[data-v-19f8af4c] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.checkbox-text strong[data-v-19f8af4c] {
color: var(--text-primary);
font-size: 0.95rem;
}
.checkbox-text small[data-v-19f8af4c] {
color: var(--text-secondary);
font-size: 0.85rem;
line-height: 1.4;
}
.filters-actions[data-v-19f8af4c] {
display: flex;
gap: 1rem;
justify-content: flex-start;
margin-top: 1rem;
}
.summary-grid[data-v-19f8af4c] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
.stat[data-v-19f8af4c] {
padding: 1rem;
}
.stat-warning[data-v-19f8af4c] {
border: 2px solid var(--warning);
}
.tabs-container[data-v-19f8af4c] {
padding: 0;
overflow: hidden;
}
.tabs-header[data-v-19f8af4c] {
display: flex;
border-bottom: 2px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.2);
}
.tab-button[data-v-19f8af4c] {
flex: 1;
padding: 1rem;
border: none;
background: transparent;
color: var(--text-secondary);
cursor: pointer;
transition: all 0.3s;
font-weight: 600;
}
.tab-button[data-v-19f8af4c]:hover {
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.tab-button.active[data-v-19f8af4c] {
background: rgba(var(--primary-rgb), 0.2);
color: var(--primary);
border-bottom: 3px solid var(--primary);
}
.tabs-content[data-v-19f8af4c] {
padding: 1.5rem;
}
.table-controls[data-v-19f8af4c] {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
align-items: center;
}
.search-input[data-v-19f8af4c] {
flex: 1;
padding: 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
}
.audit-table[data-v-19f8af4c] {
width: 100%;
border-collapse: collapse;
}
.audit-table th[data-v-19f8af4c] {
text-align: left;
padding: 0.75rem;
background: rgba(0, 0, 0, 0.3);
font-weight: 600;
cursor: pointer;
user-select: none;
}
.audit-table th[data-v-19f8af4c]:hover {
background: rgba(0, 0, 0, 0.4);
}
.audit-table td[data-v-19f8af4c] {
padding: 0.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.audit-table tbody tr[data-v-19f8af4c]:hover {
background: rgba(255, 255, 255, 0.05);
}
.row-override[data-v-19f8af4c] {
background: rgba(255, 193, 7, 0.1);
}
.row-high-subsidy[data-v-19f8af4c] {
background: rgba(255, 87, 34, 0.1);
}
.row-promotion[data-v-19f8af4c] {
background: rgba(76, 175, 80, 0.06);
}
.row-demotion[data-v-19f8af4c] {
background: rgba(244, 67, 54, 0.06);
}
.badge-tier[data-v-19f8af4c] {
background: rgba(156, 39, 176, 0.2);
color: #ce93d8;
}
.tier-cell[data-v-19f8af4c] {
display: inline-flex;
align-items: baseline;
gap: 0.4rem;
white-space: nowrap;
}
.tier-amount[data-v-19f8af4c] {
font-size: 1rem;
font-weight: 700;
color: var(--text-primary, #fff);
font-variant-numeric: tabular-nums;
}
.tier-name[data-v-19f8af4c] {
font-size: 0.75rem;
color: #ce93d8;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.tier-delta[data-v-19f8af4c] {
display: inline-block;
font-weight: 700;
font-variant-numeric: tabular-nums;
}
.tier-delta-up[data-v-19f8af4c] {
color: #4caf50;
}
.tier-delta-down[data-v-19f8af4c] {
color: #f44336;
}
.tier-delta-flat[data-v-19f8af4c] {
color: var(--text-tertiary, #9ca3af);
}
.text-right[data-v-19f8af4c] {
text-align: right;
}
.text-muted[data-v-19f8af4c] {
color: var(--text-tertiary);
font-size: 0.85rem;
}
.text-warning[data-v-19f8af4c] {
color: var(--warning);
}
.badge[data-v-19f8af4c] {
display: inline-block;
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
}
.badge-match-play[data-v-19f8af4c] {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.badge-free-play[data-v-19f8af4c] {
background: rgba(33, 150, 243, 0.2);
color: #2196f3;
}
.badge-warning[data-v-19f8af4c] {
background: rgba(255, 193, 7, 0.2);
color: #ffc107;
}
.badge-info[data-v-19f8af4c] {
background: rgba(156, 39, 176, 0.2);
color: #9c27b0;
}
.badge-danger[data-v-19f8af4c] {
background: rgba(244, 67, 54, 0.2);
color: #f44336;
font-weight: 600;
}
.badge-success[data-v-19f8af4c] {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.actions-section[data-v-19f8af4c] {
background: rgba(244, 67, 54, 0.2);
color: #f44336;
}
.badge-success[data-v-19f8af4c] {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.actions-section[data-v-19f8af4c] {
padding: 1.5rem;
margin-top: 1.5rem;
}
.actions-grid[data-v-19f8af4c] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.no-data[data-v-19f8af4c] {
text-align: center;
padding: 3rem;
color: var(--text-secondary);
}
.error-box[data-v-19f8af4c] {
padding: 1rem;
background: rgba(244, 67, 54, 0.1);
border: 1px solid rgba(244, 67, 54, 0.3);
border-radius: 8px;
color: #f44336;
margin-top: 1rem;
}
/* Player search autocomplete */
.player-search-group[data-v-19f8af4c] {
position: relative;
}
.player-search-wrapper[data-v-19f8af4c] {
position: relative;
}
.btn-clear-player[data-v-19f8af4c] {
position: absolute;
right: 8px;
top: 50%;
transform: translateY(-50%);
background: rgba(244, 67, 54, 0.2);
border: none;
border-radius: 50%;
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #f44336;
font-size: 18px;
font-weight: bold;
transition: all 0.2s;
}
.btn-clear-player[data-v-19f8af4c]:hover {
background: rgba(244, 67, 54, 0.3);
transform: translateY(-50%) scale(1.1);
}
.player-suggestions[data-v-19f8af4c] {
position: absolute;
top: 100%;
left: 0;
right: 0;
background: rgba(30, 35, 45, 0.98);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
margin-top: 4px;
max-height: 300px;
overflow-y: auto;
z-index: 1000;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}
.player-suggestion-item[data-v-19f8af4c] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
cursor: pointer;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
transition: background 0.2s;
}
.player-suggestion-item[data-v-19f8af4c]:hover {
background: rgba(100, 255, 218, 0.1);
}
.player-suggestion-item[data-v-19f8af4c]:last-child {
border-bottom: none;
}
.player-avatar[data-v-19f8af4c] {
flex-shrink: 0;
width: 40px;
height: 40px;
border-radius: 50%;
overflow: hidden;
background: rgba(100, 255, 218, 0.2);
display: flex;
align-items: center;
justify-content: center;
border: 2px solid rgba(100, 255, 218, 0.4);
}
.player-thumb[data-v-19f8af4c] {
width: 100%;
height: 100%;
object-fit: cover;
}
.player-initials[data-v-19f8af4c] {
font-weight: 600;
font-size: 0.9rem;
color: #64ffda;
text-transform: uppercase;
}
.suggestion-content[data-v-19f8af4c] {
flex: 1;
min-width: 0;
}
.suggestion-name[data-v-19f8af4c] {
font-weight: 600;
color: #64ffda;
margin-bottom: 0.25rem;
font-size: 0.95rem;
}
.suggestion-meta[data-v-19f8af4c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.25rem;
}
.birthdate[data-v-19f8af4c] {
color: rgba(255, 255, 255, 0.7);
}
.no-birthdate[data-v-19f8af4c] {
color: #ff9800;
font-size: 0.75rem;
}
.player-id[data-v-19f8af4c],
.card-number[data-v-19f8af4c] {
color: rgba(255, 255, 255, 0.5);
}
.suggestion-card[data-v-19f8af4c] {
font-size: 0.85rem;
color: rgba(255, 255, 255, 0.6);
}
.player-search-loading[data-v-19f8af4c] {
position: absolute;
top: 100%;
left: 0;
right: 0;
background: rgba(30, 35, 45, 0.98);
border: 1px solid rgba(100, 255, 218, 0.3);
border-radius: 8px;
margin-top: 4px;
padding: 0.75rem 1rem;
text-align: center;
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
z-index: 1000;
}
/* Player breakdown expandable rows */
.player-breakdown-table .player-summary-row[data-v-19f8af4c],
.supervisor-breakdown-table .supervisor-summary-row[data-v-19f8af4c],
.table-breakdown-table .table-summary-row[data-v-19f8af4c] {
cursor: pointer;
transition: background 0.2s;
}
.player-breakdown-table .player-summary-row[data-v-19f8af4c]:hover,
.supervisor-breakdown-table .supervisor-summary-row[data-v-19f8af4c]:hover,
.table-breakdown-table .table-summary-row[data-v-19f8af4c]:hover {
background: rgba(100, 255, 218, 0.08);
}
.expand-icon[data-v-19f8af4c] {
display: inline-block;
font-size: 12px;
color: var(--neon-blue);
transition: transform 0.2s;
}
.player-details-row[data-v-19f8af4c],
.supervisor-details-row[data-v-19f8af4c],
.table-details-row[data-v-19f8af4c] {
background: rgba(0, 0, 0, 0.3) !important;
}
.player-details-row[data-v-19f8af4c]:hover,
.supervisor-details-row[data-v-19f8af4c]:hover,
.table-details-row[data-v-19f8af4c]:hover {
background: rgba(0, 0, 0, 0.3) !important;
}
.player-details-container[data-v-19f8af4c],
.details-container[data-v-19f8af4c] {
padding: 1rem;
background: rgba(0, 0, 0, 0.2);
border-radius: 8px;
margin: 0.5rem 0;
}
.nested-comp-table[data-v-19f8af4c] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.nested-comp-table thead[data-v-19f8af4c] {
background: rgba(100, 255, 218, 0.1);
}
.nested-comp-table th[data-v-19f8af4c] {
padding: 0.5rem;
text-align: left;
font-weight: 600;
font-size: 0.85rem;
color: #64ffda;
border-bottom: 1px solid rgba(100, 255, 218, 0.2);
}
.nested-comp-table td[data-v-19f8af4c] {
padding: 0.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.nested-comp-table tbody tr[data-v-19f8af4c]:hover {
background: rgba(255, 255, 255, 0.03);
}
.head-count-tab[data-v-90b5cd48] {
display: flex;
flex-direction: column;
gap: 1.25rem;
padding: 0.5rem 0;
}
.hc-controls[data-v-90b5cd48] {
display: flex;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap;
gap: 1rem;
}
.control-group[data-v-90b5cd48] { display: flex; flex-direction: column; gap: 0.35rem;
}
.control-label[data-v-90b5cd48] {
font-size: 0.75rem;
color: #9ca3af;
letter-spacing: 0.5px;
text-transform: uppercase;
font-weight: 600;
}
.seg-control[data-v-90b5cd48] {
display: inline-flex;
background: rgba(0, 0, 0, 0.4);
border: 1px solid rgba(0, 245, 255, 0.18);
border-radius: 8px;
padding: 0.2rem;
}
.seg-btn[data-v-90b5cd48] {
padding: 0.45rem 1.1rem;
border-radius: 6px;
background: transparent;
border: none;
color: #9ca3af;
cursor: pointer;
font-size: 0.9rem;
font-weight: 600;
}
.seg-btn.active[data-v-90b5cd48] { background: rgba(0, 212, 255, 0.18); color: #00f5ff;
}
.seg-btn[data-v-90b5cd48]:disabled { opacity: 0.4; cursor: not-allowed;
}
.export-group[data-v-90b5cd48] { display: flex; gap: 0.5rem;
}
.export-format-select[data-v-90b5cd48] {
background: rgba(0, 0, 0, 0.4);
border: 1px solid rgba(0, 245, 255, 0.18);
border-radius: 8px;
color: #fff;
padding: 0.55rem 0.7rem;
font-size: 0.9rem;
cursor: pointer;
}
.btn-export[data-v-90b5cd48] { min-height: 40px; padding: 0 1rem;
}
.hc-error[data-v-90b5cd48] {
padding: 0.75rem 1rem;
background: rgba(255, 7, 58, 0.15);
border-left: 4px solid #ff073a;
border-radius: 8px;
color: #ff8da4;
}
.hc-loading[data-v-90b5cd48], .hc-empty[data-v-90b5cd48] {
text-align: center;
padding: 3rem 1rem;
color: #9ca3af;
}
.hc-empty h3[data-v-90b5cd48] { color: #00f5ff; margin-bottom: 0.4rem;
}
.loading-spinner[data-v-90b5cd48] {
width: 38px;
height: 38px;
border: 3px solid rgba(0, 245, 255, 0.18);
border-top-color: #00f5ff;
border-radius: 50%;
margin: 0 auto 0.75rem;
animation: spin-90b5cd48 0.8s linear infinite;
}
@keyframes spin-90b5cd48 {
to { transform: rotate(360deg);
}
}
.kpi-strip[data-v-90b5cd48] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 0.75rem;
}
.kpi[data-v-90b5cd48] {
padding: 0.85rem 1rem;
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.kpi.alert[data-v-90b5cd48] { border-color: rgba(255, 7, 58, 0.5);
}
.kpi-label[data-v-90b5cd48] {
font-size: 0.7rem;
color: #9ca3af;
letter-spacing: 0.5px;
text-transform: uppercase;
font-weight: 600;
}
.kpi-value[data-v-90b5cd48] {
font-size: 1.8rem;
font-weight: 700;
color: #00f5ff;
text-shadow: 0 0 14px rgba(0, 245, 255, 0.3);
font-variant-numeric: tabular-nums;
}
.kpi-value-row[data-v-90b5cd48] { display: flex; align-items: baseline; gap: 0.4rem;
}
.kpi-split[data-v-90b5cd48] { font-size: 1.6rem; font-weight: 700; font-variant-numeric: tabular-nums;
}
.kpi-split.manual[data-v-90b5cd48] { color: #fbbf24;
}
.kpi-split.auto[data-v-90b5cd48] { color: #34d399;
}
.kpi-divider[data-v-90b5cd48] { color: #555; font-size: 1.4rem;
}
.kpi-sub[data-v-90b5cd48] { font-size: 0.78rem; color: #888;
}
.kpi.alert .kpi-value[data-v-90b5cd48] { color: #ff8da4; text-shadow: 0 0 14px rgba(255, 7, 58, 0.35);
}
.charts-grid[data-v-90b5cd48] {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.85rem;
}
.chart-wide[data-v-90b5cd48] { grid-column: 1 / -1;
}
@media (max-width: 900px) {
.charts-grid[data-v-90b5cd48] { grid-template-columns: 1fr;
}
}
.chart-card[data-v-90b5cd48] {
padding: 1rem 1.1rem;
display: flex;
flex-direction: column;
}
.chart-card h3[data-v-90b5cd48] { margin: 0 0 0.15rem 0; font-size: 1rem; color: #00f5ff;
}
.chart-sub[data-v-90b5cd48] { margin: 0 0 0.6rem 0; font-size: 0.8rem; color: #9ca3af;
}
.chart-hint[data-v-90b5cd48] { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 220px;
}
.violations-card[data-v-90b5cd48] { padding: 1rem 1.1rem;
}
.violations-card h3[data-v-90b5cd48] { margin: 0 0 0.6rem 0; color: #ff8da4; font-size: 1rem;
}
.violations-table[data-v-90b5cd48] {
width: 100%;
border-collapse: collapse;
font-size: 0.9rem;
}
.violations-table th[data-v-90b5cd48], .violations-table td[data-v-90b5cd48] {
padding: 0.5rem 0.6rem;
border-top: 1px solid rgba(255, 255, 255, 0.06);
text-align: left;
}
.violations-table th[data-v-90b5cd48] { background: rgba(255, 7, 58, 0.1); color: #ff8da4; font-size: 0.78rem; text-transform: uppercase;
}
.violations-table .num[data-v-90b5cd48] { text-align: right; font-variant-numeric: tabular-nums;
}
.violations-table .over[data-v-90b5cd48] { color: #ff073a; font-weight: 700;
}
.override-strip[data-v-90b5cd48] {
margin-top: 0.85rem;
padding: 0.7rem 0.85rem;
background: rgba(255, 184, 77, 0.08);
border: 1px solid rgba(255, 184, 77, 0.4);
border-radius: 8px;
}
.override-header[data-v-90b5cd48] {
font-size: 0.82rem;
color: #ffd9a0;
font-weight: 600;
margin-bottom: 0.4rem;
}
.override-list[data-v-90b5cd48] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.35rem;
}
.override-list li[data-v-90b5cd48] {
display: flex; align-items: center; gap: 0.55rem;
font-size: 0.85rem;
color: #d8d8d8;
}
.override-name[data-v-90b5cd48] { flex: 1;
}
.override-mode[data-v-90b5cd48] {
padding: 0.1rem 0.5rem;
background: rgba(167, 139, 250, 0.18);
border: 1px solid rgba(167, 139, 250, 0.4);
border-radius: 999px;
color: #a78bfa;
font-size: 0.75rem;
letter-spacing: 0.3px;
}
.override-count[data-v-90b5cd48] {
color: #fbbf24;
font-weight: 600;
font-variant-numeric: tabular-nums;
}
.reports-view[data-v-4977e37e] {
padding: 1rem;
max-width: 1600px;
margin: 0 auto;
}
.view-header[data-v-4977e37e] {
margin-bottom: 1.5rem;
padding: 1.5rem;
}
.view-header h1[data-v-4977e37e] {
margin: 0 0 0.5rem;
font-size: 2rem;
}
.view-header p[data-v-4977e37e] {
margin: 0;
color: rgba(255, 255, 255, 0.7);
}
.filters[data-v-4977e37e] {
margin-bottom: 1.5rem;
padding: 1.5rem;
}
.filters-row[data-v-4977e37e] {
display: flex;
gap: 1rem;
flex-wrap: wrap;
align-items: flex-end;
}
.filters-row label[data-v-4977e37e] {
display: flex;
flex-direction: column;
gap: 0.5rem;
min-width: 150px;
}
.filters-row label span[data-v-4977e37e] {
font-size: 0.875rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
}
.filters-row select[data-v-4977e37e],
.filters-row input[data-v-4977e37e] {
padding: 0.5rem;
border-radius: 0.375rem;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.3);
color: white;
font-size: 0.875rem;
}
.tier-filter select[data-v-4977e37e] {
min-width: 180px;
height: auto;
}
.tier-filter[data-v-4977e37e] {
position: relative;
}
.tier-chips[data-v-4977e37e] {
display: flex;
flex-wrap: wrap;
gap: 0.375rem;
margin-top: 0.5rem;
}
.tier-chip[data-v-4977e37e] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.625rem;
border-radius: 0.375rem;
background: rgba(59, 130, 246, 0.2);
border: 1px solid rgba(59, 130, 246, 0.4);
color: #60a5fa !important;
font-size: 0.8125rem;
cursor: pointer;
transition: all 0.2s ease;
user-select: none;
}
.tier-chip[data-v-4977e37e]:hover {
background: rgba(59, 130, 246, 0.3);
border-color: rgba(59, 130, 246, 0.6);
transform: translateY(-1px);
box-shadow: 0 0 8px rgba(59, 130, 246, 0.4);
}
.match-play-chip[data-v-4977e37e] {
background: rgba(168, 85, 247, 0.2);
border-color: rgba(168, 85, 247, 0.4);
color: #c084fc !important;
}
.match-play-chip[data-v-4977e37e]:hover {
background: rgba(168, 85, 247, 0.3);
border-color: rgba(168, 85, 247, 0.6);
box-shadow: 0 0 8px rgba(168, 85, 247, 0.4);
}
.filters-actions[data-v-4977e37e] {
display: flex;
gap: 0.5rem;
margin-left: auto;
}
.period-meta[data-v-4977e37e] {
margin-top: 1rem;
display: flex;
gap: 1rem;
align-items: center;
flex-wrap: wrap;
}
.badge[data-v-4977e37e] {
padding: 0.25rem 0.75rem;
border-radius: 0.375rem;
background: rgba(59, 130, 246, 0.2);
color: #60a5fa;
font-size: 0.875rem;
font-weight: 600;
}
.muted[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.5);
font-size: 0.875rem;
}
/* Summary Dashboard */
.summary-dashboard[data-v-4977e37e] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
/* Pull Tabs Stats Grid */
.stats-grid[data-v-4977e37e] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 1rem;
}
.stat-box[data-v-4977e37e] {
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 0.75rem;
padding: 1rem 1.25rem;
text-align: center;
transition: all 0.2s ease;
}
.stat-box[data-v-4977e37e]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.12);
transform: translateY(-2px);
}
.stat-box .stat-label[data-v-4977e37e] {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: rgba(255, 255, 255, 0.6);
margin-bottom: 0.5rem;
}
.stat-box .stat-value[data-v-4977e37e] {
font-size: 1.5rem;
font-weight: 700;
color: #a78bfa;
line-height: 1.2;
}
.stat[data-v-4977e37e] {
display: flex;
align-items: center;
gap: 1rem;
padding: 0.5rem;
}
.stat-icon[data-v-4977e37e] {
font-size: 2.5rem;
flex-shrink: 0;
}
.stat-content[data-v-4977e37e] {
flex: 1;
min-width: 0;
}
.stat-label[data-v-4977e37e] {
font-size: 0.875rem;
color: rgba(255, 255, 255, 0.7);
margin-bottom: 0.375rem;
}
.stat-value[data-v-4977e37e] {
font-size: 1.75rem;
font-weight: 700;
color: white;
line-height: 1.1;
}
.stat-sublabel[data-v-4977e37e] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 0.25rem;
}
.stat-positive .stat-value[data-v-4977e37e] {
color: #10b981;
}
.stat-negative .stat-value[data-v-4977e37e] {
color: #ef4444;
}
.stat-compact[data-v-4977e37e] {
min-width: 150px;
}
/* View Tabs */
.view-tabs[data-v-4977e37e] {
display: flex;
gap: 0.5rem;
margin-bottom: 1rem;
}
.tab-button[data-v-4977e37e] {
padding: 0.75rem 1.5rem;
border: none;
border-radius: 0.5rem;
background: rgba(255, 255, 255, 0.05);
color: rgba(255, 255, 255, 0.7);
font-size: 0.875rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s;
}
.tab-button[data-v-4977e37e]:hover {
background: rgba(255, 255, 255, 0.1);
color: white;
}
.tab-button.active[data-v-4977e37e] {
background: rgba(59, 130, 246, 0.3);
color: #60a5fa;
border: 1px solid rgba(59, 130, 246, 0.5);
}
/* Section */
.section[data-v-4977e37e] {
padding: 1.5rem;
margin-bottom: 1.5rem;
}
.section h3[data-v-4977e37e] {
margin: 0 0 1rem;
font-size: 1.25rem;
}
.no-data-message[data-v-4977e37e] {
text-align: center;
padding: 3rem 2rem;
color: rgba(255, 255, 255, 0.6);
font-size: 1rem;
}
.no-data-message p[data-v-4977e37e] {
margin: 0;
}
/* Table */
.table-responsive[data-v-4977e37e] {
overflow-x: auto;
}
.report-table[data-v-4977e37e] {
width: 100%;
border-collapse: collapse;
table-layout: auto;
}
.report-table th[data-v-4977e37e] {
padding: 0.5rem 0.5rem;
text-align: left;
font-size: 0.875rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
border-bottom: 2px solid rgba(255, 255, 255, 0.1);
cursor: pointer;
user-select: none;
white-space: nowrap;
vertical-align: middle;
line-height: 1.2;
}
.report-table th[data-v-4977e37e]:hover {
background: rgba(255, 255, 255, 0.05);
}
.report-table td[data-v-4977e37e] {
padding: 0.5rem 0.5rem;
font-size: 0.875rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
white-space: nowrap;
vertical-align: middle;
line-height: 1.2;
}
.text-right[data-v-4977e37e] {
text-align: right;
}
.positive[data-v-4977e37e] {
color: #10b981;
font-weight: 600;
}
.negative[data-v-4977e37e] {
color: #ef4444;
font-weight: 600;
}
.player-winning[data-v-4977e37e] {
color: #10b981;
font-weight: 600;
}
.player-losing[data-v-4977e37e] {
color: #ef4444;
font-weight: 600;
}
.neutral[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.7);
}
.status-badge[data-v-4977e37e] {
display: inline-block;
padding: 0.25rem 0.75rem;
border-radius: 0.375rem;
font-size: 0.75rem;
font-weight: 600;
}
.status-hot[data-v-4977e37e] {
background: rgba(239, 68, 68, 0.2);
color: #f87171;
}
.status-cold[data-v-4977e37e] {
background: rgba(59, 130, 246, 0.2);
color: #60a5fa;
}
.status-neutral[data-v-4977e37e] {
background: rgba(156, 163, 175, 0.2);
color: #9ca3af;
}
.status-player-up[data-v-4977e37e] {
background: rgba(16, 185, 129, 0.2);
color: #34d399;
}
.status-player-down[data-v-4977e37e] {
background: rgba(239, 68, 68, 0.2);
color: #f87171;
}
.status-player-even[data-v-4977e37e] {
background: rgba(156, 163, 175, 0.2);
color: #9ca3af;
}
/* Prize pot status badges */
.status-active[data-v-4977e37e] {
background: rgba(16, 185, 129, 0.2);
color: #34d399;
}
.status-paused[data-v-4977e37e] {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
.status-depleted[data-v-4977e37e] {
background: rgba(239, 68, 68, 0.2);
color: #f87171;
}
.status-closed[data-v-4977e37e] {
background: rgba(107, 114, 128, 0.2);
color: #9ca3af;
}
/* Prize winner badges */
.winner-badge[data-v-4977e37e] {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 24px;
height: 24px;
padding: 0 0.5rem;
border-radius: 9999px;
font-size: 0.75rem;
font-weight: 600;
}
.winner-badge.registered[data-v-4977e37e] {
background: rgba(16, 185, 129, 0.2);
color: #34d399;
}
.winner-badge.guest[data-v-4977e37e] {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
/* Prize Winners specific styles */
.award-code[data-v-4977e37e] {
font-family: 'Fira Code', 'Monaco', monospace;
font-size: 0.8125rem;
padding: 0.125rem 0.375rem;
background: rgba(99, 102, 241, 0.15);
border-radius: 0.25rem;
color: #a5b4fc;
}
.winner-type-badge[data-v-4977e37e] {
display: inline-block;
padding: 0.25rem 0.5rem;
border-radius: 0.25rem;
font-size: 0.75rem;
font-weight: 500;
}
.winner-type-badge.registered[data-v-4977e37e] {
background: rgba(16, 185, 129, 0.2);
color: #34d399;
}
.winner-type-badge.guest[data-v-4977e37e] {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
/* Prize Type Badges */
.prize-type-badge[data-v-4977e37e] {
display: inline-block;
padding: 0.15rem 0.5rem;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 500;
}
.prize-type-badge.cash[data-v-4977e37e] {
background: rgba(0, 200, 83, 0.15);
color: #34d399;
}
.prize-type-badge.gift-card[data-v-4977e37e] {
background: rgba(156, 39, 176, 0.15);
color: #ce93d8;
}
.prize-type-badge.merchandise[data-v-4977e37e] {
background: rgba(33, 150, 243, 0.15);
color: #64b5f6;
}
.prize-type-badge.experience[data-v-4977e37e] {
background: rgba(255, 193, 7, 0.15);
color: #fbbf24;
}
.prize-type-badge.other[data-v-4977e37e] {
background: rgba(158, 158, 158, 0.15);
color: #9e9e9e;
}
.prize-description-hint[data-v-4977e37e] {
font-size: 0.7rem;
color: var(--color-text-muted, #888);
margin-top: 0.15rem;
font-style: italic;
}
.game-type-tag[data-v-4977e37e] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
font-size: 0.875rem;
}
.amount-cell[data-v-4977e37e] {
font-weight: 600;
color: #34d399;
}
.voided-row[data-v-4977e37e] {
opacity: 0.6;
background: rgba(239, 68, 68, 0.05);
}
.voided-row .amount-cell[data-v-4977e37e] {
text-decoration: line-through;
color: rgba(255, 255, 255, 0.5);
}
.status-badge.status-voided[data-v-4977e37e] {
background: rgba(239, 68, 68, 0.2);
color: #f87171;
}
.status-badge.status-active[data-v-4977e37e] {
background: rgba(16, 185, 129, 0.2);
color: #34d399;
}
/* Player cell styling */
.player-cell[data-v-4977e37e] {
display: flex;
flex-direction: column;
gap: 0.125rem;
}
.player-cell .player-name[data-v-4977e37e] {
font-weight: 500;
}
.player-cell .player-id[data-v-4977e37e] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
}
.checkbox-input[data-v-4977e37e] {
width: 18px;
height: 18px;
cursor: pointer;
accent-color: #6366f1;
}
/* Prize section styling */
.section-header[data-v-4977e37e] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.section-header h3[data-v-4977e37e] {
margin: 0;
}
.section-actions[data-v-4977e37e] {
display: flex;
gap: 0.75rem;
align-items: center;
}
.prize-filters[data-v-4977e37e] {
display: flex;
gap: 1rem;
align-items: flex-end;
margin-bottom: 1.5rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 0.5rem;
}
.prize-filters label[data-v-4977e37e] {
display: flex;
flex-direction: column;
gap: 0.375rem;
}
.prize-filters label span[data-v-4977e37e] {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.6);
}
.prize-filters input[data-v-4977e37e] {
padding: 0.5rem;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 0.375rem;
background: rgba(255, 255, 255, 0.05);
color: white;
}
/* Pot balance warning states */
.stat-warning[data-v-4977e37e] {
color: #fbbf24 !important;
}
.stat-critical[data-v-4977e37e] {
color: #f87171 !important;
font-weight: 600;
}
/* Totals row */
.totals-row[data-v-4977e37e] {
background: rgba(255, 255, 255, 0.08);
font-weight: 600;
}
.totals-row td[data-v-4977e37e] {
border-top: 2px solid rgba(255, 255, 255, 0.2);
}
/* Loading state for prize section */
.loading-state[data-v-4977e37e] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
gap: 1rem;
}
.loading-state p[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.6);
margin: 0;
}
.no-data-message .hint[data-v-4977e37e] {
font-size: 0.875rem;
color: rgba(255, 255, 255, 0.5);
margin-top: 0.5rem;
}
/* Player link styling */
.player-link[data-v-4977e37e] {
color: #60a5fa;
text-decoration: none;
font-weight: 600;
transition: all 0.2s;
border-bottom: 1px solid transparent;
}
.player-link[data-v-4977e37e]:hover {
color: #93c5fd;
border-bottom-color: #60a5fa;
}
.player-link[data-v-4977e37e]:active {
color: #3b82f6;
}
.player-badges[data-v-4977e37e] {
display: inline-flex;
gap: 0.35rem;
margin-left: 0.35rem;
}
.player-badge[data-v-4977e37e] {
padding: 0.05rem 0.4rem;
border-radius: 999px;
font-size: 0.65rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.9);
border: 1px solid rgba(255, 215, 0, 0.45);
background: rgba(255, 215, 0, 0.2);
}
.player-badge.hosted[data-v-4977e37e] {
border-color: rgba(59, 130, 246, 0.45);
background: rgba(59, 130, 246, 0.2);
}
.player-badge.tourney[data-v-4977e37e] {
border-color: rgba(168, 85, 247, 0.5);
background: rgba(168, 85, 247, 0.22);
}
.player-badge.event[data-v-4977e37e] {
border-color: rgba(244, 114, 182, 0.5);
background: rgba(244, 114, 182, 0.22);
color: #f472b6;
}
/* Tier badge styling */
.tier-badge[data-v-4977e37e] {
display: inline-block;
padding: 0.25rem 0.5rem;
border-radius: 0.25rem;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
}
.tier-bronze[data-v-4977e37e] {
background: rgba(205, 127, 50, 0.2);
color: #cd7f32;
border: 1px solid rgba(205, 127, 50, 0.3);
}
.tier-silver[data-v-4977e37e] {
background: rgba(192, 192, 192, 0.2);
color: #c0c0c0;
border: 1px solid rgba(192, 192, 192, 0.3);
}
.tier-gold[data-v-4977e37e] {
background: rgba(255, 215, 0, 0.2);
color: #ffd700;
border: 1px solid rgba(255, 215, 0, 0.3);
}
.tier-platinum[data-v-4977e37e] {
background: rgba(229, 228, 226, 0.2);
color: #e5e4e2;
border: 1px solid rgba(229, 228, 226, 0.3);
}
.tier-diamond[data-v-4977e37e] {
background: rgba(185, 242, 255, 0.2);
color: #b9f2ff;
border: 1px solid rgba(185, 242, 255, 0.3);
}
/* Tier Changes */
.tier-changes[data-v-4977e37e] {
display: inline-flex;
align-items: center;
gap: 0;
font-size: 0.8rem;
font-weight: 600;
white-space: nowrap;
}
.tier-change-item[data-v-4977e37e] {
color: var(--text-secondary);
}
.tier-change-item.promotion[data-v-4977e37e] {
color: var(--neon-green, #0f0);
}
.tier-change-item.demotion[data-v-4977e37e] {
color: var(--neon-red, #f44);
}
.tier-arrow[data-v-4977e37e] {
margin: 0 0.15rem;
opacity: 0.6;
color: var(--text-secondary);
}
.tier-arrow.promotion[data-v-4977e37e] {
color: var(--neon-green, #0f0);
opacity: 0.8;
}
.tier-arrow.demotion[data-v-4977e37e] {
color: var(--neon-red, #f44);
opacity: 0.8;
}
/* Match Play Cell */
.match-play-cell[data-v-4977e37e] {
font-family: 'Courier New', monospace;
text-align: right;
}
.match-play-amount[data-v-4977e37e] {
color: #a78bfa;
font-weight: 600;
font-size: 0.9rem;
}
/* Game Speed Cell */
.speed-cell[data-v-4977e37e] {
text-align: center;
}
.speed-badge[data-v-4977e37e] {
display: inline-block;
padding: 0.2rem 0.5rem;
border-radius: 4px;
font-weight: 600;
font-size: 0.85rem;
}
.speed-badge.speed-slow[data-v-4977e37e] {
background: rgba(239, 68, 68, 0.2);
color: #f87171;
border: 1px solid rgba(239, 68, 68, 0.3);
}
.speed-badge.speed-medium[data-v-4977e37e] {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
border: 1px solid rgba(251, 191, 36, 0.3);
}
.speed-badge.speed-fast[data-v-4977e37e] {
background: rgba(74, 222, 128, 0.2);
color: #4ade80;
border: 1px solid rgba(74, 222, 128, 0.3);
}
.speed-badge.speed-turbo[data-v-4977e37e] {
background: rgba(96, 165, 250, 0.2);
color: #60a5fa;
border: 1px solid rgba(96, 165, 250, 0.3);
}
/* Points Cells */
.points-cell[data-v-4977e37e] {
text-align: right;
font-family: 'Courier New', monospace;
}
.points-earned[data-v-4977e37e] {
color: #4ade80;
font-weight: 600;
}
.points-used[data-v-4977e37e] {
color: #fbbf24;
font-weight: 600;
}
/* Preferred Game Cell */
.preferred-game-cell[data-v-4977e37e] {
max-width: 180px;
}
.preferred-game-badge[data-v-4977e37e] {
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.25rem 0.75rem;
background: rgba(139, 92, 246, 0.15);
border: 1px solid rgba(139, 92, 246, 0.3);
border-radius: 0.375rem;
color: #a78bfa;
font-size: 0.8rem;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.text-muted[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.4);
font-style: italic;
}
.error-box[data-v-4977e37e] {
padding: 1rem;
background: rgba(239, 68, 68, 0.1);
border: 1px solid rgba(239, 68, 68, 0.3);
border-radius: 0.5rem;
color: #f87171;
margin-bottom: 1rem;
}
/* Charts Grid */
.charts-grid[data-v-4977e37e] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
gap: 1.5rem;
margin-top: 1.5rem;
}
@media (max-width: 1024px) {
.charts-grid[data-v-4977e37e] {
grid-template-columns: 1fr;
}
}
.chart-card[data-v-4977e37e] {
padding: 1.5rem;
min-height: 380px;
display: flex;
flex-direction: column;
}
.chart-header[data-v-4977e37e] {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 1rem;
flex-wrap: wrap;
}
.chart-filter[data-v-4977e37e] {
display: flex;
flex-direction: column;
gap: 0.35rem;
min-width: 200px;
}
.chart-filter span[data-v-4977e37e] {
font-size: 0.75rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.7);
}
.chart-filter select[data-v-4977e37e] {
padding: 0.45rem 0.6rem;
border-radius: 0.375rem;
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(0, 0, 0, 0.25);
color: #fff;
font-size: 0.8rem;
}
.chart-card h4[data-v-4977e37e] {
margin: 0 0 0.25rem;
font-size: 1.125rem;
font-weight: 600;
color: rgba(255, 255, 255, 0.95);
}
.chart-subtitle[data-v-4977e37e] {
margin: 0 0 1rem;
font-size: 0.875rem;
color: rgba(255, 255, 255, 0.5);
font-weight: 400;
}
.chart-hint[data-v-4977e37e] {
display: inline-block;
margin-left: 0.5rem;
padding: 0.125rem 0.5rem;
background: rgba(59, 130, 246, 0.2);
border: 1px solid rgba(59, 130, 246, 0.4);
border-radius: 0.25rem;
font-size: 0.75rem;
color: #60a5fa;
cursor: help;
}
.chart-card .apexcharts-canvas[data-v-4977e37e] {
margin: 0 auto;
cursor: pointer;
}
.chart-empty[data-v-4977e37e] {
display: flex;
align-items: center;
justify-content: center;
min-height: 260px;
color: rgba(255, 255, 255, 0.6);
font-size: 0.9rem;
}
.chart-note[data-v-4977e37e] {
margin-top: 0.75rem;
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
}
.chart-loading[data-v-4977e37e] {
display: flex;
align-items: center;
justify-content: center;
min-height: 280px;
}
.loading-spinner[data-v-4977e37e] {
width: 40px;
height: 40px;
border: 4px solid rgba(59, 130, 246, 0.2);
border-top-color: #60a5fa;
border-radius: 50%;
animation: spin-4977e37e 0.8s linear infinite;
}
.trend-loading[data-v-4977e37e] {
display: inline-block;
margin-left: 0.5rem;
color: #60a5fa;
font-size: 0.75rem;
}
.range-toggle[data-v-4977e37e] {
display: flex;
gap: 0.25rem;
flex-wrap: wrap;
}
.range-btn[data-v-4977e37e] {
padding: 0.3rem 0.65rem;
font-size: 0.75rem;
font-weight: 500;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 0.25rem;
background: rgba(255, 255, 255, 0.05);
color: rgba(255, 255, 255, 0.6);
cursor: pointer;
transition: all 0.15s ease;
}
.range-btn[data-v-4977e37e]:hover {
border-color: rgba(96, 165, 250, 0.4);
color: #60a5fa;
}
.range-btn.active[data-v-4977e37e] {
background: rgba(96, 165, 250, 0.15);
border-color: rgba(96, 165, 250, 0.5);
color: #60a5fa;
}
@keyframes spin-4977e37e {
to {
transform: rotate(360deg);
}
}
/* Export group styling */
.export-group[data-v-4977e37e] {
display: flex;
gap: 0;
align-items: center;
border-radius: 0.5rem;
overflow: hidden;
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
}
.export-format-select[data-v-4977e37e] {
padding: 0.625rem 1rem;
border: none;
border-right: 1px solid rgba(255, 255, 255, 0.1);
background: transparent;
color: rgba(255, 255, 255, 0.9);
font-size: 0.875rem;
font-weight: 500;
cursor: pointer;
transition: all 0.2s;
min-width: 120px;
appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 0.75rem center;
padding-right: 2.5rem;
}
.export-format-select[data-v-4977e37e]:hover {
background: rgba(255, 255, 255, 0.05);
}
.export-format-select[data-v-4977e37e]:focus {
outline: none;
background: rgba(255, 255, 255, 0.08);
}
.export-format-select option[data-v-4977e37e] {
background: rgba(30, 30, 40, 0.98);
color: white;
padding: 0.5rem;
}
/* Export button styling */
.btn-export[data-v-4977e37e] {
background: transparent !important;
border: none !important;
color: #4ade80 !important;
padding: 0.625rem 1.25rem !important;
font-weight: 500 !important;
border-radius: 0 !important;
}
.btn-export[data-v-4977e37e]:hover:not(:disabled) {
background: rgba(34, 197, 94, 0.15) !important;
color: #86efac !important;
}
.btn-export[data-v-4977e37e]:disabled {
opacity: 0.5;
cursor: not-allowed;
}
/* Winners pagination */
.winners-pagination[data-v-4977e37e] {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 0.75rem;
padding: 0.75rem 1rem;
margin-top: 0.75rem;
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 6px;
}
.winners-pagination-info[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.85);
font-size: 0.9rem;
}
.winners-pagination-actions[data-v-4977e37e] {
display: flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
}
.winners-page-size[data-v-4977e37e] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
color: rgba(255, 255, 255, 0.75);
font-size: 0.85rem;
}
.winners-page-size select[data-v-4977e37e] {
padding: 0.3rem 0.5rem;
font-size: 0.85rem;
}
.winners-pagination .btn-page[data-v-4977e37e] {
padding: 0.4rem 0.75rem !important;
font-size: 0.85rem !important;
min-width: auto !important;
}
.winners-pagination .btn-page[data-v-4977e37e]:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.winners-page-indicator[data-v-4977e37e] {
color: rgba(255, 255, 255, 0.85);
font-size: 0.9rem;
padding: 0 0.5rem;
white-space: nowrap;
}
/* Print-only elements hidden on screen */
.print-only[data-v-4977e37e] {
display: none;
}
/* Print styles - Thermal Receipt Format (76mm width) */
@media print {
/* Hide screen-only elements */
.filters[data-v-4977e37e],
.view-tabs[data-v-4977e37e],
.breadcrumb-nav[data-v-4977e37e],
.filters-actions[data-v-4977e37e],
.view-header[data-v-4977e37e],
.summary-dashboard[data-v-4977e37e] {
display: none !important;
}
/* Show print-only header */
.print-only[data-v-4977e37e] {
display: block !important;
}
/* Page setup - Thermal receipt */
@page {
size: 76mm auto;
margin: 0;
}
html[data-v-4977e37e],
body[data-v-4977e37e] {
width: 76mm;
margin: 0;
padding: 0;
}
/* Overall layout - Receipt style */
.reports-view[data-v-4977e37e] {
background: white !important;
color: #000 !important;
font-family: 'Arial', sans-serif !important;
font-size: 14px !important;
line-height: 1.4 !important;
width: 76mm !important;
margin: 0 auto !important;
padding: 2mm 2mm 5mm 5mm !important;
}
/* Print header styling - Thermal receipt header */
.print-header[data-v-4977e37e] {
text-align: center;
border-bottom: 1px solid #000;
padding-bottom: 6px;
margin-bottom: 10px;
}
.casino-logo[data-v-4977e37e] {
height: 41px;
width: auto;
margin: 0 auto 4px;
display: block;
filter: grayscale(100%) contrast(140%) brightness(0.7);
}
.print-header-row[data-v-4977e37e] {
display: block;
text-align: center;
}
.print-header-left[data-v-4977e37e],
.print-header-right[data-v-4977e37e] {
display: block;
text-align: center;
}
.print-brand[data-v-4977e37e] {
font-size: 18px !important;
font-weight: bold !important;
margin: 3px 0 !important;
letter-spacing: 0.5px !important;
color: #000 !important;
}
.print-title[data-v-4977e37e] {
font-size: 16px !important;
font-weight: bold !important;
margin: 2px 0 8px !important;
color: #000 !important;
}
.print-header-right>div[data-v-4977e37e] {
font-size: 12px !important;
line-height: 1.4 !important;
margin: 2px 0 !important;
color: #000 !important;
}
.print-meta[data-v-4977e37e] {
font-size: 12px !important;
margin: 6px 0 !important;
}
.print-meta>div[data-v-4977e37e] {
margin: 2px 0 !important;
color: #000 !important;
}
.print-timestamp[data-v-4977e37e],
.print-prepared-by[data-v-4977e37e] {
font-size: 11px !important;
color: #555 !important;
}
.print-divider[data-v-4977e37e] {
border-bottom: 1px solid #000;
margin: 6px 0 !important;
}
/* Card styling */
.card-glass[data-v-4977e37e],
.card-glass-strong[data-v-4977e37e] {
background: white !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin-bottom: 8px !important;
}
.section[data-v-4977e37e] {
page-break-inside: avoid;
border: 1px dashed #000;
padding: 4px;
margin-bottom: 6px;
}
.section h3[data-v-4977e37e] {
color: #000 !important;
font-size: 14px !important;
font-weight: bold !important;
margin: 0 0 6px 0 !important;
padding: 0 !important;
text-align: center !important;
border-bottom: 1px solid #000 !important;
padding-bottom: 4px !important;
}
/* Table styling - Compact receipt format */
.table-responsive[data-v-4977e37e] {
overflow: visible !important;
}
.report-table[data-v-4977e37e] {
width: 100% !important;
border-collapse: collapse !important;
color: #000 !important;
font-size: 9px !important;
margin: 0 !important;
table-layout: fixed !important;
}
.report-table th[data-v-4977e37e],
.report-table td[data-v-4977e37e] {
color: #000 !important;
border: none !important;
border-bottom: 1px dotted #ccc !important;
padding: 1px !important;
text-align: left !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: clip !important;
line-height: 1.1 !important;
}
.report-table th[data-v-4977e37e] {
background: #f3f3f3 !important;
font-weight: bold !important;
font-size: 9px !important;
border-bottom: 1px solid #000 !important;
}
.report-table tbody td[data-v-4977e37e] {
font-size: 8px !important;
padding: 0.5px 1px !important;
}
.report-table td.text-right[data-v-4977e37e],
.report-table th.text-right[data-v-4977e37e] {
text-align: right !important;
}
.report-table td.text-center[data-v-4977e37e],
.report-table th.text-center[data-v-4977e37e] {
text-align: center !important;
}
/* Hide some columns on receipt to save space */
/* Only show: Table, Drop, Walk With, W/L - hide Pit, Game, Sessions, Time, Status */
.report-table th[data-v-4977e37e]:nth-child(2),
.report-table td[data-v-4977e37e]:nth-child(2),
.report-table th[data-v-4977e37e]:nth-child(3),
.report-table td[data-v-4977e37e]:nth-child(3),
.report-table th[data-v-4977e37e]:nth-child(7),
.report-table td[data-v-4977e37e]:nth-child(7),
.report-table th[data-v-4977e37e]:nth-child(8),
.report-table td[data-v-4977e37e]:nth-child(8),
.report-table th[data-v-4977e37e]:nth-child(9),
.report-table td[data-v-4977e37e]:nth-child(9) {
display: none !important;
}
/* Abbreviate headers via pseudo-elements */
.report-table th[data-v-4977e37e]:nth-child(1)::before {
content: 'Tbl';
}
.report-table th[data-v-4977e37e]:nth-child(4)::before {
content: 'In';
}
.report-table th[data-v-4977e37e]:nth-child(5)::before {
content: 'Out';
}
.report-table th[data-v-4977e37e]:nth-child(6)::before {
content: 'W/L';
}
/* Set column widths for 4-column thermal receipt layout */
.report-table th[data-v-4977e37e]:nth-child(1),
.report-table td[data-v-4977e37e]:nth-child(1) {
width: 15% !important;
}
.report-table th[data-v-4977e37e]:nth-child(4),
.report-table td[data-v-4977e37e]:nth-child(4),
.report-table th[data-v-4977e37e]:nth-child(5),
.report-table td[data-v-4977e37e]:nth-child(5),
.report-table th[data-v-4977e37e]:nth-child(6),
.report-table td[data-v-4977e37e]:nth-child(6) {
width: 28% !important;
text-align: right !important;
}
.report-table th[data-v-4977e37e] {
font-size: 9px !important;
padding: 1px !important;
}
/* Hide original header text, show abbreviated version */
.report-table thead th[data-v-4977e37e] {
font-size: 0 !important;
}
.report-table thead th[data-v-4977e37e]::before {
font-size: 9px !important;
}
/* Color coding for print */
.positive[data-v-4977e37e] {
color: #000 !important;
font-weight: bold !important;
}
.positive[data-v-4977e37e]::after {
content: ' ▲';
}
.negative[data-v-4977e37e] {
color: #000 !important;
font-weight: bold !important;
}
.negative[data-v-4977e37e]::before {
content: '-';
}
.negative[data-v-4977e37e]::after {
content: ' ▼';
}
.player-winning[data-v-4977e37e] {
color: #000 !important;
font-weight: bold !important;
}
.player-winning[data-v-4977e37e]::after {
content: ' ▲';
}
.player-losing[data-v-4977e37e] {
color: #000 !important;
font-weight: bold !important;
}
.player-losing[data-v-4977e37e]::before {
content: '-';
}
.player-losing[data-v-4977e37e]::after {
content: ' ▼';
}
.neutral[data-v-4977e37e] {
color: #666 !important;
}
.status-badge[data-v-4977e37e] {
display: inline !important;
border: none !important;
color: #000 !important;
background: transparent !important;
padding: 0 !important;
font-size: 10px !important;
font-weight: normal !important;
}
/* Receipt footer */
.receipt-footer[data-v-4977e37e] {
display: block !important;
text-align: center;
border-top: 1px solid #000;
padding-top: 4px;
margin-top: 6px;
font-size: 8px;
color: #333;
}
.receipt-footer>div[data-v-4977e37e] {
margin: 1px 0;
}
/* Summary totals box */
.summary-totals[data-v-4977e37e] {
display: block !important;
background: #f3f3f3 !important;
border: 2px solid #000 !important;
padding: 8px !important;
margin: 10px 0 !important;
text-align: center !important;
}
.summary-totals .total-row[data-v-4977e37e] {
display: flex !important;
justify-content: space-between !important;
margin: 4px 0 !important;
font-size: 13px !important;
font-weight: bold !important;
}
.summary-totals .total-label[data-v-4977e37e] {
text-align: left !important;
}
.summary-totals .total-value[data-v-4977e37e] {
text-align: right !important;
font-weight: bold !important;
}
/* Period meta badge */
.period-meta[data-v-4977e37e] {
display: block !important;
text-align: center !important;
margin: 6px 0 !important;
}
.badge[data-v-4977e37e] {
display: inline-block !important;
background: #f3f3f3 !important;
color: #000 !important;
border: 1px solid #000 !important;
padding: 3px 8px !important;
font-size: 11px !important;
font-weight: bold !important;
}
.muted[data-v-4977e37e] {
display: block !important;
color: #555 !important;
font-size: 11px !important;
margin-top: 3px !important;
}
/* Table pagination */
table[data-v-4977e37e] {
page-break-inside: auto;
}
tr[data-v-4977e37e] {
page-break-inside: avoid;
page-break-after: auto;
}
thead[data-v-4977e37e] {
display: table-header-group;
}
tbody[data-v-4977e37e] {
display: table-row-group;
}
/* Ensure strong tags are visible */
strong[data-v-4977e37e] {
font-weight: bold !important;
color: #000 !important;
}
/* No data message */
.no-data-message[data-v-4977e37e] {
text-align: center !important;
padding: 10px !important;
font-size: 12px !important;
color: #666 !important;
}
}
.sms-consent-page[data-v-3c646f19] {
min-height: 100vh;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
padding: 20px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}
.consent-container[data-v-3c646f19] {
max-width: 600px;
margin: 0 auto;
background: white;
border-radius: 16px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
overflow: hidden;
}
.header-section[data-v-3c646f19] {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 40px 30px;
text-align: center;
}
.logo[data-v-3c646f19] {
margin-bottom: 15px;
}
.icon[data-v-3c646f19] {
font-size: 48px;
display: inline-block;
animation: pulse-3c646f19 2s infinite;
}
@keyframes pulse-3c646f19 {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
}
.header-section h1[data-v-3c646f19] {
margin: 0 0 10px 0;
font-size: 28px;
font-weight: 700;
}
.subtitle[data-v-3c646f19] {
margin: 0;
font-size: 16px;
opacity: 0.9;
}
.loading-state[data-v-3c646f19],
.error-state[data-v-3c646f19],
.success-state[data-v-3c646f19] {
padding: 60px 30px;
text-align: center;
}
.spinner[data-v-3c646f19] {
border: 4px solid rgba(102, 126, 234, 0.2);
border-top: 4px solid #667eea;
border-radius: 50%;
width: 50px;
height: 50px;
animation: spin-3c646f19 1s linear infinite;
margin: 0 auto 20px;
}
@keyframes spin-3c646f19 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.error-icon[data-v-3c646f19],
.success-icon[data-v-3c646f19] {
font-size: 64px;
margin-bottom: 20px;
}
.error-state h2[data-v-3c646f19] {
color: #e53e3e;
margin-bottom: 10px;
}
.error-details[data-v-3c646f19] {
color: #718096;
margin-bottom: 20px;
}
.btn-retry[data-v-3c646f19] {
background: #667eea;
color: white;
border: none;
padding: 12px 30px;
border-radius: 8px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s;
}
.btn-retry[data-v-3c646f19]:hover {
background: #5568d3;
transform: translateY(-2px);
}
.success-state h2[data-v-3c646f19] {
color: #38a169;
margin-bottom: 15px;
}
.success-details[data-v-3c646f19] {
background: #f0fff4;
border: 1px solid #9ae6b4;
border-radius: 8px;
padding: 20px;
margin: 20px 0;
text-align: left;
}
.success-details p[data-v-3c646f19] {
margin: 8px 0;
color: #2f855a;
}
.next-steps[data-v-3c646f19] {
background: #ebf8ff;
border: 1px solid #90cdf4;
border-radius: 8px;
padding: 20px;
margin-top: 20px;
text-align: left;
}
.next-steps h3[data-v-3c646f19] {
margin-top: 0;
color: #2c5282;
}
.next-steps ul[data-v-3c646f19] {
margin: 10px 0 0 0;
padding-left: 20px;
}
.next-steps li[data-v-3c646f19] {
margin-bottom: 8px;
color: #2d3748;
}
.form-section[data-v-3c646f19] {
padding: 30px;
}
.player-info[data-v-3c646f19] {
background: #f7fafc;
border: 1px solid #e2e8f0;
border-radius: 8px;
padding: 20px;
margin-bottom: 25px;
}
.player-info h3[data-v-3c646f19] {
margin-top: 0;
color: #2d3748;
font-size: 16px;
}
.info-row[data-v-3c646f19] {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
font-size: 14px;
}
.info-row .label[data-v-3c646f19] {
font-weight: 600;
color: #4a5568;
}
.info-row .value[data-v-3c646f19] {
color: #2d3748;
}
.benefits-section[data-v-3c646f19] {
background: #f0fff4;
border: 1px solid #9ae6b4;
border-radius: 8px;
padding: 20px;
margin-bottom: 25px;
}
.benefits-section h3[data-v-3c646f19] {
margin-top: 0;
color: #2f855a;
font-size: 18px;
}
.benefits-list[data-v-3c646f19] {
margin: 10px 0 0 0;
padding-left: 20px;
list-style: none;
}
.benefits-list li[data-v-3c646f19] {
margin-bottom: 10px;
color: #2d3748;
position: relative;
padding-left: 10px;
}
.form-group[data-v-3c646f19] {
margin-bottom: 25px;
}
.form-group label[data-v-3c646f19] {
display: block;
font-weight: 600;
color: #2d3748;
margin-bottom: 8px;
font-size: 15px;
}
.form-group input[type="tel"][data-v-3c646f19] {
width: 100%;
padding: 14px 16px;
border: 2px solid #e2e8f0;
border-radius: 8px;
font-size: 16px;
transition: all 0.2s;
box-sizing: border-box;
}
.form-group input[type="tel"][data-v-3c646f19]:focus {
outline: none;
border-color: #667eea;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
.input-error[data-v-3c646f19] {
border-color: #fc8181 !important;
}
.error-message[data-v-3c646f19] {
color: #e53e3e;
font-size: 13px;
margin-top: 6px;
}
.input-hint[data-v-3c646f19] {
color: #718096;
font-size: 13px;
margin-top: 6px;
}
.consent-checkbox[data-v-3c646f19] {
margin: 25px 0;
}
.checkbox-container[data-v-3c646f19] {
display: flex;
align-items: flex-start;
cursor: pointer;
user-select: none;
position: relative;
padding-left: 35px;
}
.checkbox-container input[data-v-3c646f19] {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark[data-v-3c646f19] {
position: absolute;
left: 0;
top: 2px;
height: 22px;
width: 22px;
background-color: white;
border: 2px solid #cbd5e0;
border-radius: 4px;
transition: all 0.2s;
}
.checkbox-container:hover .checkmark[data-v-3c646f19] {
border-color: #667eea;
}
.checkbox-container input:checked~.checkmark[data-v-3c646f19] {
background-color: #667eea;
border-color: #667eea;
}
.checkmark[data-v-3c646f19]:after {
content: "";
position: absolute;
display: none;
left: 6px;
top: 2px;
width: 6px;
height: 11px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.checkbox-container input:checked~.checkmark[data-v-3c646f19]:after {
display: block;
}
.checkbox-label[data-v-3c646f19] {
font-size: 14px;
line-height: 1.5;
color: #2d3748;
}
.disclosure-box[data-v-3c646f19] {
background: #fffaf0;
border: 1px solid #fbd38d;
border-radius: 8px;
padding: 20px;
margin: 25px 0;
font-size: 14px;
line-height: 1.6;
color: #2d3748;
}
.disclosure-box h4[data-v-3c646f19] {
margin-top: 0;
color: #c05621;
font-size: 16px;
}
.disclosure-list[data-v-3c646f19] {
margin: 15px 0;
padding-left: 20px;
}
.disclosure-list li[data-v-3c646f19] {
margin-bottom: 8px;
}
.disclosure-footer[data-v-3c646f19] {
margin-bottom: 0;
font-size: 13px;
color: #4a5568;
font-style: italic;
}
.legal-links[data-v-3c646f19] {
text-align: center;
margin: 20px 0;
font-size: 14px;
}
.legal-links a[data-v-3c646f19] {
color: #667eea;
text-decoration: none;
font-weight: 500;
}
.legal-links a[data-v-3c646f19]:hover {
text-decoration: underline;
}
.separator[data-v-3c646f19] {
margin: 0 10px;
color: #cbd5e0;
}
.btn-submit[data-v-3c646f19] {
width: 100%;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border: none;
padding: 16px;
border-radius: 8px;
font-size: 18px;
font-weight: 700;
cursor: pointer;
transition: all 0.3s;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-submit[data-v-3c646f19]:hover:not(.btn-disabled) {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4);
}
.btn-disabled[data-v-3c646f19] {
opacity: 0.5;
cursor: not-allowed;
}
.already-opted-in[data-v-3c646f19] {
text-align: center;
color: #38a169;
font-size: 14px;
margin-top: 15px;
padding: 12px;
background: #f0fff4;
border-radius: 6px;
}
@media (max-width: 640px) {
.sms-consent-page[data-v-3c646f19] {
padding: 10px;
}
.header-section[data-v-3c646f19] {
padding: 30px 20px;
}
.header-section h1[data-v-3c646f19] {
font-size: 24px;
}
.form-section[data-v-3c646f19] {
padding: 20px;
}
}
/* Modal Base Styles */
.modal-overlay[data-v-9bf4d12a] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(4px);
}
.modal-content[data-v-9bf4d12a] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 700px;
width: 90vw;
max-height: 80vh;
overflow: hidden;
display: flex;
flex-direction: column;
backdrop-filter: blur(20px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}
.modal-header[data-v-9bf4d12a] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
}
.modal-header h2[data-v-9bf4d12a] {
margin: 0;
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-primary);
}
.btn-close[data-v-9bf4d12a] {
background: none;
border: none;
font-size: 1.5rem;
color: var(--text-secondary);
cursor: pointer;
padding: 0.25rem;
border-radius: 0.25rem;
transition: all 0.2s ease;
}
.btn-close[data-v-9bf4d12a]:hover {
color: var(--neon-red);
background: rgba(255, 69, 0, 0.1);
}
.modal-body[data-v-9bf4d12a] {
flex: 1;
padding: 2rem;
overflow-y: auto;
}
.modal-footer[data-v-9bf4d12a] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.02);
}
/* Loading and Empty States */
.loading-message[data-v-9bf4d12a] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 2rem;
color: var(--text-secondary);
}
.no-available-players[data-v-9bf4d12a] {
text-align: center;
padding: 2rem;
color: var(--text-secondary);
}
.no-available-players .empty-icon[data-v-9bf4d12a] {
font-size: 3rem;
color: var(--border-color);
margin-bottom: 1rem;
opacity: 0.5;
}
.empty-cta-row[data-v-9bf4d12a] {
display: flex;
gap: 1rem;
justify-content: center;
margin-top: 1rem;
}
/* Form Styles */
.add-player-form[data-v-9bf4d12a] {
display: flex;
flex-direction: column;
gap: 2rem;
}
.form-section[data-v-9bf4d12a] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.form-section label[data-v-9bf4d12a] {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
}
.input-glass[data-v-9bf4d12a] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
width: 100%;
}
.input-glass[data-v-9bf4d12a]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 245, 255, 0.3);
}
.player-search input[data-v-9bf4d12a] {
width: 100%;
}
/* Player Selection */
.available-players-list[data-v-9bf4d12a] {
max-height: 300px;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.player-option[data-v-9bf4d12a] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.75rem;
cursor: pointer;
transition: all 0.2s ease;
}
.player-option[data-v-9bf4d12a]:hover {
border-color: var(--neon-blue);
background: rgba(64, 224, 208, 0.1);
}
.player-option.selected[data-v-9bf4d12a] {
border-color: var(--neon-blue);
background: rgba(64, 224, 208, 0.2);
box-shadow: 0 0 10px rgba(64, 224, 208, 0.3);
}
.player-info[data-v-9bf4d12a] {
display: flex;
align-items: center;
gap: 1rem;
}
.player-avatar[data-v-9bf4d12a] {
width: 40px;
height: 40px;
border-radius: 50%;
overflow: hidden;
background: linear-gradient(45deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
}
.player-avatar img[data-v-9bf4d12a] {
width: 100%;
height: 100%;
object-fit: cover;
}
.default-avatar[data-v-9bf4d12a] {
color: var(--text-primary);
font-size: 1.2rem;
}
.player-details[data-v-9bf4d12a] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.player-name[data-v-9bf4d12a] {
font-weight: 600;
color: var(--text-primary);
display: flex;
align-items: center;
gap: 0.5rem;
}
.vip-indicator[data-v-9bf4d12a] {
background: linear-gradient(135deg, var(--neon-gold), #ffa500);
color: var(--surface-dark);
padding: 0.1rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
}
.hosted-indicator[data-v-9bf4d12a] {
background: rgba(0, 255, 150, 0.15);
color: var(--neon-green);
padding: 0.1rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(0, 255, 150, 0.35);
}
.tourney-indicator[data-v-9bf4d12a] {
background: rgba(138, 43, 226, 0.12);
color: var(--neon-purple);
padding: 0.1rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(138, 43, 226, 0.35);
}
.event-indicator[data-v-9bf4d12a] {
background: rgba(244, 114, 182, 0.12);
color: #f472b6;
padding: 0.1rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(244, 114, 182, 0.35);
}
.exclusion-badge[data-v-9bf4d12a] {
background: linear-gradient(135deg, var(--neon-red), #ff4500);
color: white;
padding: 0.2rem 0.5rem;
border-radius: 0.25rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
}
.player-option.self-excluded[data-v-9bf4d12a] {
border-color: var(--neon-red);
background: rgba(255, 69, 0, 0.1);
cursor: not-allowed;
opacity: 0.7;
}
.player-option.barred[data-v-9bf4d12a] {
border-color: var(--neon-orange);
background: rgba(255, 140, 0, 0.1);
cursor: not-allowed;
opacity: 0.7;
}
.player-meta[data-v-9bf4d12a] {
display: flex;
align-items: center;
gap: 0.75rem;
font-size: 0.85rem;
color: var(--text-secondary);
}
.player-id[data-v-9bf4d12a] {
font-weight: 500;
}
.card-number[data-v-9bf4d12a] {
color: var(--neon-green);
}
.membership[data-v-9bf4d12a] {
color: var(--neon-purple);
font-weight: 500;
}
.player-stats[data-v-9bf4d12a] {
display: flex;
flex-direction: column;
gap: 0.25rem;
text-align: right;
}
.player-stats .stat[data-v-9bf4d12a] {
display: flex;
justify-content: space-between;
gap: 1rem;
font-size: 0.85rem;
}
.player-stats .label[data-v-9bf4d12a] {
color: var(--text-secondary);
}
.player-stats .value[data-v-9bf4d12a] {
color: var(--text-primary);
font-weight: 500;
}
/* Seat Selection */
.seat-grid[data-v-9bf4d12a] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
gap: 1rem;
}
.seat-button[data-v-9bf4d12a] {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border: 2px solid rgba(255, 255, 255, 0.2);
border-radius: 0.75rem;
cursor: pointer;
transition: all 0.2s ease;
min-height: 80px;
}
.seat-button[data-v-9bf4d12a]:hover:not(:disabled) {
border-color: var(--neon-blue);
background: rgba(64, 224, 208, 0.1);
}
.seat-button.selected[data-v-9bf4d12a] {
border-color: var(--neon-blue);
background: rgba(64, 224, 208, 0.2);
box-shadow: 0 0 10px rgba(64, 224, 208, 0.3);
}
.seat-button.occupied[data-v-9bf4d12a] {
background: rgba(255, 69, 0, 0.1);
border-color: var(--neon-red);
cursor: not-allowed;
opacity: 0.7;
}
.seat-button[data-v-9bf4d12a]:disabled {
cursor: not-allowed;
}
.seat-number[data-v-9bf4d12a] {
font-size: 1.2rem;
font-weight: bold;
color: var(--text-primary);
}
.occupied-by[data-v-9bf4d12a] {
font-size: 0.75rem;
color: var(--text-secondary);
margin-top: 0.25rem;
text-align: center;
}
/* Buy-in Amount */
.buy-in-input-group[data-v-9bf4d12a] {
position: relative;
margin-bottom: 1rem;
}
.input-prefix[data-v-9bf4d12a] {
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
color: var(--text-secondary);
font-size: 1.1rem;
font-weight: 600;
}
.buy-in-input-group .input-glass[data-v-9bf4d12a] {
padding-left: 2rem;
font-size: 1.1rem;
}
.amount-suggestions[data-v-9bf4d12a] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.amount-btn[data-v-9bf4d12a] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--text-primary);
padding: 0.5rem 1rem;
border-radius: 0.5rem;
cursor: pointer;
transition: all 0.2s ease;
font-weight: 500;
}
.amount-btn[data-v-9bf4d12a]:hover {
border-color: var(--neon-green);
background: rgba(64, 224, 208, 0.1);
color: var(--neon-green);
}
/* Button Styles */
.btn-glass[data-v-9bf4d12a] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 0.75rem 1.5rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
backdrop-filter: blur(10px);
font-weight: 500;
}
.btn-glass[data-v-9bf4d12a]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.btn-neon[data-v-9bf4d12a] {
padding: 0.75rem 1.5rem;
border: 1px solid;
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
gap: 0.5rem;
}
.btn-neon.neon-green[data-v-9bf4d12a] {
background: rgba(57, 255, 20, 0.2);
color: var(--neon-green);
border-color: var(--neon-green);
}
.btn-neon.neon-green[data-v-9bf4d12a]:hover:not(:disabled) {
background: var(--neon-green);
color: var(--bg-primary);
box-shadow: 0 0 20px rgba(57, 255, 20, 0.5);
transform: translateY(-2px);
}
.btn-neon[data-v-9bf4d12a]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}
.btn[data-v-9bf4d12a] {
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 0.5rem 1rem;
color: var(--text-primary);
cursor: pointer;
transition: all 0.2s ease;
font-weight: 500;
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
.btn-secondary[data-v-9bf4d12a] {
color: var(--text-secondary);
}
.btn-primary[data-v-9bf4d12a] {
background: rgba(0, 245, 255, 0.2);
color: var(--neon-blue);
border-color: var(--neon-blue);
}
.btn[data-v-9bf4d12a]:hover {
transform: translateY(-1px);
opacity: 0.9;
}
/* Icons */
.icon[data-v-9bf4d12a] {
width: 1.2em;
height: 1.2em;
}
.spinning[data-v-9bf4d12a] {
animation: spin-9bf4d12a 1s linear infinite;
}
@keyframes spin-9bf4d12a {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* Text Gradient */
.text-gradient[data-v-9bf4d12a] {
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
/* Animations */
.animate-fade-in[data-v-9bf4d12a] {
animation: fadeIn-9bf4d12a 0.3s ease-out;
}
.animate-scale-in[data-v-9bf4d12a] {
animation: scaleIn-9bf4d12a 0.3s ease-out;
}
@keyframes fadeIn-9bf4d12a {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-9bf4d12a {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.modal-content[data-v-9bf4d12a] {
width: 95vw;
max-height: 90vh;
}
.modal-header[data-v-9bf4d12a],
.modal-body[data-v-9bf4d12a],
.modal-footer[data-v-9bf4d12a] {
padding: 1rem;
}
.seat-grid[data-v-9bf4d12a] {
grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
}
.empty-cta-row[data-v-9bf4d12a] {
flex-direction: column;
}
}
.chip-inventory[data-v-f0cf51fa] {
margin: 1rem 0;
}
.chip-grid[data-v-f0cf51fa] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 1rem;
}
.chip-denomination[data-v-f0cf51fa] {
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
background: rgba(255, 255, 255, 0.05);
}
.chip-header[data-v-f0cf51fa] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.5rem;
}
.chip-color[data-v-f0cf51fa] {
width: 20px;
height: 20px;
border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.3);
}
.chip-color.chip-quarter[data-v-f0cf51fa] {
background: #FF69B4;
}
.chip-color.chip-fifty[data-v-f0cf51fa] {
background: #4169E1;
}
.chip-color.chip-white[data-v-f0cf51fa] {
background: #FFFFFF;
}
.chip-color.chip-red[data-v-f0cf51fa] {
background: #FF0000;
}
.chip-color.chip-green[data-v-f0cf51fa] {
background: #00FF00;
}
.chip-color.chip-black[data-v-f0cf51fa] {
background: #000000;
}
.chip-color.chip-orange[data-v-f0cf51fa] {
background: #FFA500;
}
.chip-value[data-v-f0cf51fa] {
margin-left: auto;
font-weight: bold;
color: var(--neon-green);
}
.chip-input-group[data-v-f0cf51fa] {
display: flex;
align-items: center;
gap: 0.5rem;
}
.chip-count[data-v-f0cf51fa] {
flex: 1;
text-align: center;
}
.chip-total[data-v-f0cf51fa] {
min-width: 60px;
text-align: right;
font-weight: bold;
color: var(--neon-blue);
}
.cash-section[data-v-f0cf51fa] {
margin-top: 1.5rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.cash-input-group[data-v-f0cf51fa] {
display: flex;
align-items: center;
gap: 1rem;
}
.cash-input-group label[data-v-f0cf51fa] {
min-width: 120px;
}
.inventory-total[data-v-f0cf51fa] {
margin-top: 1.5rem;
padding-top: 1rem;
border-top: 2px solid rgba(255, 255, 255, 0.2);
}
.total-display[data-v-f0cf51fa] {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 1.2rem;
font-weight: bold;
}
.total-amount[data-v-f0cf51fa] {
color: var(--neon-green);
font-size: 1.5rem;
}
.discrepancy-alert[data-v-f0cf51fa] {
margin-top: 1rem;
padding: 1rem;
background: rgba(255, 193, 7, 0.1);
border: 1px solid rgba(255, 193, 7, 0.3);
border-radius: 8px;
}
.alert-content[data-v-f0cf51fa] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 1rem;
}
.alert-icon[data-v-f0cf51fa] {
font-size: 1.5rem;
}
.alert-text strong[data-v-f0cf51fa] {
color: #ffc107;
}
.discrepancy-reason[data-v-f0cf51fa] {
margin-top: 1rem;
}
.discrepancy-reason label[data-v-f0cf51fa] {
display: block;
margin-bottom: 0.5rem;
font-weight: bold;
}
.signature-section[data-v-f0cf51fa] {
margin-top: 1.5rem;
}
.signature-info[data-v-f0cf51fa] {
font-style: italic;
color: rgba(255, 255, 255, 0.7);
margin-bottom: 1rem;
}
.signature-input-group[data-v-f0cf51fa] {
display: flex;
align-items: center;
gap: 1rem;
}
.signature-input-group label[data-v-f0cf51fa] {
min-width: 150px;
}
.notes-section[data-v-f0cf51fa] {
margin: 1rem 0;
}
.expected-inventory[data-v-f0cf51fa] {
margin: 1rem 0;
}
.expected-total[data-v-f0cf51fa] {
color: var(--neon-blue);
font-weight: bold;
}
.compliance-badge[data-v-f0cf51fa] {
display: flex;
gap: 0.5rem;
}
.badge.wac-compliance[data-v-f0cf51fa] {
background: linear-gradient(135deg, #2563eb, #1d4ed8);
}
.table-detail-view[data-v-003181e1] {
max-width: 1400px;
margin: 0 auto;
padding: 1rem;
position: relative;
}
.view-header[data-v-003181e1] {
margin-bottom: 2rem;
}
.header-content[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem;
}
.table-info h1[data-v-003181e1] {
margin: 0 0 1rem 0;
display: flex;
align-items: center;
gap: 0.5rem;
}
.table-meta[data-v-003181e1] {
display: flex;
gap: 1rem;
align-items: center;
}
.game-type[data-v-003181e1] {
font-size: 1.1rem;
color: var(--neon-blue);
font-weight: 500;
}
.vip-badge[data-v-003181e1] {
background: linear-gradient(135deg, var(--neon-gold), #ffd700);
color: var(--surface-dark);
padding: 0.25rem 0.75rem;
border-radius: 1rem;
font-size: 0.8rem;
font-weight: bold;
text-transform: uppercase;
}
.status-badge[data-v-003181e1] {
padding: 0.25rem 0.75rem;
border-radius: 1rem;
font-size: 0.8rem;
font-weight: bold;
text-transform: uppercase;
}
.status-open[data-v-003181e1] {
background: rgba(0, 255, 127, 0.2);
color: var(--neon-green);
border: 1px solid var(--neon-green);
}
.status-closed[data-v-003181e1] {
background: rgba(255, 69, 0, 0.2);
color: var(--neon-red);
border: 1px solid var(--neon-red);
}
.status-maintenance[data-v-003181e1] {
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
border: 1px solid var(--neon-orange);
}
.status-unknown[data-v-003181e1] {
background: rgba(128, 128, 128, 0.2);
color: var(--text-secondary);
border: 1px solid var(--text-secondary);
}
.quick-actions[data-v-003181e1] {
display: flex;
gap: 1rem;
}
.players-stats-section[data-v-003181e1] {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 2rem;
margin-bottom: 2rem;
}
.players-management[data-v-003181e1] {
padding: 2rem;
}
.players-header[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.no-players[data-v-003181e1] {
text-align: center;
padding: 3rem 1rem;
color: var(--text-secondary);
}
.empty-icon[data-v-003181e1] {
font-size: 3rem;
margin-bottom: 1rem;
opacity: 0.5;
}
.helper-actions[data-v-003181e1] {
display: grid;
grid-template-columns: repeat(3, minmax(180px, 1fr));
gap: 1rem;
justify-items: stretch;
align-items: stretch;
margin-top: 1rem;
}
.btn-tertiary[data-v-003181e1] {
background: transparent;
border: 1px dashed var(--border-color);
color: var(--text-secondary);
}
/* Touch-friendly and neon glass button tweaks */
.btn-lg[data-v-003181e1] {
padding: 0.9rem 1.25rem;
font-size: 1rem;
border-radius: 14px;
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
.btn-touch[data-v-003181e1] {
padding: 1rem 1rem;
font-size: 1rem;
border-radius: 16px;
min-height: 56px;
width: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.6rem;
}
.btn-neon .icon[data-v-003181e1] {
font-size: 1.1rem;
}
@media (max-width: 900px) {
.helper-actions[data-v-003181e1] {
grid-template-columns: 1fr;
}
}
.helper-note[data-v-003181e1] {
display: block;
margin-top: 0.5rem;
opacity: 0.8;
}
.players-list[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 1rem;
max-height: 400px;
overflow-y: auto;
}
.player-card[data-v-003181e1] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem;
background: var(--surface-light);
border: 1px solid var(--border-color);
border-radius: 0.75rem;
transition: all 0.3s ease;
}
.player-card[data-v-003181e1]:hover {
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 191, 255, 0.2);
}
.player-info[data-v-003181e1] {
display: flex;
align-items: center;
gap: 1rem;
flex: 1;
}
.player-avatar[data-v-003181e1] {
width: 48px;
height: 48px;
border-radius: 50%;
overflow: hidden;
border: 2px solid var(--border-color);
display: flex;
align-items: center;
justify-content: center;
background: var(--surface-dark);
}
.player-avatar img[data-v-003181e1] {
width: 100%;
height: 100%;
object-fit: cover;
}
.default-avatar[data-v-003181e1] {
font-size: 1.5rem;
color: var(--text-secondary);
}
.player-details[data-v-003181e1] {
flex: 1;
}
.player-name[data-v-003181e1] {
font-weight: 600;
font-size: 1rem;
margin-bottom: 0.25rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.vip-indicator[data-v-003181e1] {
background: linear-gradient(135deg, var(--neon-gold), #ffd700);
color: var(--surface-dark);
padding: 0.125rem 0.5rem;
border-radius: 0.75rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
}
.hosted-indicator[data-v-003181e1] {
background: rgba(0, 255, 150, 0.15);
color: var(--neon-green);
padding: 0.125rem 0.5rem;
border-radius: 0.75rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(0, 255, 150, 0.4);
}
.tourney-indicator[data-v-003181e1] {
background: rgba(138, 43, 226, 0.15);
color: var(--neon-purple);
padding: 0.125rem 0.5rem;
border-radius: 0.75rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(138, 43, 226, 0.4);
}
.event-indicator[data-v-003181e1] {
background: rgba(244, 114, 182, 0.15);
color: #f472b6;
padding: 0.125rem 0.5rem;
border-radius: 0.75rem;
font-size: 0.7rem;
font-weight: bold;
text-transform: uppercase;
border: 1px solid rgba(244, 114, 182, 0.4);
}
.event-color[data-v-003181e1] {
color: #f472b6;
}
.card-number[data-v-003181e1] {
font-size: 0.8rem;
color: var(--text-secondary);
font-weight: normal;
}
.player-meta[data-v-003181e1] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: 0.25rem;
}
.betting-info[data-v-003181e1] {
display: flex;
gap: 1rem;
font-size: 0.85rem;
}
.current-bet[data-v-003181e1] {
color: var(--neon-green);
font-weight: 600;
}
.session-action[data-v-003181e1] {
color: var(--neon-blue);
font-weight: 600;
}
.player-actions[data-v-003181e1] {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
align-items: stretch;
}
.player-actions .btn-touch[data-v-003181e1] {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
min-height: 48px;
min-width: 80px;
padding: 0.75rem 1rem;
font-size: 0.9rem;
font-weight: 500;
border-radius: 12px;
border: 2px solid transparent;
transition: all 0.3s ease;
cursor: pointer;
white-space: nowrap;
}
.player-actions .btn-touch[data-v-003181e1]:hover {
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.player-actions .btn-touch[data-v-003181e1]:active {
transform: translateY(0);
}
.player-actions .btn-touch .icon[data-v-003181e1] {
font-size: 1.1rem;
flex-shrink: 0;
}
.player-actions .btn-touch .btn-label[data-v-003181e1] {
font-weight: 600;
}
/* Button color variants */
.player-actions .btn-secondary[data-v-003181e1] {
background: rgba(108, 117, 125, 0.2);
color: #6c757d;
border-color: rgba(108, 117, 125, 0.3);
}
.player-actions .btn-secondary[data-v-003181e1]:hover {
background: rgba(108, 117, 125, 0.3);
border-color: #6c757d;
color: #fff;
}
.player-actions .btn-warning[data-v-003181e1] {
background: rgba(255, 193, 7, 0.2);
color: var(--neon-orange);
border-color: rgba(255, 193, 7, 0.3);
}
.player-actions .btn-warning[data-v-003181e1]:hover {
background: rgba(255, 193, 7, 0.3);
border-color: var(--neon-orange);
color: #fff;
box-shadow: 0 4px 12px rgba(255, 193, 7, 0.3);
}
.player-actions .btn-danger[data-v-003181e1] {
background: rgba(220, 53, 69, 0.2);
color: var(--neon-red);
border-color: rgba(220, 53, 69, 0.3);
}
.player-actions .btn-danger[data-v-003181e1]:hover {
background: rgba(220, 53, 69, 0.3);
border-color: var(--neon-red);
color: #fff;
box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}
/* Mobile responsiveness */
@media (max-width: 768px) {
.player-actions[data-v-003181e1] {
flex-direction: column;
width: 100%;
gap: 0.5rem;
}
.player-actions .btn-touch[data-v-003181e1] {
width: 100%;
min-height: 52px;
padding: 1rem;
font-size: 1rem;
}
}
.dealer-assignment[data-v-003181e1] {
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid var(--border-color);
}
.dealer-assignment h4[data-v-003181e1] {
margin: 0 0 1rem 0;
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-primary);
font-size: 1rem;
}
.staff-info[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.staff-member[data-v-003181e1] {
display: flex;
align-items: center;
gap: 1rem;
}
.staff-member label[data-v-003181e1] {
min-width: 60px;
font-weight: 500;
color: var(--text-secondary);
}
.staff-member select[data-v-003181e1] {
flex: 1;
padding: 0.5rem;
background: var(--surface-dark);
border: 1px solid var(--border-color);
border-radius: 0.375rem;
color: var(--text-primary);
}
.staff-member select[data-v-003181e1]:focus {
outline: none;
border-color: var(--neon-blue);
}
.table-stats[data-v-003181e1] {
padding: 2rem;
}
.stats-grid[data-v-003181e1] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
margin-top: 1rem;
}
.stat-item[data-v-003181e1] {
text-align: center;
padding: 1rem;
background: var(--surface-light);
border-radius: 0.5rem;
border: 1px solid var(--border-color);
}
.stat-value[data-v-003181e1] {
font-size: 1.5rem;
font-weight: bold;
color: var(--neon-blue);
margin-bottom: 0.5rem;
}
.stat-label[data-v-003181e1] {
font-size: 0.9rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.quick-stats[data-v-003181e1] {
margin-top: 1.5rem;
padding-top: 1.5rem;
border-top: 1px solid var(--border-color);
}
.quick-stat[data-v-003181e1] {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 0;
font-size: 0.9rem;
}
.quick-stat .icon[data-v-003181e1] {
font-size: 1.1rem;
}
.vip-color[data-v-003181e1] {
color: var(--neon-gold);
}
.hosted-color[data-v-003181e1] {
color: var(--neon-green);
}
.tourney-color[data-v-003181e1] {
color: var(--neon-purple);
}
.config-section[data-v-003181e1] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
margin-bottom: 2rem;
}
.betting-limits[data-v-003181e1],
.chip-inventory[data-v-003181e1] {
padding: 2rem;
}
.limits-header[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.limits-header h3[data-v-003181e1] {
margin: 0;
}
.limits-info[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.limits-edit-form[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.limits-edit-form .form-group[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.limits-edit-form .form-group label[data-v-003181e1] {
font-weight: 500;
color: var(--text-secondary);
font-size: 0.9rem;
}
.limits-edit-form .input-glass[data-v-003181e1] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 6px;
color: var(--text-primary);
font-size: 0.9rem;
}
.limits-edit-form .input-glass[data-v-003181e1]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.1);
}
.limits-edit-form .form-actions[data-v-003181e1] {
display: flex;
gap: 1rem;
justify-content: flex-end;
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid var(--border-color);
}
.limit-item[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: var(--surface-light);
border-radius: 0.5rem;
border: 1px solid var(--border-color);
}
.limit-item label[data-v-003181e1] {
font-weight: 500;
color: var(--text-secondary);
}
.amount[data-v-003181e1] {
font-weight: bold;
color: var(--neon-green);
}
.inventory-status[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 1rem;
margin-top: 1rem;
}
.inventory-item[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem;
background: var(--surface-light);
border-radius: 0.5rem;
border: 1px solid var(--border-color);
}
.inventory-item.needs-attention[data-v-003181e1] {
border-color: var(--neon-red);
background: rgba(255, 69, 0, 0.1);
}
.inventory-item label[data-v-003181e1] {
font-weight: 500;
color: var(--text-secondary);
}
.activity-section[data-v-003181e1] {
padding: 2rem;
}
.activity-log[data-v-003181e1] {
margin-top: 1rem;
}
.activity-item[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background: var(--surface-light);
border-radius: 0.5rem;
border: 1px solid var(--border-color);
margin-bottom: 0.5rem;
}
.activity-time[data-v-003181e1] {
font-weight: bold;
color: var(--neon-blue);
}
.activity-desc[data-v-003181e1] {
color: var(--text-secondary);
}
.loading-overlay[data-v-003181e1] {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.7);
display: flex;
align-items: center;
justify-content: center;
border-radius: 1rem;
}
.loading-spinner[data-v-003181e1] {
color: var(--neon-blue);
font-size: 1.2rem;
}
.icon[data-v-003181e1] {
width: 1.2em;
height: 1.2em;
}
h3[data-v-003181e1] {
margin: 0 0 1rem 0;
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-primary);
}
@media (max-width: 768px) {
.header-content[data-v-003181e1] {
flex-direction: column;
gap: 1rem;
text-align: center;
}
.players-stats-section[data-v-003181e1],
.config-section[data-v-003181e1] {
grid-template-columns: 1fr;
}
.stats-grid[data-v-003181e1] {
grid-template-columns: 1fr;
}
}
/* Removed old Add Player Modal styles - now handled by AddPlayerModal.vue component */
/* Scan ID Modal Styles */
.modal-header[data-v-003181e1] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem 2rem 1rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-003181e1] {
margin: 0;
font-size: 1.5rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.75rem;
}
.modal-header .icon[data-v-003181e1] {
font-size: 1.25rem;
}
.btn-close[data-v-003181e1] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 50%;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
}
.btn-close[data-v-003181e1]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
transform: scale(1.1);
}
.modal-body[data-v-003181e1] {
padding: 1.5rem 2rem;
}
.modal-body p[data-v-003181e1] {
color: var(--text-secondary);
margin-bottom: 1.5rem;
line-height: 1.6;
}
.modal-footer[data-v-003181e1] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1rem 2rem 2rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-footer .btn-glass[data-v-003181e1],
.modal-footer .btn-neon[data-v-003181e1] {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1.5rem;
font-size: 0.95rem;
font-weight: 500;
border-radius: 12px;
transition: all 0.3s ease;
}
.modal-footer .btn-glass[data-v-003181e1] {
background: rgba(255, 255, 255, 0.05);
color: var(--text-secondary);
border: 1px solid rgba(255, 255, 255, 0.15);
}
.modal-footer .btn-glass[data-v-003181e1]:hover {
background: rgba(255, 255, 255, 0.1);
color: var(--text-primary);
transform: translateY(-1px);
}
.modal-footer .btn-neon[data-v-003181e1] {
background: rgba(0, 245, 255, 0.1);
color: var(--neon-blue);
border: 2px solid var(--neon-blue);
position: relative;
overflow: hidden;
}
.modal-footer .btn-neon[data-v-003181e1]:hover {
background: rgba(0, 245, 255, 0.2);
box-shadow: 0 0 20px rgba(0, 245, 255, 0.3);
transform: translateY(-1px);
}
.modal-footer .btn-neon[data-v-003181e1]:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.scan-input[data-v-003181e1] {
width: 100%;
font-size: 1rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
transition: all 0.3s ease;
}
.scan-input[data-v-003181e1]:focus {
outline: none;
border-color: var(--neon-blue);
background: rgba(255, 255, 255, 0.08);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.2);
}
.input-help[data-v-003181e1] {
display: block;
margin-top: 0.5rem;
color: var(--text-secondary);
font-size: 0.85rem;
opacity: 0.8;
}
/* Player Tier Display */
.player-tier-display[data-v-003181e1] {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-top: 0.5rem;
}
.tier-value[data-v-003181e1] {
padding: 0.25rem 0.75rem;
border-radius: 8px;
font-weight: 600;
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.5px;
display: inline-block;
text-shadow: 0 0 8px currentColor;
width: fit-content;
}
.tier-value.tier-diamond[data-v-003181e1] {
background: linear-gradient(135deg, #4A90E2, #357ABD);
color: white;
border: 1px solid rgba(74, 144, 226, 0.5);
box-shadow: 0 0 12px rgba(74, 144, 226, 0.3);
}
.tier-value.tier-platinum[data-v-003181e1] {
background: linear-gradient(135deg, #E8E8E8, #C0C0C0);
color: #333;
border: 1px solid rgba(232, 232, 232, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-gold[data-v-003181e1] {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #333;
border: 1px solid rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.tier-value.tier-silver[data-v-003181e1] {
background: linear-gradient(135deg, #C0C0C0, #A8A8A8);
color: #333;
border: 1px solid rgba(192, 192, 192, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-bronze[data-v-003181e1] {
background: linear-gradient(135deg, #CD7F32, #B8860B);
color: white;
border: 1px solid rgba(205, 127, 50, 0.5);
box-shadow: 0 0 12px rgba(205, 127, 50, 0.3);
}
.tier-value.tier-tier-1[data-v-003181e1] {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #333;
border: 1px solid rgba(255, 215, 0, 0.5);
box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.tier-value.tier-tier-2[data-v-003181e1] {
background: linear-gradient(135deg, #C0C0C0, #A8A8A8);
color: #333;
border: 1px solid rgba(192, 192, 192, 0.5);
box-shadow: 0 0 12px rgba(192, 192, 192, 0.3);
}
.tier-value.tier-tier-3[data-v-003181e1] {
background: linear-gradient(135deg, #CD7F32, #B8860B);
color: white;
border: 1px solid rgba(205, 127, 50, 0.5);
box-shadow: 0 0 12px rgba(205, 127, 50, 0.3);
}
.match-play-indicator[data-v-003181e1] {
display: inline-flex;
align-items: center;
padding: 0.35rem 0.75rem;
border-radius: 6px;
font-size: 0.8rem;
font-weight: 600;
background: rgba(0, 255, 150, 0.1);
border: 1px solid rgba(0, 255, 150, 0.3);
color: var(--neon-green);
box-shadow: 0 0 8px rgba(0, 255, 150, 0.2);
cursor: help;
max-width: fit-content;
white-space: nowrap;
}
.tables-view[data-v-25f0dc74] {
max-width: 1400px;
margin: 0 auto;
padding: 1rem;
}
.view-header[data-v-25f0dc74] {
padding: 2rem;
text-align: center;
margin-bottom: 2rem;
}
/* Table Stats */
.table-stats[data-v-25f0dc74] {
margin-bottom: 2rem;
}
.stats-grid[data-v-25f0dc74] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.stat-card[data-v-25f0dc74] {
display: flex;
align-items: center;
padding: 1.5rem;
gap: 1rem;
}
.stat-icon[data-v-25f0dc74] {
font-size: 2rem;
padding: 0.8rem;
border-radius: 12px;
background: rgba(255, 255, 255, 0.1);
}
.stat-info[data-v-25f0dc74] {
flex: 1;
}
.stat-value[data-v-25f0dc74] {
font-size: 1.8rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.stat-label[data-v-25f0dc74] {
font-size: 0.9rem;
color: var(--text-secondary);
opacity: 0.8;
}
/* Table Filters */
.table-filters[data-v-25f0dc74] {
display: flex;
align-items: end;
gap: 1.5rem;
padding: 1.5rem 2rem;
margin-bottom: 2rem;
flex-wrap: wrap;
}
.filter-group[data-v-25f0dc74] {
display: flex;
flex-direction: column;
gap: 0.5rem;
min-width: 150px;
}
.filter-group label[data-v-25f0dc74] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.input-glass[data-v-25f0dc74] {
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
.input-glass[data-v-25f0dc74]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
.filter-actions[data-v-25f0dc74] {
display: flex;
gap: 1rem;
margin-left: auto;
}
.btn-icon[data-v-25f0dc74] {
margin-right: 0.5rem;
}
/* Tables Grid */
.tables-grid[data-v-25f0dc74] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
gap: 1.5rem;
}
.table-card[data-v-25f0dc74] {
padding: 1.5rem;
transition: all 0.3s ease;
cursor: pointer;
position: relative;
overflow: hidden;
}
.table-card[data-v-25f0dc74]:hover {
transform: translateY(-2px);
box-shadow: 0 15px 30px rgba(0, 150, 255, 0.1);
}
.table-card.active[data-v-25f0dc74] {
border-left: 4px solid var(--neon-green);
}
.table-card.closed[data-v-25f0dc74] {
border-left: 4px solid var(--neon-red);
opacity: 0.7;
}
.table-card.maintenance[data-v-25f0dc74] {
border-left: 4px solid var(--neon-orange);
opacity: 0.8;
}
/* Table Header */
.table-header[data-v-25f0dc74] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.table-info[data-v-25f0dc74] {
flex: 1;
}
.table-name[data-v-25f0dc74] {
font-size: 1.4rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.table-game[data-v-25f0dc74] {
font-size: 0.9rem;
color: var(--text-secondary);
opacity: 0.8;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.table-status[data-v-25f0dc74] {
padding: 0.4rem 0.8rem;
border-radius: 20px;
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
display: flex;
align-items: center;
gap: 0.25rem;
}
.table-status.active[data-v-25f0dc74] {
background: rgba(0, 255, 150, 0.2);
color: var(--neon-green);
border: 1px solid var(--neon-green);
}
.table-status.closed[data-v-25f0dc74] {
background: rgba(255, 100, 100, 0.2);
color: var(--neon-red);
border: 1px solid var(--neon-red);
}
.table-status.maintenance[data-v-25f0dc74] {
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
border: 1px solid var(--neon-orange);
}
/* Table Metrics */
.table-metrics[data-v-25f0dc74] {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
margin-bottom: 1.5rem;
}
.metric[data-v-25f0dc74] {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
.metric-label[data-v-25f0dc74] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.8;
}
.metric-value[data-v-25f0dc74] {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
}
.speed-rating[data-v-25f0dc74] {
font-size: 1rem !important;
}
.speed-stars[data-v-25f0dc74] {
display: flex;
gap: 0.125rem;
}
.speed-star[data-v-25f0dc74] {
font-size: 0.8rem;
opacity: 0.3;
transition: all 0.3s ease;
}
.speed-star.active[data-v-25f0dc74] {
opacity: 1;
color: var(--neon-orange);
text-shadow: 0 0 5px rgba(255, 165, 0, 0.5);
}
/* Dealer Info */
.dealer-info[data-v-25f0dc74] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 10px;
margin-bottom: 1rem;
}
.dealer-avatar[data-v-25f0dc74] {
width: 40px;
height: 40px;
border-radius: 50%;
background: linear-gradient(135deg, var(--neon-blue), var(--neon-purple));
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: 600;
font-size: 1rem;
}
.dealer-details[data-v-25f0dc74] {
flex: 1;
}
.dealer-name[data-v-25f0dc74] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.dealer-shift[data-v-25f0dc74] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.8;
}
.no-dealer[data-v-25f0dc74] {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 10px;
margin-bottom: 1rem;
border: 1px dashed rgba(255, 255, 255, 0.2);
}
.no-dealer-text[data-v-25f0dc74] {
color: var(--text-secondary);
opacity: 0.7;
font-style: italic;
}
/* Table Actions */
.table-actions[data-v-25f0dc74] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-small[data-v-25f0dc74] {
padding: 0.4rem 0.8rem;
font-size: 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.2);
background: rgba(255, 255, 255, 0.05);
color: var(--text-primary);
border-radius: 6px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 0.25rem;
}
.btn-small[data-v-25f0dc74]:hover {
background: rgba(255, 255, 255, 0.1);
}
.btn-view[data-v-25f0dc74] {
border-color: var(--neon-blue);
color: var(--neon-blue);
}
.btn-view[data-v-25f0dc74]:hover {
background: rgba(0, 150, 255, 0.1);
}
.btn-edit[data-v-25f0dc74] {
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.btn-edit[data-v-25f0dc74]:hover {
background: rgba(255, 165, 0, 0.1);
}
.btn-open[data-v-25f0dc74] {
border-color: var(--neon-green);
color: var(--neon-green);
}
.btn-open[data-v-25f0dc74]:hover {
background: rgba(0, 255, 150, 0.1);
}
.btn-close[data-v-25f0dc74] {
border-color: var(--neon-red);
color: var(--neon-red);
}
.btn-close[data-v-25f0dc74]:hover {
background: rgba(255, 100, 100, 0.1);
}
.btn-change[data-v-25f0dc74],
.btn-assign[data-v-25f0dc74] {
border-color: var(--neon-purple);
color: var(--neon-purple);
}
.btn-change[data-v-25f0dc74]:hover,
.btn-assign[data-v-25f0dc74]:hover {
background: rgba(147, 51, 234, 0.1);
}
.btn-stash[data-v-25f0dc74] {
border-color: var(--neon-orange);
color: var(--neon-orange);
}
.btn-stash[data-v-25f0dc74]:hover {
background: rgba(255, 165, 0, 0.1);
}
.btn-unstash[data-v-25f0dc74] {
border-color: var(--neon-green);
color: var(--neon-green);
}
.btn-unstash[data-v-25f0dc74]:hover {
background: rgba(57, 255, 20, 0.1);
}
.btn-stash-active[data-v-25f0dc74] {
border-color: var(--neon-orange);
color: var(--neon-orange);
background: rgba(255, 165, 0, 0.1);
}
.stash-badge[data-v-25f0dc74] {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 20px;
height: 20px;
padding: 0 6px;
margin-left: 6px;
border-radius: 10px;
background: var(--neon-orange);
color: #000;
font-size: 0.75rem;
font-weight: 700;
}
.stash-info[data-v-25f0dc74] {
background: rgba(255, 255, 255, 0.05);
border-radius: 6px;
padding: 1rem;
margin-top: 1rem;
}
.stash-info p[data-v-25f0dc74] {
margin: 0.25rem 0;
color: var(--text-secondary);
}
.info-text[data-v-25f0dc74] {
color: var(--text-secondary);
opacity: 0.8;
font-size: 0.9rem;
}
/* Stashed table card treatment */
.table-card.stashed[data-v-25f0dc74] {
border-left: 4px dashed var(--neon-orange);
opacity: 0.75;
}
.stashed-status[data-v-25f0dc74] {
background: rgba(255, 165, 0, 0.2);
color: var(--neon-orange);
border: 1px solid var(--neon-orange);
}
/* Modal Styles */
.modal-overlay[data-v-25f0dc74] {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.modal-content[data-v-25f0dc74] {
background: rgba(20, 25, 35, 0.95);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
max-width: 600px;
width: 90%;
max-height: 90vh;
overflow-y: auto;
backdrop-filter: blur(20px);
}
.modal-header[data-v-25f0dc74] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.5rem 2rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.modal-header h2[data-v-25f0dc74] {
margin: 0;
}
.btn-close[data-v-25f0dc74] {
background: none;
border: none;
color: var(--text-secondary);
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.3s ease;
}
.btn-close[data-v-25f0dc74]:hover {
color: var(--text-primary);
background: rgba(255, 255, 255, 0.1);
}
.modal-body[data-v-25f0dc74] {
padding: 2rem;
}
.modal-footer[data-v-25f0dc74] {
display: flex;
justify-content: flex-end;
gap: 1rem;
padding: 1.5rem 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
/* Form Styles */
.form-grid[data-v-25f0dc74] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}
.form-group[data-v-25f0dc74] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label[data-v-25f0dc74] {
color: var(--text-primary);
font-weight: 500;
font-size: 0.9rem;
}
.input-glass[data-v-25f0dc74]::placeholder {
color: var(--text-secondary);
opacity: 0.6;
}
/* Sign Display — Supervisor Controls */
.sign-controls-section[data-v-25f0dc74] {
border-top: 1px solid rgba(255, 255, 255, 0.1);
padding-top: 1.5rem;
}
.sign-controls-section h4[data-v-25f0dc74] {
color: var(--text-primary);
margin-bottom: 1rem;
}
.char-counter[data-v-25f0dc74] {
float: right;
font-size: 0.8rem;
color: var(--text-secondary);
font-weight: 400;
}
.rules-textarea[data-v-25f0dc74] {
width: 100%;
resize: vertical;
font-family: inherit;
font-size: 0.9rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-primary);
}
.rules-textarea[data-v-25f0dc74]:focus {
outline: none;
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.3);
}
.bonus-bet-row[data-v-25f0dc74] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.5rem;
flex-wrap: wrap;
}
.bonus-label[data-v-25f0dc74] {
flex: 2;
min-width: 120px;
}
.bonus-minmax[data-v-25f0dc74] {
flex: 1;
min-width: 70px;
}
.btn-remove-bonus[data-v-25f0dc74] {
background: rgba(255, 7, 58, 0.1);
border: 1px solid rgba(255, 7, 58, 0.3);
color: var(--neon-red);
width: 28px;
height: 28px;
border-radius: 6px;
cursor: pointer;
font-size: 1.1rem;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
transition: all 0.2s ease;
}
.btn-remove-bonus[data-v-25f0dc74]:hover {
background: rgba(255, 7, 58, 0.25);
}
.btn-add-bonus[data-v-25f0dc74] {
margin-top: 0.25rem;
font-size: 0.85rem;
padding: 0.4rem 0.8rem;
}
.field-error[data-v-25f0dc74] {
color: var(--neon-red);
font-size: 0.8rem;
margin-top: 0.25rem;
display: block;
}
.bonus-error[data-v-25f0dc74] {
width: 100%;
}
/* Dealer Assignment */
.table-assignment-info[data-v-25f0dc74] {
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 10px;
margin-bottom: 2rem;
}
.table-assignment-info h4[data-v-25f0dc74] {
color: var(--text-primary);
margin-bottom: 0.5rem;
}
.table-assignment-info p[data-v-25f0dc74] {
color: var(--text-secondary);
margin: 0;
}
.available-dealers h4[data-v-25f0dc74] {
color: var(--text-primary);
margin-bottom: 1rem;
}
.dealer-list[data-v-25f0dc74] {
display: flex;
flex-direction: column;
gap: 0.75rem;
max-height: 300px;
overflow-y: auto;
}
.dealer-option[data-v-25f0dc74] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
}
.dealer-option[data-v-25f0dc74]:hover {
background: rgba(255, 255, 255, 0.05);
border-color: var(--neon-blue);
}
.dealer-option.selected[data-v-25f0dc74] {
background: rgba(0, 150, 255, 0.1);
border-color: var(--neon-blue);
box-shadow: 0 0 10px rgba(0, 150, 255, 0.2);
}
.dealer-option .dealer-info[data-v-25f0dc74] {
flex: 1;
}
.dealer-option .dealer-name[data-v-25f0dc74] {
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.25rem;
}
.dealer-experience[data-v-25f0dc74],
.dealer-games[data-v-25f0dc74] {
font-size: 0.8rem;
color: var(--text-secondary);
opacity: 0.8;
}
.dealer-status[data-v-25f0dc74] {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.8rem;
color: var(--neon-green);
}
.status-dot[data-v-25f0dc74] {
width: 8px;
height: 8px;
border-radius: 50%;
}
.status-dot.available[data-v-25f0dc74] {
background: var(--neon-green);
box-shadow: 0 0 4px var(--neon-green);
}
/* Animations */
.animate-fade-in[data-v-25f0dc74] {
animation: fadeIn-25f0dc74 0.3s ease-out;
}
.animate-scale-in[data-v-25f0dc74] {
animation: scaleIn-25f0dc74 0.3s ease-out;
}
@keyframes fadeIn-25f0dc74 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn-25f0dc74 {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
/* Responsive Design */
@media (max-width: 768px) {
.table-filters[data-v-25f0dc74] {
flex-direction: column;
align-items: stretch;
}
.filter-actions[data-v-25f0dc74] {
margin-left: 0;
justify-content: center;
}
.tables-grid[data-v-25f0dc74] {
grid-template-columns: 1fr;
}
.table-metrics[data-v-25f0dc74] {
grid-template-columns: 1fr;
}
.table-actions[data-v-25f0dc74] {
justify-content: center;
}
.form-grid[data-v-25f0dc74] {
grid-template-columns: 1fr;
}
.dealer-option[data-v-25f0dc74] {
flex-direction: column;
text-align: center;
}
}
.threejs-test-view[data-v-2d3c7ec7] {
padding: 2rem;
max-width: 1400px;
margin: 0 auto;
}
.breadcrumb-nav[data-v-2d3c7ec7] {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 1.5rem;
font-size: 0.9rem;
}
.breadcrumb-link[data-v-2d3c7ec7] {
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--text-secondary);
text-decoration: none;
transition: color 0.2s ease;
}
.breadcrumb-link[data-v-2d3c7ec7]:hover {
color: var(--neon-blue);
}
.breadcrumb-separator[data-v-2d3c7ec7] {
color: var(--text-secondary);
opacity: 0.5;
}
.breadcrumb-current[data-v-2d3c7ec7] {
color: var(--text-primary);
font-weight: 500;
}
.view-header[data-v-2d3c7ec7] {
padding: 2rem;
margin-bottom: 2rem;
text-align: center;
}
.view-header h1[data-v-2d3c7ec7] {
margin-bottom: 0.5rem;
}
.view-header p[data-v-2d3c7ec7] {
color: var(--text-secondary);
font-size: 1.1rem;
}
.card-glass[data-v-2d3c7ec7] {
background: rgba(255, 255, 255, 0.05);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 16px;
padding: 2rem;
margin-bottom: 2rem;
}
.test-status[data-v-2d3c7ec7] {
padding: 1.5rem;
}
.status-grid[data-v-2d3c7ec7] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1.5rem;
}
.status-item[data-v-2d3c7ec7] {
text-align: center;
}
.status-label[data-v-2d3c7ec7] {
font-size: 0.85rem;
color: var(--text-secondary);
margin-bottom: 0.5rem;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.status-value[data-v-2d3c7ec7] {
font-size: 1.2rem;
font-weight: 600;
color: var(--text-primary);
}
.status-value.success[data-v-2d3c7ec7] {
color: #00ff88;
}
.status-value.error[data-v-2d3c7ec7] {
color: #ff6464;
}
.scene-container[data-v-2d3c7ec7] {
padding: 1.5rem;
}
.scene-header[data-v-2d3c7ec7] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.scene-header h2[data-v-2d3c7ec7] {
margin: 0;
color: var(--text-primary);
}
.scene-controls[data-v-2d3c7ec7] {
display: flex;
gap: 1rem;
}
.btn-glass[data-v-2d3c7ec7] {
padding: 0.75rem 1.5rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-size: 0.9rem;
}
.btn-glass[data-v-2d3c7ec7]:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(0, 255, 255, 0.4);
}
.scene-wrapper[data-v-2d3c7ec7] {
height: 600px;
border-radius: 12px;
overflow: hidden;
margin-bottom: 1rem;
}
.scene-footer[data-v-2d3c7ec7] {
text-align: center;
}
.scene-note[data-v-2d3c7ec7] {
color: var(--text-secondary);
font-size: 0.9rem;
margin: 0;
}
.test-results h2[data-v-2d3c7ec7] {
margin-bottom: 1.5rem;
color: var(--text-primary);
}
.results-grid[data-v-2d3c7ec7] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}
.result-item[data-v-2d3c7ec7] {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
transition: all 0.3s ease;
}
.result-item.result-pass[data-v-2d3c7ec7] {
border-color: rgba(0, 255, 136, 0.4);
background: rgba(0, 255, 136, 0.05);
}
.result-item.result-pending[data-v-2d3c7ec7] {
border-color: rgba(255, 200, 0, 0.4);
background: rgba(255, 200, 0, 0.05);
}
.result-icon[data-v-2d3c7ec7] {
font-size: 1.5rem;
}
.result-text[data-v-2d3c7ec7] {
font-size: 1rem;
color: var(--text-primary);
}
.error-message[data-v-2d3c7ec7] {
padding: 1.5rem;
background: rgba(255, 100, 100, 0.1);
border: 1px solid rgba(255, 100, 100, 0.3);
border-radius: 8px;
margin-top: 1rem;
}
.error-message h3[data-v-2d3c7ec7] {
color: #ff6464;
margin-bottom: 1rem;
}
.error-message pre[data-v-2d3c7ec7] {
color: #ff6464;
font-family: monospace;
font-size: 0.9rem;
white-space: pre-wrap;
word-wrap: break-word;
}
.success-message[data-v-2d3c7ec7] {
padding: 1.5rem;
background: rgba(0, 255, 136, 0.1);
border: 1px solid rgba(0, 255, 136, 0.3);
border-radius: 8px;
margin-top: 1rem;
}
.success-message h3[data-v-2d3c7ec7] {
color: #00ff88;
margin-bottom: 0.5rem;
}
.success-message p[data-v-2d3c7ec7] {
color: var(--text-primary);
margin: 0;
}
.next-steps h2[data-v-2d3c7ec7] {
margin-bottom: 1.5rem;
color: var(--text-primary);
}
.steps-list[data-v-2d3c7ec7] {
list-style: none;
padding: 0;
margin: 0;
}
.steps-list li[data-v-2d3c7ec7] {
padding: 1rem;
margin-bottom: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 8px;
color: var(--text-secondary);
transition: all 0.3s ease;
}
.steps-list li.step-complete[data-v-2d3c7ec7] {
border-color: rgba(0, 255, 136, 0.4);
background: rgba(0, 255, 136, 0.05);
color: var(--text-primary);
}
.steps-list li strong[data-v-2d3c7ec7] {
color: var(--text-primary);
display: block;
margin-bottom: 0.25rem;
}
.text-gradient[data-v-2d3c7ec7] {
background: linear-gradient(135deg, #00ffff, #ff00ff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.tis-management[data-v-3ad056da] {
padding: 2rem;
max-width: 1400px;
margin: 0 auto;
}
.page-header[data-v-3ad056da] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 2rem;
gap: 2rem;
}
.header-content h1[data-v-3ad056da] {
margin-bottom: 0.5rem;
}
.page-subtitle[data-v-3ad056da] {
color: rgba(255, 255, 255, 0.7);
margin: 0;
}
.filters-section[data-v-3ad056da] {
margin-bottom: 2rem;
}
.filters-grid[data-v-3ad056da] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
padding: 1.5rem;
background: rgba(255, 255, 255, 0.05);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.filter-group[data-v-3ad056da] {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.filter-group label[data-v-3ad056da] {
font-weight: 500;
color: rgba(255, 255, 255, 0.8);
}
.tis-grid[data-v-3ad056da] {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
gap: 1.5rem;
}
.tis-card[data-v-3ad056da] {
padding: 1.5rem;
cursor: pointer;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.tis-card[data-v-3ad056da]:hover {
border-color: var(--neon-blue);
box-shadow: 0 8px 32px rgba(99, 102, 241, 0.2);
}
.tis-header[data-v-3ad056da] {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 1rem;
}
.tis-info h3[data-v-3ad056da] {
margin: 0 0 0.5rem 0;
color: var(--neon-blue);
}
.tis-meta[data-v-3ad056da] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.table-name[data-v-3ad056da],
.shift-info[data-v-3ad056da] {
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.7);
}
.tis-type[data-v-3ad056da] {
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-size: 0.8rem;
font-weight: bold;
}
.tis-type.opening[data-v-3ad056da] {
background: rgba(34, 197, 94, 0.2);
color: #22c55e;
}
.tis-type.closing[data-v-3ad056da] {
background: rgba(251, 146, 60, 0.2);
color: #fb923c;
}
.status-badge[data-v-3ad056da] {
padding: 0.25rem 0.75rem;
border-radius: 20px;
font-size: 0.8rem;
font-weight: bold;
}
.status-draft[data-v-3ad056da] {
background: rgba(156, 163, 175, 0.2);
color: #9ca3af;
}
.status-pending[data-v-3ad056da] {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
.status-completed[data-v-3ad056da] {
background: rgba(34, 197, 94, 0.2);
color: #22c55e;
}
.status-discrepancy[data-v-3ad056da] {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.status-voided[data-v-3ad056da] {
background: rgba(107, 114, 128, 0.2);
color: #6b7280;
}
.inventory-summary[data-v-3ad056da] {
margin-bottom: 1rem;
}
.inventory-item[data-v-3ad056da] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5rem;
}
.inventory-item label[data-v-3ad056da] {
color: rgba(255, 255, 255, 0.7);
}
.amount[data-v-3ad056da] {
font-weight: bold;
color: var(--neon-green);
}
.inventory-item.discrepancy .amount[data-v-3ad056da] {
color: #ef4444;
}
.signature-status[data-v-3ad056da] {
margin-bottom: 1rem;
}
.signature-item[data-v-3ad056da] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.25rem;
}
.signature-role[data-v-3ad056da] {
color: rgba(255, 255, 255, 0.7);
font-size: 0.9rem;
}
.signature-status.signed[data-v-3ad056da] {
color: var(--neon-green);
}
.signature-status[data-v-3ad056da]:not(.signed) {
color: rgba(255, 255, 255, 0.5);
}
.tis-timestamp[data-v-3ad056da] {
font-size: 0.8rem;
color: rgba(255, 255, 255, 0.5);
margin-bottom: 1rem;
}
.tis-actions[data-v-3ad056da] {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.btn-sm[data-v-3ad056da] {
padding: 0.5rem 1rem;
font-size: 0.8rem;
}
.empty-state[data-v-3ad056da] {
text-align: center;
padding: 4rem 2rem;
color: rgba(255, 255, 255, 0.7);
}
.empty-icon[data-v-3ad056da] {
font-size: 4rem;
margin-bottom: 1rem;
}
.empty-state h3[data-v-3ad056da] {
margin-bottom: 0.5rem;
color: rgba(255, 255, 255, 0.9);
}
.loading-state[data-v-3ad056da] {
text-align: center;
padding: 4rem 2rem;
color: rgba(255, 255, 255, 0.7);
}
.loading-spinner[data-v-3ad056da] {
width: 40px;
height: 40px;
border: 4px solid rgba(255, 255, 255, 0.1);
border-left: 4px solid var(--neon-blue);
border-radius: 50%;
animation: spin-3ad056da 1s linear infinite;
margin: 0 auto 1rem auto;
}
@keyframes spin-3ad056da {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* Global Styles for IPC-PitBoss Casino Management */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
font-size: 16px;
scroll-behavior: smooth;
}
body {
font-family: 'Inter', 'Segoe UI', 'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
background: linear-gradient(135deg, #0a0a0b 0%, #1a1a1e 50%, #2a2a32 100%);
color: var(--text-primary);
min-height: 100vh;
overflow-x: hidden;
line-height: 1.6;
}
/* Print defaults */
@media print {
body {
background: #fff !important;
color: #000 !important;
}
/* Hide global app chrome */
.app-header, .nav-glass, .nav-menu, .nav-user, .breadcrumb-nav, .ToastNotification, .app-loading, .app-welcome { display: none !important; }
/* Remove extra paddings for print area */
.app-main { padding: 0 !important; }
}
/* Background Pattern */
body::before {
content: '';
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image:
radial-gradient(circle at 25% 25%, rgba(0, 245, 255, 0.1) 0%, transparent 50%),
radial-gradient(circle at 75% 75%, rgba(138, 43, 226, 0.1) 0%, transparent 50%);
pointer-events: none;
z-index: -1;
}
/* Typography */
h1, h2, h3, h4, h5, h6 {
font-weight: 600;
line-height: 1.2;
margin-bottom: 0.5em;
}
h1 { font-size: 1.75rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }
p {
margin-bottom: 1em;
color: var(--text-secondary);
}
/* Links */
a {
color: var(--neon-blue);
text-decoration: none;
transition: color 0.3s ease;
}
a:hover {
color: var(--neon-purple);
}
/* Scrollbar Styling */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.05);
border-radius: 4px;
}
::-webkit-scrollbar-thumb {
background: rgba(0, 245, 255, 0.3);
border-radius: 4px;
transition: background 0.3s ease;
}
::-webkit-scrollbar-thumb:hover {
background: rgba(0, 245, 255, 0.5);
}
/* Selection */
::selection {
background: rgba(0, 245, 255, 0.3);
color: var(--text-primary);
}
/* Focus Styles */
:focus {
outline: 2px solid var(--neon-blue);
outline-offset: 2px;
}
/* Form Elements */
input, textarea, select, button {
font-family: inherit;
font-size: inherit;
}
/* Select/Dropdown Styling */
select {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
padding: 12px 16px;
color: var(--text-primary);
outline: none;
transition: all 0.3s ease;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23ffffff' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 12px center;
background-size: 12px;
padding-right: 40px;
}
select:focus {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.3);
}
select:hover {
background: rgba(255, 255, 255, 0.06);
border-color: rgba(255, 255, 255, 0.15);
}
/* Select Options - using higher specificity */
select option,
.filter-select option,
.input-glass option {
background: var(--bg-secondary) !important;
color: var(--text-primary) !important;
padding: 8px 12px;
border: none;
}
select option:hover,
.filter-select option:hover,
.input-glass option:hover {
background: rgba(0, 245, 255, 0.1) !important;
color: var(--text-primary) !important;
}
select option:checked,
.filter-select option:checked,
.input-glass option:checked {
background: var(--bg-tertiary) !important;
color: var(--neon-blue) !important;
}
/* Fix for webkit browsers */
select option:not(:checked),
.filter-select option:not(:checked),
.input-glass option:not(:checked) {
background: var(--bg-secondary) !important;
color: var(--text-primary) !important;
}
/* Multi-select styling */
select[multiple] {
min-height: 120px;
padding: 8px;
}
select[multiple] option {
padding: 6px 8px;
margin: 2px 0;
border-radius: 4px;
}
select[multiple] option:hover {
background: rgba(0, 245, 255, 0.2);
}
select[multiple] option:checked {
background: var(--neon-blue);
color: var(--bg-primary);
}
button {
cursor: pointer;
border: none;
background: none;
}
button:disabled {
opacity: 0.6;
cursor: not-allowed;
}
/* Loading States */
.loading {
position: relative;
pointer-events: none;
}
.loading::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 20px;
height: 20px;
margin: -10px 0 0 -10px;
border: 2px solid var(--glass-border);
border-top: 2px solid var(--neon-blue);
border-radius: 50%;
animation: spin 1s linear infinite;
}
/* Layout Utilities */
.container {
max-width: 1400px;
margin: 0 auto;
padding: 0 20px;
}
.flex {
display: flex;
}
.flex-col {
flex-direction: column;
}
.items-center {
align-items: center;
}
.justify-center {
justify-content: center;
}
.justify-between {
justify-content: space-between;
}
.grid {
display: grid;
}
.gap-4 {
gap: 1rem;
}
.gap-6 {
gap: 1.5rem;
}
.gap-8 {
gap: 2rem;
}
/* Breadcrumbs (shared) */
.breadcrumb-nav {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1.5rem;
padding: 0.75rem;
background: rgba(255, 255, 255, 0.03);
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.breadcrumb-link {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
border-radius: 6px;
text-decoration: none;
color: var(--text-secondary);
transition: all 0.3s ease;
background: rgba(255, 255, 255, 0.05);
}
.breadcrumb-link:hover {
color: var(--neon-blue);
background: rgba(0, 245, 255, 0.1);
transform: translateY(-1px);
}
.breadcrumb-icon {
font-size: 1rem;
}
.breadcrumb-text {
font-size: 0.9rem;
font-weight: 500;
}
.breadcrumb-separator {
color: var(--text-muted);
font-size: 1.2rem;
font-weight: 300;
}
.breadcrumb-current {
color: var(--text-primary);
font-weight: 600;
font-size: 0.95rem;
}
/* Spacing */
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.m-4 { margin: 1rem; }
.m-6 { margin: 1.5rem; }
.m-8 { margin: 2rem; }
.mt-4 { margin-top: 1rem; }
.mb-4 { margin-bottom: 1rem; }
.ml-4 { margin-left: 1rem; }
.mr-4 { margin-right: 1rem; }
/* Text Utilities */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }
.text-sm { font-size: 0.875rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
/* Visibility */
.hidden { display: none !important; }
.invisible { visibility: hidden; }
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
/* Responsive */
@media (max-width: 768px) {
body {
font-size: 14px;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.375rem; }
.container {
padding: 0 16px;
}
}
/* Activity Feed (shared) */
.activity-container {
padding: 1.5rem;
}
.activity-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
padding-bottom: 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.activity-header h3 {
margin: 0;
color: var(--text-primary);
}
.activity-feed {
display: flex;
flex-direction: column;
gap: 1rem;
}
.activity-item {
display: flex;
align-items: center;
gap: 1rem;
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
border-radius: 12px;
transition: background 0.3s ease;
}
.activity-item:hover {
background: rgba(255, 255, 255, 0.05);
}
.activity-icon {
font-size: 1.5rem;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
flex-shrink: 0;
}
/* Icon backgrounds by type */
.activity-icon.player-join { background: rgba(0, 245, 255, 0.1); }
.activity-icon.big-win { background: rgba(57, 255, 20, 0.1); }
.activity-icon.big-loss { background: rgba(255, 7, 58, 0.12); }
.activity-icon.comp-issued { background: rgba(138, 43, 226, 0.1); }
.activity-icon.table-open { background: rgba(255, 102, 0, 0.1); }
.activity-icon.alert { background: rgba(255, 7, 58, 0.1); }
.activity-icon.buy-in { background: rgba(0, 245, 255, 0.12); }
.activity-icon.cash-out { background: rgba(255, 165, 0, 0.12); }
.activity-icon.fill-slip { background: rgba(255, 215, 0, 0.12); }
.activity-content { flex: 1; }
.activity-message { color: var(--text-primary); margin-bottom: 0.25rem; }
.activity-meta { display: flex; gap: 1rem; font-size: 0.875rem; color: var(--text-muted); }
.activity-amount { font-weight: 600; font-size: 1.1rem; flex-shrink: 0; }
.activity-amount.win { color: var(--neon-green); }
.activity-amount.loss,
.activity-amount.cash-out { color: var(--neon-red); }
.activity-amount.buy-in { color: var(--neon-blue); }
.activity-amount.comp { color: var(--neon-purple); }
/* Item accents (left border) */
.activity-item.is-big-win { border-left: 2px solid var(--neon-green); }
.activity-item.is-big-loss { border-left: 2px solid var(--neon-red); }
.activity-item.is-buy-in { border-left: 2px solid var(--neon-blue); }
.activity-item.is-cash-out { border-left: 2px solid var(--neon-orange); }
.activity-item.is-comp-issued { border-left: 2px solid var(--neon-purple); }
.activity-item.is-fill-slip { border-left: 2px solid #FFD700; }
.activity-item.is-session-end { border-left: 2px solid rgba(255, 255, 255, 0.2); }
/* Badges */
.activity-badge {
font-size: 0.7rem;
padding: 0.15rem 0.5rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.06);
color: var(--text-secondary);
border: 1px solid rgba(255, 255, 255, 0.12);
}
.activity-badge.badge-buy-in { background: rgba(0, 245, 255, 0.08); color: var(--neon-blue); border-color: rgba(0, 245, 255, 0.25); }
.activity-badge.badge-cash-out { background: rgba(255, 165, 0, 0.08); color: var(--neon-orange); border-color: rgba(255, 165, 0, 0.25); }
.activity-badge.badge-comp-issued { background: rgba(138, 43, 226, 0.08); color: var(--neon-purple); border-color: rgba(138, 43, 226, 0.25); }
.activity-badge.badge-fill-slip { background: rgba(255, 215, 0, 0.08); color: #FFD700; border-color: rgba(255, 215, 0, 0.25); }
.activity-badge.badge-big-win { background: rgba(57, 255, 20, 0.08); color: var(--neon-green); border-color: rgba(57, 255, 20, 0.25); }
.activity-badge.badge-big-loss { background: rgba(255, 7, 58, 0.08); color: var(--neon-red); border-color: rgba(255, 7, 58, 0.25); }
.activity-badge.badge-session-end { background: rgba(255, 255, 255, 0.06); color: var(--text-muted); border-color: rgba(255, 255, 255, 0.12); }
@media (max-width: 768px) {
.activity-header { flex-direction: column; gap: 1rem; align-items: stretch; }
.activity-item { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
.activity-meta { flex-direction: column; gap: 0.25rem; }
}
/* Policy Modal Content Styles */
.policy-content {
color: #ffffff;
line-height: 1.6;
}
.policy-section {
margin-bottom: 3rem;
padding-bottom: 1.5rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.policy-section:last-child {
border-bottom: none;
margin-bottom: 1rem;
}
.policy-section h3 {
color: var(--neon-blue);
margin-bottom: 1rem;
font-size: 1.25rem;
}
.policy-section ul {
margin-left: 1.5rem;
margin-bottom: 1rem;
}
.policy-section li {
margin-bottom: 0.5rem;
color: var(--text-secondary);
}
.policy-updated {
color: var(--text-muted);
font-size: 0.9rem;
margin-bottom: 2rem;
text-align: center;
font-style: italic;
}
/* Glassmorphism & Dark Mode Styles for IPC-PitBoss Casino Management */
:root {
/* ==========================================
SAFE AREA & MOBILE PLATFORM VARIABLES
========================================== */
/* Safe Area Insets (iOS notch, Dynamic Island, Android gesture nav) */
--safe-area-top: env(safe-area-inset-top, 0px);
--safe-area-right: env(safe-area-inset-right, 0px);
--safe-area-bottom: env(safe-area-inset-bottom, 0px);
--safe-area-left: env(safe-area-inset-left, 0px);
/* Keyboard height (set dynamically by useKeyboard composable) */
--keyboard-height: 0px;
/* Touch target minimums (Apple/Material guidelines) */
--touch-target-min: 44px;
--touch-target-recommended: 48px;
/* ==========================================
Dark Mode Color Palette
========================================== */
--bg-primary: #0a0a0b;
--bg-secondary: #1a1a1e;
--bg-tertiary: #2a2a32;
--card-bg: #1a1a2e;
/* Glass Effects */
--glass-bg: rgba(255, 255, 255, 0.05);
--glass-border: rgba(255, 255, 255, 0.1);
--glass-shadow: rgba(0, 0, 0, 0.3);
/* Backdrop blur values - prevents removal during build optimization */
--glass-blur: blur(20px);
--glass-blur-strong: blur(25px);
--glass-blur-subtle: blur(15px);
--glass-blur-minimal: blur(10px);
/* Neon Accents */
--neon-blue: #00f5ff;
--neon-purple: #8a2be2;
--neon-green: #39ff14;
--neon-red: #ff073a;
--neon-orange: #ff6600;
--neon-gold: #ffd700;
--neon-teal: #00d9ff;
/* Casino Colors */
--casino-gold: #ffd700;
--casino-red: #dc143c;
--casino-green: #228b22;
/* Text Colors */
--text-primary: #ffffff;
--text-secondary: #b0b0b0;
--text-muted: #808080;
/* UI Colors */
--border-color: rgba(255, 255, 255, 0.15);
--surface-light: rgba(255, 255, 255, 0.05);
--surface-dark: rgba(0, 0, 0, 0.2);
/* Status Colors */
--success: var(--neon-green);
--warning: var(--neon-orange);
--error: var(--neon-red);
--info: var(--neon-blue);
}
/* Glass Base Classes */
.glass {
background: var(--glass-bg);
backdrop-filter: var(--glass-blur);
-webkit-backdrop-filter: var(--glass-blur);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
}
.glass-strong {
background: rgba(255, 255, 255, 0.08);
backdrop-filter: var(--glass-blur-strong);
-webkit-backdrop-filter: var(--glass-blur-strong);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 20px;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.glass-subtle {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: var(--glass-blur-subtle);
-webkit-backdrop-filter: var(--glass-blur-subtle);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
}
/* Neon Glow Effects */
.neon-glow {
box-shadow: 0 0 10px currentColor, 0 0 20px currentColor, 0 0 30px currentColor;
}
.neon-blue { color: var(--neon-blue); }
.neon-purple { color: var(--neon-purple); }
.neon-green { color: var(--neon-green); }
.neon-red { color: var(--neon-red); }
.neon-orange { color: var(--neon-orange); }
/* Button Styles */
.btn-glass {
background: var(--glass-bg);
backdrop-filter: var(--glass-blur);
-webkit-backdrop-filter: var(--glass-blur);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
}
.btn-glass:hover {
background: rgba(255, 255, 255, 0.1);
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.btn-neon {
background: var(--glass-bg);
backdrop-filter: var(--glass-blur);
-webkit-backdrop-filter: var(--glass-blur);
border: 2px solid currentColor;
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 12px 24px;
color: var(--text-primary);
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
position: relative;
overflow: hidden;
}
.btn-neon::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transition: left 0.5s;
}
.btn-neon:hover::before {
left: 100%;
}
/* Button Variants */
.btn-primary { color: var(--neon-blue); }
.btn-success { color: var(--neon-green); }
.btn-warning { color: var(--neon-orange); }
.btn-error { color: var(--neon-red); }
.btn-info { color: var(--neon-blue); }
/* Hover Effects */
.hover-lift {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-lift:hover {
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}
/* Card Styles */
.card-glass {
background: var(--glass-bg);
backdrop-filter: var(--glass-blur);
-webkit-backdrop-filter: var(--glass-blur);
border: 1px solid var(--glass-border);
border-radius: 16px;
box-shadow: 0 8px 32px var(--glass-shadow);
padding: 24px;
margin: 16px 0;
}
.card-glass-strong {
background: rgba(255, 255, 255, 0.08);
backdrop-filter: var(--glass-blur-strong);
-webkit-backdrop-filter: var(--glass-blur-strong);
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 20px;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
padding: 32px;
margin: 20px 0;
}
/* Input Styles */
.input-glass {
background: rgba(255, 255, 255, 0.03);
backdrop-filter: var(--glass-blur-subtle);
-webkit-backdrop-filter: var(--glass-blur-subtle);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 12px;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
padding: 12px 16px;
color: var(--text-primary);
outline: none;
transition: all 0.3s ease;
}
.input-glass:focus {
background: rgba(255, 255, 255, 0.08);
border-color: var(--neon-blue);
box-shadow: 0 0 0 2px rgba(0, 245, 255, 0.3);
}
/* Firefox freezes for 10+ seconds when opening a native