/* VELO table chrome for play.velo.poker — white felt text + optional chat/stats.
   Hide-lobby is gated by html/body.velo-embed (velo-table.js). Direct visits
   keep the PM lobby. Do not inject the 9080 preview banner. */

@import url("https://fonts.googleapis.com/css2?family=Oxanium:wght@300;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap");

:root {
  --velo-bg: #161826;
  --velo-shell: #101220;
  --velo-surface: #232532;
  --velo-text: #e9e9ed;
  --velo-accent: #dc5b48;
  --velo-gold: #d9a441;
  --velo-felt: #4a1620;
  --velo-tab: 36px;
}

html,
body,
#client_div {
  background-color: var(--velo-bg);
}

#client_div {
  background-image: none;
}

/* Compact edge tabs — closed by default; no full-width chat bar */
#velo-dock-chat {
  display: none;
  flex-direction: column;
  position: fixed !important;
  width: auto;
  max-width: 360px;
  background: transparent;
  font-family: Inter, system-ui, sans-serif;
  color: var(--velo-text);
  box-sizing: border-box;
  z-index: 2147483000;
  pointer-events: auto;
}

body.has-velo-table #velo-dock-chat {
  display: flex;
}

#velo-dock-stats {
  display: none !important;
}

#velo-dock-chat {
  left: 10px;
  bottom: 10px;
  align-items: flex-start;
}

#velo-dock-stats {
  right: 10px;
  bottom: 10px;
  align-items: flex-end;
}

.velo-dock-toggle {
  flex: 0 0 auto;
  height: var(--velo-tab);
  min-width: 72px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid rgba(217, 164, 65, 0.45);
  border-radius: 8px;
  background: var(--velo-shell);
  color: var(--velo-gold);
  font-family: Oxanium, Inter, sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  text-align: center;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
}

body.velo-chat-open #velo-dock-chat > .velo-dock-toggle {
  border-radius: 8px 8px 0 0;
  border-bottom-color: transparent;
  box-shadow: none;
}

.velo-dock-body {
  display: none;
  flex: 1 1 auto;
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: var(--velo-bg);
  border: 1px solid rgba(217, 164, 65, 0.35);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}

body.velo-chat-open #velo-dock-chat .velo-dock-body {
  display: flex;
}

#velo-dock-chat .velo-dock-body {
  width: 340px;
  height: 220px;
  flex-direction: column;
}

#velo-dock-stats .velo-dock-body {
  width: 280px;
  height: 320px;
  flex-direction: column;
}

#velo-dock-chat .chattextframe,
#velo-dock-chat .chateditframe,
#velo-dock-stats .tablestatstext,
#velo-dock-stats .tablestatsheader {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: 100% !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

#velo-dock-chat .chattextframe {
  flex: 1 1 auto;
  height: auto !important;
  min-height: 48px;
  background: var(--velo-bg) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(233, 233, 237, 0.08) !important;
}

#velo-dock-chat .chateditframe {
  flex: 0 0 28px;
  height: 28px !important;
  background: var(--velo-surface) !important;
  border: 0 !important;
  display: flex !important;
}

#velo-dock-chat .tablechattext,
#velo-dock-chat .tablechatedit,
#velo-dock-chat .tablechatsendbtn,
#velo-dock-stats .tablestatstext {
  position: absolute !important;
  transform: none !important;
}

#velo-dock-chat .tablechattext,
#velo-dock-stats .tablestatstext {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  color: var(--velo-text) !important;
}

#velo-dock-chat .tablechatedit {
  top: 0 !important;
  left: 0 !important;
  right: 36px !important;
  width: auto !important;
  height: 28px !important;
}

#velo-dock-chat .tablechatsendbtn {
  top: 0 !important;
  left: auto !important;
  right: 0 !important;
  width: 36px !important;
  height: 28px !important;
}

#velo-dock-stats .tablestatsheader {
  flex: 0 0 28px;
  height: 28px !important;
  line-height: 28px !important;
  background: var(--velo-shell) !important;
  color: var(--velo-gold) !important;
  font-family: Oxanium, Inter, sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: block !important;
}

#velo-dock-stats .tablestatstext {
  flex: 1 1 auto;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  display: block !important;
  background: var(--velo-bg) !important;
}

#velo-dock-chat .memo,
#velo-dock-stats .memo,
#velo-dock-chat .tablechattext,
#velo-dock-stats .tablestatstext {
  background: var(--velo-bg) !important;
  color: var(--velo-text) !important;
  font-family: Inter, ui-monospace, monospace !important;
  font-size: 12px !important;
  line-height: 16px !important;
}

#velo-dock-chat input,
#velo-dock-chat .input,
#velo-dock-chat .tablechatedit input {
  background: var(--velo-shell) !important;
  color: var(--velo-text) !important;
  border: 0 !important;
}

.chattextframe,
.chateditframe {
  background: var(--velo-surface) !important;
  border-color: rgba(233, 233, 237, 0.12) !important;
  box-shadow: none !important;
  color: var(--velo-text) !important;
}

.tablecontent > .chattextframe,
.tablecontent > .chateditframe,
.tablecontent > .chatstatsicon {
  display: none !important;
}

.tablecontent .sp_graphic {
  visibility: visible !important;
}
.tablecontent .sp_seat,
.tablecontent .sp_graphic,
.tablecontent .sp_name,
.tablecontent .sp_info {
  overflow: visible !important;
}

/* Table / seat / waiting / prompt text: force brand white over PM oncolor (red). */
/* Seat hover card: PM default fill is #E0E0E0; felt text is #e9e9ed (white on white). */
.tooltip {
  background: #232532 !important;
  background-color: #232532 !important;
  color: #e9e9ed !important;
  -webkit-text-fill-color: #e9e9ed !important;
  border: 1px solid #3a3c4a;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.tooltip,
.tooltip * {
  color: #e9e9ed !important;
  -webkit-text-fill-color: #e9e9ed !important;
}

.tablecontent,
.tablecontent .bannermiddle,
.tablecontent .bannerleft,
.tablecontent .bannerleft2,
.tablecontent .bannerright,
.tablecontent .bannerright2,
.tablecontent .tablemessage,
.tablecontent .sp_name,
.tablecontent .sp_info,
.tablecontent .infobar,
.tablecontent .foldanybet,
.tablecontent .outnexthand,
.tablecontent .outnextblind,
.tablecontent .straddle,
.tablecontent .icmchop,
.tablecontent .runtwice,
.tablecontent .showonfold,
.tablecontent .totalplate,
.infobar {
  color: var(--velo-text) !important;
  -webkit-text-fill-color: var(--velo-text) !important;
}

.sp_name,
.sp_info {
  font-family: Oxanium, Inter, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}

.bannermiddle,
.bannerleft,
.bannerleft2,
.bannerright,
.bannerright2,
.tablemessage {
  font-family: Oxanium, Inter, sans-serif !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
}

.totalplate {
  font-family: Oxanium, Inter, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  color: var(--velo-text) !important;
  background-color: var(--velo-shell) !important;
  border: 1px solid var(--velo-gold) !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

/* —— Embed-only: hide PM lobby chrome, contain+center the 700×510 stage.
   Gated by html/body.velo-embed (set by velo-table.js). Direct play.velo.poker
   visits do not get this class. Do not stretch tablecontent to 100% — that
   cropped/zoomed the oval on the previous hide-lobby attempt. */

html.velo-embed,
body.velo-embed,
body.velo-embed #client_div {
  background-color: var(--velo-bg) !important;
  background-image: none !important;
  overflow: hidden !important;
}

body.velo-embed #Lobby,
body.velo-embed #MinTray,
body.velo-embed #IconBarLobby,
body.velo-embed #IconBarLeave,
body.velo-embed #OpenTableControls,
body.velo-embed #BGTile,
body.velo-embed #BGLogo {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

body.velo-embed.has-velo-table #Connecting,
body.velo-embed.has-velo-table #ConnectFullBtn,
body.velo-embed.has-velo-table #ConnectRegBtn,
body.velo-embed.has-velo-table #Login {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.velo-embed #client_div > .dialog:not(.table):not(#Lobby):has(> .tablecontent) {
  background: var(--velo-bg) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .header,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .icontray,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .menu,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .maxbtn,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .minbtn,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .closebtn,
body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .tablecontent > .resize {
  display: none !important;
}

body.velo-embed #client_div > .dialog:not(.table):has(> .tablecontent) > .tablecontent {
  top: 0 !important;
  left: 0 !important;
  width: 700px !important;
  height: 510px !important;
  overflow: visible !important;
  transform-origin: top left !important;
  background-color: var(--velo-bg) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}

body.velo-embed .tablecontent {
  background-color: var(--velo-bg) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  overflow: visible !important;
}

body.velo-embed #velo-dock-chat {
  z-index: 2147483000;
}

body.velo-embed:not(.velo-chat-open) #velo-dock-chat {
  max-width: 120px;
}