/* Utilo Loan Manager — frontend styles
   Mirrors the Utilo theme's design tokens so plugin pages look native. */
.ulm-app{
  --ink:#12203D; --ink-soft:#4B5670; --paper:#F1F3EE; --card:#FFFFFF;
  --line:#D8DDD1; --gold:#E3A62F; --gold-deep:#B9821B; --ledger:#1F6F5C; --ledger-soft:#E7F0EC;
  --font-display:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-mono:'IBM Plex Mono','Courier New',monospace;
  --radius:3px;
  max-width:900px;
  margin:0 auto;
  padding:48px 24px 80px;
  font-family:var(--font-body);
  color:var(--ink);
}
.ulm-app *{ box-sizing:border-box; }
.ulm-app h1,.ulm-app h2,.ulm-app h3,.ulm-app h4{ font-family:var(--font-display); color:var(--ink); margin:0 0 .5em; }
.ulm-page-title{ font-size:clamp(1.8rem,3vw + 1rem,2.6rem); }
.ulm-muted{ color:var(--ink-soft); }
.ulm-hint{ font-size:.8rem; color:var(--ink-soft); margin:.3em 0 0; }

.ulm-banner{ padding:.9em 1.2em; border-radius:var(--radius); font-size:.92rem; margin-bottom:1.6rem; border:1px solid transparent; }
.ulm-banner-success{ background:var(--ledger-soft); color:var(--ledger); border-color:#bfe0d4; }
.ulm-banner-error{ background:#FBE9E7; color:#9A3B2E; border-color:#F1C7C0; }
.ulm-banner-warning{ background:#FFF3CD; color:#8a6d1a; border-color:#f5e2a3; margin-bottom:1.2rem; }

.ulm-gate{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:2.4rem; text-align:center; }
.ulm-gate p{ margin-bottom:1.2rem; color:var(--ink-soft); }

/* buttons */
.ulm-btn{ display:inline-flex; align-items:center; gap:.5em; font-weight:600; font-size:.98rem; padding:.85em 1.6em; border-radius:var(--radius); border:1px solid transparent; cursor:pointer; text-decoration:none; }
.ulm-btn:hover{ text-decoration:none; }
.ulm-btn-primary{ background:var(--gold); color:var(--ink); }
.ulm-btn-primary:hover{ background:var(--gold-deep); }

/* forms */
.ulm-form{ max-width:640px; }
.ulm-form-wide{ max-width:760px; }
.ulm-row{ margin-bottom:1.2rem; }
.ulm-row label{ display:block; font-size:.85rem; font-weight:600; color:var(--ink); margin-bottom:.4em; }
.ulm-row input[type="text"], .ulm-row input[type="email"], .ulm-row input[type="tel"],
.ulm-row input[type="number"], .ulm-row input[type="password"], .ulm-row input[type="file"],
.ulm-row select, .ulm-row textarea{
  width:100%; font-family:var(--font-body); font-size:.98rem; padding:.75em .9em;
  border:1px solid var(--line); border-radius:var(--radius); background:#fff; color:var(--ink);
}
.ulm-row textarea{ resize:vertical; }
.ulm-row input:focus, .ulm-row select:focus, .ulm-row textarea:focus{ outline:2px solid var(--gold); outline-offset:1px; }
.ulm-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:0 1.4rem; }
@media(max-width:640px){ .ulm-grid-2{ grid-template-columns:1fr; } }
.ulm-checkbox-row{ display:flex; align-items:flex-start; gap:.6em; font-size:.9rem; color:var(--ink-soft); margin-bottom:1.4rem; }
.ulm-checkbox-row input{ margin-top:.25em; }

.ulm-avatar-row{ display:flex; align-items:center; gap:1.4rem; margin-bottom:2rem; }
.ulm-avatar{ border-radius:50%; object-fit:cover; background:var(--line); }

/* wp_login_form default markup */
.ulm-app #loginform p{ margin-bottom:1.1rem; }
.ulm-app #loginform label{ display:block; font-size:.85rem; font-weight:600; color:var(--ink); margin-bottom:.4em; }
.ulm-app #loginform input[type="text"], .ulm-app #loginform input[type="password"]{
  width:100%; font-family:var(--font-body); font-size:.98rem; padding:.75em .9em; border:1px solid var(--line); border-radius:var(--radius);
}
.ulm-app #loginform .forgetmenot{ display:flex; align-items:center; gap:.5em; font-size:.88rem; color:var(--ink-soft); }
.ulm-app #loginform .forgetmenot input{ width:auto; }
.ulm-app #loginform p.submit input[type="submit"]{
  font-family:var(--font-body); font-weight:600; font-size:.98rem; padding:.85em 1.6em;
  background:var(--gold); color:var(--ink); border:0; border-radius:var(--radius); cursor:pointer;
}
.ulm-app #loginform p.submit input[type="submit"]:hover{ background:var(--gold-deep); }

.ulm-check-list li{ padding:.35em 0; color:var(--ink-soft); font-size:.94rem; }
.ulm-check-list li::before{ content:"✓ "; color:var(--ledger); font-weight:700; }

/* dashboard */
.ulm-account-header{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:2rem; flex-wrap:wrap; gap:1rem; }
.ulm-account-header-who{ display:flex; align-items:center; gap:1rem; }
.ulm-account-header-who .ulm-avatar{ flex-shrink:0; }
.ulm-account-header-who h2{ margin-bottom:.15em; }
.ulm-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2rem; }
@media(max-width:720px){ .ulm-stats{ grid-template-columns:1fr 1fr; } }
.ulm-stat{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.2rem; text-align:center; }
.ulm-stat strong{ display:block; font-family:var(--font-mono); font-size:1.4rem; margin-bottom:.3em; }
.ulm-stat span{ font-size:.82rem; color:var(--ink-soft); }
.ulm-quick-actions{ display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:2.2rem; }
.ulm-chip{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:.7em 1.1em; font-size:.9rem; color:var(--ink); text-decoration:none; }
.ulm-chip:hover{ border-color:var(--ink); text-decoration:none; }
.ulm-chip-accent{ background:var(--gold); border-color:var(--gold); font-weight:600; }
.ulm-info-table{ width:100%; border-collapse:collapse; }
.ulm-info-table th, .ulm-info-table td{ text-align:left; padding:.6em 0; border-bottom:1px solid var(--line); font-size:.94rem; }
.ulm-info-table th{ width:200px; color:var(--ink-soft); font-weight:600; }

/* simulator */
.ulm-sim-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.8rem; }
@media(max-width:760px){ .ulm-sim-cards{ grid-template-columns:1fr 1fr; } }
.ulm-sim-card{ text-align:left; background:var(--card); border:2px solid var(--line); border-radius:var(--radius); padding:1.1rem; cursor:pointer; font-family:var(--font-body); }
.ulm-sim-card strong{ display:block; margin-bottom:.4em; font-size:.98rem; color:var(--ink); }
.ulm-sim-card span{ font-family:var(--font-mono); font-size:.78rem; color:var(--ink-soft); }
.ulm-sim-card.is-active{ border-color:var(--gold); box-shadow:0 0 0 1px var(--gold); }
.ulm-range-value{ font-family:var(--font-mono); font-size:.9rem; color:var(--ink-soft); margin-top:.4em; }
.ulm-sim-result{ display:flex; gap:2rem; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.2rem 1.6rem; margin:1.4rem 0; }
.ulm-sim-result span{ display:block; font-size:.8rem; color:var(--ink-soft); }
.ulm-sim-result strong{ font-family:var(--font-mono); font-size:1.3rem; color:var(--ledger); }

/* loans */
.ulm-loan-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; margin-bottom:1.6rem; }
.ulm-loan-facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:1rem 0 1.4rem; }
@media(max-width:640px){ .ulm-loan-facts{ grid-template-columns:1fr 1fr; } }
.ulm-loan-facts span{ display:block; font-size:.78rem; color:var(--ink-soft); }
.ulm-loan-facts strong{ font-family:var(--font-mono); font-size:1.05rem; }
.ulm-badge{ font-family:var(--font-mono) !important; font-size:.75rem !important; padding:.25em .6em; border-radius:999px; background:var(--ledger-soft); color:var(--ledger); }
.ulm-badge-paid{ background:var(--ledger-soft); color:var(--ledger); }
.ulm-badge-active{ background:#FFF3CD; color:#8a6d1a; }
.ulm-badge-defaulted{ background:#FBE9E7; color:#9A3B2E; }
.ulm-badge-overdue{ background:#FBE9E7; color:#9A3B2E; }
.ulm-doc-list{ list-style:none; margin:0; padding:0; }
.ulm-doc-list li{ padding:.4em 0; border-bottom:1px solid var(--line); font-size:.92rem; }
.ulm-doc-list li:last-child{ border-bottom:0; }