@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600&display=swap');
:root{--plum:#4b1533;--rosa:#d64570;--bg:#f6f1f3;--card:#fff;--tinta:#2b1a22;--suave:#7d6570;--linea:#eadfe4}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Outfit',system-ui,sans-serif;background:var(--bg);color:var(--tinta);display:flex;min-height:100vh;font-size:15px}
.lateral{width:220px;background:var(--plum);color:#fff;padding:22px 16px;flex:none;display:flex;flex-direction:column;gap:4px}
.lateral .marca{font-weight:600;font-size:18px;margin-bottom:18px;color:#ffd9e4}
.lateral a{color:#f3dbe4;text-decoration:none;padding:10px 12px;border-radius:10px;font-size:14px}
.lateral a:hover,.lateral a.activo{background:rgba(255,255,255,.12);color:#fff}
.contenido{flex:1;padding:30px 34px;max-width:1200px}
h1{font-weight:600;font-size:26px;margin-bottom:20px;color:var(--plum)}
h2{font-weight:600;font-size:18px;margin:26px 0 12px;color:var(--plum)}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:24px}
.kpi{background:var(--card);border-radius:14px;padding:18px;border:1px solid var(--linea)}
.kpi b{display:block;font-size:30px;font-weight:600;color:var(--rosa)}
.kpi span{color:var(--suave);font-size:13px}
.panel{background:var(--card);border-radius:14px;border:1px solid var(--linea);padding:20px;margin-bottom:20px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--linea);vertical-align:top}
th{color:var(--suave);font-weight:500;font-size:13px}
tr:hover td{background:#fcf8fa}
.etiqueta{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;background:#eee;white-space:nowrap}
.etiqueta.pagada,.etiqueta.activa{background:#dcfce7;color:#166534}
.etiqueta.pendiente{background:#fef3c7;color:#92400e}
.etiqueta.borrador{background:#e0e7ff;color:#3730a3}
.etiqueta.expirada,.etiqueta.cancelada{background:#fee2e2;color:#991b1b}
.btn{display:inline-block;font:inherit;font-size:13px;font-weight:500;border:0;border-radius:8px;padding:7px 12px;background:var(--rosa);color:#fff;cursor:pointer;text-decoration:none;margin:2px 0}
.btn.sec{background:#fff;color:var(--plum);border:1px solid var(--linea)}
.btn.peligro{background:#fff;color:#b91c1c;border:1px solid #fecaca}
.btn.grande{font-size:15px;padding:11px 20px}
.filtros a{display:inline-block;margin:0 8px 14px 0;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--linea);color:var(--tinta);text-decoration:none;font-size:13px}
.filtros a.activo{background:var(--plum);color:#fff;border-color:var(--plum)}
label{display:block;font-size:13px;font-weight:500;margin:14px 0 5px;color:var(--plum)}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=url],select,textarea{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--linea);border-radius:10px;background:#fff}
textarea{min-height:90px}
.fila{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fila3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.flash{border-radius:10px;padding:12px 16px;margin-bottom:16px;font-size:14px}
.flash.ok{background:#dcfce7;color:#166534}.flash.error{background:#fee2e2;color:#991b1b}
.ayuda{color:var(--suave);font-size:13px;margin-top:4px}
.acciones form{display:inline}
.chico{font-size:12px;color:var(--suave)}
.login{margin:auto;width:360px;background:#fff;padding:34px;border-radius:18px;border:1px solid var(--linea)}
code{background:#f3e8ed;padding:2px 6px;border-radius:6px;font-size:12px}
@media (max-width:760px){body{flex-direction:column}.lateral{width:100%;flex-direction:row;flex-wrap:wrap;padding:12px}.lateral .marca{width:100%;margin-bottom:6px}.contenido{padding:18px 14px}.fila,.fila3{grid-template-columns:1fr}table{display:block;overflow-x:auto}}