
/* App theme on top of Opalin main.css */
:root{ --brand:#20c997; --ink:#0c1b1f; --muted:#708090; --bg:#0a1418; }
body{ background:#0b141a; color:#e9f0f3; }
.navbar{ background:rgba(0,0,0,.4); backdrop-filter: blur(8px); }
.card{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:12px; }
.mandotoast{ position:fixed; right:16px; bottom:16px; background:#1f2a30; color:#cde7f0; padding:10px 14px; border-radius:8px; border:1px solid rgba(255,255,255,.08); }
.btn-brand{ background:var(--brand); color:#052b2b; font-weight:700; border-radius:8px; padding:10px 16px; }
.badge-soft{ background:rgba(255,255,255,.08); padding:.3rem .6rem; border-radius:999px; font-size:.8rem; }
.table-dark{ color:#e7eef2; }
.small-muted{ color:#9fb1bd; font-size:.85rem; }
input, select, textarea{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); color:#e8f2f7; border-radius:8px; padding:10px; }
label{ color:#d2e1ea; font-weight:600; font-size:.9rem; }
hr{ border-color:rgba(255,255,255,.1) }
pre.code{ background:#0f1b22; border-radius:10px; padding:10px 12px; overflow:auto; border:1px solid rgba(255,255,255,.08); }
.opalin-section{ padding: 40px 0; }
.pricing-card{ display:flex; flex-direction:column; gap:12px; padding:18px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); }
.pricing-card h4{ margin: 0; }
.kbd{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size: .85rem; padding:.1rem .3rem; border:1px solid rgba(255,255,255,.15); border-radius:4px; }
