:root, html[data-theme="dark"]{ --ink:#080b10; --panel:#0f141c; --panel-2:#141b25; --panel-3:#1a2230; --border:#212b38; --border-soft:#1a222d; --text:#eef2f6; --text-muted:#8493a6; --text-dim:#57667a; /* Joker-Farbschema: Lila als Primärakzent (früher "Gold"-Variable, Name aus Kompatibilitätsgründen beibehalten), Grün für Erfolg/Gewinn. */ --gold:#a855f7; --gold-dim:#6b21a8; --live:#e2432b; --win:#22c55e; --radius:10px; --font-display:'Barlow Condensed',sans-serif; --font-body:'Inter',sans-serif; } /* Helles Theme — wird per data-theme="light" auf aktiviert */ html[data-theme="light"]{ --ink:#f3f5f8; --panel:#ffffff; --panel-2:#eef1f5; --panel-3:#e6eaf0; --border:#dde3ea; --border-soft:#e7ebf0; --text:#141a22; --text-muted:#57667a; --text-dim:#8493a6; --gold:#7c3aed; --gold-dim:#c4b5fd; --live:#c8351f; --win:#16a34a; } *{box-sizing:border-box; margin:0; padding:0;} body{background:var(--ink); color:var(--text); font-family:var(--font-body); -webkit-font-smoothing:antialiased; min-height:100vh; transition:background .15s ease, color .15s ease;} a{color:inherit;} ::selection{background:var(--gold); color:#1a1305;} .topbar{ display:flex; align-items:center; gap:20px; padding:16px 24px; border-bottom:1px solid var(--border); max-width:1200px; margin:0 auto; position:sticky;top:0;z-index:250;background:var(--ink); } .logo{font-family:var(--font-display); font-weight:800; font-size:24px; display:flex; align-items:center; gap:9px; text-decoration:none; color:var(--text);} .logo-mark{width:9px; height:9px; border-radius:50%; background:var(--gold); flex-shrink:0; box-shadow:0 0 8px rgba(227,167,60,.5);} .logo-img{height:34px; width:auto; display:block; flex-shrink:0;} .logo-text{white-space:nowrap;} .logo span{color:var(--gold);} .nav{margin-left:auto; display:flex; align-items:center; gap:14px; font-size:14px;} .nav a{color:var(--text-muted); text-decoration:none;} .nav a:hover{color:var(--text);} .balance-pill{ background:var(--panel-2); border:1px solid var(--border); border-radius:999px; padding:7px 14px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--gold); } .theme-toggle{ width:36px; height:36px; border-radius:999px; border:1px solid var(--border); background:var(--panel-2); color:var(--text); font-size:15px; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; } .theme-toggle:hover{border-color:var(--gold-dim);} .theme-options{display:flex; gap:10px;} .theme-option{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border-radius:8px; border:1px solid var(--border); background:var(--panel-3); color:var(--text-muted); cursor:pointer; font-size:14px; font-weight:600; } .theme-option.active{border-color:var(--gold); color:var(--gold); background:rgba(227,167,60,.1);} .container{max-width:1200px; margin:0 auto; padding:32px 24px 60px;} .container-narrow{max-width:440px; margin:60px auto; padding:0 20px;} h1{font-family:var(--font-display); font-weight:700; font-size:30px; margin-bottom:6px;} h2{font-family:var(--font-display); font-weight:700; font-size:22px; margin-bottom:14px;} p.sub{color:var(--text-dim); font-size:14px; margin-bottom:24px;} .card{background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius); padding:24px;} .fav-star{background:none; border:none; cursor:pointer; font-size:16px; line-height:1; padding:4px 6px; border-radius:6px;} .fav-star:hover{background:var(--panel-3);} .favorites-box{margin-bottom:14px;} .favorites-box .highlight-chip{margin-bottom:4px;} .ticket-thread{display:flex; flex-direction:column; gap:12px;} .ticket-msg{border:1px solid var(--border-soft); border-radius:8px; padding:12px 14px; max-width:80%;} .ticket-msg-user{background:var(--panel-2); align-self:flex-start;} .ticket-msg-staff{background:rgba(227,167,60,.08); border-color:rgba(227,167,60,.25); align-self:flex-end;} .ticket-msg-meta{display:flex; justify-content:space-between; gap:12px; font-size:12px; color:var(--text-dim); margin-bottom:6px;} .ticket-msg-meta strong{color:var(--text); font-weight:600;} .ticket-msg-body{font-size:14px; color:var(--text); line-height:1.5; white-space:pre-wrap;} @media (max-width: 640px){ .ticket-msg{max-width:100%;} } .form-group{margin-bottom:16px;} label{display:block; font-size:13px; color:var(--text-muted); margin-bottom:6px; font-weight:500;} input:not([type]), input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=datetime-local], input[type=time], input[type=search], input[type=url], input[type=tel], select, textarea{ width:100%; padding:11px 13px; background:var(--panel-3); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:14px; font-family:inherit; } input:focus, select:focus, textarea:focus{outline:none; border-color:var(--gold-dim);} textarea{resize:vertical;} .password-field-wrap{position:relative;} .password-field-wrap input[type=password], .password-field-wrap input[type=text]{padding-right:42px;} .password-toggle-btn{ position:absolute; right:6px; top:50%; transform:translateY(-50%); background:none; border:none; padding:6px; cursor:pointer; font-size:15px; color:var(--text-dim); line-height:1; border-radius:6px; } .password-toggle-btn:hover{color:var(--text); background:var(--panel-2);} .btn{ display:inline-block; font-family:inherit; font-weight:600; font-size:14px; padding:11px 20px; border-radius:8px; border:1px solid var(--border); background:transparent; color:var(--text-muted); cursor:pointer; text-decoration:none; } .btn-gold{background:var(--gold); color:#1a1305; border:1px solid var(--gold);} .btn-block{width:100%; text-align:center;} .btn-danger{border-color:var(--live); color:var(--live);} /* Unified application messages: frontend + backend. `.notice` is the preferred reusable component; `.alert` remains as a compatibility alias for older templates. */ .notice,.alert{ display:flex; align-items:flex-start; gap:11px; width:100%; box-sizing:border-box; padding:13px 15px; margin:0 0 18px; border:1px solid var(--border); border-radius:9px; background:var(--panel-2); color:var(--text); font-size:13.5px; line-height:1.45; } .notice::before,.alert::before{ display:inline-flex; align-items:center; justify-content:center; flex:0 0 22px; width:22px; height:22px; border-radius:50%; font-size:13px; font-weight:800; line-height:1; content:'i'; background:rgba(132,147,166,.14); color:var(--text-muted); border:1px solid rgba(132,147,166,.28); } .notice-success,.notice.success,.alert-success{ background:rgba(63,191,127,.08); border-color:rgba(63,191,127,.32); color:var(--text); } .notice-success::before,.notice.success::before,.alert-success::before{ content:'✓'; background:rgba(63,191,127,.14); border-color:rgba(63,191,127,.34); color:var(--win); } .notice-error,.notice.error,.alert-error{ background:rgba(226,75,43,.08); border-color:rgba(226,75,43,.36); color:var(--text); } .notice-error::before,.notice.error::before,.alert-error::before{ content:'!'; background:rgba(226,75,43,.14); border-color:rgba(226,75,43,.38); color:#ff8a76; } .notice-warning,.alert-warning{ background:rgba(227,167,60,.08); border-color:rgba(227,167,60,.34); color:var(--text); } .notice-warning::before,.alert-warning::before{ content:'!'; background:rgba(227,167,60,.14); border-color:rgba(227,167,60,.34); color:var(--gold); } .notice-info,.alert-info{ background:rgba(132,147,166,.08); border-color:rgba(132,147,166,.3); color:var(--text); } table{width:100%; border-collapse:collapse; font-size:13.5px;} th, td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--border-soft);} th{color:var(--text-dim); font-weight:600; font-size:11.5px; text-transform:uppercase; letter-spacing:.5px;} tr:hover td{background:var(--panel-2);} /* v1.0.0-alpha12.2: keep wide admin tables inside their cards. */ .table-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;} .table-scroll table{width:100%;min-width:760px;} .table-scroll th,.table-scroll td{vertical-align:middle;} .badge{font-size:11px; font-weight:700; padding:2px 8px; border-radius:20px; white-space:nowrap; display:inline-flex; align-items:center;} .badge-open{background:rgba(227,167,60,.12); color:var(--gold); border:1px solid rgba(227,167,60,.3);} .badge-won{background:rgba(63,191,127,.12); color:var(--win); border:1px solid rgba(63,191,127,.3);} .badge-lost{background:rgba(226,75,43,.12); color:var(--live); border:1px solid rgba(226,75,43,.3);} .badge-void{background:rgba(132,147,166,.12); color:var(--text-dim); border:1px solid var(--border);} /* --- Sport-Board (index.php) --- */ .board-search{ width:100%; margin-bottom:16px; padding:10px 13px; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; color:var(--text); font-size:13.5px; } .board-search:focus{outline:none; border-color:var(--gold-dim);} .board-sidebar-label{ font-family:var(--font-display); font-size:11.5px; letter-spacing:1.2px; text-transform:uppercase; color:var(--text-dim); font-weight:600; margin:0 0 8px 2px; } .highlight-list{display:flex; flex-direction:column; gap:4px; margin-bottom:20px;} .highlight-chip{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:8px; background:var(--panel); border:1px solid var(--border-soft); color:var(--text-muted); text-decoration:none; font-size:13px; transition:border-color .15s, color .15s; } .highlight-chip:hover{border-color:var(--gold-dim); color:var(--text);} .sidebar-country-list{ display:flex; flex-direction:column; gap:1px; margin:2px 0 10px 12px; padding-left:8px; border-left:2px solid var(--border-soft); } .sidebar-country-row{display:flex; align-items:center; gap:0;} .sidebar-country-check-wrap{ display:flex; align-items:center; justify-content:center; flex-shrink:0; cursor:pointer; width:0; opacity:0; overflow:hidden; transition:width .15s ease, opacity .15s ease; } .sidebar-country-row:hover .sidebar-country-check-wrap, .sidebar-country-check-wrap.sidebar-country-check-active{ width:22px; opacity:1; } .sidebar-country-check-wrap input[type=checkbox]{width:auto; accent-color:var(--win); cursor:pointer;} .sidebar-country-item{ display:flex; align-items:center; gap:10px; padding:7px 8px; border-radius:6px; flex:1; min-width:0; background:none; border:none; text-align:left; cursor:pointer; text-decoration:none; color:var(--text-muted); font-size:13.5px; font-family:inherit; } .sidebar-country-item:hover{background:var(--panel-2); color:var(--text);} .sidebar-country-extra{display:none;} .sidebar-country-list-expanded .sidebar-country-extra{display:block;} .sidebar-country-flag{ width:20px; height:20px; border-radius:50%; flex-shrink:0; object-fit:cover; background:var(--panel-3); } .sidebar-country-flag-emoji{display:flex; align-items:center; justify-content:center; font-size:13px;} .sidebar-country-name{flex:1; min-width:0;} .sidebar-country-chevron{font-size:11px; color:var(--text-dim); transition:transform .15s;} .sidebar-country-group-open .sidebar-country-chevron{transform:rotate(180deg);} .sidebar-more-toggle{ display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:4px; padding:7px 8px; background:none; border:none; color:var(--gold); font-size:12.5px; font-weight:600; cursor:pointer; font-family:inherit; } .sidebar-more-toggle:hover{color:var(--text);} .sidebar-league-list{display:none; flex-direction:column; gap:0; margin:0 0 4px 30px;} .sidebar-country-group-open .sidebar-league-list{display:flex;} .sidebar-league-item{ display:flex; align-items:center; gap:8px; padding:5px 8px; border-radius:6px; color:var(--text-muted); font-size:12.5px; cursor:pointer; } .sidebar-league-item:hover{background:var(--panel-2); color:var(--text);} .sidebar-league-item input[type=checkbox]{width:auto; accent-color:var(--win); flex-shrink:0; cursor:pointer;} .sidebar-league-name{flex:1; min-width:0;} .sidebar-league-count{color:var(--text-dim); font-size:11px;} .country-block{border:1px solid var(--border-soft); border-radius:var(--radius); margin-bottom:12px; overflow:hidden;} .country-header{width:100%; display:flex; align-items:center; gap:10px; padding:14px 16px; background:var(--panel); border:none; color:var(--text); font-size:15px; font-weight:600; cursor:pointer;} .league-name{padding:11px 16px 11px 34px; background:var(--panel-2); color:var(--gold); font-size:13.5px; font-weight:600;} .match-row{display:flex; align-items:center; gap:14px; padding:12px 16px 12px 34px; border-top:1px solid var(--border-soft); flex-wrap:wrap;} .match-row-live{background:rgba(226,75,43,.04);} .match-row-live:hover{background:rgba(226,75,43,.09);} .match-time{font-size:11.5px; color:var(--text-dim); width:120px;} .match-time-live{display:flex; align-items:center; gap:5px; color:var(--live); font-weight:700; font-size:11.5px;} .live-dot{width:6px; height:6px; border-radius:50%; background:var(--live); box-shadow:0 0 6px var(--live-glow); animation:pulse-dot 1.6s ease-in-out infinite;} .live-score{margin-left:8px; font-weight:700; color:var(--gold); font-variant-numeric:tabular-nums;} .match-teams{flex:1; min-width:180px; font-size:13.5px;} .live-detail-overlay{ position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.65); display:flex; align-items:center; justify-content:center; padding:20px; } .live-detail-panel{ background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius); width:100%; max-width:420px; padding:24px; position:relative; } .live-detail-close{ position:absolute; top:14px; right:14px; background:none; border:none; color:var(--text-dim); font-size:18px; cursor:pointer; line-height:1; } .live-detail-close:hover{color:var(--text);} .live-detail-league{text-align:center; font-size:12px; color:var(--text-dim); margin-bottom:4px;} .live-detail-score{display:flex; align-items:center; justify-content:center; gap:16px; margin-bottom:4px;} .live-detail-team{font-size:15px; font-weight:600; color:var(--text); text-align:center; flex:1;} .live-detail-score-box{ font-family:var(--font-display); font-size:26px; font-weight:700; color:var(--gold); background:var(--panel-2); border-radius:8px; padding:4px 14px; font-variant-numeric:tabular-nums; } .live-detail-minute{text-align:center; color:var(--live); font-weight:700; font-size:13px; margin-bottom:18px;} .live-detail-stats{display:flex; justify-content:space-between; margin-bottom:18px; font-size:13px; color:var(--text-muted);} .live-pitch{ position:relative; height:70px; border-radius:10px; overflow:hidden; display:flex; border:1px solid var(--border-soft); } .live-pitch-half{flex:1; position:relative;} .live-pitch-home{background:repeating-linear-gradient(90deg, #1a3a1f 0 20px, #17331c 20px 40px);} .live-pitch-away{background:repeating-linear-gradient(90deg, #17331c 0 20px, #1a3a1f 20px 40px);} .live-pitch-ball{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:20px; transition:left .3s ease; } .live-pitch-label{ position:absolute; bottom:4px; left:0; right:0; text-align:center; font-size:11px; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.6); } .odds-group{display:flex; gap:6px; align-items:center;} .odds-group-market{padding-left:10px; border-left:1px solid var(--border-soft);} .odds-market-label{font-size:10.5px; color:var(--text-dim); white-space:nowrap; margin-right:2px;} .odd-btn{display:flex; flex-direction:column; align-items:center; gap:1px; min-width:56px; padding:6px 4px; background:var(--panel-3); border:1px solid var(--border); border-radius:6px; color:var(--text); cursor:pointer;} .odd-btn:hover{border-color:var(--gold-dim);} .odd-label{font-size:9.5px; color:var(--text-dim); font-weight:600;} .odd-value{font-size:13.5px; font-weight:700; font-variant-numeric:tabular-nums;} /* --- Admin --- */ .admin-shell{display:grid; grid-template-columns:220px 1fr; min-height:100vh;} .admin-sidebar{border-right:1px solid var(--border-soft); padding:20px 12px;} .admin-sidebar a{display:block; padding:10px 12px; border-radius:8px; color:var(--text-muted); text-decoration:none; font-size:14px; margin-bottom:2px;} .admin-sidebar a.active, .admin-sidebar a:hover{background:var(--panel-2); color:var(--text);} /* --- Einstellungen-Untermenü: Klick = fest aufgeklappt unter dem Punkt, Hover = Dropdown-Flyout --- */ .nav-group{position:relative;} .nav-group-toggle{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:10px 12px; border-radius:8px; color:var(--text-muted); text-decoration:none; font-size:14px; margin-bottom:2px; background:none; border:none; cursor:pointer; font-family:inherit; } .nav-group-toggle:hover, .nav-group-toggle.active{background:var(--panel-2); color:var(--text);} .nav-group-arrow{font-size:11px; color:var(--text-dim); transition:transform .15s;} .nav-group.open .nav-group-arrow{transform:rotate(180deg);} /* Fest aufgeklappt (auf der Einstellungen-Seite selbst): Untermenü direkt darunter im Fluss */ .nav-group-menu{display:none; flex-direction:column; padding-left:14px; border-left:2px solid var(--border-soft); margin:2px 0 6px 12px;} .nav-group.open .nav-group-menu{display:flex;} .nav-group-menu a{ padding:7px 10px; font-size:13px; color:var(--text-dim); text-decoration:none; border-radius:6px; } .nav-group-menu a:hover{background:var(--panel-2); color:var(--text);} /* Hover-Dropdown von jeder anderen Seite aus: Flyout rechts daneben, überschreibt die feste Darstellung visuell */ .nav-group:not(.open):hover .nav-group-menu{ display:flex; position:absolute; left:100%; top:0; margin:0; padding:6px; z-index:20; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; min-width:170px; box-shadow:0 8px 24px rgba(0,0,0,.35); } /* --- Einstellungen-Untermenü: Klick klappt aus, Hover zeigt Flyout --- */ .nav-group{position:relative;} .nav-group-toggle{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; background:none; border:none; color:var(--text-muted); padding:10px 12px; border-radius:8px; font-size:14px; cursor:pointer; text-align:left; font-family:inherit; } .nav-group-toggle:hover, .nav-group-toggle.active{background:var(--panel-2); color:var(--text);} .nav-group-arrow{font-size:10px; transition:transform .15s; color:var(--text-dim);} .nav-group.open .nav-group-arrow{transform:rotate(180deg);} .nav-group-menu{ display:none; flex-direction:column; position:absolute; left:100%; top:0; margin-left:6px; min-width:170px; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; padding:6px; box-shadow:0 8px 24px rgba(0,0,0,.35); z-index:40; } .nav-group.open .nav-group-menu{display:flex;} .nav-group-menu a{padding:8px 10px; border-radius:6px; font-size:13px; margin-bottom:0;} .nav-group-menu a:hover{background:var(--panel-3);} @media (hover:hover) and (pointer:fine){ .nav-group:hover .nav-group-menu{display:flex;} } @media (max-width:820px){ .nav-group-menu{position:static; left:auto; margin-left:0; box-shadow:none; padding-left:14px; background:transparent; border:none;} } .admin-main{padding:28px 32px;} .admin-topbar{display:flex; justify-content:space-between; align-items:center; margin-bottom:22px;} .stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:28px;} .stat-card{background:var(--panel); border:1px solid var(--border-soft); border-radius:var(--radius); padding:18px;} .stat-card .label{font-size:12px; color:var(--text-dim); margin-bottom:6px;} .stat-card .value{font-family:var(--font-display); font-size:26px; font-weight:700;} /* --- Changelog-Accordion (admin/status.php) --- */ .changelog-entry{border:1px solid var(--border-soft); border-radius:8px; margin-bottom:10px; overflow:hidden; background:var(--panel-2);} .changelog-entry summary{ padding:13px 16px; cursor:pointer; font-family:var(--font-display); font-weight:700; font-size:16px; color:var(--text); list-style:none; display:flex; align-items:center; gap:8px; } .changelog-entry summary::-webkit-details-marker{display:none;} .changelog-entry summary::before{content:'▸'; color:var(--gold); font-size:13px; transition:transform .15s;} .changelog-entry[open] summary::before{transform:rotate(90deg);} .changelog-body{padding:4px 18px 16px 34px; border-top:1px solid var(--border-soft);} .changelog-section{margin-top:12px;} .changelog-section-title{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--gold); margin-bottom:6px;} .changelog-body ul{padding-left:18px; margin:0;} .changelog-body li{color:var(--text-muted); font-size:13.5px; line-height:1.6; margin-bottom:4px;} .changelog-body code{background:var(--panel-3); padding:1px 5px; border-radius:4px; font-size:12px; color:var(--gold);} @media (max-width:820px){ .admin-shell{grid-template-columns:1fr;} .admin-sidebar{display:flex; overflow-x:auto; border-right:none; border-bottom:1px solid var(--border-soft);} .admin-sidebar a{flex:0 0 auto; white-space:nowrap;} } /* --- Wiederverwendbare responsive Layout-Helfer --- */ .board-layout{display:grid; grid-template-columns:220px 1fr; gap:24px; align-items:start;} .two-col{display:grid; grid-template-columns:1fr 1fr; gap:20px;} .admin-split{display:grid; grid-template-columns:1fr 320px; gap:20px; align-items:start;} @media (max-width:900px){ .board-layout{grid-template-columns:1fr;} .board-layout > nav .card a{white-space:nowrap;} .highlight-list{flex-direction:row; overflow-x:auto; gap:8px; -webkit-overflow-scrolling:touch;} .highlight-chip{flex:0 0 auto; white-space:nowrap;} .two-col{grid-template-columns:1fr;} .admin-split{grid-template-columns:1fr;} } @media (max-width:700px){ .topbar{flex-wrap:wrap; gap:10px; padding:14px 16px;} .nav{gap:8px; width:100%; justify-content:flex-start;} .container{padding:20px 16px 50px;} .match-time{width:auto;} #quickBet{left:12px !important; right:12px !important; width:auto !important; bottom:12px !important;} .stat-grid{grid-template-columns:1fr 1fr;} } @media (max-width:480px){ .stat-grid{grid-template-columns:1fr;} h1{font-size:24px;} } /* --- Bet 24/7 OOP/Twig admin refinements --- */ .admin-shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100vh;} .admin-sidebar{background:var(--panel);border-right:1px solid var(--border-soft);padding:18px 10px;position:sticky;top:0;height:100vh;overflow:auto;} .admin-sidebar .admin-brand{display:flex;align-items:center;gap:9px;padding:6px 10px 20px;text-decoration:none;font-weight:800;font-family:var(--font-display);font-size:21px;} .admin-sidebar .admin-brand small{font-family:var(--font-body);font-size:11px;color:var(--text-dim);font-weight:600;margin-left:auto;text-transform:uppercase;letter-spacing:.7px;} .admin-sidebar>a,.admin-sidebar .nav-group-toggle{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:8px;color:var(--text-muted);text-decoration:none;font-size:13.5px;margin:1px 0;} .admin-sidebar>a:hover,.admin-sidebar .nav-group-toggle:hover,.admin-sidebar>a.active,.admin-sidebar .nav-group-toggle.active{background:var(--panel-2);color:var(--text);} .admin-sidebar>a.active,.admin-sidebar .nav-group-toggle.active{box-shadow:inset 3px 0 0 var(--gold);} .admin-sidebar .nav-spacer{height:8px;border-top:1px solid var(--border-soft);margin:10px 12px 6px;} .admin-main{min-width:0;padding:30px;} .admin-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;} .admin-topbar h1{margin:0;} .admin-top-actions{display:flex;align-items:center;gap:8px;} .admin-split{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:20px;align-items:start;} .stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:20px;} .stat-card{background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:18px;} .stat-card .label{color:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.5px;} .stat-card .value{font-family:var(--font-display);font-size:26px;font-weight:700;margin-top:5px;} .nav-group-menu{display:none;padding:2px 0 5px 20px;} .nav-group.open .nav-group-menu{display:block;} .nav-group-menu a{display:block;padding:6px 10px;color:var(--text-dim);text-decoration:none;font-size:12.5px;border-radius:6px;} .nav-group-menu a:hover{color:var(--text);background:var(--panel-2);} .admin-nav-badge{margin-left:auto;background:rgba(227,167,60,.12);color:var(--gold);border:1px solid rgba(227,167,60,.3);border-radius:999px;padding:1px 7px;font-size:10px;font-weight:700;} .settings-tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px;position:sticky;top:0;background:var(--ink);padding:10px 0;z-index:5;} .settings-tabs a{padding:7px 11px;border:1px solid var(--border);border-radius:999px;text-decoration:none;color:var(--text-muted);font-size:12px;background:var(--panel);} .settings-tabs a:hover{border-color:var(--gold-dim);color:var(--text);} .settings-section{scroll-margin-top:70px;margin-bottom:20px;} .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;} .form-grid .form-group{margin:0;} .field-help{color:var(--text-dim);font-size:11.5px;margin-top:5px;line-height:1.4;} .color-field{display:grid;grid-template-columns:52px 1fr;gap:8px;align-items:center;} .color-field input[type=color]{width:52px;height:42px;padding:3px;background:var(--panel-3);border:1px solid var(--border);border-radius:8px;} .inline-check{display:flex;align-items:center;gap:9px;color:var(--text);font-size:14px;} .inline-check input{width:auto;} .code-note{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--text-dim);} .table-actions{display:flex;gap:6px;justify-content:flex-end;} .migration-badge{font-size:10px;padding:2px 7px;border-radius:999px;border:1px solid var(--border);color:var(--text-dim);margin-left:auto;} @media(max-width:900px){.admin-shell{grid-template-columns:1fr}.admin-sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--border-soft)}.admin-main{padding:20px}.admin-split,.form-grid{grid-template-columns:1fr}} /* --- Alpha3 financial core / bet slip --- */ .odd-btn.selected{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);background:rgba(168,85,247,.10)} .quick-bet{position:fixed;right:22px;bottom:22px;width:330px;z-index:100;background:var(--panel);border:1px solid var(--gold-dim);border-radius:var(--radius);padding:18px;box-shadow:0 18px 55px rgba(0,0,0,.45)} .quick-bet-close{position:absolute;top:8px;right:10px;background:none;border:0;color:var(--text-dim);font-size:21px;cursor:pointer} .quick-bet strong[data-bet-match]{display:block;padding-right:25px;margin-bottom:4px} .quick-bet-odds,.quick-bet-win{display:flex;justify-content:space-between;gap:12px;margin:14px 0;color:var(--text-muted);font-size:13px} .quick-bet-odds strong,.quick-bet-win strong{color:var(--gold)} /* v1.0.0-alpha9: reusable multi-selection bet-slip internals */ .bet-slip-selections{display:flex;flex-direction:column;gap:8px;max-height:45vh;overflow:auto;margin:8px 0 12px} .bet-slip-selection{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel-2)} .bet-slip-selection-text{min-width:0;font-size:13px}.bet-slip-selection-text strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .bet-slip-remove{border:0;background:transparent;color:var(--text-muted);font-size:20px;line-height:1;cursor:pointer;padding:0 2px}.bet-slip-remove:hover{color:var(--live)} .bet-system-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:8px;max-height:220px;overflow:auto;padding:2px} .bet-system-option{display:flex;align-items:center;gap:7px;padding:7px 8px;border:1px solid var(--border);border-radius:6px;background:var(--panel-2);cursor:pointer;font-size:.9rem} .bet-system-option:hover{border-color:var(--gold)} .bet-system-option input{margin:0} @media (max-width:700px){.bet-system-options{grid-template-columns:1fr}} /* v1.0.0-alpha14: terminal sportsbook cashout status. */ .badge-cashed_out{background:rgba(63,191,127,.12); color:var(--win); border:1px solid rgba(63,191,127,.3);} /* v1.0.0-alpha15: player bet history filters and reusable detail layout. */ .bet-history-filters{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr)) auto;gap:12px;align-items:end} .bet-history-filters label{display:flex;flex-direction:column;gap:6px;color:var(--text-dim);font-size:12px} .bet-history-filter-actions{display:flex;gap:8px;align-items:center} .btn-small{padding:7px 10px;font-size:12px} .btn-ghost{background:transparent} .detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px} .detail-list{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(0,1.4fr);gap:10px 16px;margin:0} .detail-list dt{color:var(--text-dim)} .detail-list dd{margin:0;word-break:break-word} @media (max-width:900px){.bet-history-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.bet-history-filter-actions{grid-column:1/-1}.detail-grid{grid-template-columns:1fr}} @media (max-width:560px){.bet-history-filters{grid-template-columns:1fr}.detail-list{grid-template-columns:1fr}.detail-list dd{margin-bottom:8px}} .history-pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin:0 0 20px} .history-pagination .disabled{pointer-events:none;opacity:.45} /* alpha27: compact provider mapping and safer remapping */ /* alpha28: lightweight provider mapping UI */ .provider-mapping-stats{grid-template-columns:repeat(4,minmax(130px,1fr));} .provider-mapping-actions{min-width:190px;white-space:nowrap;} .provider-mapping-secondary{display:inline-block;margin-left:6px;} .provider-mapping-edit-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-width:360px;} .provider-mapping-edit-form select{min-width:220px;max-width:420px;} .provider-mapping-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px;} .provider-mapping-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;} @media(max-width:900px){.provider-mapping-stats{grid-template-columns:repeat(2,minmax(130px,1fr));}} @media(max-width:520px){.provider-mapping-stats{grid-template-columns:1fr 1fr}.provider-mapping-edit-form{min-width:0;align-items:stretch;flex-direction:column}.provider-mapping-edit-form select{max-width:none;width:100%;}} /* v1.0.0-alpha29: compact mapping filters + normalized teams */ .provider-mapping-filter{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr)) auto auto;gap:8px;align-items:center;} .provider-mapping-filter select,.provider-mapping-filter input[type="search"]{min-width:0;width:100%;} @media(max-width:1200px){.provider-mapping-filter{grid-template-columns:repeat(2,minmax(0,1fr));}.provider-mapping-filter .btn{justify-self:start;}} @media(max-width:700px){.provider-mapping-filter{grid-template-columns:1fr 1fr;}.provider-mapping-filter select,.provider-mapping-filter input[type="search"]{grid-column:1/-1;}} /* v1.0.0-alpha30: normalized team admin integration + robust admin overflow containment */ .card,.admin-split>*{min-width:0;max-width:100%;} .table-scroll{display:block;min-width:0;max-width:100%;} .market-table-scroll{margin-top:8px;} .market-table-scroll table{min-width:620px;} .market-outcome-form{display:grid;grid-template-columns:minmax(130px,1.2fr) minmax(130px,1.2fr) minmax(90px,.7fr) minmax(70px,.5fr) auto;gap:8px;align-items:end;margin-top:10px;min-width:0;} .market-outcome-form>*{min-width:0;} .team-new-field{margin-top:8px;} @media(max-width:1250px){.market-outcome-form{grid-template-columns:repeat(2,minmax(0,1fr));}.market-outcome-form>div:last-child{grid-column:1/-1;display:flex;align-items:end;gap:8px;}} @media(max-width:620px){.market-outcome-form{grid-template-columns:1fr;}.market-outcome-form>div:last-child{grid-column:auto;}} /* Presence status indicator */ .presence-cell{text-align:center;white-space:nowrap;} .presence-dot{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;box-shadow:0 0 0 2px rgba(255,255,255,.05);} .presence-dot-online{background:var(--win);} .presence-dot-offline{background:var(--live);} .presence-dot-never{background:var(--text-dim);} /* v1.0.0-alpha36: scalable payout user search + sidebar overflow guard */ .admin-sidebar{overflow-y:auto;overflow-x:hidden;} .admin-sidebar .nav-group{max-width:100%;} .admin-sidebar .nav-group-menu{max-width:100%;box-sizing:border-box;} @media (hover:hover) and (pointer:fine){ .admin-sidebar .nav-group:not(.open):hover .nav-group-menu{ position:static;left:auto;top:auto;margin:2px 0 6px 12px;padding:2px 0 5px 14px; min-width:0;width:auto;box-shadow:none;border:0;border-left:2px solid var(--border-soft);background:transparent; } } .user-search-field{position:relative;min-width:0;} .user-search-results{position:absolute;z-index:80;left:0;right:0;top:100%;margin-top:4px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;box-shadow:0 12px 30px rgba(0,0,0,.35);max-height:280px;overflow-y:auto;} .user-search-results button{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--border-soft);background:transparent;color:var(--text);padding:9px 11px;cursor:pointer;font:inherit;} .user-search-results button:last-child{border-bottom:0;} .user-search-results button:hover{background:var(--panel-3);} .user-search-results small{display:block;color:var(--text-dim);margin-top:2px;} .user-search-empty{padding:10px 11px;color:var(--text-dim);font-size:12px;} @media(max-width:900px){.staff-assignment-form{grid-template-columns:1fr!important;}} /* Keep settings submenu inside the sidebar flow in every state. */ .admin-sidebar .nav-group-menu{ position:static;left:auto;top:auto;margin:2px 0 6px 12px;padding:2px 0 5px 14px; min-width:0;width:auto;box-shadow:none;border:0;border-left:2px solid var(--border-soft);background:transparent; } /* v1.0.0-alpha37: payout/location form polish */ .payout-location-form .form-group{margin-bottom:14px;} .payout-location-form .inline-check{margin:2px 0 14px;} .payout-location-form .btn-gold{min-width:112px;} .withdrawal-create-form, .staff-assignment-form{display:grid;gap:12px;align-items:end;} .withdrawal-create-form{grid-template-columns:minmax(280px,1.5fr) minmax(150px,.55fr) minmax(180px,.75fr) auto;} .staff-assignment-form{grid-template-columns:minmax(300px,1fr) auto auto;} .user-search-field > span, .withdrawal-create-form label > span, .payout-location-form label > span{display:block;margin-bottom:6px;} .user-search-field input[type=search]{min-height:42px;} .user-search-results{overflow-x:hidden;} .user-search-results button{white-space:normal;} .staff-assignment-form .inline-check{margin:0 0 11px;white-space:nowrap;} .location-editor-card{min-width:0;} .location-editor-card input[type=text]{max-width:100%;box-sizing:border-box;} @media(max-width:1100px){ .withdrawal-create-form{grid-template-columns:minmax(240px,1fr) minmax(140px,.55fr) minmax(170px,.7fr);} .withdrawal-create-form .btn-gold{grid-column:3;justify-self:end;} } @media(max-width:900px){ .withdrawal-create-form,.staff-assignment-form{grid-template-columns:1fr!important;} .withdrawal-create-form .btn-gold{grid-column:auto;justify-self:stretch;} .staff-assignment-form .inline-check{margin:0;} } /* v1.0.0-alpha38: backend-wide form normalization + simple Settings navigation */ .admin-main input:not([type]), .admin-main input[type="text"], .admin-main input[type="email"], .admin-main input[type="password"], .admin-main input[type="number"], .admin-main input[type="date"], .admin-main input[type="datetime-local"], .admin-main input[type="time"], .admin-main input[type="search"], .admin-main input[type="url"], .admin-main input[type="tel"], .admin-main select, .admin-main textarea { width:100%; min-width:0; min-height:42px; padding:10px 12px; background:var(--panel-3); border:1px solid var(--border); border-radius:8px; color:var(--text); font:inherit; font-size:14px; line-height:1.35; box-sizing:border-box; transition:border-color .15s ease, box-shadow .15s ease, background .15s ease; } .admin-main textarea{min-height:96px;resize:vertical;} .admin-main input:not([type])::placeholder, .admin-main input[type="text"]::placeholder, .admin-main input[type="email"]::placeholder, .admin-main input[type="password"]::placeholder, .admin-main input[type="number"]::placeholder, .admin-main input[type="search"]::placeholder, .admin-main input[type="url"]::placeholder, .admin-main input[type="tel"]::placeholder, .admin-main textarea::placeholder{color:var(--text-dim);opacity:1;} .admin-main input:not([type]):hover, .admin-main input[type="text"]:hover, .admin-main input[type="email"]:hover, .admin-main input[type="password"]:hover, .admin-main input[type="number"]:hover, .admin-main input[type="date"]:hover, .admin-main input[type="datetime-local"]:hover, .admin-main input[type="time"]:hover, .admin-main input[type="search"]:hover, .admin-main input[type="url"]:hover, .admin-main input[type="tel"]:hover, .admin-main select:hover, .admin-main textarea:hover{border-color:var(--text-dim);} .admin-main input:not([type]):focus, .admin-main input[type="text"]:focus, .admin-main input[type="email"]:focus, .admin-main input[type="password"]:focus, .admin-main input[type="number"]:focus, .admin-main input[type="date"]:focus, .admin-main input[type="datetime-local"]:focus, .admin-main input[type="time"]:focus, .admin-main input[type="search"]:focus, .admin-main input[type="url"]:focus, .admin-main input[type="tel"]:focus, .admin-main select:focus, .admin-main textarea:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 2px color-mix(in srgb, var(--gold) 18%, transparent); } .admin-main input:disabled, .admin-main select:disabled, .admin-main textarea:disabled{opacity:.6;cursor:not-allowed;background:var(--panel-2);} .admin-main input[type="checkbox"], .admin-main input[type="radio"]{accent-color:var(--gold);} .admin-main input[type="date"], .admin-main input[type="datetime-local"], .admin-main input[type="time"]{color-scheme:dark;} html[data-theme="light"] .admin-main input[type="date"], html[data-theme="light"] .admin-main input[type="datetime-local"], html[data-theme="light"] .admin-main input[type="time"]{color-scheme:light;} /* Settings is intentionally a plain navigation link. Legacy submenu/flyout is disabled globally. */ .admin-sidebar .nav-group-menu{display:none!important;} .admin-sidebar .nav-group:hover .nav-group-menu, .admin-sidebar .nav-group.open .nav-group-menu{display:none!important;} /* v1.0.0-alpha39: unified admin utilities, document scrolling, custom checkboxes */ /* The admin sidebar is part of the document flow. There is no independent vertical scroll frame. */ .admin-shell{align-items:stretch;} .admin-sidebar{ position:relative; top:auto; height:auto; min-height:100vh; overflow:visible; align-self:stretch; } .admin-main{position:relative;} .admin-utility-bar{ display:flex; justify-content:flex-end; align-items:center; flex-wrap:wrap; gap:6px; min-height:36px; margin:-12px 0 14px; } .admin-utility-link, .admin-utility-button{ display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:6px 10px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--text-muted); text-decoration:none; font:inherit; font-size:13px; cursor:pointer; } .admin-utility-link:hover, .admin-utility-link.active, .admin-utility-button:hover{ color:var(--text); background:var(--panel-2); border-color:var(--border-soft); } .admin-utility-logout{margin:0;display:inline-flex;} .admin-utility-theme{margin:0;min-width:36px;min-height:34px;padding:5px 8px;} /* Admin checkboxes follow the same dark/light form surface instead of browser-white controls. */ .admin-main input[type="checkbox"]{ -webkit-appearance:none; appearance:none; width:18px; height:18px; min-width:18px; min-height:18px; margin:0; padding:0; border:1px solid var(--border); border-radius:5px; background-color:var(--panel-3); background-repeat:no-repeat; background-position:center; background-size:12px 12px; vertical-align:-3px; cursor:pointer; transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease; } .admin-main input[type="checkbox"]:hover{border-color:var(--text-dim);} .admin-main input[type="checkbox"]:focus-visible{ outline:none; border-color:var(--gold); box-shadow:0 0 0 2px color-mix(in srgb, var(--gold) 18%, transparent); } .admin-main input[type="checkbox"]:checked{ border-color:var(--gold); background-color:var(--gold); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3 6.4 11.4 12.8 4.9' fill='none' stroke='%230b0e14' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } .admin-main input[type="checkbox"]:disabled{cursor:not-allowed;opacity:.5;} .admin-main .inline-check{display:flex;align-items:center;gap:8px;} @media(max-width:820px){ .admin-sidebar{min-height:0;overflow-x:auto;overflow-y:visible;} .admin-utility-bar{justify-content:flex-start;margin-top:-8px;} } /* v1.0.0-alpha40: consistent backend select controls */ .admin-main select { -webkit-appearance:none; appearance:none; padding-right:42px; background-color:var(--panel-3); background-image: linear-gradient(45deg, transparent 50%, var(--text-muted) 50%), linear-gradient(135deg, var(--text-muted) 50%, transparent 50%); background-position: calc(100% - 18px) calc(50% - 2px), calc(100% - 12px) calc(50% - 2px); background-size:6px 6px,6px 6px; background-repeat:no-repeat; cursor:pointer; } .admin-main select:hover { background-image: linear-gradient(45deg, transparent 50%, var(--text) 50%), linear-gradient(135deg, var(--text) 50%, transparent 50%); } .admin-main select:focus { background-image: linear-gradient(45deg, transparent 50%, var(--gold) 50%), linear-gradient(135deg, var(--gold) 50%, transparent 50%); } .admin-main select:disabled{cursor:not-allowed;} .admin-main select option, .admin-main select optgroup{ background:var(--panel-3); color:var(--text); font:inherit; } html[data-theme="light"] .admin-main select option, html[data-theme="light"] .admin-main select optgroup{ background:var(--panel-3); color:var(--text); } /* v1.0.0-alpha41: player withdrawal / payout UI */ .withdrawal-player-header{margin-bottom:18px} .withdrawal-player-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:18px;margin-bottom:18px} .withdrawal-player-request,.withdrawal-player-info{min-width:0} .withdrawal-balance-label{font-size:.82rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em} .withdrawal-balance{font-family:var(--font-display);font-size:2.15rem;font-weight:800;line-height:1.05;margin:5px 0 10px;color:var(--gold)} .withdrawal-player-form{display:grid;grid-template-columns:minmax(150px,.7fr) minmax(220px,1fr) auto;gap:12px;align-items:end;margin-top:18px} .withdrawal-player-form label{display:grid;gap:6px;min-width:0} .withdrawal-player-form label>span{font-size:.84rem;color:var(--text-muted)} .withdrawal-player-form .btn{min-height:42px} .withdrawal-method-note{margin-top:12px} .withdrawal-player-info h2,.withdrawal-history-card h2{margin-top:0} .withdrawal-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:withdrawal-step} .withdrawal-steps li{position:relative;padding-left:38px;min-height:30px;counter-increment:withdrawal-step} .withdrawal-steps li::before{content:counter(withdrawal-step);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--border);color:var(--gold);font-weight:700} .withdrawal-steps strong,.withdrawal-steps span{display:block} .withdrawal-steps span{font-size:.84rem;color:var(--text-muted);margin-top:2px} .withdrawal-history-card{overflow:auto} .withdrawal-history-card td:first-child strong{white-space:nowrap} .withdrawal-cancel-form{margin:0} @media (max-width:980px){.withdrawal-player-grid{grid-template-columns:1fr}.withdrawal-player-form{grid-template-columns:1fr 1fr}.withdrawal-player-form .btn{grid-column:1/-1;justify-self:start}} @media (max-width:640px){.withdrawal-player-form{grid-template-columns:1fr}.withdrawal-player-form .btn{justify-self:stretch}.withdrawal-balance{font-size:1.85rem}} /* v1.0.0-alpha42: player account navigation */ .account-menu{position:relative;flex-shrink:0} .account-menu-toggle{ display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 11px; border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text-muted); font:inherit;font-size:14px;cursor:pointer } .account-menu-toggle:hover,.account-menu.open .account-menu-toggle{color:var(--text);background:var(--panel-2);border-color:var(--border-soft)} .account-menu-arrow{font-size:10px;transition:transform .15s ease;color:var(--text-dim)} .account-menu.open .account-menu-arrow{transform:rotate(180deg)} .account-menu-panel{ display:none;position:absolute;right:0;top:calc(100% + 8px);z-index:100;min-width:210px;padding:7px; background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.35) } .account-menu.open .account-menu-panel{display:block} .account-menu-panel>a,.account-menu-logout button{ display:flex;width:100%;align-items:center;min-height:38px;padding:8px 10px;border:0;border-radius:7px; background:transparent;color:var(--text-muted);font:inherit;font-size:13.5px;text-align:left;text-decoration:none;cursor:pointer } .account-menu-panel>a:hover,.account-menu-panel>a:focus-visible,.account-menu-logout button:hover,.account-menu-logout button:focus-visible{background:var(--panel-2);color:var(--text);outline:none} .account-menu-divider{height:1px;background:var(--border-soft);margin:6px 4px} .account-menu-logout{margin:0} .account-placeholder-card{max-width:720px} .account-placeholder-card p{color:var(--text-muted);line-height:1.6} @media(max-width:700px){ .topbar{align-items:center} .nav{flex-wrap:wrap} .nav>a:first-child{margin-right:auto} .balance-pill{order:2} .account-menu{order:3;margin-left:auto} .account-menu-panel{right:0;min-width:min(260px,calc(100vw - 32px))} } .account-balance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .account-balance-card{min-width:0} .account-balance-value{font-family:var(--font-display);font-size:34px;font-weight:800;line-height:1.05;margin:8px 0 10px;color:var(--gold)} .account-form-card{max-width:620px} @media(max-width:800px){.account-balance-grid{grid-template-columns:1fr}} /* Player account overview / profile preferences */ .account-more-link{display:flex;justify-content:flex-end;margin-top:14px} .account-more-link a{color:var(--gold);font-weight:600;text-decoration:none} .account-more-link a:hover{text-decoration:underline} .theme-option input[type="radio"]{position:absolute;opacity:0;pointer-events:none} .theme-option:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px} /* v1.0.0-alpha46: sticky player header + top-level theme switch */ .player-theme-toggle{margin-left:0} @media(max-width:700px){.player-theme-toggle{order:2}.balance-pill{order:2}} /* v1.0.0-alpha49: browser autofill decoy fields for non-login admin forms */ .autofill-trap{position:fixed!important;left:-10000px!important;top:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important} .autofill-trap input{width:1px!important;height:1px!important;min-width:0!important;padding:0!important;border:0!important} /* alpha52: inline validation feedback for bank details */ .field-inline-error{color:var(--live);font-size:11.5px;margin-top:-8px;margin-bottom:4px;line-height:1.35;} input:invalid[data-iban-input]:not(:focus){border-color:var(--live);} /* alpha52: visible IBAN inline validation */ .field-inline-success{color:var(--success,#29c77f);font-size:12px;margin-top:6px;margin-bottom:4px;line-height:1.35;font-weight:600;} .field-inline-error{color:var(--danger,var(--live,#ef5350));font-size:12px;margin-top:6px;margin-bottom:4px;line-height:1.35;font-weight:600;} input.field-invalid{border-color:var(--danger,var(--live,#ef5350))!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--danger,var(--live,#ef5350)) 35%,transparent);} input.field-valid{border-color:var(--success,#29c77f)!important;} /* v1.0.0-alpha53: global admin back-to-top control */ .admin-back-to-top{position:fixed;right:22px;bottom:22px;z-index:180;width:42px;height:42px;border:1px solid var(--border);border-radius:50%;background:var(--panel-2);color:var(--text);font-size:20px;font-weight:700;cursor:pointer;box-shadow:0 10px 28px rgba(0,0,0,.28);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .16s ease,transform .16s ease,visibility .16s ease} .admin-back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)} .admin-back-to-top:hover,.admin-back-to-top:focus-visible{border-color:var(--gold);color:var(--gold);outline:none} .bank-payout-mode-info{margin-bottom:16px} .bank-payout-actions{display:grid;gap:10px;min-width:330px} .bank-payout-action-form{display:flex;gap:7px;align-items:end;flex-wrap:wrap;margin:0} /* v1.0.0-alpha54: location cash management */ .cash-location-head{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(340px,1.2fr) minmax(320px,1fr);gap:16px;align-items:stretch} .cash-balance-card{display:flex;flex-direction:column;justify-content:center} .cash-balance-value{font-family:var(--font-display);font-size:38px;font-weight:800;color:var(--gold);line-height:1.05;margin:8px 0 10px} .cash-movement-form{display:grid;grid-template-columns:minmax(140px,.7fr) minmax(130px,.6fr) 1.2fr auto;gap:10px;align-items:end} .cash-close-form{display:grid;grid-template-columns:minmax(150px,.7fr) 1fr auto;gap:10px;align-items:end} .cash-amount-positive{color:var(--success,#29c77f)} .cash-amount-negative,.cash-difference-warning{color:var(--danger,var(--live,#ef5350))} @media(max-width:1150px){.cash-location-head{grid-template-columns:1fr 1fr}.cash-balance-card{grid-column:1/-1}.cash-movement-form{grid-template-columns:1fr 1fr}.cash-note-field{grid-column:1/-1}.cash-close-form{grid-template-columns:1fr}} @media(max-width:700px){.cash-location-head{grid-template-columns:1fr}.cash-balance-card{grid-column:auto}.cash-movement-form{grid-template-columns:1fr}.cash-note-field{grid-column:auto}} /* v1.0.0-alpha56: operator / revenue dashboard */ .revenue-filter-card{margin-bottom:20px} .revenue-filters{display:grid;grid-template-columns:repeat(6,minmax(140px,1fr));gap:12px;align-items:end} .revenue-filters label{display:flex;flex-direction:column;gap:6px;color:var(--text-dim);font-size:12px;min-width:0} .revenue-filters input,.revenue-filters select{width:100%;min-width:0} .revenue-filter-disabled{opacity:.6} .revenue-event-search{position:relative} .revenue-event-search .user-search-results{top:calc(100% + 4px);left:0;right:0;z-index:40} .revenue-filter-actions{display:flex;gap:8px;grid-column:1/-1} .revenue-filter-note{margin:14px 0 0;max-width:1100px} .revenue-kpi-note{margin-top:7px;color:var(--text-dim);font-size:11px;line-height:1.35} .revenue-unavailable .value{color:var(--text-dim)} .revenue-section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px} .revenue-section-head h2{margin-bottom:3px} .revenue-table .num{text-align:right;white-space:nowrap} .revenue-definition-card{margin-top:20px} .revenue-definition-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} .revenue-definition-grid>div{padding:14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel-2)} .revenue-definition-grid p{margin:6px 0 0;color:var(--text-dim);line-height:1.5} @media(max-width:1180px){.revenue-filters{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.revenue-filters{grid-template-columns:1fr 1fr}.revenue-definition-grid{grid-template-columns:1fr}.revenue-section-head{flex-direction:column}} @media(max-width:520px){.revenue-filters{grid-template-columns:1fr}.revenue-filter-actions{flex-wrap:wrap}} .revenue-governance-card{margin-top:20px} .revenue-governance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} .revenue-governance-grid>div{position:relative;padding:14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel-2)} .revenue-governance-grid .badge{float:right;margin-left:10px} .revenue-governance-grid p{margin:7px 0 0;color:var(--text-dim);line-height:1.5} @media(max-width:760px){.revenue-governance-grid{grid-template-columns:1fr}} /* alpha58 revenue attribution/cost journal */ .revenue-filters{grid-template-columns:repeat(7,minmax(150px,1fr));} .revenue-cost-form{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:12px;align-items:end;margin:14px 0 18px}.revenue-cost-form label{display:grid;gap:6px}.revenue-cost-form label span{font-size:.82rem;color:var(--text-muted)} @media(max-width:1200px){.revenue-filters{grid-template-columns:repeat(3,minmax(180px,1fr))}.revenue-cost-form{grid-template-columns:repeat(2,minmax(180px,1fr))}} @media(max-width:720px){.revenue-filters,.revenue-cost-form{grid-template-columns:1fr}} .revenue-cost-reverse{display:flex;gap:6px;min-width:260px}.revenue-cost-reverse input{min-width:150px} /* v1.0.0-alpha59: responsive Revenue and Spiele & Quoten polish */ .revenue-kpis{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:stretch} .revenue-kpis .stat-card{min-width:0;min-height:116px;display:flex;flex-direction:column;justify-content:flex-start} .revenue-kpis .stat-card .label{line-height:1.35;overflow-wrap:normal;word-break:normal;hyphens:none;text-transform:none;letter-spacing:.2px} .revenue-kpis .stat-card .value{font-size:clamp(22px,2vw,28px);line-height:1.15;overflow-wrap:anywhere} .revenue-filter-hint{min-height:1.2em;color:var(--text-dim);font-size:11px;line-height:1.2} .revenue-filter-disabled select{cursor:not-allowed} @media(max-width:1500px){.revenue-kpis{grid-template-columns:repeat(3,minmax(220px,1fr))}} @media(max-width:1000px){.revenue-kpis{grid-template-columns:repeat(2,minmax(220px,1fr))}} @media(max-width:560px){.revenue-kpis{grid-template-columns:1fr}.revenue-kpis .stat-card{min-height:0}} .matches-markets-card{margin-top:16px;overflow:hidden} .market-admin-card{min-width:0;border:1px solid var(--border);border-radius:10px;padding:14px;margin:0 0 14px;background:var(--panel-2)} .market-admin-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;min-width:0} .market-admin-title{min-width:0;overflow-wrap:anywhere} .market-admin-title>strong{display:block;font-size:15px} .market-tech{margin-top:5px;color:var(--text-dim);font-size:11px;max-width:100%} .market-tech summary{cursor:pointer;user-select:none} .market-tech code,.market-tech span{display:inline-block;margin:5px 8px 0 0;max-width:100%;overflow-wrap:anywhere;white-space:normal} .market-settlement-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px} .market-settlement-form{margin-top:10px;min-width:0} .market-outcome-grid{display:grid;grid-template-columns:minmax(150px,2fr) minmax(64px,.6fr) minmax(90px,.8fr) minmax(145px,1.1fr) minmax(55px,.5fr);gap:10px;align-items:center;min-width:0} .market-outcome-grid-head{padding:0 10px 7px;color:var(--text-dim);font-size:11px;text-transform:uppercase;letter-spacing:.35px} .market-outcome-row{padding:10px;border-top:1px solid var(--border);background:var(--panel)} .market-outcome-row:last-child{border-bottom:1px solid var(--border)} .market-outcome-row>div{min-width:0;overflow-wrap:anywhere} .market-outcome-row select{width:100%;min-width:0} .market-outcome-name strong{display:block;overflow-wrap:anywhere} .market-outcome-name code{display:block;margin-top:3px;color:var(--text-dim);font-size:10px;white-space:normal;overflow-wrap:anywhere} .market-empty{padding:12px;border:1px solid var(--border);border-radius:8px;color:var(--text-dim)} .market-settlement-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px} .market-delete-outcomes{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px} .market-delete-outcomes form{max-width:100%}.market-delete-outcomes .btn{max-width:100%;white-space:normal;text-align:left;overflow-wrap:anywhere} .market-outcome-form{display:grid;grid-template-columns:minmax(130px,1.3fr) minmax(130px,1.3fr) minmax(90px,.7fr) minmax(70px,.55fr) minmax(150px,1.1fr);gap:10px;align-items:end;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border)} .market-outcome-form>div{min-width:0}.market-outcome-form label{display:block;margin-bottom:5px;color:var(--text-dim);font-size:12px}.market-outcome-form input{width:100%;min-width:0} .market-outcome-add-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.market-outcome-add-actions .inline-check{margin:0}.market-outcome-add-actions .btn{white-space:nowrap} .market-add-card{margin-top:20px;padding-top:18px;border-top:1px solid var(--border)} .market-add-form{min-width:0}.market-add-form .two-col{min-width:0}.market-add-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.market-add-actions .inline-check{margin:0}.market-add-actions .btn{min-width:160px} @media(max-width:1150px){.market-outcome-form{grid-template-columns:repeat(2,minmax(0,1fr))}.market-outcome-add-actions{grid-column:1/-1;justify-content:flex-start}.market-outcome-grid{grid-template-columns:minmax(130px,1.6fr) 70px 90px minmax(130px,1fr) 50px}} @media(max-width:760px){.market-outcome-grid-head{display:none}.market-outcome-grid.market-outcome-row{grid-template-columns:1fr 1fr;gap:8px 12px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px}.market-outcome-row:last-child{border-bottom:1px solid var(--border)}.market-outcome-name{grid-column:1/-1}.market-outcome-row>div[data-label]::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--text-dim);font-size:10px;text-transform:uppercase;letter-spacing:.3px}.market-outcome-form{grid-template-columns:1fr}.market-outcome-add-actions{grid-column:auto}.market-admin-head{align-items:flex-start}.market-add-actions{align-items:stretch;flex-direction:column}.market-add-actions .btn{width:100%}} @media(max-width:480px){.market-admin-card{padding:10px}.market-admin-head{flex-direction:column}.market-admin-head form,.market-admin-head .btn{width:100%}.market-outcome-grid.market-outcome-row{grid-template-columns:1fr}.market-outcome-name{grid-column:auto}.market-settlement-actions .btn{width:100%}} /* alpha59 test follow-up: market cards must respond to their own width, not only viewport width */ .market-admin-card,.market-add-card{container-type:inline-size} .market-outcome-form{ grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr)); } .market-outcome-add-actions{ grid-column:1/-1; justify-content:flex-start; min-width:0; } .market-outcome-add-actions .btn{max-width:100%;white-space:normal} .market-add-form .two-col{ grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:12px; } @container (max-width:700px){ .market-outcome-grid-head{display:none} .market-outcome-grid.market-outcome-row{ grid-template-columns:1fr 1fr; gap:8px 12px; border:1px solid var(--border); border-radius:8px; margin-bottom:8px; } .market-outcome-row:last-child{border-bottom:1px solid var(--border)} .market-outcome-name{grid-column:1/-1} .market-outcome-row>div[data-label]::before{ content:attr(data-label); display:block; margin-bottom:4px; color:var(--text-dim); font-size:10px; text-transform:uppercase; letter-spacing:.3px; } .market-outcome-row select{max-width:100%} .market-add-actions{align-items:stretch;flex-direction:column} .market-add-actions .btn{width:100%;min-width:0} } @container (max-width:430px){ .market-admin-head{flex-direction:column} .market-admin-head form,.market-admin-head .btn{width:100%} .market-outcome-grid.market-outcome-row{grid-template-columns:1fr} .market-outcome-name{grid-column:auto} .market-outcome-form{grid-template-columns:1fr} .market-outcome-add-actions{grid-column:auto;align-items:stretch;flex-direction:column} .market-outcome-add-actions .btn{width:100%} .market-settlement-actions .btn{width:100%} } /* v1.0.0-alpha60: global admin CRUD page pattern */ .admin-page-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-left:auto} .admin-editor-page{width:min(100%,960px);margin:0 auto;min-width:0} .admin-editor-wide{width:100%;min-width:0} .admin-form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px} .admin-danger-card{margin-top:18px;border-color:color-mix(in srgb,var(--danger) 42%,var(--border))} .admin-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin-top:14px} .admin-editor-wide>.card,.admin-editor-page>.card{min-width:0} @media(max-width:760px){ .admin-topbar{align-items:flex-start;gap:12px;flex-wrap:wrap} .admin-page-actions{width:100%;justify-content:flex-start;margin-left:0} .admin-page-actions .btn{width:100%;text-align:center} .admin-permission-grid{grid-template-columns:1fr} .admin-form-actions{align-items:stretch} .admin-form-actions .btn{width:100%;text-align:center} } /* alpha60 UX correction: create forms use a focused readable width; edit/detail pages keep their existing width rules */ .admin-editor-create{width:min(100%,760px);margin:0 auto;min-width:0} .admin-editor-create>.card{min-width:0} /* v1.0.0-alpha60: final admin form row alignment polish */ .revenue-filters label{margin-bottom:0} .js-revenue-location-wrap{position:relative} .revenue-filter-hint{position:absolute;left:0;top:calc(100% + 3px);min-height:0;white-space:normal} .revenue-filters{row-gap:20px} .cash-movement-form label,.cash-close-form label{margin-bottom:0} .cash-movement-form>.btn,.cash-close-form>.btn{align-self:end;margin-bottom:0} /* v1.0.0-alpha63: explicit market/selection acceptance controls */ .market-state-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:7px} .market-head-actions{display:flex;align-items:flex-start;justify-content:flex-end;gap:8px;flex-wrap:wrap;max-width:100%} .market-state-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .market-state-form .inline-check{margin:0;white-space:nowrap} .market-outcome-grid{grid-template-columns:minmax(145px,1.7fr) minmax(105px,.75fr) minmax(86px,.65fr) minmax(130px,1fr) minmax(110px,.8fr) minmax(125px,.9fr)} .market-outcome-edit-row input[type="number"]{width:100%;min-width:0} .market-outcome-active{margin:0;white-space:normal} .market-row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap} .market-row-actions .btn{min-width:0} .market-admin-note{margin:10px 0 0} @container (max-width:900px){ .market-outcome-grid-head{display:none} .market-outcome-grid.market-outcome-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px} .market-outcome-name{grid-column:1/-1} .market-outcome-row>div[data-label]::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--text-dim);font-size:10px;text-transform:uppercase;letter-spacing:.3px} } @container (max-width:520px){ .market-admin-head{flex-direction:column} .market-head-actions,.market-head-actions form,.market-head-actions .btn{width:100%} .market-state-form{align-items:stretch;flex-direction:column} .market-outcome-grid.market-outcome-row{grid-template-columns:1fr} .market-outcome-name{grid-column:auto} .market-row-actions .btn{flex:1} } /* v1.0.0-alpha65: dedicated sportsbook live section */ .live-home{margin:0 0 22px;border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--panel);overflow:hidden} .live-home-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px 20px;border-bottom:1px solid var(--border-soft)} .live-home-head h1{margin:2px 0 3px;font-size:24px} .live-home-kicker{display:flex;align-items:center;gap:7px;color:var(--live);font-size:11px;font-weight:800;letter-spacing:.12em} .badge-live{color:var(--live);border-color:color-mix(in srgb,var(--live) 35%,var(--border));background:color-mix(in srgb,var(--live) 10%,transparent)} .live-home-list{display:flex;flex-direction:column} .live-home-match{padding-left:20px;padding-right:20px} .live-home-event{flex:1;min-width:210px} .live-home-league{display:block;margin-bottom:3px;color:var(--text-dim);font-size:11px} .live-home-markets{display:flex;align-items:center;gap:10px;flex:2;min-width:320px;flex-wrap:wrap} .live-home-empty{padding:18px 20px;color:var(--text-muted)} @media (max-width:760px){.live-home-head{padding:16px}.live-home-match{padding:13px 16px}.live-home-markets{min-width:100%;width:100%}.live-home-event{min-width:0;width:calc(100% - 130px)}} /* alpha65: dedicated player live-betting page */ .live-page{padding-top:22px} .live-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px} .live-page-head h1{margin:2px 0 3px} .live-page-toolbar{margin-bottom:12px} .live-page-toolbar .board-search{width:min(420px,100%)} .live-page-list{border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--panel);overflow:hidden} @media (max-width:760px){.live-page{padding-top:16px}.live-page-head{align-items:center}.live-page-list .live-home-match{padding:13px 16px}} /* v1.0.0-alpha65.2: compact sportsbook/live market navigation */ .sportsbook-page{padding-top:22px} .sport-filter-strip{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;margin-bottom:14px;scrollbar-width:thin;scroll-snap-type:x proximity} .sport-filter-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:88px;min-height:68px;padding:8px 10px;border:1px solid var(--border-soft);border-radius:8px;background:var(--panel);color:var(--text-muted);text-decoration:none;scroll-snap-align:start} .sport-filter-item:hover{border-color:var(--gold-dim);color:var(--text)} .sport-filter-item.active{border-color:var(--gold-dim);background:var(--panel-2);color:var(--text)} .sport-filter-item.active::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--gold)} .sport-filter-icon{font-size:19px;line-height:1} .sport-filter-name{max-width:92px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sport-filter-count{position:absolute;top:5px;right:7px;color:var(--text-dim);font-size:9px;font-variant-numeric:tabular-nums} .compact-primary-markets{display:flex;align-items:center;gap:8px;flex:2;min-width:360px;flex-wrap:wrap} .sportsbook-compact-row .match-teams{min-width:210px} .event-link{color:inherit;text-decoration:none} .event-link:hover{color:var(--gold)} .more-markets-link{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:34px;padding:0 9px;border:1px solid var(--border);border-radius:7px;background:var(--panel-2);color:var(--text-muted);font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap} .more-markets-link:hover{border-color:var(--gold-dim);color:var(--text)} .event-markets-page{padding-top:22px;padding-bottom:80px} .event-markets-head{display:flex;justify-content:flex-start;margin-bottom:12px} .event-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px;padding:20px;border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--panel)} .event-hero-live{background:color-mix(in srgb,var(--live) 5%,var(--panel))} .event-context{margin-bottom:5px;color:var(--text-dim);font-size:12px} .event-hero h1{margin:0 0 6px;font-size:26px} .event-live-line{display:flex;align-items:center;gap:7px;color:var(--live);font-size:12px;font-weight:700} .event-market-count{padding:6px 10px;border:1px solid var(--border-soft);border-radius:999px;color:var(--text-dim);font-size:11px;white-space:nowrap} .event-market-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .event-market-card{padding:14px;border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--panel)} .event-market-title{margin-bottom:10px;color:var(--text);font-size:13px;font-weight:700} .event-market-options{display:flex;gap:7px;flex-wrap:wrap} .event-odd-btn{flex:1 1 90px;max-width:180px} @media (max-width:1100px){.compact-primary-markets{min-width:100%;width:100%}.sportsbook-compact-row .more-markets-link{margin-left:auto}} @media (max-width:760px){.sportsbook-page{padding-top:16px}.sport-filter-strip{margin-left:-2px;margin-right:-2px}.sport-filter-item{min-width:78px;min-height:62px}.sport-filter-name{max-width:78px}.sportsbook-compact-row{padding:12px 14px}.sportsbook-compact-row .match-time{width:auto;min-width:100px}.sportsbook-compact-row .match-teams{min-width:calc(100% - 130px)}.compact-primary-markets{gap:6px}.compact-primary-markets .odds-group-market{width:100%;padding-left:0;border-left:0;border-top:1px solid var(--border-soft);padding-top:8px}.event-hero{flex-direction:column}.event-market-grid{grid-template-columns:1fr}.event-market-count{align-self:flex-start}} /* v1.0.0-alpha65.3: wide responsive sportsbook grid + in-page market panel */ .sportsbook-wide-page{width:100%} .sportsbook-board-layout{grid-template-columns:minmax(var(--sportsbook-sidebar-min-width),220px) minmax(0,1fr);gap:18px} .sportsbook-main{min-width:0} .sportsbook-title-line{display:flex;align-items:flex-end;justify-content:space-between;gap:16px} .sportsbook-table-scroll{width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin} .sportsbook-table-min{min-width:calc(110px + var(--sportsbook-event-min-width) + var(--sportsbook-market-min-width) + var(--sportsbook-market-min-width) + var(--sportsbook-market-min-width) + 92px)} .sportsbook-market-header,.sportsbook-grid-row{ display:grid; grid-template-columns:110px minmax(var(--sportsbook-event-min-width),1.3fr) repeat(3,minmax(var(--sportsbook-market-min-width),1fr)) 56px; gap:8px; align-items:center; } .sportsbook-market-header{padding:8px 14px;border-top:1px solid var(--border-soft);background:var(--panel-2);color:var(--text-muted);font-size:11px;font-weight:700} .market-head-slot{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .market-head-more{text-align:center;color:var(--text-dim)} .sportsbook-grid-row{padding:9px 14px;border-top:1px solid var(--border-soft);flex-wrap:nowrap} .sportsbook-grid-row .match-time{width:auto;min-width:0} .sportsbook-grid-row .match-teams{min-width:0} .event-link-button{display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer} .event-link-button:hover{color:var(--gold)} .primary-market-slot{position:relative;min-width:0;min-height:38px;display:flex;align-items:center;gap:5px} .primary-market-line{flex:0 0 auto;min-width:24px;color:var(--text-dim);font-size:10px;text-align:right;font-variant-numeric:tabular-nums} .primary-market-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:5px;flex:1;min-width:0} .primary-market-options .odd-btn{min-width:0;width:100%;padding:5px 6px} .primary-market-empty{display:flex;align-items:center;justify-content:center;width:100%;height:34px;border:1px dashed var(--border-soft);border-radius:6px;color:var(--text-dim)} .more-market-cell{display:flex;justify-content:flex-end} .more-market-cell .more-markets-link{width:48px;min-width:48px;padding:0;border:0;background:transparent} .live-sport-groups{display:flex;flex-direction:column;gap:14px} .live-sport-group{border:1px solid var(--border-soft);border-radius:var(--radius);overflow:hidden;background:var(--panel)} .live-sport-group-head{padding:11px 14px;background:var(--panel);border-bottom:1px solid var(--border-soft)} .live-sport-group .sportsbook-market-header{border-top:0} .market-panel-overlay[hidden]{display:none!important} .market-panel-overlay{position:fixed;inset:0;z-index:500;display:flex;justify-content:flex-end} .market-panel-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58);backdrop-filter:blur(2px)} .market-panel{position:relative;z-index:1;width:clamp(420px,46vw,760px);height:100%;overflow-y:auto;background:var(--ink);border-left:1px solid var(--border);box-shadow:-18px 0 50px rgba(0,0,0,.35)} .market-panel-shell{min-height:100%;padding:20px} .market-panel-loading{padding:30px;color:var(--text-muted)} .market-panel-head{position:sticky;top:-20px;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:-20px -20px 14px;padding:20px;background:var(--ink);border-bottom:1px solid var(--border-soft)} .market-panel-head h2{margin:3px 0 5px;font-size:22px} .market-panel-head .sub{margin:0;color:var(--text-dim);font-size:12px} .market-panel-close{flex:0 0 38px;width:38px;height:38px;border:1px solid var(--border);border-radius:999px;background:var(--panel-2);color:var(--text);font-size:22px;line-height:1;cursor:pointer} .market-panel-count{margin-bottom:10px;color:var(--text-dim);font-size:11px} .market-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} body.market-panel-open{overflow:hidden} @media (max-width:900px){ .sportsbook-board-layout{grid-template-columns:1fr} .sportsbook-sidebar{min-width:0} } @media (max-width:700px){ .sportsbook-table-min{min-width:calc(96px + var(--sportsbook-event-min-width) + var(--sportsbook-market-min-width) + var(--sportsbook-market-min-width) + var(--sportsbook-market-min-width) + 72px)} .sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:96px minmax(var(--sportsbook-event-min-width),1.3fr) repeat(3,minmax(var(--sportsbook-market-min-width),1fr)) 48px;padding-left:10px;padding-right:10px} .market-panel{width:100%;max-width:none;border-left:0} .market-panel-grid{grid-template-columns:1fr} } /* alpha65.4 sportsbook three-column workspace */ .sportsbook-desktop-shell{display:grid;grid-template-columns:minmax(0,1fr) auto var(--sportsbook-betslip-width,340px);gap:12px;align-items:start;width:100%;padding:0 var(--sportsbook-page-gutter,0)} .sportsbook-primary-column{min-width:0} .sportsbook-desktop-shell .sportsbook-wide-page{width:100%;max-width:none;margin:0} .sportsbook-bet-sidecar{position:sticky;top:62px;display:block;min-width:310px;width:var(--sportsbook-betslip-width,340px);max-height:calc(100vh - 78px);overflow:hidden;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);z-index:20} .bet-sidecar-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border)} .bet-sidecar-tab{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--text-muted);padding:10px 6px;cursor:pointer}.bet-sidecar-tab strong,.bet-sidecar-tab span{display:block}.bet-sidecar-tab strong{font-size:18px;color:var(--text)}.bet-sidecar-tab span{font-size:11px}.bet-sidecar-tab.active{border-bottom-color:var(--gold);color:var(--text)} .bet-sidecar-pane{display:none;max-height:calc(100vh - 145px);overflow:auto;padding:10px}.bet-sidecar-pane.active{display:block}.bet-slip-empty{padding:34px 12px;text-align:center;color:var(--text-muted);font-size:13px}.bet-slip-selection{display:flex;gap:8px;padding:10px 4px;border-bottom:1px solid var(--border-soft)}.bet-slip-selection-text{min-width:0;flex:1}.bet-slip-remove{border:0;background:none;color:var(--text-muted);cursor:pointer;font-size:18px}.bet-slip-live-score,.open-bet-score{margin-top:4px;color:var(--accent,#56b5ff);font-size:12px}.bet-mode-wrap{margin:10px 0}.open-bets-list{display:grid;gap:7px}.open-bet-card{display:grid;gap:3px;padding:9px;border:1px solid var(--border);border-radius:7px;background:var(--panel-2);color:var(--text);text-decoration:none}.open-bet-card span{font-size:11px;color:var(--text-muted)} .market-panel-column{position:sticky;top:62px;width:clamp(360px,28vw,520px);max-height:calc(100vh - 78px);overflow:auto;background:var(--ink);border:1px solid var(--border);border-radius:var(--radius)}.market-panel-column[hidden]{display:none!important}.market-panel-column .market-panel-shell{padding:14px}.market-panel-column .market-panel-head{position:sticky;top:-14px;margin:-14px -14px 12px;padding:14px}.market-panel-column .market-panel-grid{grid-template-columns:1fr}.market-panel-open{overflow:auto!important} .sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:96px minmax(var(--sportsbook-event-min-width),1.25fr) 62px repeat(3,minmax(var(--sportsbook-market-min-width),1fr)) 48px!important}.market-head-score,.match-score-cell{display:flex;align-items:center;justify-content:center}.market-head-score{font-size:11px;color:var(--text-muted);font-weight:700}.score-value{font-weight:800;color:#57b9ef}.score-placeholder{color:var(--text-dim)} @media (max-width:1180px){.sportsbook-desktop-shell{grid-template-columns:minmax(0,1fr) var(--sportsbook-betslip-width,320px)}.market-panel-column{position:fixed;z-index:450;left:0;right:var(--sportsbook-betslip-width,320px);bottom:0;top:56px;width:auto;max-height:none;border-radius:0}.sportsbook-bet-sidecar{width:var(--sportsbook-betslip-width,320px)}} @media (max-width:760px){.sportsbook-desktop-shell{display:block}.sportsbook-bet-sidecar{position:fixed;left:8px;right:8px;bottom:8px;top:auto;width:auto;max-height:58vh;z-index:500}.market-panel-column{right:0;top:52px;bottom:0}.sportsbook-market-header,.sportsbook-grid-row{min-width:900px}} /* alpha65.5 sportsbook sidecar + non-blocking market drawer */ .sportsbook-desktop-shell{grid-template-columns:minmax(0,1fr) var(--sportsbook-betslip-width,340px)!important;gap:12px} .sportsbook-bet-sidecar{grid-column:2;grid-row:1;align-self:start} .market-panel-column{position:fixed!important;z-index:440;top:62px!important;right:calc(var(--sportsbook-betslip-width,340px) + 20px)!important;left:auto!important;bottom:auto!important;width:min(520px,calc(100vw - var(--sportsbook-betslip-width,340px) - 44px))!important;max-height:calc(100vh - 78px)!important;box-shadow:-18px 0 42px rgba(0,0,0,.28)} .bet-slip-selection.is-unavailable{opacity:.78;border-left:3px solid var(--danger);padding-left:8px}.bet-slip-unavailable{margin-top:5px;color:var(--danger);font-size:12px;font-weight:700}.bet-slip-odds-changed{margin-top:4px;color:var(--success);font-size:11px;font-weight:700}.bet-remove-unavailable{margin:8px 0 12px} .my-bets-side-list{display:grid;gap:7px}.my-bet-side-card{border:1px solid var(--border);border-radius:8px;background:var(--panel-2);overflow:hidden}.my-bet-side-toggle{width:100%;display:flex;align-items:flex-start;gap:8px;padding:10px;border:0;background:transparent;color:var(--text);text-align:left;cursor:pointer}.my-bet-side-summary{display:grid;gap:3px;min-width:0;flex:1}.my-bet-side-summary strong{font-size:13px}.my-bet-side-summary small{color:var(--text-muted);font-size:11px}.my-bet-side-plus{flex:0 0 28px;width:28px;height:28px;border:1px solid var(--border);border-radius:999px;display:grid;place-items:center;font-size:18px;color:var(--gold)}.my-bet-side-detail{padding:0 10px 10px;font-size:11px;color:var(--text-muted);display:grid;gap:5px}.my-bet-side-detail a{color:var(--gold);font-weight:700}.my-bet-side-leg{padding-top:4px;border-top:1px solid var(--border-soft)}.my-bet-side-status{font-weight:800}.my-bet-side-status.status-won{color:var(--success)}.my-bet-side-status.status-lost{color:var(--danger)}.my-bet-side-status.status-open{color:#57b9ef} @media (max-width:1180px){.sportsbook-desktop-shell{grid-template-columns:minmax(0,1fr) var(--sportsbook-betslip-width,320px)!important}.market-panel-column{right:calc(var(--sportsbook-betslip-width,320px) + 12px)!important;width:min(480px,calc(100vw - var(--sportsbook-betslip-width,320px) - 28px))!important}} @media (max-width:760px){.sportsbook-desktop-shell{display:block!important}.market-panel-column{left:0!important;right:0!important;top:52px!important;bottom:0!important;width:auto!important;max-height:none!important;border-radius:0!important}.sportsbook-bet-sidecar{grid-column:auto;grid-row:auto}} /* alpha65.6: persistent draft bet slip + compact sidebar summaries */ .bet-slip-toolbar{display:flex;justify-content:flex-end;align-items:center;min-height:34px;padding:6px 8px 0} .bet-slip-trash{width:30px;height:30px;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--text-muted);cursor:pointer;font-size:16px;line-height:1} .bet-slip-trash:hover{color:var(--text);border-color:var(--accent)} .my-bet-side-summary>small:first-of-type{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .my-bet-side-card .my-bet-side-toggle{padding-top:10px;padding-bottom:10px} /* alpha65.7: compact prematch sport navigation + switchable market columns */ .sportsbook-sports-label{margin-top:16px} .sportsbook-sidebar-sports{display:grid;gap:4px} .sportsbook-sidebar-sport{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:38px;padding:7px 9px;border:1px solid transparent;border-radius:7px;color:var(--text-muted);text-decoration:none} .sportsbook-sidebar-sport:hover{background:var(--panel-2);color:var(--text)} .sportsbook-sidebar-sport.active{border-color:var(--gold-dim);background:var(--panel-2);color:var(--text)} .sportsbook-sidebar-sport .sport-filter-icon{font-size:16px;text-align:center} .sportsbook-sidebar-sport .sport-filter-name{max-width:none;overflow:hidden;text-overflow:ellipsis} .sportsbook-sidebar-sport .sport-filter-count{position:static;font-size:10px} .market-head-select-wrap{display:grid;gap:4px;overflow:visible!important} .market-column-select{width:100%;min-width:0;height:30px;padding:3px 28px 3px 8px;border:1px solid var(--border);border-radius:6px;background:var(--panel);color:var(--text);font:inherit;font-size:11px;font-weight:800;text-align:center;cursor:pointer} .market-head-outcomes{display:grid;grid-template-columns:repeat(var(--market-outcome-count,1),minmax(0,1fr));gap:5px;min-height:13px;color:var(--text-dim);font-size:9px;font-weight:700;text-align:center} .market-head-outcomes span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .sportsbook-grid-row .primary-market-options .odd-label{display:none} .sportsbook-grid-row .primary-market-options .odd-btn{min-height:34px} .sportsbook-grid-row .primary-market-options .odd-value{font-size:12px;font-weight:800} .sportsbook-grid-row .primary-market-line{font-size:10px} .bet-slip-selection .bet-slip-live-score{display:block} @media (max-width:900px){.sportsbook-sidebar-sports{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}} /* alpha65.8: responsive 1–4 market columns, nested filters, collapsible sidebar */ .sportsbook-table-scroll{container-type:inline-size} .sportsbook-table-min{min-width:580px!important} .sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(4,minmax(128px,1fr)) 48px!important} .match-time{display:grid;gap:2px;align-content:center;font-variant-numeric:tabular-nums;white-space:nowrap}.match-date{font-size:10px;color:var(--text-dim)}.match-clock{font-size:12px;font-weight:800;color:var(--text)} @container (max-width:1120px){.sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(3,minmax(128px,1fr)) 48px!important}.market-col-4{display:none!important}} @container (max-width:900px){.sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(2,minmax(128px,1fr)) 48px!important}.market-col-3,.market-col-4{display:none!important}} @container (max-width:690px){.sportsbook-market-header,.sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px minmax(128px,1fr) 48px!important}.market-col-2,.market-col-3,.market-col-4{display:none!important}} .league-name{display:flex;align-items:center;gap:8px}.league-favorite{border:0;background:transparent;color:var(--text-dim);font-size:17px;cursor:pointer;padding:2px 4px}.league-favorite.is-favorite{color:var(--gold)} .sportsbook-sidebar-topline{display:flex;justify-content:flex-end;margin-bottom:6px}.sportsbook-sidebar-toggle{width:34px;height:34px;border:1px solid var(--border);border-radius:7px;background:var(--panel);color:var(--text);cursor:pointer}.sportsbook-board-layout.sidebar-collapsed{grid-template-columns:52px minmax(0,1fr)}.sportsbook-sidebar.is-collapsed{min-width:52px;width:52px}.sportsbook-sidebar.is-collapsed .sportsbook-sidebar-content{display:none}.sportsbook-sidebar.is-collapsed .sportsbook-sidebar-topline{justify-content:center} .sportsbook-sport-tree{display:grid;gap:3px}.sportsbook-country-tree{display:grid;gap:2px;margin:3px 0 8px 8px;padding-left:6px;border-left:1px solid var(--border-soft)}.sportsbook-country-node{display:grid;gap:2px}.sportsbook-country-row{display:flex;align-items:center;gap:3px;min-height:32px}.sportsbook-tree-caret{flex:0 0 24px;width:24px;height:24px;border:0;background:transparent;color:var(--text-muted);cursor:pointer;transition:transform .15s}.sportsbook-country-node.is-open .sportsbook-tree-caret{transform:rotate(90deg)}.sportsbook-filter-check{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0;flex:1;padding:4px 5px;border-radius:5px;color:var(--text-muted);cursor:pointer}.sportsbook-filter-check:hover{background:var(--panel-2);color:var(--text)}.sportsbook-filter-check input{margin:0}.sportsbook-filter-check span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sportsbook-filter-check small{color:var(--text-dim);font-size:10px}.sportsbook-league-tree{display:grid;gap:1px;margin-left:28px}.sportsbook-league-filter{font-size:12px}.sportsbook-more-countries{margin:5px 0 2px 28px;border:0;background:transparent;color:var(--text-muted);cursor:pointer;text-align:left}.sportsbook-more-countries:hover{color:var(--text)} .bet-system-picker{position:relative}.bet-system-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 11px;border:1px solid var(--border);border-radius:7px;background:var(--panel-2);color:var(--text);font:inherit;font-weight:700;cursor:pointer;text-align:left}.bet-system-toggle [data-bet-system-toggle-label]{font-weight:500;color:var(--text-muted);margin-right:auto}.bet-system-options{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;padding:7px;background:var(--panel);border:1px solid var(--border);border-radius:8px;box-shadow:0 12px 28px rgba(0,0,0,.35);max-height:260px;overflow:auto}.bet-system-option{display:flex;align-items:center;gap:8px;padding:8px;border-radius:6px;cursor:pointer}.bet-system-option:hover{background:var(--panel-2)} @media (max-width:900px){.sportsbook-board-layout,.sportsbook-board-layout.sidebar-collapsed{grid-template-columns:1fr}.sportsbook-sidebar{position:relative;width:100%!important}.sportsbook-sidebar.is-collapsed{min-width:0}.sportsbook-sidebar.is-collapsed .sportsbook-sidebar-content{display:none}} /* alpha65.8 prematch has no score placeholder; reserve the space for market columns */ .sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(4,minmax(128px,1fr)) 48px!important} @container (max-width:1040px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(3,minmax(128px,1fr)) 48px!important}.sportsbook-page .market-col-4{display:none!important}} @container (max-width:820px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(2,minmax(128px,1fr)) 48px!important}.sportsbook-page .market-col-3,.sportsbook-page .market-col-4{display:none!important}} @container (max-width:620px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) minmax(128px,1fr) 48px!important}.sportsbook-page .market-col-2,.sportsbook-page .market-col-3,.sportsbook-page .market-col-4{display:none!important}} .sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(3,minmax(128px,1fr)) 48px!important} .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(3,minmax(128px,1fr)) 48px!important} .sportsbook-table-min.market-columns-2 .sportsbook-market-header,.sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(2,minmax(128px,1fr)) 48px!important} .sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(2,minmax(128px,1fr)) 48px!important} .sportsbook-table-min.market-columns-1 .sportsbook-market-header,.sportsbook-table-min.market-columns-1 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px minmax(128px,1fr) 48px!important} .sportsbook-page .sportsbook-table-min.market-columns-1 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-1 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) minmax(128px,1fr) 48px!important} @container (max-width:900px){.sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px repeat(2,minmax(128px,1fr)) 48px!important}.sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) repeat(2,minmax(128px,1fr)) 48px!important}} @container (max-width:690px){.sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-table-min.market-columns-3 .sportsbook-grid-row,.sportsbook-table-min.market-columns-2 .sportsbook-market-header,.sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) 50px minmax(128px,1fr) 48px!important}.sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row,.sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header,.sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(180px,1.25fr) minmax(128px,1fr) 48px!important}} /* alpha65.8.1 compact nested filters + system picker hotfix */ .sportsbook-league-tree[hidden],.bet-system-options[hidden]{display:none!important} .sportsbook-country-select{display:flex;align-items:center;gap:8px;min-width:0;flex:1;padding:5px 6px;border:0;border-radius:5px;background:transparent;color:var(--text-muted);font:inherit;text-align:left;cursor:pointer} .sportsbook-country-select:hover{background:var(--panel-2);color:var(--text)} .sportsbook-country-flag,.sportsbook-country-check{flex:0 0 20px;width:20px;text-align:center} .sportsbook-country-check{display:none;border-radius:4px;background:#22a865;color:#fff;font-weight:800;line-height:20px;height:20px} .sportsbook-country-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .sportsbook-country-node.is-selected.is-open .sportsbook-country-flag{display:none} .sportsbook-country-node.is-selected.is-open .sportsbook-country-check{display:inline-block} .sportsbook-country-node.is-selected .sportsbook-country-name{color:var(--text);font-weight:700} .bet-system-options{grid-template-columns:1fr!important;gap:1px!important;padding:4px!important} .bet-system-option{border:0!important;border-radius:4px!important;background:transparent!important;padding:7px 8px!important} .bet-system-option:hover{background:var(--panel-2)!important} /* v1.0.0-alpha65.8.2: sidebar containment + compact system toolbar */ .sportsbook-board-layout{ grid-template-columns:minmax(var(--sportsbook-sidebar-min-width),220px) minmax(0,1fr); min-width:0; } .sportsbook-sidebar{ min-width:0; max-width:100%; overflow:hidden; } .sportsbook-sidebar-content,.sportsbook-sidebar-sports,.sportsbook-sport-tree,.sportsbook-country-tree,.sportsbook-country-node,.sportsbook-country-row{min-width:0} .sportsbook-country-select{min-width:0;overflow:hidden} .sportsbook-country-name{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .sportsbook-league-tree{min-width:0;overflow:hidden} .sportsbook-league-filter{min-width:0} .sportsbook-league-filter span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .bet-slip-toolbar{position:relative;display:flex;align-items:center;gap:8px;min-height:38px;padding:6px 8px} .bet-slip-toolbar-spacer{flex:1 1 auto} .bet-system-picker-toolbar{margin:0;min-width:0;flex:1 1 auto;max-width:calc(100% - 42px)} .bet-system-picker-toolbar[hidden]{display:none!important} .bet-system-picker-toolbar .bet-system-toggle{ min-height:30px; width:auto; max-width:100%; padding:5px 8px; gap:6px; border-radius:5px; font-size:12px; line-height:1.2; } .bet-system-picker-toolbar .bet-system-toggle strong{font-size:12px} .bet-system-picker-toolbar .bet-system-toggle [data-bet-system-toggle-label]{ min-width:0; max-width:175px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; } .bet-system-picker-toolbar .bet-system-options{left:0;right:auto;width:min(285px,calc(100vw - 48px));top:calc(100% + 3px)} .bet-system-picker-toolbar [data-bet-system-summary]{display:none!important} .bet-slip-trash{flex:0 0 34px} @media (max-width:900px){ .sportsbook-sidebar{overflow:visible} } /* v1.0.0-alpha65.8.3 sidebar/same-event guard hotfix */ .sportsbook-country-select{display:flex;align-items:center;gap:7px;min-width:0;flex:1;border:0;background:transparent;color:var(--text-muted);cursor:pointer;text-align:left;padding:4px 2px} .sportsbook-country-flag{display:inline-flex;flex:0 0 22px;min-width:22px;justify-content:center;align-items:center;font-size:18px;line-height:1;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif} .sportsbook-country-check{display:none;flex:0 0 22px;min-width:22px;justify-content:center;color:var(--success);font-weight:800} .sportsbook-country-node.is-selected.is-open .sportsbook-country-flag{display:none} .sportsbook-country-node.is-selected.is-open .sportsbook-country-check{display:inline-flex} .bet-slip-rule-notice{margin:4px 8px 8px;padding:7px 9px;border:1px solid color-mix(in srgb,var(--danger) 55%,var(--border));border-radius:7px;background:color-mix(in srgb,var(--danger) 9%,transparent);color:var(--danger);font-size:12px;font-weight:700} .sportsbook-country-node[hidden],.sportsbook-league-tree[hidden]{display:none!important} /* v1.0.0-alpha65.8.5: country flags are data-driven via countries.flag_code */ .sportsbook-country-flag{position:relative;height:20px;width:20px!important;min-width:20px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border-radius:50%;line-height:1} .sportsbook-country-flag img{display:block;width:100%;height:100%;object-fit:cover;border:1px solid rgba(255,255,255,.14);box-sizing:border-box;border-radius:50%} /* v1.0.0-alpha65.8.6: circular country flags; flag source remains DB-driven via countries.flag_code. */ /* v1.0.0-alpha65.8.7: responsive sportsbook density hotfix. Market columns keep a compact ideal width instead of stretching; the visible count steps down 4 -> 3 -> 2 -> 1 from the actual table container width. */ .sportsbook-table-scroll{ container-type:inline-size; overflow-x:auto; min-width:0; } .sportsbook-table-min{ width:100%; min-width:556px!important; } .sportsbook-page .sportsbook-market-header, .sportsbook-page .sportsbook-grid-row{ grid-template-columns:88px minmax(230px,1fr) repeat(4,190px) 48px!important; } .sportsbook-page .market-column-select{ width:190px; max-width:190px; justify-self:center; } .sportsbook-page .primary-market-slot{ width:190px; max-width:190px; justify-self:center; } .sportsbook-page .primary-market-options{ display:flex; flex:1 1 auto; justify-content:center; gap:5px; min-width:0; } .sportsbook-page .primary-market-options .odd-btn{ flex:0 0 58px; width:58px; max-width:58px; min-width:58px; padding-left:5px; padding-right:5px; } .sportsbook-page .primary-market-line{flex:0 0 25px;min-width:25px} @container (max-width:1175px){ .sportsbook-page .sportsbook-market-header, .sportsbook-page .sportsbook-grid-row{ grid-template-columns:88px minmax(230px,1fr) repeat(3,190px) 48px!important; } .sportsbook-page .market-col-4{display:none!important} } @container (max-width:950px){ .sportsbook-page .sportsbook-market-header, .sportsbook-page .sportsbook-grid-row{ grid-template-columns:88px minmax(230px,1fr) repeat(2,190px) 48px!important; } .sportsbook-page .market-col-3, .sportsbook-page .market-col-4{display:none!important} } @container (max-width:760px){ .sportsbook-page .sportsbook-market-header, .sportsbook-page .sportsbook-grid-row{ grid-template-columns:88px minmax(230px,1fr) 190px 48px!important; } .sportsbook-page .market-col-2, .sportsbook-page .market-col-3, .sportsbook-page .market-col-4{display:none!important} } /* Live tables use the same compact market cells while retaining the score column. */ .live-page .sportsbook-market-header, .live-page .sportsbook-grid-row{ grid-template-columns:88px minmax(230px,1fr) 50px repeat(4,190px) 48px!important; } .live-page .market-column-select{width:190px;max-width:190px;justify-self:center} .live-page .primary-market-slot{width:190px;max-width:190px;justify-self:center} .live-page .primary-market-options{display:flex;flex:1 1 auto;justify-content:center;gap:5px;min-width:0} .live-page .primary-market-options .odd-btn{flex:0 0 58px;width:58px;max-width:58px;min-width:58px;padding-left:5px;padding-right:5px} @container (max-width:1230px){ .live-page .sportsbook-market-header, .live-page .sportsbook-grid-row{grid-template-columns:88px minmax(230px,1fr) 50px repeat(3,190px) 48px!important} .live-page .market-col-4{display:none!important} } @container (max-width:1005px){ .live-page .sportsbook-market-header, .live-page .sportsbook-grid-row{grid-template-columns:88px minmax(230px,1fr) 50px repeat(2,190px) 48px!important} .live-page .market-col-3,.live-page .market-col-4{display:none!important} } @container (max-width:815px){ .live-page .sportsbook-market-header, .live-page .sportsbook-grid-row{grid-template-columns:88px minmax(230px,1fr) 50px 190px 48px!important} .live-page .market-col-2,.live-page .market-col-3,.live-page .market-col-4{display:none!important} } /* Reclaim width before the fixed bet-slip starts competing with the sportsbook. This is a responsive presentation rule only; the user's saved sidebar state remains untouched for wider viewports. */ @media (max-width:1280px) and (min-width:901px){ .sportsbook-board-layout, .sportsbook-board-layout.sidebar-collapsed{ grid-template-columns:52px minmax(0,1fr)!important; } .sportsbook-sidebar{ min-width:52px!important; width:52px!important; overflow:visible!important; } .sportsbook-sidebar .sportsbook-sidebar-content{display:none!important} .sportsbook-sidebar .sportsbook-sidebar-topline{justify-content:center} } /* v1.0.0-alpha65.8.8: compact sportsbook odds + shared match-info overlay trigger. */ .match-info-cell,.market-head-info{display:flex;align-items:center;justify-content:center;min-width:0} .match-info-trigger{width:30px;height:30px;padding:0;border:0;background:transparent;display:flex;align-items:flex-end;justify-content:center;gap:2px;cursor:pointer;color:var(--text-dim)} .match-info-trigger span{display:block;width:3px;border-radius:2px;background:currentColor} .match-info-trigger span:nth-child(1){height:8px}.match-info-trigger span:nth-child(2){height:14px}.match-info-trigger span:nth-child(3){height:19px} .match-info-trigger:hover,.match-info-trigger:focus-visible{color:var(--accent);outline:none} .event-info-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 12px} .event-info-tab{min-height:36px;border:1px solid var(--border);border-radius:8px;background:var(--panel-2);color:var(--text-muted);font-weight:700} .event-info-tab.active{color:var(--text);border-color:color-mix(in srgb,var(--accent) 50%,var(--border))} .event-info-placeholder{display:grid;gap:10px}.event-info-card{padding:13px;border:1px solid var(--border);border-radius:10px;background:var(--panel-2)} .event-info-card h3{margin:0 0 8px;font-size:14px}.event-info-card p{margin:0;color:var(--text-muted);line-height:1.45} .event-info-metric{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--border-soft)} .event-info-metric:first-of-type{border-top:0} /* Reference-sized market cells: compact like the supplied sportsbook examples. */ .sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(4,170px) 44px!important} .sportsbook-page .market-column-select{width:170px;max-width:170px} .sportsbook-page .primary-market-slot{width:170px;max-width:170px} .sportsbook-page .primary-market-options{gap:4px} .sportsbook-page .primary-market-options .odd-btn{flex:0 0 52px;width:52px;max-width:52px;min-width:52px;padding-left:4px;padding-right:4px} .sportsbook-page .primary-market-line{flex:0 0 22px;min-width:22px} @container (max-width:1110px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(3,170px) 44px!important}.sportsbook-page .market-col-4{display:none!important}} @container (max-width:905px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(2,170px) 44px!important}.sportsbook-page .market-col-3,.sportsbook-page .market-col-4{display:none!important}} @container (max-width:700px){.sportsbook-page .sportsbook-market-header,.sportsbook-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px 170px 44px!important}.sportsbook-page .market-col-2,.sportsbook-page .market-col-3,.sportsbook-page .market-col-4{display:none!important}} .live-page .sportsbook-market-header,.live-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(4,170px) 44px!important} .live-page .market-column-select{width:170px;max-width:170px}.live-page .primary-market-slot{width:170px;max-width:170px} .live-page .primary-market-options{gap:4px}.live-page .primary-market-options .odd-btn{flex:0 0 52px;width:52px;max-width:52px;min-width:52px;padding-left:4px;padding-right:4px} @container (max-width:1160px){.live-page .sportsbook-market-header,.live-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(3,170px) 44px!important}.live-page .market-col-4{display:none!important}} @container (max-width:955px){.live-page .sportsbook-market-header,.live-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(2,170px) 44px!important}.live-page .market-col-3,.live-page .market-col-4{display:none!important}} @container (max-width:750px){.live-page .sportsbook-market-header,.live-page .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px 170px 44px!important}.live-page .market-col-2,.live-page .market-col-3,.live-page .market-col-4{display:none!important}} /* Prevent the fixed bet slip from crushing the event table at narrower desktop widths. */ @media (max-width:1080px) and (min-width:761px){ .sportsbook-board-layout,.sportsbook-board-layout.sidebar-collapsed{grid-template-columns:52px minmax(0,1fr)!important} .sportsbook-sidebar{min-width:52px!important;width:52px!important} .sportsbook-sidebar .sportsbook-sidebar-content{display:none!important} } /* Keep compact sizing authoritative for sports that currently expose fewer than four configured header slots. */ .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(3,170px) 44px!important} .sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(2,170px) 44px!important} .sportsbook-page .sportsbook-table-min.market-columns-1 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-1 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px 170px 44px!important} .live-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(3,170px) 44px!important} .live-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(2,170px) 44px!important} .live-page .sportsbook-table-min.market-columns-1 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-1 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px 170px 44px!important} /* Container overrides for sports with fewer configured header slots. */ @container (max-width:905px){ .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px repeat(2,170px) 44px!important} .sportsbook-page .sportsbook-table-min.market-columns-3 .market-col-3{display:none!important} } @container (max-width:700px){ .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row, .sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header, .sportsbook-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 34px 170px 44px!important} .sportsbook-page .sportsbook-table-min.market-columns-3 .market-col-2, .sportsbook-page .sportsbook-table-min.market-columns-3 .market-col-3, .sportsbook-page .sportsbook-table-min.market-columns-2 .market-col-2{display:none!important} } .live-page .sportsbook-table-min{min-width:606px!important} @container (max-width:955px){ .live-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px repeat(2,170px) 44px!important} .live-page .sportsbook-table-min.market-columns-3 .market-col-3{display:none!important} } @container (max-width:750px){ .live-page .sportsbook-table-min.market-columns-3 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-3 .sportsbook-grid-row, .live-page .sportsbook-table-min.market-columns-2 .sportsbook-market-header, .live-page .sportsbook-table-min.market-columns-2 .sportsbook-grid-row{grid-template-columns:88px minmax(220px,1fr) 50px 34px 170px 44px!important} .live-page .sportsbook-table-min.market-columns-3 .market-col-2, .live-page .sportsbook-table-min.market-columns-3 .market-col-3, .live-page .sportsbook-table-min.market-columns-2 .market-col-2{display:none!important} } /* v1.0.0-alpha65.8.9: collapsible responsive bet-slip rail */ .bet-sidecar-head{display:flex;align-items:stretch;border-bottom:1px solid var(--border)} .bet-sidecar-head .bet-sidecar-tabs{flex:1 1 auto;border-bottom:0} .bet-sidecar-collapse{flex:0 0 38px;width:38px;margin:7px 7px 7px 0;border:1px solid var(--border);border-radius:8px;background:var(--panel-2);color:var(--text-muted);display:grid;place-items:center;cursor:pointer} .bet-sidecar-collapse:hover,.betslip-floating-toggle:hover{border-color:var(--gold);color:var(--text)} .betslip-ticket-icon{position:relative;display:block;width:18px;height:14px;border:2px solid currentColor;border-radius:3px} .betslip-ticket-icon:before,.betslip-ticket-icon:after{content:"";position:absolute;top:3px;width:5px;height:6px;background:var(--panel);border-radius:50%} .betslip-ticket-icon:before{left:-5px}.betslip-ticket-icon:after{right:-5px} .betslip-floating-toggle{position:fixed;z-index:430;top:76px;right:18px;width:46px;height:46px;border:1px solid var(--border);border-radius:12px;background:var(--panel);color:var(--text-muted);box-shadow:0 10px 28px rgba(0,0,0,.34);display:none;place-items:center;cursor:pointer} .betslip-floating-count{position:absolute;top:-7px;right:-7px;min-width:22px;height:22px;padding:0 6px;border:2px solid var(--background);border-radius:999px;background:var(--gold);color:#fff;font-size:11px;font-weight:800;line-height:18px;text-align:center;font-variant-numeric:tabular-nums} .sportsbook-desktop-shell.betslip-collapsed{grid-template-columns:minmax(0,1fr)!important} .sportsbook-desktop-shell.betslip-collapsed .sportsbook-bet-sidecar{display:none} .sportsbook-desktop-shell.betslip-collapsed .betslip-floating-toggle{display:grid} .sportsbook-desktop-shell.betslip-collapsed .market-panel-column{right:20px!important;width:min(520px,calc(100vw - 44px))!important} .sportsbook-desktop-shell.betslip-auto-compact.betslip-peek-open .sportsbook-bet-sidecar{display:block;position:fixed;z-index:520;top:68px;right:8px;left:auto;bottom:8px;width:min(var(--sportsbook-betslip-width,340px),calc(100vw - 16px));min-width:0;max-height:calc(100vh - 76px);box-shadow:-18px 0 42px rgba(0,0,0,.38)} .sportsbook-desktop-shell.betslip-auto-compact.betslip-peek-open .betslip-floating-toggle{display:none} .sportsbook-desktop-shell.betslip-auto-compact.betslip-peek-open .market-panel-column{right:calc(min(var(--sportsbook-betslip-width,340px),calc(100vw - 16px)) + 16px)!important;width:min(520px,calc(100vw - min(var(--sportsbook-betslip-width,340px),calc(100vw - 16px)) - 36px))!important} .sportsbook-desktop-shell.betslip-auto-compact.betslip-peek-open .sportsbook-bet-sidecar{bottom:8px} /* v1.0.0-alpha65.8.10: once compact, the left sportsbook navigation stays floating. The breakpoint itself is DB/Admin-configured and applied by JS via sidebar-auto-float. */ .sportsbook-board-layout.sidebar-auto-float{ grid-template-columns:minmax(0,1fr)!important; } .sportsbook-board-layout.sidebar-auto-float .sportsbook-main{ grid-column:1!important; min-width:0; } .sportsbook-board-layout.sidebar-auto-float .sportsbook-sidebar{ position:fixed!important; z-index:515!important; top:82px!important; left:max(10px,var(--sportsbook-page-gutter,0px))!important; width:44px!important; min-width:44px!important; max-width:44px!important; height:auto!important; max-height:none!important; overflow:visible!important; padding:0!important; margin:0!important; border:0!important; background:transparent!important; box-shadow:none!important; } .sportsbook-board-layout.sidebar-auto-float .sportsbook-sidebar-topline{ display:flex!important; justify-content:center!important; margin:0!important; } .sportsbook-board-layout.sidebar-auto-float .sportsbook-sidebar-toggle{ box-shadow:0 8px 24px rgba(0,0,0,.28); } .sportsbook-board-layout.sidebar-auto-float .sportsbook-sidebar-content{ display:none!important; } .sportsbook-board-layout.sidebar-auto-float.sidebar-drawer-open .sportsbook-sidebar{ width:min(280px,calc(100vw - 20px))!important; min-width:0!important; max-width:min(280px,calc(100vw - 20px))!important; max-height:calc(100vh - 94px)!important; overflow:auto!important; padding:10px!important; border:1px solid var(--border)!important; border-radius:var(--radius)!important; background:var(--ink)!important; box-shadow:18px 18px 46px rgba(0,0,0,.42)!important; } .sportsbook-board-layout.sidebar-auto-float.sidebar-drawer-open .sportsbook-sidebar-topline{ justify-content:flex-end!important; margin-bottom:6px!important; } .sportsbook-board-layout.sidebar-auto-float.sidebar-drawer-open .sportsbook-sidebar-content{ display:block!important; } /* v1.0.0-alpha69.2: minimally clearer Smart Sync activation control */ .smart-sync-toggle-row{padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--panel-2)} .smart-sync-toggle{display:flex;align-items:center;gap:8px;cursor:pointer} .smart-sync-toggle input[type=checkbox]{width:18px;height:18px;flex:0 0 18px} .smart-sync-toggle .badge{margin-left:6px;vertical-align:1px} .event-hot-tag{display:inline-flex;align-items:center;justify-content:center;padding:2px 5px;margin-right:6px;border-radius:4px;font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.04em;background:var(--gold);color:#17130a;vertical-align:middle} /* --- alpha71.1 backend navigation: grouped, searchable, content-height sticky sidebar --- */ @media (min-width:901px){ .admin-sidebar{ position:sticky; top:0; height:max-content; max-height:100vh; overflow-x:hidden; overflow-y:auto; align-self:start; scrollbar-gutter:stable; } } .admin-nav-search-wrap{position:relative;margin:0 8px 14px;} .admin-nav-search{width:100%;height:36px;padding:7px 10px 7px 31px;border:1px solid var(--border-soft);border-radius:8px;background:var(--panel-2);color:var(--text);font:inherit;font-size:12.5px;outline:none;} .admin-nav-search::placeholder{color:var(--text-dim);} .admin-nav-search:focus{border-color:var(--gold-dim);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 13%,transparent);} .admin-nav-search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-dim);font-size:15px;pointer-events:none;} .admin-nav{display:block;} .admin-nav-section{margin:0 0 12px;} .admin-nav-section-title{padding:0 12px 5px;color:var(--text-dim);font-size:10.5px;font-weight:700;letter-spacing:.075em;text-transform:uppercase;white-space:nowrap;} .admin-nav-section-items{display:flex;flex-direction:column;gap:1px;} .admin-sidebar .admin-nav-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;color:var(--text-muted);text-decoration:none;font-size:13.5px;margin:0;min-width:0;} .admin-sidebar .admin-nav-item:hover,.admin-sidebar .admin-nav-item.active{background:var(--panel-2);color:var(--text);} .admin-sidebar .admin-nav-item.active{box-shadow:inset 3px 0 0 var(--gold);} .admin-nav-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;color:var(--text-dim);font-size:15px;line-height:1;} .admin-nav-item.active .admin-nav-icon,.admin-nav-item:hover .admin-nav-icon{color:var(--gold);} .admin-nav-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .admin-nav-empty{padding:10px 12px;color:var(--text-dim);font-size:12.5px;} .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;} @media (max-width:900px){ .admin-sidebar{display:block;position:relative;height:auto;max-height:none;overflow:visible;border-right:0;border-bottom:1px solid var(--border-soft);} .admin-nav-search-wrap{max-width:340px;margin-bottom:10px;} .admin-nav{display:flex;gap:14px;overflow-x:auto;padding-bottom:4px;} .admin-nav-section{flex:0 0 auto;margin:0;} .admin-nav-section-items{flex-direction:row;} .admin-nav-section-title{padding-left:8px;} .admin-sidebar .admin-nav-item{white-space:nowrap;} } /* --- alpha71.2 backend sidebar: WordPress-style page scrolling, no internal scrollbar --- */ @media (min-width:901px){ .admin-sidebar{ position:sticky; top:var(--backend-sidebar-sticky-top,0px); height:max-content; max-height:none; overflow:visible; align-self:start; scrollbar-gutter:auto; } } /* --- alpha72 backend refinements --- */ @media (min-width:901px){ .admin-utility-bar{position:sticky;top:0;z-index:470;background:color-mix(in srgb,var(--ink) 94%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-soft);margin:-30px -30px 24px;padding:12px 30px;} } .system-status-body{min-height:100vh;margin:0;background:var(--ink);color:var(--text);font-family:var(--font-body);display:grid;place-items:center;padding:24px;} .system-status-shell{width:min(620px,100%);} .system-status-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(28px,6vw,54px);box-shadow:0 20px 60px rgba(0,0,0,.28);} .system-status-brand{display:inline-block;color:var(--gold);font-family:var(--font-display);font-weight:800;font-size:22px;text-decoration:none;margin-bottom:28px;} .system-status-code{font-family:var(--font-display);font-size:clamp(64px,14vw,112px);font-weight:800;line-height:.85;color:var(--gold);opacity:.92;} .system-status-card h1{font-family:var(--font-display);font-size:clamp(28px,5vw,42px);margin:18px 0 8px;} .system-status-card p{color:var(--text-muted);font-size:15px;line-height:1.6;max-width:50ch;} .system-status-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;} /* v1.0.0-alpha73: Support-Tickets */ .support-list-head,.support-ticket-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px} .support-list-head h2,.support-ticket-heading h2{margin-top:0} .support-filter-form{display:flex;align-items:center;gap:8px;min-width:220px} .support-filter-form label{color:var(--text-dim);font-size:12px;white-space:nowrap} .support-filter-form select{min-width:150px} .support-admin-detail-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:18px;align-items:start} .support-event-list{display:grid;gap:10px} .support-event-row{padding:10px 0;border-bottom:1px solid var(--border-soft);font-size:13px;line-height:1.45} .support-event-row:last-child{border-bottom:0} .support-event-row>.text-dim{display:block;font-size:11px;margin:2px 0 4px} @media(max-width:900px){.support-admin-detail-grid{grid-template-columns:1fr}.support-list-head,.support-ticket-heading{flex-direction:column}.support-filter-form{width:100%;min-width:0}.support-filter-form select{flex:1}} .support-subject-row{display:grid;grid-template-columns:minmax(220px,1fr) 110px 110px auto;gap:10px;align-items:center} .support-subject-actions{display:flex;gap:8px;justify-content:flex-end} .support-sort-input{width:100%} .support-subject-create{max-width:760px} @media(max-width:800px){.support-subject-row{grid-template-columns:1fr}.support-subject-actions{justify-content:flex-start}} /* v1.0.0-alpha73.5: player-facing checkbox row used by support actions */ .checkbox-row{display:flex;align-items:flex-start;gap:9px;margin:10px 0 14px;cursor:pointer;line-height:1.35} .checkbox-row input[type="checkbox"]{-webkit-appearance:none;appearance:none;width:18px;height:18px;min-width:18px;min-height:18px;margin:1px 0 0;padding:0;border:1px solid var(--border);border-radius:5px;background:var(--panel-2);background-repeat:no-repeat;background-position:center;background-size:12px 12px;cursor:pointer} .checkbox-row input[type="checkbox"]:focus-visible{outline:none;border-color:var(--gold);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 18%,transparent)} .checkbox-row input[type="checkbox"]:checked{border-color:var(--gold);background-color:var(--gold);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3 6.4 11.4 12.8 4.9' fill='none' stroke='%230b0e14' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")} .ticket-internal-note{align-self:center;max-width:88%;border:1px dashed var(--border-soft);border-radius:8px;padding:10px 12px;background:var(--panel);color:var(--text-dim);font-size:13px} .ticket-internal-note-meta{display:flex;justify-content:space-between;gap:12px;margin-bottom:4px;font-size:11px} .ticket-internal-note-meta strong{color:var(--text)} .ticket-internal-note-body{line-height:1.45} @media(max-width:640px){.ticket-internal-note{max-width:100%;width:100%}.ticket-internal-note-meta{flex-direction:column;gap:2px}} .support-admin-detail-grid-single{grid-template-columns:minmax(0,1fr)} .ticket-attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;padding-top:9px;border-top:1px solid var(--border-soft)} .ticket-attachment{display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:6px 9px;border:1px solid var(--border-soft);border-radius:7px;background:var(--panel);font-size:12px;text-decoration:none;overflow-wrap:anywhere} .ticket-attachment span{color:var(--text-dim);white-space:nowrap} .ticket-attachment:hover{border-color:var(--gold)} /* v1.0.0-alpha74: server-side user search/filter UX */ .user-list-card{display:grid;gap:14px} .user-list-filters{display:grid;grid-template-columns:minmax(260px,2fr) minmax(170px,1fr) minmax(170px,1fr) auto;gap:10px;align-items:end} .user-list-filters label{display:grid;gap:6px;color:var(--text-dim);font-size:12px;min-width:0} .user-list-filters input,.user-list-filters select{width:100%;min-width:0} .user-list-filter-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .user-list-result-meta{font-size:12px} @media(max-width:1050px){.user-list-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.user-list-filter-actions{grid-column:1/-1}} @media(max-width:650px){.user-list-filters{grid-template-columns:1fr}} /* v1.0.0-alpha75.5: non-blocking live-idle confirmation. */ .live-idle-modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.58)} .live-idle-modal__dialog{width:min(460px,100%);border:1px solid var(--border);border-radius:16px;background:var(--panel);box-shadow:0 24px 70px rgba(0,0,0,.42);padding:22px} .live-idle-modal__dialog h2{margin:0 0 10px;font-size:1.2rem} .live-idle-modal__text{margin:0;color:var(--text-muted);line-height:1.5} .live-idle-modal__actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:20px} @media (max-width:520px){.live-idle-modal{align-items:flex-end;padding:12px}.live-idle-modal__dialog{border-radius:16px 16px 10px 10px}.live-idle-modal__actions .btn{flex:1 1 100%}} /* alpha83.2: provider mapping autocomplete is portaled to so table/card overflow cannot clip it. */ .provider-target-results-floating{z-index:10000;max-width:calc(100vw - 24px);}