/* Gedeelde premium popupstijl, gebaseerd op de Daguitdaging. */
:is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog, .bid-popup-dialog) {
  border: 1px solid #c79b49 !important;
  border-radius: 24px !important;
  background: linear-gradient(145deg, #fffaf0 0%, #27452c 100%) !important;
  color: #30261d !important;
  box-shadow: 0 22px 55px rgba(11, 24, 15, .28), inset 0 0 0 3px rgba(255,255,255,.54) !important;
  font-family: Arial, sans-serif !important;
  animation: unified-popup-open .22s ease-out both;
}

:is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog) > .last-trick-header {
  border: 0 !important;
  border-bottom: 1px solid rgba(160, 119, 49, .3) !important;
  background: transparent !important;
  box-shadow: none !important;
}

:is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog) > .last-trick-header span {
  color: #514236 !important;
  font-family: Arial, sans-serif !important;
}

:is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog) > .last-trick-header strong {
  color: #12472b !important;
  font-family: Arial, sans-serif !important;
}

:is(.last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog) > .last-trick-header > button,
.online-dialog:not(:has(.daily-reference-hero)) #closeOnlineButton {
  min-width: 38px !important;
  min-height: 34px !important;
  padding: 7px 11px !important;
  border: 1px solid #cda34e !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #194f33, #0e3823) !important;
  color: #f8e3aa !important;
  box-shadow: 0 3px 8px rgba(15, 50, 31, .17) !important;
  font: 700 12px/1 Arial, sans-serif !important;
}

:is(.last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog) > .last-trick-header > button:hover,
.online-dialog:not(:has(.daily-reference-hero)) #closeOnlineButton:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.05) !important;
}

/* Inhoud blijft goed leesbaar op het groene deel van de gradient. */
:is(.last-trick-summary, .boom-winner, .chat-history-note) {
  border-color: rgba(205, 163, 78, .35) !important;
  background: rgba(255, 250, 240, .88) !important;
  color: #3d3025 !important;
}

.bid-popup-dialog > span { color: #a67525 !important; }
.bid-popup-dialog > strong { color: #123f28 !important; }
.bid-popup-dialog > p { color: #4f463c !important; }

/* De biedkeuze moet altijd boven het scorebord en de tafelacties liggen. */
.bid-popup:not([hidden]) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 6000 !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}

.bid-popup:not([hidden]) .bid-popup-dialog {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
}

body:has(.bid-popup:not([hidden])) :is(.score-board, .score-actions, #newGameButton, #lastTrickButton) {
  pointer-events: none !important;
}

@keyframes unified-popup-open {
  from { opacity: 0; transform: scale(.98); }
  to { opacity: 1; transform: scale(1); }
}

@media (max-width: 760px) {
  :is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog, .bid-popup-dialog) {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    border-radius: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.online-dialog, .last-trick-dialog, .boom-dialog, .info-dialog, .settings-dialog, .chat-history-dialog, .bid-popup-dialog) {
    animation: none !important;
  }
}