/* « Ce que vous payez chaque mois » (plan S1, 20/10/2026). Uses the site tokens
   from styles.css (--surface, --line, --primary…), so light and dark themes follow. */
.monthly-estimate .estimate-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:var(--shadow)}
.monthly-estimate .estimate-inputs{display:grid;gap:18px;align-content:start}
.monthly-estimate label{display:grid;gap:8px;font-weight:600;color:var(--text)}
.monthly-estimate select,.monthly-estimate input[type=number]{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-height:44px;width:100%}
.monthly-estimate input[type=range]{width:100%;accent-color:var(--primary);min-height:32px}
.monthly-estimate .estimate-minutes{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:12px;align-items:center}
.monthly-estimate .estimate-hint{font-weight:400;font-size:14px;color:var(--muted)}
.monthly-estimate .estimate-result{margin:0;display:grid;gap:10px;align-content:start;background:var(--surface-soft);border-radius:16px;padding:20px}
.monthly-estimate .estimate-result div{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.monthly-estimate .estimate-result dt{color:var(--muted)}
.monthly-estimate .estimate-result dd{margin:0;font-weight:600;color:var(--text);text-align:right}
.monthly-estimate .estimate-total{border-top:1px solid var(--line);padding-top:12px;margin-top:4px}
.monthly-estimate .estimate-total dt,.monthly-estimate .estimate-total dd{font-size:20px;font-weight:800;color:var(--text)}
.monthly-estimate .estimate-today{margin:4px 0 0;font-size:15px;color:var(--text)}
@media (max-width:760px){.monthly-estimate .estimate-panel{grid-template-columns:1fr;padding:20px}.monthly-estimate .estimate-minutes{grid-template-columns:1fr 96px}}