/* Love Calculator additions — uses the same theme variables as the rest of the site */
.lm-form { display:flex; flex-direction:column; gap:14px; margin-bottom:22px; text-align:left; }
.lm-field label { display:block; font-size:.78rem; font-weight:600; color:var(--text-muted); margin-bottom:6px; }
.lm-field input {
  width:100%; padding:13px 16px; border-radius:14px; border:2px solid var(--border-color);
  background:var(--bg-primary); color:var(--text-primary);
  font-family:'Poppins',sans-serif; font-size:.9rem; outline:none; transition:border-color .25s;
}
.lm-field input:focus { border-color:var(--color-primary); }
.lm-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.lm-optional { font-size:.72rem; color:var(--text-muted); font-weight:500; margin:2px 0 -4px; }
.lm-error {
  display:none; background:rgba(255,80,80,.1); border:1px solid rgba(255,80,80,.3);
  color:#e74c3c; border-radius:12px; padding:10px 14px; font-size:.8rem; font-weight:500;
}
.lm-breakdown { margin-top:16px; text-align:left; display:flex; flex-direction:column; gap:12px; }
.lm-bd-top { display:flex; justify-content:space-between; font-size:.78rem; font-weight:600; color:var(--text-secondary); margin-bottom:5px; }
.lm-bd-bar { height:6px; background:var(--border-color); border-radius:3px; overflow:hidden; }
.lm-bd-fill { height:100%; width:0; background:var(--gradient-main); border-radius:3px; transition:width 1s ease; }

.lm-flames { margin-top:14px; font-size:.85rem; font-weight:700; color:var(--color-primary); }
.lm-disclaimer { margin-top:14px; font-size:.7rem; color:var(--text-muted); line-height:1.6; }

/* ── Mobile fix: date inputs must never be wider than the card ── */
.lm-field { min-width:0; }
.lm-field input { max-width:100%; box-sizing:border-box; min-width:0; }
.lm-field input[type="date"] {
  -webkit-appearance:none; appearance:none;
  display:block; padding:13px 12px; font-size:.82rem; min-height:50px;
}
.lm-field input[type="date"]::-webkit-date-and-time-value { text-align:left; }
.lm-container { overflow-x:hidden; }
@media (max-width:480px) {
  .lm-row { grid-template-columns:1fr; }   /* one DOB under the other on phones */
  .lm-action-btn:disabled { opacity: 0.7; cursor: wait; }
}