/* Qylit Account – white/green theme, no browser dialogs, simple errors */
.qylit-hidden{display:none!important}

.qylit-wrap{
  --q-bg:#ffffff;
  --q-text:#0b1220;
  --q-muted:#667085;
  --q-card:#ffffff;
  --q-border:#e5e7eb;
  --q-shadow:0 10px 30px rgba(2,8,23,.06);
  --q-green:#16a34a;
  --q-green-dark:#12803b;
  --q-red:#ef4444;
  --q-blue:#2563eb;
  color:var(--q-text);
}
.qylit-title{margin:0 0 12px;font-size:clamp(26px,4vw,42px);line-height:1.1}
.qylit-card{
  background:var(--q-card);
  border:1px solid var(--q-border);
  border-radius:16px;padding:20px;margin:16px 0;box-shadow:var(--q-shadow);
}
.qylit-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.qylit-controls{margin-top:12px}

.qylit-badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;border:1px solid #d1d5db;background:#f8fafc;color:#334155}
.qylit-badge.pro{border-color:var(--q-green); background:#ecfdf5; color:#065f46}

.qylit-muted{color:var(--q-muted)}

.qylit-btn{
  appearance:none;border-radius:10px;cursor:pointer;border:1px solid #d1d5db;
  background:#ffffff;color:var(--q-text);padding:10px 14px;transition:transform .06s ease, box-shadow .15s ease, background .15s ease;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
}
.qylit-btn:hover{transform:translateY(-1px)}
.qylit-btn:disabled{opacity:.6;cursor:not-allowed}

.qylit-btn.primary{
  border-color:var(--q-green); background:var(--q-green); color:#fff;
}
.qylit-btn.primary:hover{background:var(--q-green-dark)}
.qylit-btn.danger{border-color:var(--q-red); background:#fff; color:var(--q-red)}
.qylit-btn.danger:hover{background:#fff0f0}

.qylit-link{background:none;border:none;color:var(--q-green);text-decoration:underline;cursor:pointer;padding:0}

.qylit-toast{
  position:fixed; right:24px; bottom:24px; z-index:99999;
  min-width:240px; max-width:420px; padding:12px 14px; border-radius:10px;
  background:#ffffff; border:1px solid var(--q-border); color:var(--q-text);
  box-shadow:var(--q-shadow); opacity:0; pointer-events:none; transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease;
}
.qylit-toast.show{opacity:1; pointer-events:auto; transform:translateY(0)}
.qylit-toast.ok{border-color:#16a34a}
.qylit-toast.warn{border-color:#f59e0b}
.qylit-toast.err{border-color:#ef4444}

/* Modal overlay + panel (light) */
.qylit-modal{position:fixed; inset:0; background:rgba(15,23,42,.35); display:none; align-items:center; justify-content:center; z-index:99998}
.qylit-modal[aria-hidden="false"]{display:flex}
.qylit-modal__panel{
  width:min(560px, 92vw); background:#ffffff; border:1px solid var(--q-border);
  border-radius:16px; box-shadow:var(--q-shadow); padding:16px 16px 18px;
}
.qylit-modal__header{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px}
.qylit-modal__header h3{margin:0; font-size:20px}
.qylit-x{background:#ffffff;border:1px solid #d1d5db;border-radius:8px;width:32px;height:32px;color:var(--q-text);cursor:pointer}
.qylit-label{display:block; font-size:13px; color:#475569; margin:6px 0}

/* Inputs – fix text always dark, incl. Chrome autofill */
.qylit-input{
  width:100%; background:#ffffff; color:#0b1220 !important; border:1px solid #d1d5db;
  border-radius:10px; padding:10px 12px; outline:none; transition:border-color .15s ease, box-shadow .15s ease;
}
.qylit-input::placeholder{color:#94a3b8}
.qylit-input:focus{border-color:var(--q-green); box-shadow:0 0 0 3px rgba(22,163,74,.20)}
/* Chrome autofill fix */
.qylit-input:-webkit-autofill,
.qylit-input:-webkit-autofill:hover,
.qylit-input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 30px #ffffff inset !important;
  -webkit-text-fill-color:#0b1220 !important;
  caret-color:#0b1220 !important;
}

.qylit-btn.is-loading{position:relative; pointer-events:none; opacity:.9}
.qylit-btn.is-loading::after{
  content:""; position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; border:2px solid rgba(0,0,0,.25); border-top-color:#0b1220; border-radius:50%;
  animation:qspin .7s linear infinite;
}
@keyframes qspin{to{transform:translateY(-50%) rotate(360deg)}}