/* Games Page Styles */

/* Body Background - Keep transparent to show site-wide background */
body {
  background: transparent;
}

/* Games Page Heading - Styling for the main title outside the container */
h1 {
  color: #FFA500;
  text-align: center;
  margin: 20px 0;
  font-size: 2.2em;
  background: transparent;
}

/* Game Tabs - Container for tab buttons */
.game-tabs {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

/* Tab Buttons - Individual game selection buttons */
.tab-button {
  padding: 10px 20px;
  border: 2px solid #FFA500;
  border-radius: 5px;
  background: transparent;
  color: #FFA500;
  font-size: 1em;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
}

/* Tab Button Hover State */
.tab-button:hover {
  background: #FFA500;
  color: #181818;
}

/* Tab Button Active State */
.tab-button.active {
  background: #FFA500;
  color: #181818;
  border-color: #FFA500;
  font-weight: bold;
  box-shadow: 0 2px 8px rgba(255,165,0,0.15);
}

/* Responsive iframe styling */
iframe {
  width: calc(100% - 48px); /* 24px margin on each side */
  height: 100%;
  min-height: 480px;
  max-width: calc(100% - 48px);
  margin: 0 24px; /* 24px margin on left and right */
  display: block;
}