/* ============================================================
   LeadCRM — Base Design System
   ============================================================ */

:root{
    --bg:            #f5f7fb;
    --surface:       #ffffff;
    --surface-2:     #f9fafc;
    --border:        #e6e9f0;
    --text:          #101828;
    --muted:         #667085;
    --primary:       #4f46e5;
    --primary-600:   #4338ca;
    --primary-50:    #eef2ff;
    --success:       #12b76a;
    --warning:       #f79009;
    --danger:        #f04438;
    --info:          #0ba5ec;
    --radius-sm:     8px;
    --radius:        12px;
    --radius-lg:     16px;
    --shadow-sm:     0 1px 2px rgba(16,24,40,.06);
    --shadow:        0 4px 12px rgba(16,24,40,.08);
    --shadow-lg:     0 12px 32px rgba(16,24,40,.12);
    --font:          'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
                     Roboto, Helvetica, Arial, sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
    font-family:var(--font);
    background:var(--bg);
    color:var(--text);
    font-size:15px;
    line-height:1.5;
    min-height:100vh;
    -webkit-font-smoothing:antialiased;
}

a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-600)}
h1,h2,h3,h4{margin:0 0 .5rem;font-weight:700;letter-spacing:-.01em}
p{margin:0 0 1rem}

.muted{color:var(--muted)}
.center{text-align:center}

/* ---------------- Buttons ---------------- */
.btn{
    display:inline-flex;align-items:center;gap:.5rem;
    padding:.6rem 1rem;border-radius:var(--radius-sm);
    border:1px solid transparent;cursor:pointer;
    font-weight:600;font-size:14px;line-height:1;
    transition:background .15s ease,border-color .15s ease,color .15s ease,transform .05s ease;
    text-decoration:none;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-600);color:#fff}
.btn-secondary{background:#fff;border-color:var(--border);color:var(--text)}
.btn-secondary:hover{background:var(--surface-2)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{filter:brightness(.95);color:#fff}
.btn-ghost{background:transparent;color:var(--text)}
.btn-ghost:hover{background:rgba(16,24,40,.05)}

/* ---------------- Cards ---------------- */
.card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    padding:1.25rem;
}

/* ---------------- Forms ---------------- */
.field{margin-bottom:1rem}
.label{display:block;font-size:13px;font-weight:600;margin-bottom:.35rem;color:#344054}
.input,.select,.textarea{
    width:100%;padding:.65rem .8rem;border-radius:var(--radius-sm);
    border:1px solid var(--border);background:#fff;color:var(--text);
    font-size:14px;font-family:inherit;outline:none;
    transition:border-color .15s,box-shadow .15s;
}
.input:focus,.select:focus,.textarea:focus{
    border-color:var(--primary);
    box-shadow:0 0 0 3px var(--primary-50);
}
.textarea{min-height:110px;resize:vertical}

/* ---------------- Badges ---------------- */
.badge{
    display:inline-block;padding:.2rem .55rem;border-radius:999px;
    font-size:12px;font-weight:600;line-height:1.4;
}
.badge-primary{background:var(--primary-50);color:var(--primary-600)}
.badge-success{background:#e7f7ee;color:#067647}
.badge-warning{background:#fff3e0;color:#b54708}
.badge-danger {background:#fee4e2;color:#b42318}
.badge-muted  {background:#f2f4f7;color:#475467}

/* ---------------- Alerts ---------------- */
.alert{
    padding:.85rem 1rem;border-radius:var(--radius-sm);
    font-size:14px;margin-bottom:1rem;border:1px solid transparent;
}
.alert-success{background:#ecfdf3;border-color:#a6f4c5;color:#067647}
.alert-danger {background:#fef3f2;border-color:#fecdca;color:#b42318}
.alert-warning{background:#fffaeb;border-color:#fedf89;color:#b54708}
.alert-info   {background:#eff8ff;border-color:#b2ddff;color:#175cd3}

/* ---------------- Tables ---------------- */
.table{
    width:100%;border-collapse:collapse;background:#fff;
    border-radius:var(--radius);overflow:hidden;font-size:14px;
}
.table th,.table td{
    text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--border);
}
.table th{
    background:var(--surface-2);font-weight:600;color:#475467;
    font-size:12px;text-transform:uppercase;letter-spacing:.04em;
}
.table tr:last-child td{border-bottom:none}
.table tbody tr:hover{background:#fafbff}

/* ---------------- Install / error page ---------------- */
.err-page{
    min-height:100vh;display:flex;align-items:center;justify-content:center;
    padding:2rem;background:linear-gradient(180deg,#f5f7fb,#eef2ff);
}
.err-card{
    background:#fff;padding:2.5rem;border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);text-align:center;max-width:420px;width:100%;
}
.err-code{
    font-size:3rem;font-weight:800;color:var(--primary);
    letter-spacing:-.03em;margin-bottom:.5rem;
}

/* ---------------- Install check list ---------------- */
.check-list{list-style:none;padding:0;margin:1rem 0}
.check-list li{
    padding:.6rem .8rem;border-radius:var(--radius-sm);
    margin-bottom:.4rem;background:var(--surface-2);
    border:1px solid var(--border);font-size:14px;
}
.check-list li.ok {background:#ecfdf3;border-color:#a6f4c5;color:#067647}
.check-list li.bad{background:#fef3f2;border-color:#fecdca;color:#b42318}