/* Investment Calculator CSS - Theme color: #1dcf9f */
:root{
  --accent: #1dcf9f;
  --bg: #ffffff;
  --card: #fbfffc;
  --text: #122022;
  --muted: #6b7d7a;
  --radius: 14px;
  --shadow: 0 8px 28px rgba(17, 24, 24, 0.06);
}

.irc-container{
  max-width: 980px;
  margin: 18px auto;
  padding: 18px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:var(--text);
}

.irc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.irc-header h2{
  font-size:20px;
  margin:0;
  color:var(--accent);
}

.controls-top{display:flex;align-items:center;gap:8px;}

.small-note{font-size:12px;color:var(--muted);margin-left:6px;}

.irc-form{
  background:var(--card);
  padding:16px;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  margin-bottom:14px;
}

.row{display:flex;flex-direction:column;margin-bottom:12px;}
.row label{font-weight:600;margin-bottom:6px;}
.row input[type="number"], .row select{
  padding:10px 12px;border-radius:10px;border:1px solid #d7ebe4;font-size:14px;
  outline:none;box-sizing:border-box;
}
.row input[type="number"]:focus, .row select:focus{box-shadow:0 0 0 4px rgba(29,207,159,0.08);border-color:var(--accent);}

.rate-scenarios{margin-top:8px;display:flex;gap:8px;}
.scenario{background:#eaf7f2;border:1px solid rgba(29,207,159,0.15);padding:6px 8px;border-radius:8px;cursor:pointer;font-size:13px;}

.actions{display:flex;gap:10px;justify-content:flex-start;margin-top:6px;}
.btn{padding:9px 12px;border-radius:10px;border:1px solid transparent;background:transparent;cursor:pointer;font-weight:600;}
.btn.primary{background:var(--accent);color:#fff;border-color:rgba(0,0,0,0.04);}
.btn.ghost{background:transparent;border:1px solid #cfeee5;color:var(--text);}

.tooltip-panel{
  display:none;
  margin-top:10px;
  background:#ffffffaa;border-radius:10px;padding:10px;border:1px solid #e6f6ef;
}
.tooltip-item{display:none;padding:8px 6px;border-radius:8px;background:#f8fffc;margin-bottom:6px;font-size:13px;color:var(--muted);}

.info{
  display:inline-block;margin-left:8px;background:var(--accent);color:#fff;border-radius:50%;width:18px;height:18px;line-height:18px;text-align:center;font-size:12px;cursor:pointer;
}

/* Results */
.irc-results{margin-top:14px;display:block;}
.results-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.results-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.card{background:var(--card);padding:12px;border-radius:12px;box-shadow:var(--shadow);}
.summary p{margin:8px 0;color:var(--muted);font-size:14px;}
.milestones ul{margin:8px 0;padding-left:18px;color:var(--muted);}

/* small screens */
@media (max-width:780px){
  .results-grid{grid-template-columns:1fr;}
  .irc-container{padding:12px;}
  .irc-header{flex-direction:column;align-items:flex-start;gap:8px;}
}

/* Dark mode */
.dark-mode{
  --bg: #081014;
  --card: #0b1720;
  --text: #d7f7f0;
  --muted: #9fbfb3;
  background:var(--bg);color:var(--text);
}
.dark-mode .irc-form, .dark-mode .card{background: #071316;border:1px solid rgba(255,255,255,0.02);box-shadow:none;}
.dark-mode .info{background:#10d3a6;color:#042621;}
.dark-mode .scenario{background:transparent;border:1px solid rgba(29,207,159,0.12);color:var(--muted);}

/* small helpers */
.small-checkbox{font-size:13px;color:var(--muted);display:block;margin-top:6px;}
.result-actions{display:flex;gap:8px;}