/* PRESTIG POKER — refined theme */

:root {
  --pp-void: #070708;
  --pp-ink: #0c0c0e;
  --pp-panel: rgba(12, 12, 14, 0.82);
  --pp-panel-border: rgba(255, 255, 255, 0.07);
  --pp-gold: #c2a35a;
  --pp-gold-bright: #d8bc74;
  --pp-gold-dim: rgba(194, 163, 90, 0.22);
  --pp-text: #eceae4;
  --pp-muted: #9a9690;
  --pp-danger: #8f2a2a;
  --pp-ok: #2d8f56;
}

html {
  min-height: 100%;
  background: var(--pp-void);
}

body.prestig-app,
body {
  background-color: var(--pp-void) !important;
  background-image:
    radial-gradient(ellipse 90% 70% at 50% 28%, rgba(28, 24, 18, 0.45), transparent 72%),
    linear-gradient(180deg, rgba(7, 7, 8, 0.25) 0%, rgba(7, 7, 8, 0.55) 48%, rgba(5, 5, 6, 0.88) 100%),
    url('../../data/background.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed;
  color: var(--pp-text);
  font-family: 'Barlow', Roboto, sans-serif !important;
}

/* Soft vignette + film grain (no harsh overlays) */
body::before {
  content: '';
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(ellipse 75% 60% at 50% 40%, transparent 30%, rgba(0, 0, 0, 0.55) 100%);
  opacity: 1;
}

body::after {
  content: '';
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 0;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

#pokerclock,
#gamecanvas,
#gamedialog,
#gamedialog_rotated,
#gamespinner {
  position: relative;
  z-index: 1;
}

#pokerclock {
  animation: pp-enter 0.7s ease both;
}

@keyframes pp-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

/*
  Buttons are absolutely positioned by the app with fixed line-height /
  padding / Roboto metrics. Do NOT change font, letter-spacing, transform,
  box-shadow or border-radius — that shifts labels and icons.
*/
button,
.actionbutton,
.playbutton {
  font-family: Roboto, Arial, sans-serif !important;
  letter-spacing: normal;
  text-transform: none;
  transform: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  filter: none;
  transition: filter 0.15s ease, opacity 0.15s ease;
}

.actionbutton:enabled:hover,
.playbutton:enabled:hover {
  filter: brightness(1.06);
  transform: none !important;
}

.actionbutton:enabled:active,
.playbutton:enabled:active {
  filter: brightness(0.97);
  transform: none !important;
}

.actionbutton,
.actionbutton span,
.actionbutton:enabled:active,
.actionbutton:enabled:hover {
  color: #000 !important;
}

.actionbutton:disabled,
.playbutton:disabled {
  opacity: 0.2 !important;
  filter: none;
}

.actionbutton_red,
.actionbutton_red span {
  color: #000 !important;
}

/* Panels / settings */
.settingarea {
  background:
    linear-gradient(180deg, rgba(22, 22, 24, 0.92), rgba(10, 10, 12, 0.9)) !important;
  color: var(--pp-text) !important;
  border: 1px solid var(--pp-panel-border) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 0;
  box-sizing: border-box;
}

.settingarea_tab_inactive {
  background-color: rgba(255, 255, 255, 0.04) !important;
  color: var(--pp-muted) !important;
  border: none !important;
  transition: color 0.15s ease, background-color 0.15s ease;
}

.settingarea_tab_active {
  background-color: rgba(0, 0, 0, 0.55) !important;
  color: var(--pp-gold-bright) !important;
  border: none !important;
  box-shadow: inset 0 -2px 0 var(--pp-gold);
}

.gameinput {
  background-color: rgba(0, 0, 0, 0.55) !important;
  color: var(--pp-text) !important;
  border: 1px solid transparent !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  letter-spacing: normal;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gameinput:focus {
  border-color: rgba(194, 163, 90, 0.45) !important;
  box-shadow: none;
  outline: none;
}

.gameinput::placeholder,
.gameinput::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.32) !important;
}

/* Dialogs */
#gamespinner,
#gamedialog,
#gamedialog_rotated {
  background-color: rgba(4, 4, 5, 0.72) !important;
  backdrop-filter: blur(8px) saturate(0.9);
  -webkit-backdrop-filter: blur(8px) saturate(0.9);
}

#gamedialog > div,
#gamedialog_string_wrapper,
#gamedialog_rotated > div {
  border-radius: 4px;
}

::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(194, 163, 90, 0.28);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(194, 163, 90, 0.5);
}

a {
  color: var(--pp-gold-bright) !important;
  text-decoration: none;
  transition: color 0.15s ease;
}

a:hover {
  color: #e8d29a !important;
}

/* Brand logo — keep original bounce transform intact */
.bounce-top {
  animation-duration: 1s !important;
}

.spinner {
  /* no extra filter: avoids layout/paint shift around spinner */
}

/* Subtle top hairline accent */
#pokerclock::before {
  content: '';
  pointer-events: none;
  position: fixed;
  top: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  z-index: 2;
  background: linear-gradient(90deg, transparent, rgba(194, 163, 90, 0.35), transparent);
  opacity: 0.7;
}

@media (max-width: 768px) {
  body {
    background-attachment: scroll;
  }

  #pokerclock::before {
    left: 6%;
    right: 6%;
  }
}