/* Dark widget styling */
.mortgage-widget {
  font-family: "Helvetica Neue", Arial, sans-serif;
  max-width: 1100px;
  margin: 24px auto;
  background: #174035;
  color: #e9eef6;
  border-radius: 12px;
  padding: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.6);
}
.mortgage-widget h2 { text-align:center; margin:0 0 12px; font-size:28px; color:#fff; }

/* tabs */
.mortgage-tabs { display:flex; gap:12px; justify-content:center; margin-bottom:18px; flex-wrap:wrap; }
.mortgage-tab { padding:10px 14px; border-radius:8px; cursor:pointer; color:#9fb0cc; font-weight:700; font-size:13px; border:1px solid transparent; }
.mortgage-tab.active { color:#0f1113; background:#F75709; box-shadow:0 6px 18px rgba(43,156,255,0.18); }

/* layout */
.mortgage-body { display:flex; gap:18px; margin-top:8px; align-items:start; }
.left-panel { flex:1; }
.right-panel { width:360px; background:#07101a; border-radius:10px; padding:18px; color:#dff7ff; }

/* panels */
.mortgage-panel { display:none; background:transparent; padding:12px; border-radius:8px; }
.mortgage-panel.active { display:block; }

/* grid inputs */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
.field { margin-bottom:10px; }
.field label { display:block; font-size:13px; color:#cfe6ff; margin-bottom:6px; font-weight:600; }

/* money & number inputs */
.input-money, .input-number, select, input[type="email"] {
  width:100%;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.06);
  background:#07101a;
  color:#e6f3ff;
  box-sizing:border-box;
}

/* slider row */
.slider-row { display:flex; align-items:center; gap:10px; }
.slider-row input[type="range"] { -webkit-appearance:none; width:100%; height:6px; border-radius:6px; #F75709; outline:none; }
.slider-row output { min-width:140px; text-align:right; font-weight:800; color:#dff7ff; background:rgba(255,255,255,0.03); padding:8px 10px; border-radius:8px; border:1px solid rgba(255,255,255,0.03); }

/* right panel */
.big-payment { text-align:center; font-size:32px; font-weight:900; margin-bottom:6px; color:#fff; }
.small { font-size:12px; color:#9fb0cc; }
.right-list { margin-top:14px; }
.right-list .row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid rgba(255,255,255,0.03); color:#cfe6ff; }
.right-list .row .value { font-weight:900; }

/* actions */
.mortgage-actions { margin-top:12px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.mortgage-actions .emailField { flex:1 1 280px; padding:10px 12px; border-radius:8px; background:#07101a; color:#e6f3ff; border:1px solid rgba(255,255,255,0.04); }
.mortgage-actions button { padding:12px 16px; border-radius:8px; border:none; cursor:pointer; background:#F75709; color:#07101a; font-weight:700; }
.mortgage-actions .msg { flex-basis:100%; margin-top:10px; display:none; font-weight:700; color:#1bff9b; }

/* responsive */
@media (max-width:980px){
  .mortgage-body { flex-direction:column; }
  .right-panel { width:100%; }
  .grid-2 { grid-template-columns:1fr; }
}