/* MopTask reusable components — built on tokens/tokens.css */
.mt-btn{height:52px;padding:0 28px;border:0;border-radius:var(--radius-pill);background:var(--teal-600);color:#fff;font:600 17px var(--font-ui);display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}
.mt-btn:hover{background:var(--teal-700)}.mt-btn--navy{background:var(--navy)}.mt-btn--blue{background:var(--blue-action)}.mt-btn--soft{background:#E1F5EF;color:var(--teal-700)}.mt-btn--ghost{background:#fff;color:var(--navy);border:1px solid var(--mist)}.mt-btn--block{width:100%}.mt-btn--sq{border-radius:var(--radius-md)}
.mt-fab{width:58px;height:58px;border-radius:50%;border:0;background:var(--teal);color:#fff;font-size:30px;box-shadow:var(--shadow-fab);cursor:pointer}
.mt-input{height:46px;width:100%;border:1px solid var(--mist);border-radius:12px;padding:0 14px;font:400 15px var(--font-ui);color:var(--navy);outline:0;box-sizing:border-box}.mt-input:focus{border-color:var(--teal)}.mt-input--error{border-color:var(--danger)}.mt-error{color:var(--danger);font-size:12.5px;margin-top:6px}
.mt-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--radius-lg);padding:14px;box-shadow:var(--shadow-card)}.mt-card--navy{background:var(--navy);color:#fff;border:0;border-radius:var(--radius-xl)}
.mt-metric__value{font:800 var(--size-kpi) var(--font-display)}.mt-metric__label{font-size:13px;color:var(--text-2)}
.mt-badge{display:inline-block;font:600 11.5px var(--font-ui);padding:3px 9px;border-radius:8px}.mt-badge--success{background:var(--success-bg);color:var(--success-text)}.mt-badge--danger{background:#FDE2E2;color:var(--danger)}.mt-badge--info{background:#E4EEFC;color:var(--blue)}.mt-badge--warn{background:#FDECD9;color:#C2610F}.mt-badge--save{background:var(--lime);color:var(--navy);font-weight:700}
.mt-chip{height:32px;padding:0 14px;border-radius:16px;border:1px solid var(--mist);background:#fff;font:600 12.5px var(--font-ui);color:var(--navy);cursor:pointer}.mt-chip--on{background:var(--navy);color:#fff;border-color:var(--navy)}
.mt-progress{height:10px;border-radius:5px;background:#E8EEF0;overflow:hidden}.mt-progress>span{display:block;height:100%;background:var(--teal);border-radius:5px}
.mt-tabbar{height:var(--layout-bottom-nav);background:#fff;border-top:1px solid #E6EEEE;display:flex;padding-top:8px}.mt-tabbar button{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;font:400 11.5px var(--font-ui);color:var(--text-2);cursor:pointer}.mt-tabbar button.on{color:var(--navy);font-weight:600}.mt-tabbar button.on i{color:var(--teal)}
.mt-sheet{background:#fff;border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;padding:10px 20px 28px}.mt-sheet__grab{width:40px;height:5px;border-radius:3px;background:var(--mist);margin:0 auto 14px}
.mt-modal{background:#fff;border-radius:16px;padding:24px;box-shadow:var(--shadow-modal);max-width:440px}
.mt-toast{background:var(--navy);color:#fff;border-radius:12px;padding:12px 14px;font:500 13.5px var(--font-ui)}
.mt-slot{height:44px;border-radius:12px;border:2px solid var(--border-soft);background:#fff;font:400 14.5px var(--font-ui);color:var(--navy);cursor:pointer}.mt-slot--on{border-color:var(--teal);background:#E7F7F3;font-weight:600}.mt-slot:disabled{background:var(--surface-muted);color:#A6B6C2;text-decoration:line-through}
.mt-stepper{display:flex;justify-content:space-between;font-size:11.5px;color:#6E8597}.mt-stepper .on{color:var(--navy);font-weight:700}