/* DigitalSafety – Scam Analyzer (Blue theme, readable) */
:root{
  --ds-sa-bg:#f5faff;
  --ds-sa-card:#ffffff;
  --ds-sa-card2:#f0f6ff;
  --ds-sa-text:#0f172a;
  --ds-sa-sub:#334155;
  --ds-sa-muted:#64748b;
  --ds-sa-line:#cfe0f5;
  --ds-sa-accent:#2563eb;
  --ds-sa-accent2:#1d4ed8;
  --ds-sa-good:#22c55e;
  --ds-sa-warn:#f59e0b;
  --ds-sa-bad:#ef4444;
}

.ds-sa-wrap{
  width:100%;
  max-width:980px;
  margin:18px auto;
  padding:0 12px;
  color:var(--ds-sa-text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

.ds-sa-card{
  background:var(--ds-sa-card);
  border:1px solid var(--ds-sa-line);
  border-radius:18px;
  padding:18px;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
}

.ds-sa-head{margin-bottom:10px}
.ds-sa-title{margin:0 0 6px 0;font-size:22px;line-height:1.2;color:#1e3a8a}
.ds-sa-sub{margin:0 0 14px 0;color:var(--ds-sa-sub);font-size:13.5px}

.ds-sa-label{display:block;margin:6px 0 8px 0;font-weight:700;color:var(--ds-sa-text)}

.ds-sa-textarea{
  width:100%;
  box-sizing:border-box;
  border-radius:14px;
  border:1px solid #93c5fd;
  background:#ffffff;
  color:var(--ds-sa-text);
  padding:12px;
  outline:none;
  min-height:180px;
  font-size:15px;
  line-height:1.45;
}
.ds-sa-textarea::placeholder{color:#94a3b8}
.ds-sa-textarea:focus{
  border-color:var(--ds-sa-accent);
  box-shadow:0 0 0 3px rgba(37,99,235,.18);
}

.ds-sa-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:10px;
}

.ds-sa-btn{
  border:none;
  border-radius:999px;
  padding:10px 14px;
  background:linear-gradient(135deg,var(--ds-sa-accent),var(--ds-sa-accent2));
  color:#ffffff;
  font-weight:800;
  cursor:pointer;
}
.ds-sa-btn:hover{filter:brightness(1.03)}
.ds-sa-btn:disabled{opacity:.6;cursor:not-allowed}

.ds-sa-btn-ghost{
  background:#e0ecff;
  color:#1e3a8a;
  border:1px solid #93c5fd;
}

.ds-sa-hint{color:var(--ds-sa-muted);font-size:13px}

.ds-sa-result{margin-top:16px;padding-top:12px;border-top:1px dashed var(--ds-sa-line)}
.ds-sa-score{margin-bottom:10px}

.ds-sa-meter{
  width:100%;
  height:10px;
  background:#e5edff;
  border-radius:999px;
  overflow:hidden;
  border:1px solid var(--ds-sa-line);
}
.ds-sa-meter-bar{
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--ds-sa-good),var(--ds-sa-accent),var(--ds-sa-bad));
}

.ds-sa-scoreline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:10px;
}
.ds-sa-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  background:#e0ecff;
  color:#1e3a8a;
  border:1px solid #93c5fd;
}
.ds-sa-percent{font-weight:900;font-size:16px;color:var(--ds-sa-text)}

.ds-sa-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:12px;
}

.ds-sa-col{
  background:var(--ds-sa-card2);
  border:1px solid #c7ddf5;
  border-radius:14px;
  padding:12px;
}
.ds-sa-col h4{margin:0 0 8px 0;color:#0f172a}

.ds-sa-list{margin:0;padding-left:18px}
.ds-sa-list li{margin:6px 0;color:var(--ds-sa-text)}
.ds-sa-list a{color:var(--ds-sa-accent);text-decoration:underline;word-break:break-word}

.ds-sa-tips{
  margin-top:12px;
  background:#ecfdf5;
  border:1px solid #86efac;
  border-radius:14px;
  padding:12px;
  color:#064e3b;
}
.ds-sa-tips h4{margin:0 0 8px 0;color:#065f46}
.ds-sa-tips li{color:#064e3b}

.ds-sa-foot{margin-top:10px;color:var(--ds-sa-muted)}

@media (max-width: 760px){
  .ds-sa-grid{grid-template-columns:1fr}
}