@charset "UTF-8";
/**
 * Summer Theme - Current Default Theme
 * Theme: Golden Summer (Mùa Hạ)
 * Colors: Golden yellow, warm tones
 */

:root {
  /* Base Colors - Summer Theme (Current) */
  --bg-color: #191b24;
  --text-base: #aaa;
  --primary-color: #ffd875;
  --primary-color-hover: #ffde8a;
  --primary-button-text: #191b24;
  --primary-text: #ffd875;
  
  /* Summer Accent Colors */
  --summer-gold: #ffd875;
  --summer-gold-light: #ffde8a;
  --summer-gold-dark: #fecf59;
  --summer-yellow: #fff1cc;
  
  /* Background Layers - Summer Theme */
  --top-bg-default: #202331;
  --border-color: #ffffff10;
  --bg-2: #282b3a;
  --bg-3: #2f3346;
  --bg-4: #3e435c;
  --bg-5: #535d8e;
  --footer-bg: #0f111a;
  
  /* Shadows */
  --shadow-large: 0 0 20px 20px rgba(0, 0, 0, 0.1);
  --h-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
  --category-name: #fff;
  --padding-base: 40px;
  --bs-border-color: rgba(0, 0, 0, 0.3);
  
  /* Toast Colors */
  --Toastify__progress-bar--error: #f85f5f !important;
  --toastify-icon-color-error: #f85f5f !important;
}

/* Summer Background */
body {
  background: var(--bg-color);
}

/* Summer Link Colors */
a {
  color: #fff;
}

a:hover {
  color: var(--primary-text);
}

/* Summer Button Styles */
.button-play,
.primary-gradient,
.w-chart .number {
  background: #fecf59;
  background: linear-gradient(39deg, #fecf59, #fff1cc);
}

.button-play {
  box-shadow: 0 5px 10px 5px rgba(255, 218, 125, 0.1);
}

.button-play:hover {
  box-shadow: 0 5px 10px 10px rgba(255, 218, 125, 0.15);
}