/**
 * PS2 Resume - PS1 Light Theme
 * Retro PlayStation 1 aesthetic with classic grey tones
 */

/* PS1 Theme Variables - Classic Grey Aesthetic */
[data-theme="light"] {
  /* Core PS1 Colors */
  --ps1-grey-dark: #4A4A4A;
  --ps1-grey-mid: #7B7B7B;
  --ps1-grey-light: #ABABAB;
  --ps1-grey-lighter: #D0D0D0;
  --ps1-white: #F5F5F5;
  --ps1-black: #1A1A1A;

  /* PS1 Button Colors (for accents) */
  --ps1-green: #5FB878;    /* Triangle */
  --ps1-red: #E85454;      /* Circle */
  --ps1-blue: #4A9FE8;     /* X */
  --ps1-pink: #E85487;     /* Square */

  /* Text Colors - Sharp contrast like PS1 menus */
  --text-primary: #1A1A1A;
  --text-secondary: #4A4A4A;
  --text-accent: #5FB878;

  /* Backgrounds - Solid PS1 grey gradients */
  --bg-gradient: linear-gradient(180deg,
    #E8E8E8 0%,
    #D8D8D8 30%,
    #C8C8C8 50%,
    #D8D8D8 70%,
    #E8E8E8 100%);

  --glass-bg: rgba(245, 245, 245, 0.95);
  --glass-border: rgba(74, 74, 74, 0.3);
  --panel-bg: rgba(255, 255, 255, 0.85);

  /* Shadows - More pronounced, less glow */
  --shadow-soft: 0 4px 8px rgba(0, 0, 0, 0.2);
  --shadow-strong: 0 6px 12px rgba(0, 0, 0, 0.3);
  --shadow-glow: 0 2px 4px rgba(74, 74, 74, 0.4);
}

/* Background - Simpler, more solid like PS1 */
[data-theme="light"] body::before {
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(74, 74, 74, 0.1), transparent),
    radial-gradient(2px 2px at 60% 70%, rgba(123, 123, 123, 0.08), transparent),
    radial-gradient(1px 1px at 80% 20%, rgba(74, 74, 74, 0.1), transparent),
    radial-gradient(2px 2px at 30% 80%, rgba(123, 123, 123, 0.08), transparent);
  opacity: 0.5;
}

/* Scanlines - Lighter, more retro CRT feel */
[data-theme="light"] body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.03),
    rgba(0, 0, 0, 0.03) 1px,
    transparent 1px,
    transparent 2px
  );
  pointer-events: none;
  z-index: 9999;
}

/* Header Bar - PS1 Classic Grey */
[data-theme="light"] .ps2-header-bar {
  background: linear-gradient(180deg, #BEBEBE 0%, #9E9E9E 100%);
  border-bottom: 3px solid #6E6E6E;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

[data-theme="light"] .ps2-brand {
  color: #1A1A1A;
  text-shadow:
    1px 1px 0 rgba(255, 255, 255, 0.5),
    2px 2px 2px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .ps2-brand .ps {
  color: #2A2A2A;
}

[data-theme="light"] .ps2-memory {
  color: #1A1A1A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}

/* Footer Bar - Matching header */
[data-theme="light"] .ps2-footer-bar {
  background: linear-gradient(180deg, #9E9E9E 0%, #BEBEBE 100%);
  border-top: 3px solid #6E6E6E;
  box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.3), inset 0 -1px 0 rgba(255, 255, 255, 0.4);
  color: #1A1A1A;
}

[data-theme="light"] .footer-publisher,
[data-theme="light"] .footer-year {
  color: #2A2A2A;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  font-weight: 600;
}

/* Panels - Solid PS1 style with subtle 3D effect */
[data-theme="light"] .panel {
  background: linear-gradient(135deg, #F5F5F5 0%, #E8E8E8 100%);
  border: 2px solid #9E9E9E;
  box-shadow:
    4px 4px 0 rgba(0, 0, 0, 0.15),
    inset 1px 1px 0 rgba(255, 255, 255, 0.8);
}

[data-theme="light"] .panel:hover {
  background: linear-gradient(135deg, #FAFAFA 0%, #EEEEEE 100%);
  box-shadow:
    6px 6px 0 rgba(0, 0, 0, 0.15),
    inset 1px 1px 0 rgba(255, 255, 255, 0.9);
  transform: translateY(-2px);
}

[data-theme="light"] .panel-glow {
  background: radial-gradient(circle at 50% 0%, rgba(95, 184, 120, 0.1), transparent 70%);
}

[data-theme="light"] .panel-title {
  color: #1A1A1A;
  border-bottom: 2px solid #ABABAB;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .title-icon {
  color: #5FB878;
}

/* Profile */
[data-theme="light"] .profile-name {
  background: linear-gradient(135deg, #4A4A4A 0%, #7B7B7B 50%, #4A4A4A 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(2px 2px 0 rgba(255, 255, 255, 0.5)) drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.2));
  animation: gradient-shift 3s ease infinite;
}

[data-theme="light"] .profile-name.typing::after {
  -webkit-text-fill-color: #4A4A4A;
}

[data-theme="light"] .profile-title {
  color: #4A4A4A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}

[data-theme="light"] .profile-summary {
  color: #2A2A2A;
}

[data-theme="light"] .profile-photo {
  border: 3px solid #7B7B7B;
  box-shadow:
    4px 4px 0 rgba(0, 0, 0, 0.2),
    inset 0 0 0 2px rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .initials {
  background: linear-gradient(135deg, #7B7B7B, #9E9E9E);
  color: #FFFFFF;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Contact Items - PS1 button style */
[data-theme="light"] .contact-item {
  background: linear-gradient(135deg, #E8E8E8, #D0D0D0);
  border: 2px solid #9E9E9E;
  color: #1A1A1A;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .contact-item:hover {
  background: linear-gradient(135deg, #F0F0F0, #D8D8D8);
  border-color: #7B7B7B;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.25);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .contact-icon {
  color: #4A4A4A;
}

/* Skills - PS1 memory card block style */
[data-theme="light"] .skill-tag {
  background: linear-gradient(135deg, #D8D8D8, #C0C0C0);
  border: 2px solid #8E8E8E;
  color: #1A1A1A;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.15);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .skill-tag:hover {
  background: linear-gradient(135deg, #E0E0E0, #C8C8C8);
  border-color: #5FB878;
  box-shadow: 3px 3px 0 rgba(95, 184, 120, 0.3);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .skills-category h3 {
  color: #2A2A2A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .skills-category-icon {
  color: #5FB878;
}

/* Skill Bars - Solid PS1 style */
[data-theme="light"] .skill-bar {
  background: linear-gradient(90deg, #C0C0C0, #A8A8A8);
  border: 2px solid #8E8E8E;
  box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .skill-bar-fill {
  background: linear-gradient(90deg, #5FB878, #4A9E60);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.3),
    0 0 8px rgba(95, 184, 120, 0.4);
  border-right: 2px solid #489850;
}

[data-theme="light"] .skill-bar-name {
  color: #1A1A1A;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .skill-bar-percent {
  color: #4A4A4A;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

/* Experience Timeline - PS1 Style (Solid & Blocky) */
[data-theme="light"] .timeline-container::before {
  background: linear-gradient(180deg, #8E8E8E, #6E6E6E, #8E8E8E);
  width: 3px;
  box-shadow: 1px 0 0 rgba(255, 255, 255, 0.3);
}

[data-theme="light"] .timeline-item {
  border-bottom-color: rgba(74, 74, 74, 0.2);
}

[data-theme="light"] .timeline-item::before {
  background: linear-gradient(135deg, #7B7B7B, #9E9E9E);
  border: 3px solid #4A4A4A;
  box-shadow:
    0 0 0 2px #E8E8E8,
    2px 2px 0 rgba(0, 0, 0, 0.3),
    inset 1px 1px 0 rgba(255, 255, 255, 0.5);
  width: 16px;
  height: 16px;
  left: -28px;
}

[data-theme="light"] .timeline-item:hover::before {
  background: linear-gradient(135deg, #5FB878, #4A9E60);
  border-color: #3E8050;
  box-shadow:
    0 0 0 2px #E8E8E8,
    3px 3px 0 rgba(0, 0, 0, 0.4),
    inset 1px 1px 0 rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .exp-role {
  color: #1A1A1A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .exp-company {
  color: #5FB878;
}

[data-theme="light"] .exp-period {
  color: #4A4A4A;
  background: linear-gradient(135deg, #D0D0D0, #C0C0C0);
  border: 1px solid #9E9E9E;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .exp-description {
  color: #2A2A2A;
}

[data-theme="light"] .highlight-tag {
  background: linear-gradient(135deg, #C8C8C8, #B8B8B8);
  border: 1px solid #8E8E8E;
  color: #1A1A1A;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
}

/* Education */
[data-theme="light"] .edu-degree {
  color: #1A1A1A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .edu-school {
  color: #4A9FE8;
}

[data-theme="light"] .edu-year {
  color: #4A4A4A;
  background: linear-gradient(135deg, #D0D0D0, #C0C0C0);
  border: 1px solid #9E9E9E;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .edu-description {
  color: #2A2A2A;
}

/* Certifications - PS1 icon style */
[data-theme="light"] .cert-item {
  background: linear-gradient(135deg, #E8E8E8, #D0D0D0);
  border: 2px solid #9E9E9E;
  color: #1A1A1A;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.15);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  font-weight: 500;
}

[data-theme="light"] .cert-item:hover {
  background: linear-gradient(135deg, #F0F0F0, #D8D8D8);
  border-color: #7B7B7B;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .cert-icon {
  color: #D89040;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}

/* Languages */
[data-theme="light"] .language-item {
  background: linear-gradient(135deg, #E8E8E8, #D0D0D0);
  border: 2px solid #9E9E9E;
  color: #1A1A1A;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .language-item:hover {
  background: linear-gradient(135deg, #F0F0F0, #D8D8D8);
  border-color: #7B7B7B;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .lang-name {
  color: #1A1A1A;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  font-weight: 500;
}

[data-theme="light"] .lang-level {
  color: #2A2A2A;
  font-weight: 700;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background: linear-gradient(135deg, #5FB878, #4A9E60);
  padding: 5px 14px;
  border-radius: 8px;
  border: 1px solid #3E8050;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

[data-theme="light"] .language-item svg {
  stroke: #4A4A4A;
  filter: drop-shadow(0 1px 1px rgba(255, 255, 255, 0.5));
}

/* Projects - Solid blocks */
[data-theme="light"] .project-item {
  background: linear-gradient(135deg, #F0F0F0, #E0E0E0);
  border: 2px solid #9E9E9E;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .project-item:hover {
  background: linear-gradient(135deg, #F5F5F5, #E8E8E8);
  border-color: #7B7B7B;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .project-name {
  color: #1A1A1A;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .project-description {
  color: #2A2A2A;
}

[data-theme="light"] .project-icon {
  color: #4A9FE8;
}

[data-theme="light"] .tech-tag {
  background: linear-gradient(135deg, #C8C8C8, #B8B8B8);
  border: 1px solid #8E8E8E;
  color: #1A1A1A;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
}

/* Buttons - Classic PS1 style (NO BLUE!) */
[data-theme="light"] .btn-start {
  background: linear-gradient(135deg, #7B7B7B, #5E5E5E) !important;
  color: #FFFFFF !important;
  border: 3px solid #4A4A4A !important;
  box-shadow:
    3px 3px 0 rgba(0, 0, 0, 0.4),
    inset 1px 1px 0 rgba(255, 255, 255, 0.4) !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
  font-weight: 600;
  animation: none !important; /* Remove blue pulse animation */
}

[data-theme="light"] .btn-start:hover {
  background: linear-gradient(135deg, #8E8E8E, #6E6E6E) !important;
  box-shadow:
    4px 4px 0 rgba(0, 0, 0, 0.5),
    inset 1px 1px 0 rgba(255, 255, 255, 0.5) !important;
  transform: translate(-1px, -1px) !important;
}

[data-theme="light"] .btn-start svg {
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.5));
}

/* Main Competencies - Override inline styles */
[data-theme="light"] .main-competencies h3 {
  color: #4A4A4A !important;
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5) !important;
}

[data-theme="light"] .main-competencies li {
  color: #1A1A1A !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .main-competencies svg {
  stroke: #5FB878 !important;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
}

/* Language & Theme & Sound Selectors - PS1 style */
[data-theme="light"] .language-selector,
[data-theme="light"] .theme-toggle,
[data-theme="light"] .sound-toggle {
  background: linear-gradient(135deg, #BEBEBE, #9E9E9E);
  border: 2px solid #7B7B7B;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.25), inset 1px 1px 0 rgba(255, 255, 255, 0.4);
}

[data-theme="light"] .lang-btn {
  color: #1A1A1A;
  border: 1px solid #8E8E8E;
  background: linear-gradient(135deg, #D0D0D0, #B8B8B8);
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .lang-btn:hover {
  background: linear-gradient(135deg, #D8D8D8, #C0C0C0);
  border-color: #6E6E6E;
  color: #000000;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .lang-btn.active {
  background: linear-gradient(135deg, #5FB878, #4A9E60);
  border-color: #3E8050;
  color: #FFFFFF;
  box-shadow:
    inset 1px 1px 3px rgba(0, 0, 0, 0.3),
    0 0 8px rgba(95, 184, 120, 0.4);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

[data-theme="light"] .theme-icon {
  fill: #1A1A1A;
  stroke: #1A1A1A;
  filter: drop-shadow(0 1px 1px rgba(255, 255, 255, 0.5));
}

[data-theme="light"] .theme-toggle:hover,
[data-theme="light"] .sound-toggle:hover {
  background: linear-gradient(135deg, #C8C8C8, #A8A8A8);
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.3), inset 1px 1px 0 rgba(255, 255, 255, 0.5);
  transform: translate(-1px, -1px);
}

[data-theme="light"] .sound-icon {
  color: #1A1A1A;
  filter: drop-shadow(0 1px 1px rgba(255, 255, 255, 0.5));
}

[data-theme="light"] .sound-toggle.muted {
  opacity: 0.5;
}

/* Guarantee all text is visible - override any white/light colors */
[data-theme="light"] .cert-list li,
[data-theme="light"] .cert-item span {
  color: #1A1A1A !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

/* Override ALL blue colors from PS2 theme */
[data-theme="light"] .skill-bar-fill {
  background: linear-gradient(90deg, #5FB878, #4A9E60) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.3),
    0 0 8px rgba(95, 184, 120, 0.4) !important;
  border-right: 2px solid #489850 !important;
}

[data-theme="light"] .btn-download {
  background: linear-gradient(145deg, #7B7B7B, #5E5E5E) !important;
  border-color: #4A4A4A !important;
  color: #FFFFFF !important;
}

[data-theme="light"] .btn-download:hover {
  background: linear-gradient(145deg, #8E8E8E, #6E6E6E) !important;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.4) !important;
}

/* Remove any remaining blue SVG strokes */
[data-theme="light"] svg[stroke*="#00"],
[data-theme="light"] svg[stroke*="blue"] {
  stroke: #4A4A4A !important;
}

/* Override any blue text colors */
[data-theme="light"] *[style*="color: #00"],
[data-theme="light"] *[style*="color:#00"],
[data-theme="light"] *[style*="color: rgb(0"] {
  color: #1A1A1A !important;
}

/* Ensure links are dark grey, not blue */
[data-theme="light"] a {
  color: #4A4A4A;
}

[data-theme="light"] a:hover {
  color: #5FB878;
}

/* Remove smooth transitions for more instant PS1 feel */
[data-theme="light"] * {
  transition: none;
}

/* Add back transitions only for transform (for button press effect) */
[data-theme="light"] .lang-btn,
[data-theme="light"] .theme-toggle,
[data-theme="light"] .sound-toggle,
[data-theme="light"] .btn-start,
[data-theme="light"] .skill-tag,
[data-theme="light"] .contact-item,
[data-theme="light"] .cert-item,
[data-theme="light"] .language-item,
[data-theme="light"] .project-item {
  transition: transform 0.1s ease;
}

/* ========== MUSIC PLAYER (PS1 LIGHT THEME) ========== */
[data-theme="light"] .easter-egg-panel {
  border: 3px solid #5FB878 !important;
  box-shadow:
    4px 4px 0 rgba(0, 0, 0, 0.3),
    inset 0 0 20px rgba(95, 184, 120, 0.1) !important;
  background: var(--panel-bg);
}

[data-theme="light"] .panel-music .panel-title {
  color: #5FB878;
  text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .music-subtitle {
  color: #4A4A4A;
}

[data-theme="light"] .track-item {
  background: rgba(200, 200, 200, 0.5);
  border: 2px solid #ABABAB;
}

[data-theme="light"] .track-item:hover {
  background: rgba(95, 184, 120, 0.15);
  border-color: #5FB878;
}

[data-theme="light"] .track-item.active {
  background: linear-gradient(135deg, rgba(95, 184, 120, 0.2), rgba(74, 159, 232, 0.2));
  border-color: #5FB878;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .track-number {
  color: #5FB878;
}

[data-theme="light"] .track-title {
  color: #1A1A1A;
}

[data-theme="light"] .track-artist {
  color: #5FB878;
}

[data-theme="light"] .track-style {
  color: #7B7B7B;
}

[data-theme="light"] .track-duration {
  color: #7B7B7B;
}

[data-theme="light"] .player-controls {
  background: rgba(180, 180, 180, 0.8);
  border: 2px solid #ABABAB;
}

[data-theme="light"] .now-playing-label {
  color: #7B7B7B;
}

[data-theme="light"] .now-playing-title {
  color: #5FB878;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .now-playing-artist {
  color: #4A9FE8;
}

[data-theme="light"] .time-current,
[data-theme="light"] .time-total {
  color: #4A4A4A;
}

[data-theme="light"] .progress-bar {
  background: rgba(0, 0, 0, 0.15);
  border: 1px solid #ABABAB;
}

[data-theme="light"] .progress-fill {
  background: linear-gradient(90deg, #5FB878, #4A9FE8);
}

[data-theme="light"] .control-btn {
  background: linear-gradient(180deg, #D0D0D0 0%, #ABABAB 100%);
  border: 2px solid #7B7B7B;
  color: #5FB878;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .control-btn:hover {
  background: linear-gradient(180deg, #E0E0E0 0%, #C0C0C0 100%);
  border-color: #5FB878;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.3);
  transform: translateY(-2px);
}

[data-theme="light"] .control-btn:active {
  transform: translateY(1px);
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .control-btn.play-btn {
  background: linear-gradient(180deg, #5FB878 0%, #4A9070 100%);
  border-color: #3A7050;
  color: #fff;
}

[data-theme="light"] .control-btn.play-btn:hover {
  background: linear-gradient(180deg, #70C888 0%, #5FB878 100%);
}

[data-theme="light"] .hide-player-btn {
  background: linear-gradient(180deg, #D0D0D0 0%, #ABABAB 100%);
  border: 2px solid #7B7B7B;
  color: #E85454;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .hide-player-btn:hover {
  background: rgba(232, 84, 84, 0.2);
  border-color: #E85454;
}

[data-theme="light"] .volume-slider {
  background: rgba(0, 0, 0, 0.15);
  border: 1px solid #ABABAB;
}

[data-theme="light"] .volume-slider::-webkit-slider-thumb {
  background: linear-gradient(135deg, #5FB878, #4A9FE8);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .volume-slider::-moz-range-thumb {
  background: linear-gradient(135deg, #5FB878, #4A9FE8);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] #easterEggPublisher:active,
[data-theme="light"] #easterEggYear:active {
  color: #5FB878;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}

/* ========== SCROLLBAR (PS1 LIGHT THEME) ========== */
/* Main scrollbar (body) */
body[data-theme="light"]::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body[data-theme="light"]::-webkit-scrollbar-track {
  background: rgba(171, 171, 171, 0.4);
}

body[data-theme="light"]::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #9E9E9E 0%, #7B7B7B 100%);
  border-radius: 4px;
  border: 1px solid #6E6E6E;
}

body[data-theme="light"]::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #ABABAB 0%, #9E9E9E 100%);
}

/* Inner elements scrollbars */
[data-theme="light"] *::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

[data-theme="light"] *::-webkit-scrollbar-track {
  background: rgba(171, 171, 171, 0.4);
  border-radius: 4px;
}

[data-theme="light"] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #9E9E9E 0%, #7B7B7B 100%);
  border-radius: 4px;
  border: 1px solid #6E6E6E;
}

[data-theme="light"] *::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #ABABAB 0%, #9E9E9E 100%);
}

/* Firefox scrollbar */
body[data-theme="light"] {
  scrollbar-width: thin;
  scrollbar-color: #7B7B7B rgba(171, 171, 171, 0.4);
}

[data-theme="light"] * {
  scrollbar-width: thin;
  scrollbar-color: #7B7B7B rgba(171, 171, 171, 0.4);
}

/* ========== TEXT SELECTION (PS1 LIGHT THEME) ========== */
[data-theme="light"] ::selection {
  background: #5FB878;
  color: #1A1A1A;
}

[data-theme="light"] ::-moz-selection {
  background: #5FB878;
  color: #1A1A1A;
}