:root{
    --verde:#087735;
    --rojo:#f20d0d;
    --gris:#f4f6f8;
    --texto:#222;
    --borde:#d9dee5;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--gris);color:var(--texto)}
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#fff}
.login-card{width:380px;background:#fff;border:1px solid var(--borde);border-radius:18px;padding:30px;box-shadow:0 10px 35px rgba(0,0,0,.08)}
.login-card img{width:100%;margin-bottom:20px}.login-card h1{font-size:24px;color:var(--verde);margin:0 0 18px}
label{font-weight:bold;font-size:14px}input,select,textarea{width:100%;padding:11px;margin:7px 0 15px;border:1px solid var(--borde);border-radius:9px}
button,.btn{display:inline-block;background:var(--verde);color:white;border:0;border-radius:9px;padding:11px 16px;font-weight:bold;text-decoration:none;cursor:pointer}.btn-red{background:var(--rojo)}
.alert{padding:11px;border-radius:9px;margin-bottom:12px}.alert-error{background:#ffe6e6;color:#a40000}
.layout{display:flex;min-height:100vh}.sidebar{width:260px;background:#fff;border-right:1px solid var(--borde);padding:18px;position:fixed;top:0;bottom:0}
.brand img{width:210px;margin-bottom:20px}.sidebar nav a{display:block;padding:13px 14px;margin-bottom:7px;border-radius:10px;color:#222;text-decoration:none;font-weight:bold}.sidebar nav a:hover{background:#e9f7ef;color:var(--verde)}.sidebar .logout{color:var(--rojo)}
.content{margin-left:260px;padding:26px;width:calc(100% - 260px)}.topbar{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:18px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}.topbar h1{margin:0;color:var(--verde)}
.cards{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:18px}.card{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:20px}.card h3{margin:0;color:#555;font-size:15px}.card p{font-size:30px;font-weight:bold;margin:12px 0 0;color:var(--verde)}
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden}.table th,.table td{padding:12px;border-bottom:1px solid var(--borde);text-align:left}.table th{background:#f0f3f5}
@media(max-width:800px){.sidebar{position:relative;width:100%}.layout{display:block}.content{margin-left:0;width:100%}.cards{grid-template-columns:1fr}.brand img{width:180px}}
