:root{
  --codemyo-primary:#774eb4;
  --codemyo-primary-2:#9b6dff;
  --codemyo-dark:#0b1020;

  --codemyo-text:#101828;
  --codemyo-muted:#667085;

  --codemyo-surface:#ffffff;
  --codemyo-surface-2:#f7f7fb;

  --codemyo-border:#e7e7f0;
  --codemyo-border-strong:#d6d6e6;

  --codemyo-shadow: 0 20px 50px rgba(0,0,0,.12);
  --codemyo-shadow-soft: 0 14px 30px rgba(16,24,40,.10);

  --codemyo-radius:16px;
  --codemyo-radius-sm:12px;

  --codemyo-focus: 0 0 0 4px rgba(119,78,180,.18);
}

/* Genel kart */
.codemyo-card{
  border: 0;
  border-radius: var(--codemyo-radius);
  box-shadow: var(--codemyo-shadow);
}

.codemyo-card-header{
  border-top-left-radius: var(--codemyo-radius);
  border-top-right-radius: var(--codemyo-radius);
}

/* Sol panel arka planı */
.codemyo-auth-left{
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(119,78,180,.55), transparent 60%),
    radial-gradient(700px 400px at 90% 90%, rgba(119,78,180,.35), transparent 60%),
    linear-gradient(135deg, #0a0f1d 0%, #0f1630 40%, #070a12 100%);
}

/* Ekka primary override */
.codemyo-auth .bg-primary,
.codemyo-auth .btn-primary{
  background: linear-gradient(135deg, var(--codemyo-primary) 0%, var(--codemyo-primary-2) 100%) !important;
  border-color: rgba(0,0,0,0) !important;
}

.codemyo-auth .btn-primary{
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 700;
  letter-spacing: .2px;
  box-shadow: 0 14px 26px rgba(119,78,180,.25);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.codemyo-auth .btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(119,78,180,.30);
  filter: brightness(0.98);
}

.codemyo-auth .btn-primary:active{
  transform: translateY(0px);
  box-shadow: 0 12px 24px rgba(119,78,180,.22);
}

/* Form başlık metinleri */
.codemyo-auth .card-body h4{
  letter-spacing: -0.2px;
}

.codemyo-auth label.small{
  font-weight: 600;
  color: var(--codemyo-muted);
}

/* ===== INPUT’LARI “premium” yapan ana bölüm ===== */

/* Input group genel */
.codemyo-auth .input-group{
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 0 rgba(16,24,40,.02);
}

/* Icon kısmı */
.codemyo-auth .input-group-text{
  background: var(--codemyo-surface-2);
  border: 1px solid var(--codemyo-border);
  border-right: 0;
  color: #475467;
  padding: 0 14px;
  min-width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Input */
.codemyo-auth .form-control{
  height: 48px;
  border: 1px solid var(--codemyo-border);
  border-left: 0;
  border-radius: 0;
  background: var(--codemyo-surface);
  color: var(--codemyo-text);
  font-weight: 600;
  padding: 10px 14px;
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

.codemyo-auth .form-control::placeholder{
  color: #98a2b3;
  font-weight: 500;
}

/* Focus: mor glow + border */
.codemyo-auth .form-control:focus{
  outline: none;
  box-shadow: var(--codemyo-focus);
  border-color: rgba(119,78,180,.55);
  background: #fff;
}

/* Focus olduğunda icon tarafı da uyum sağlasın */
.codemyo-auth .input-group:focus-within .input-group-text{
  border-color: rgba(119,78,180,.55);
  box-shadow: var(--codemyo-focus);
  color: var(--codemyo-primary);
}

/* Ekka bazen inputlarda radius bozar; düzelt */
.codemyo-auth .input-group .input-group-text:first-child{
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
}
.codemyo-auth .input-group .form-control:last-child{
  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
}

/* Checkbox alanı biraz daha modern */
.codemyo-auth .control.control-checkbox{
  font-weight: 600;
  color: #344054;
}

/* Linkler */
.codemyo-auth a.text-blue{
  color: var(--codemyo-primary) !important;
  font-weight: 700;
  text-decoration: none;
}
.codemyo-auth a.text-blue:hover{
  text-decoration: underline;
}

/* Mini help kutusu */
.codemyo-mini-help{
  background: #f7f7fb;
  border: 1px solid #ececf5;
  border-radius: 14px;
  padding: 12px 12px;
}

/* Quote kutusu micro animasyon */
.codemyo-quote-box{
  margin-top: 18px;
  padding: 18px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  transition: opacity .2s ease, transform .2s ease;
}
.codemyo-quote-box.fade-out{
  opacity: .15;
  transform: translateY(2px);
}

/* Mobilde sağ panel daha ferah olsun */
@media (max-width: 991px){
  .codemyo-auth .card-body{
    padding: 28px !important;
  }
  .codemyo-auth .btn-primary{
    padding: 12px 14px;
  }
}