/* REMOVE BOOTSTRAP TEXT COLOR CONTROL */
body {
  --bs-body-color: #ffffff;
  font-family: 'Inter', sans-serif;
  background: #0f172a;
  color: #ffffff;
  margin: 0;
}

/* Animated Graph */
.finance-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: -1;
  background:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 40px 40px;
}

.finance-bg svg {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 300px;
  opacity: 0.2;
}

.animated-line {
  fill: none;
  stroke: #3b82f6;
  stroke-width: 3;
  stroke-dasharray: 2000;
  stroke-dashoffset: 2000;
  animation: draw 12s linear infinite;
}

@keyframes draw {
  0% { stroke-dashoffset: 2000; }
  50% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: -2000; }
}

.faq{
max-width:800px;
margin:60px auto;
padding:20px;
color:#cbd5e1;
text-align:center;
}

/* Language Toggle */
.language-toggle {
  position: fixed;
  top: 15px;
  right: 20px;
}

.language-toggle select {
  background: #1e293b;
  color: white;
  border: 1px solid #475569;
  padding: 5px 10px;
  border-radius: 8px;
}

/* Layout */
.hero {
  padding: 100px 20px 60px;
  text-align: center;
}

.card {
  background: rgba(30,41,59,0.95);
  padding: 25px;
  border-radius: 20px;
  margin-bottom: 40px;
  border: 1px solid rgba(255,255,255,0.1);
}

.card h3,
.card label,
.card p {
  color: #ffffff;
}

/* Inputs */
input {
  width: 100%;
  padding: 10px;
  background: #1e293b;
  border: 1px solid #475569;
  color: white;
  border-radius: 8px;
  margin-bottom: 15px;
}

.input-group {
  display: flex;
}

.input-group button {
  background: #1e293b;
  border: 1px solid #475569;
  color: white;
  padding: 0 15px;
  border-radius: 8px;
}

/* Buttons */
.primary-btn {
  width: 100%;
  padding: 12px;
  background: linear-gradient(90deg,#3b82f6,#2563eb);
  border: none;
  color: white;
  border-radius: 10px;
  font-weight: 600;
}

.result-box {
  margin-top: 20px;
  padding: 20px;
  background: rgba(59,130,246,0.15);
  border-radius: 15px;
}

.hidden {
  display: none;
}

.advice {
  margin-top: 10px;
  color: #cbd5e1;
}

/* Arthya */
.arthya {
  text-align: center;
  padding: 60px;
  background: #111827;
}

.arthya-btn {
  background: #8b5cf6;
  padding: 10px 25px;
  border-radius: 25px;
  color: white;
  text-decoration: none;
}

/* Support */
.support {
  text-align: center;
  padding: 40px;
}

.coffee-btn {
  background: #ff813f;
  padding: 10px 25px;
  border-radius: 25px;
  color: white;
  text-decoration: none;
}
/* Custom Select Styling */
.select-wrapper {
  position: relative;
}

.custom-select {
  width: 100%;
  padding: 10px 40px 10px 12px;
  background: #1e293b;
  border: 1px solid #475569;
  color: #ffffff;
  border-radius: 8px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}

.select-wrapper::after {
  content: "▾";
  position: absolute;
  right: 15px;
  top: 38px;
  pointer-events: none;
  color: #94a3b8;
  font-size: 14px;
}

.custom-select:focus {
  border-color: #3b82f6;
  outline: none;
}

.advanced-toggle {
  cursor: pointer;
  font-size: 14px;
  color: #94a3b8;
  margin-bottom: 10px;
}

.assumption-text {
  display: block;
  font-size: 12px;
  color: #64748b;
  margin-top: 5px;
}

#advancedSection {
  background: rgba(59,130,246,0.08);
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 10px;
}

.advanced-btn{
width:100%;
background:rgba(59,130,246,0.15);
border:1px solid rgba(59,130,246,0.4);
color:#cbd5e1;
padding:8px;
border-radius:8px;
font-size:14px;
margin-bottom:10px;
cursor:pointer;
transition:0.2s;
}

.advanced-btn:hover{
background:rgba(59,130,246,0.25);
}

.hidden{
  display:none;
}

footer {
  text-align: center;
  padding: 20px;
  color: #94a3b8;
}