/* Kawaii-Trash Theme - Bright, playful, explosive colors */

:root[data-theme="kawaii"] {
  /* Background */
  --bg-primary: 255 255 255;    /* #FFFFFF Snow White */
  --bg-secondary: 255 250 250;  /* Slightly off-white */

  /* Text */
  --text-primary: 51 51 51;
  --text-secondary: 102 102 102;

  /* Border */
  --border: 0 204 0;            /* #00CC00 Lime Green */

  /* Accent */
  --accent-from: 255 0 119;     /* #FF0077 Bright Pink */
  --accent-to: 102 0 255;       /* #6600FF Deep Electric */
  --accent-green: 0 204 0;      /* #00CC00 Lime Green */
  --accent-orange: 255 153 0;   /* #FF9900 Orange Warning */
}

[data-theme="kawaii"] {
  background: white;
  color: rgb(51 51 51);
}

[data-theme="kawaii"] header {
  background: linear-gradient(90deg, #FF0077 0%, #FF9900 50%, #00CC00 100%);
  border: none;
  box-shadow: 0 4px 20px rgba(255, 0, 119, 0.3);
}

[data-theme="kawaii"] header a,
[data-theme="kawaii"] header .text-gray-700 {
  color: white !important;
  font-weight: 700;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

[data-theme="kawaii"] .text-2xl.font-bold a {
  color: white !important;
  filter: drop-shadow(0 2px 8px rgba(255, 255, 255, 0.5));
}

[data-theme="kawaii"] select {
  background: white;
  border: 2px solid rgb(0 204 0);
  color: rgb(51 51 51);
  font-weight: 600;
}

[data-theme="kawaii"] select:hover {
  border-color: rgb(255 0 119);
  box-shadow: 0 0 10px rgba(255, 0, 119, 0.3);
}

[data-theme="kawaii"] input {
  background: white;
  border: 3px solid rgb(0 204 0);
  color: rgb(51 51 51);
  font-weight: 500;
}

[data-theme="kawaii"] input:focus {
  border-color: rgb(255 0 119);
  box-shadow: 0 0 15px rgba(255, 0, 119, 0.4);
  outline: none;
}

[data-theme="kawaii"] .generator-card,
[data-theme="kawaii"] .rounded-lg.shadow-lg {
  background: white !important;
  border: 3px solid rgb(255 0 119);
  box-shadow: 8px 8px 0 rgba(255, 0, 119, 0.2);
  border-radius: 16px;
}

[data-theme="kawaii"] .bg-gray-50 {
  background: rgb(255 250 250) !important;
  border: 2px solid rgb(0 204 0);
  border-radius: 12px;
}

[data-theme="kawaii"] button,
[data-theme="kawaii"] .text-blue-600 {
  color: rgb(255 153 0) !important;
  font-weight: 700;
}

[data-theme="kawaii"] button:hover,
[data-theme="kawaii"] .text-blue-600:hover {
  color: rgb(255 0 119) !important;
  transform: scale(1.05);
  transition: all 0.2s ease;
}

[data-theme="kawaii"] h1 {
  background: linear-gradient(135deg, #FF0077 0%, #FF9900 50%, #6600FF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900;
}

[data-theme="kawaii"] .text-gray-500,
[data-theme="kawaii"] .text-gray-600,
[data-theme="kawaii"] .text-gray-700 {
  color: rgb(102 102 102) !important;
}

[data-theme="kawaii"] footer {
  background: linear-gradient(90deg, #6600FF 0%, #FF0077 100%);
  border-top: none;
}

[data-theme="kawaii"] footer,
[data-theme="kawaii"] footer a,
[data-theme="kawaii"] footer .text-gray-400 {
  color: white !important;
}

/* Success/Copy animation */
[data-theme="kawaii"] .copied {
  animation: kawaii-bounce 0.5s ease;
  color: rgb(0 204 0) !important;
  font-weight: 700;
}

@keyframes kawaii-bounce {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2) rotate(5deg);
  }
}

/* Fun hover effects */
[data-theme="kawaii"] .generator-card:hover {
  transform: translateY(-4px);
  box-shadow: 12px 12px 0 rgba(255, 0, 119, 0.3);
  transition: all 0.3s ease;
}
