/* wmcpv3 ModernTW tasarim sistemi — 4 renk varyanti (CSS custom properties).
   body sinifi ile degisir: tema-altin (varsayilan) | tema-kirmizi | tema-mavi | tema-yesil
   Tailwind renkleri bu degiskenlerden okur (tailwind.config.js). */

:root, .tema-altin {
  --wm-bg: #0d1117;
  --wm-panel: #161b26;
  --wm-panel-2: #1e2634;
  --wm-line: #2b3444;
  --wm-text: #e8edf5;
  --wm-muted: #9aa7bd;
  --wm-vurgu: #d4a24c;      /* altin */
  --wm-vurgu-2: #b4842f;
  --wm-vurgu-ink: #1a1205;  /* vurgu uzerine metin */
  --wm-vurgu-yumusak: rgba(212,162,76,0.14);
  --wm-basari: #3fb950;
  --wm-hata: #f0533f;
  --wm-uyari: #e3a008;
}
.tema-kirmizi {
  --wm-vurgu: #e0453a;
  --wm-vurgu-2: #b62f26;
  --wm-vurgu-ink: #2a0705;
  --wm-vurgu-yumusak: rgba(224,69,58,0.14);
}
.tema-mavi {
  --wm-vurgu: #3d8bfd;
  --wm-vurgu-2: #2f6ecc;
  --wm-vurgu-ink: #04122a;
  --wm-vurgu-yumusak: rgba(61,139,253,0.14);
}
.tema-yesil {
  --wm-vurgu: #35b96a;
  --wm-vurgu-2: #2a9455;
  --wm-vurgu-ink: #04210f;
  --wm-vurgu-yumusak: rgba(53,185,106,0.14);
}

/* On-scroll reveal (Alpine + IntersectionObserver ile tetiklenir) */
[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .5s ease;
  /* Guvenlik: observer/JS calismazsa da icerik 1.6sn sonra kesin gorunur */
  animation: wmRevealSafety .01s linear 1.6s forwards; }
[data-reveal].gorundu { opacity: 1; transform: none; animation: none; }
@keyframes wmRevealSafety { to { opacity: 1; transform: none; } }

/* Ince kaydirma cubugu */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--wm-bg); }
::-webkit-scrollbar-thumb { background: var(--wm-line); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: var(--wm-vurgu-2); }

/* Global native form kontrolleri — koyu tema (beyaz select/input/button okunmuyordu) */
select, input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]), textarea {
  background: var(--wm-panel-2); color: var(--wm-text);
  border: 1px solid var(--wm-line); border-radius: 8px; padding: 8px 12px;
  outline: none; -webkit-appearance: none; appearance: none;
}
select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2397a3ba' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; padding-right: 30px; cursor: pointer; }
select option { background: var(--wm-panel); color: var(--wm-text); }
select:focus, input:focus, textarea:focus { border-color: var(--wm-vurgu); }
input[type=submit], input[type=button], button.wm-btn {
  background: var(--wm-vurgu); color: var(--wm-vurgu-ink); border: 0;
  border-radius: 8px; padding: 9px 18px; font-weight: 600; cursor: pointer;
}
input[type=submit]:hover, input[type=button]:hover, button.wm-btn:hover { background: var(--wm-vurgu-2); }
