/* viva-MARKET · estilos del panel */
:root{--ink:#1B1530;--ink2:#4A4260;--mute:#6B6385;--line:#E5DEF5;--bg:#F4F1FB;--card:#fff;--violet:#6C2BD9;--violet-d:#4C1D95;--violet-l:#EFE7FF;--orange:#FF6B1A;--orange-l:#FFE4D3;--orange-d:#8A3A08;--green:#0B6B47;--green-l:#D7F5E8;--red:#8F1B2F;--red-l:#FFE0EA}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 'DM Sans',system-ui,sans-serif}
a{color:var(--violet)}a:hover{color:var(--violet-d)}
h1,h2{font-family:Poppins,sans-serif;margin:0}
h1{font-size:26px}h2{font-size:18px;margin-bottom:14px}
.muted{color:var(--mute)}small{font-size:13px}
.app{display:flex;flex-wrap:wrap;min-height:100vh}
.side{flex:1 1 220px;max-width:250px;background:var(--ink);color:#fff;padding:22px 14px;display:flex;flex-direction:column;gap:4px}
.side a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;color:#D9D2EE;text-decoration:none;font-weight:700}
.side a:hover{background:#2A2048;color:#fff}.side a.on{background:var(--orange);color:var(--ink)}
.logo{font:800 22px Poppins,sans-serif;padding:0 10px}.logo span{color:#FF8A47}.logo.big{font-size:34px;color:var(--ink);padding:0}.logo.big span{color:var(--orange)}
.tienda{color:#B3A9D1;font-size:13px;padding:2px 10px 18px}
.grow{flex:1}.yo{padding:10px 12px;font-weight:700}.yo small{display:block;color:#B3A9D1;font-weight:400}
.main{flex:999 1 560px;min-width:0;padding:28px;display:flex;flex-direction:column;gap:18px}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}.head>div:first-child{flex:1 1 auto}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px}
.card.dark{background:var(--ink);color:#fff;border:none}.card.narrow{max-width:760px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.kpi{display:flex;flex-direction:column;gap:6px}.kpi b{font:800 28px Poppins,sans-serif}.kpi small{color:var(--ink2)}
.tag{display:inline-block;align-self:flex-start;padding:3px 10px;border-radius:999px;font-size:13px;font-weight:700;background:#F1EDF9;color:var(--ink2)}
.tag.sm{font-size:11px;padding:1px 7px}
.tag.violet{background:var(--violet-l);color:var(--violet-d)}.tag.orange{background:var(--orange-l);color:var(--orange-d)}
.tag.green{background:var(--green-l);color:var(--green)}.tag.red,.tag.pink{background:var(--red-l);color:var(--red)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink2);font:700 15px 'DM Sans',sans-serif;text-decoration:none;cursor:pointer}
.btn.primary{background:var(--violet);border-color:var(--violet);color:#fff}.btn.primary:hover{background:var(--violet-d);color:#fff}
.btn.big{height:54px;font:700 17px Poppins,sans-serif;width:100%}.btn.sm{height:32px;padding:0 12px;font-size:13px}
.form{display:flex;flex-direction:column;gap:14px}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:700;color:var(--ink2);font-size:14px;flex:1 1 180px}
.form label.check{flex-direction:row;align-items:center;gap:10px;font-weight:500}
.form label.mini{flex:0 0 70px}
input,select{height:46px;padding:0 14px;border-radius:12px;border:1px solid #D9D0EF;font:16px 'DM Sans',sans-serif;color:var(--ink);background:#fff;width:100%}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--violet)}input[type=color]{padding:4px}
input:focus,select:focus{outline:2px solid var(--violet);outline-offset:1px}
input.big{font:700 22px Poppins,sans-serif;border:2px solid var(--violet)}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px;align-items:start}
fieldset{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}legend{font-weight:700;color:var(--ink2);font-size:14px;margin-bottom:8px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:700;color:var(--ink2);text-decoration:none}
.pill.on,.pill.chk:has(input:checked){background:var(--violet);border-color:var(--violet);color:#fff}
.pill.chk input{position:absolute;opacity:0;width:1px;height:1px}.pill.chk:focus-within{outline:2px solid var(--violet)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.search{flex:1 1 260px;max-width:420px}
.scroll{overflow-x:auto;padding:8px 12px}
.tbl{width:100%;border-collapse:collapse;min-width:640px}
.tbl th{text-align:left;font-size:12px;color:var(--mute);padding:10px 8px}
.tbl td{padding:12px 8px;border-top:1px solid #F1EDF9}.tbl tr.off td{opacity:.5}
.tbl a{color:var(--ink);text-decoration:none}.tbl a:hover{color:var(--violet)}
.prov{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--ink)}.prov:hover{border-color:var(--violet)}
.prov small{display:block;color:var(--ink2)}.prov.off{opacity:.55}.prov .tag{margin-left:auto}
.avatar{flex:0 0 48px;height:48px;border-radius:14px;background:var(--violet-l);color:var(--violet-d);display:flex;align-items:center;justify-content:center;font:800 20px Poppins,sans-serif}
.info{flex:1 1 180px;display:flex;flex-direction:column;padding:10px 14px;border-radius:12px;background:var(--bg)}.info b{font:700 20px Poppins,sans-serif}
.sug{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:var(--orange-l);color:var(--orange-d);font-weight:700}.sug b{font:800 18px Poppins,sans-serif}
.prev{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #3B2A6B}.prev s{color:#B3A9D1}.prev b{color:#FFB27D;font-family:Poppins,sans-serif}
.flash{padding:14px 16px;border-radius:14px;font-weight:700;background:var(--green-l);color:var(--green)}.flash.err{background:var(--red-l);color:var(--red)}
.login{flex:1;display:flex;align-items:center;justify-content:center;min-height:90vh}
.login-box{width:100%;max-width:400px;background:#fff;border-radius:26px;padding:36px;border:1px solid var(--line);box-shadow:0 20px 60px rgba(108,43,217,.15)}
@media (max-width:700px){.side{max-width:none;flex-basis:100%;flex-direction:row;flex-wrap:wrap}.side .grow,.tienda,.yo{display:none}.main{padding:16px}}
