:root{
  --berry:#d92f62;--berry-dark:#ad1f4b;--berry-soft:#fde8ef;--cream:#fff8ef;--choco:#3d252b;
  --ink:#251b1e;--muted:#75666b;--line:#eadfe2;--surface:#fff;--bg:#f7f3f1;--success:#1d8f63;
  --warning:#b97812;--danger:#c93848;--blue:#3867d6;--shadow:0 10px 30px rgba(61,37,43,.08);--radius:16px;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
.app-shell{min-height:100vh;display:grid;grid-template-columns:265px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#351f27,#24161b);color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:30}.brand-lockup{display:flex;align-items:center;gap:11px;padding:3px 8px 22px}.brand-lockup .brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#fff,#ffdce7);font-size:23px;box-shadow:0 6px 18px #0002}.brand-lockup strong{display:block;font-size:20px;letter-spacing:.08em}.brand-lockup span{display:block;font-size:12px;opacity:.72;margin-top:1px}.brand-lockup.large{color:var(--ink);justify-content:center}.brand-lockup.large .brand-mark{width:54px;height:54px;font-size:30px}.brand-lockup.large strong{font-size:28px;color:var(--berry)}
.sidebar nav{display:flex;flex-direction:column;gap:4px;overflow:auto;padding-right:3px}.nav-link{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:11px;color:#f6edf0;font-size:14px;border:0;background:transparent;width:100%;text-align:left}.nav-link:hover,.nav-link.active{background:#ffffff18}.nav-link.active{box-shadow:inset 3px 0 0 #ff7ca2;color:#fff}.nav-icon{width:22px;text-align:center;font-size:17px}.sidebar-foot{margin-top:auto;padding-top:14px;border-top:1px solid #ffffff18}.user-chip{display:flex;align-items:center;gap:10px;padding:8px 10px 14px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--berry);font-weight:800}.user-chip strong,.user-chip small{display:block}.user-chip strong{font-size:13px}.user-chip small{font-size:11px;opacity:.7;margin-top:2px}
.main{min-width:0}.topbar{height:78px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:sticky;top:0;z-index:20}.topbar h1{font-size:22px;margin:0}.topbar p{margin:3px 0 0;font-size:12px;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:10px}.compact-select{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);background:var(--bg);padding:7px 10px;border-radius:10px}.compact-select select{border:0;background:transparent;max-width:180px;color:var(--ink);outline:none}.icon-btn{border:1px solid var(--line);background:#fff;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;color:var(--ink)}.icon-btn:hover{border-color:#d4c4c9;background:var(--cream)}.content{padding:24px;max-width:1700px;margin:0 auto}.loading{padding:70px;text-align:center;color:var(--muted)}
.grid{display:grid;gap:16px}.grid.kpis{grid-template-columns:repeat(6,minmax(155px,1fr));margin-bottom:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;min-width:0}.card.flat{box-shadow:none}.card h2,.card h3{margin:0 0 14px}.card h2{font-size:17px}.card h3{font-size:15px}.kpi{position:relative;overflow:hidden;min-height:118px}.kpi:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-28px;bottom:-35px;background:var(--berry-soft)}.kpi .label{font-size:12px;color:var(--muted);position:relative;z-index:1}.kpi .value{font-size:24px;font-weight:800;margin-top:10px;position:relative;z-index:1}.kpi .hint{font-size:11px;color:var(--muted);margin-top:7px;position:relative;z-index:1}.kpi.positive .value{color:var(--success)}.kpi.negative .value{color:var(--danger)}.kpi.warning .value{color:var(--warning)}
.toolbar{display:flex;gap:10px;align-items:end;justify-content:space-between;margin-bottom:15px;flex-wrap:wrap}.toolbar .group{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.toolbar label{font-size:11px;color:var(--muted)}.toolbar input,.toolbar select{display:block;margin-top:4px}.btn{border:0;border-radius:10px;padding:10px 14px;font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:7px}.btn.primary{background:var(--berry);color:white}.btn.primary:hover{background:var(--berry-dark)}.btn.secondary{background:var(--berry-soft);color:var(--berry-dark)}.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn.danger{background:#feecee;color:var(--danger)}.btn.success{background:#e8f7f1;color:var(--success)}.btn.small{padding:7px 9px;font-size:11px}.btn.full{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{border:1px solid var(--line);background:white;border-radius:10px;padding:10px 11px;color:var(--ink);outline:none;min-width:0}input:focus,select:focus,textarea:focus{border-color:#e17898;box-shadow:0 0 0 3px #fde8ef}textarea{resize:vertical;min-height:90px}.stack-form{display:grid;gap:13px}.stack-form label,.form-grid label{display:grid;gap:5px;font-size:12px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid .full{grid-column:1/-1}.check{display:flex!important;grid-auto-flow:column;justify-content:start;align-items:center;gap:8px!important;color:var(--ink)!important}.check input{width:auto;min-width:auto}.muted{color:var(--muted)}.tiny{font-size:11px}.nowrap{white-space:nowrap}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}.table{width:100%;border-collapse:collapse;min-width:720px}.table th{position:sticky;top:0;background:#fbf8f7;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:11px;border-bottom:1px solid var(--line);z-index:1}.table td{padding:11px;border-bottom:1px solid #f0e8ea;font-size:13px;vertical-align:top}.table tr:last-child td{border-bottom:0}.table tr:hover td{background:#fffaf8}.right{text-align:right}.center{text-align:center}.actions-cell{display:flex;gap:5px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;background:#eee}.badge.pendiente{background:#fff3d8;color:#93610a}.badge.preparando{background:#ede8ff;color:#6946bd}.badge.listo{background:#e3f4ff;color:#2470a8}.badge.en_camino{background:#e6efff;color:#315ea8}.badge.entregado,.badge.emitida,.badge.enviado,.badge.enviada{background:#e7f7ef;color:#16724d}.badge.anulado,.badge.error,.badge.fallido{background:#fee9ec;color:#b9273c}.badge.simulada,.badge.en_cola,.badge.parcial{background:#f0edf4;color:#695775}
.bar-list{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:minmax(100px,1.2fr) 3fr auto;align-items:center;gap:10px;font-size:12px}.bar-track{height:9px;background:#f1e8eb;border-radius:99px;overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,var(--berry),#ff8aaa);border-radius:99px}.spark-bars{height:210px;display:flex;align-items:end;gap:7px;padding-top:20px;border-bottom:1px solid var(--line);overflow-x:auto}.spark-col{min-width:28px;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:end;gap:5px;height:100%}.spark-col .bar{width:100%;min-height:2px;background:linear-gradient(180deg,#f45a86,var(--berry));border-radius:7px 7px 2px 2px}.spark-col small{font-size:9px;color:var(--muted);white-space:nowrap}.empty{padding:36px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:12px;background:#fffdfc}.section-title{display:flex;align-items:center;justify-content:space-between;margin:20px 0 12px}.section-title h2{margin:0;font-size:18px}
.pos-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(330px,.8fr);gap:16px;align-items:start}.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.product-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px;display:flex;flex-direction:column;min-height:165px;transition:.15s}.product-card:hover{transform:translateY(-2px);border-color:#e79ab1;box-shadow:var(--shadow)}.product-card .category{font-size:10px;color:var(--berry);font-weight:800;text-transform:uppercase}.product-card h3{font-size:15px;margin:8px 0 5px}.product-card p{font-size:11px;color:var(--muted);margin:0 0 12px;flex:1}.product-card .price{font-size:17px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.cart-panel{position:sticky;top:96px}.cart-lines{display:grid;gap:9px;max-height:340px;overflow:auto;padding-right:3px}.cart-line{border:1px solid var(--line);border-radius:11px;padding:10px}.cart-line-top{display:flex;justify-content:space-between;gap:8px}.cart-line strong{font-size:13px}.cart-line small{display:block;color:var(--muted);margin-top:4px}.qty-row{display:flex;align-items:center;gap:7px;margin-top:8px}.qty-btn{border:1px solid var(--line);background:#fff;width:27px;height:27px;border-radius:8px}.cart-summary{border-top:1px dashed var(--line);margin-top:13px;padding-top:12px;display:grid;gap:7px}.sum-row{display:flex;justify-content:space-between;font-size:13px}.sum-row.total{font-size:20px;font-weight:800;padding-top:5px}.tabs{display:flex;gap:5px;overflow:auto;margin-bottom:14px;padding-bottom:3px}.tab{border:1px solid var(--line);background:#fff;padding:8px 11px;border-radius:999px;font-size:12px;white-space:nowrap}.tab.active{background:var(--berry);color:#fff;border-color:var(--berry)}
.modal-backdrop{position:fixed;inset:0;background:#1b1116aa;display:grid;place-items:center;padding:18px;z-index:100}.modal{background:#fff;border-radius:18px;width:min(720px,100%);max-height:92vh;overflow:auto;box-shadow:0 30px 90px #0005}.modal.wide{width:min(1050px,100%)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}.modal-head h2{font-size:18px;margin:0}.modal-body{padding:20px}.modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:15px 20px;border-top:1px solid var(--line);position:sticky;bottom:0;background:#fff}.close-btn{border:0;background:transparent;font-size:24px}.product-description{background:#fff7fa;border:1px solid #f3d9e2;border-radius:12px;padding:12px;margin:0 0 16px;color:var(--berry-dark);font-weight:700}.option-group{margin-bottom:16px;border:1px solid var(--line);border-radius:13px;padding:13px;transition:.15s}.option-group.has-extras{border-color:#e7a736;background:#fffaf0}.option-group-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.option-group h4{margin:0;font-size:13px}.included-badge{font-size:11px;font-weight:800;color:#17603a;background:#eaf8f0;border-radius:999px;padding:5px 8px}.option-rule{font-size:11px;color:var(--muted);margin:5px 0 9px}.option-list{display:flex;gap:7px;flex-wrap:wrap}.option-pill input{display:none}.option-pill span{display:inline-flex;border:1px solid var(--line);padding:8px 10px;border-radius:999px;font-size:12px}.option-pill input:checked+span{background:var(--berry-soft);border-color:var(--berry);color:var(--berry-dark);font-weight:700}.option-counter{font-size:11px;color:var(--muted);margin-top:9px;font-weight:700}.has-extras .option-counter{color:#a35c00}.custom-price-box{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:#f8f5f3;border-radius:13px;padding:12px;margin:16px 0}.custom-price-box>div{display:flex;flex-direction:column;gap:4px}.custom-price-box span{font-size:11px;color:var(--muted)}.custom-price-box strong{font-size:17px}.custom-price-box .custom-total{border-left:1px solid var(--line);padding-left:12px}.extra-line{color:#a35c00!important;font-weight:800}.rule-grid{display:grid;gap:9px}.rule-row{display:grid;grid-template-columns:minmax(180px,1.2fr) 160px 160px auto;gap:10px;align-items:end;border:1px solid var(--line);padding:10px;border-radius:12px;opacity:.7}.rule-row.enabled{opacity:1;background:#fffafd}.rule-row small{align-self:center;color:var(--muted)}.section-divider{border:0;border-top:1px solid var(--line);margin:22px 0}
.alert{padding:11px 13px;border-radius:10px;font-size:12px;margin-bottom:12px}.alert.info{background:#edf5ff;color:#285b93}.alert.warning{background:#fff5dc;color:#8a5c0d}.alert.danger{background:#feecee;color:#b32a3b}.alert.success{background:#e9f8f1;color:#19704d}.toast-root{position:fixed;right:18px;bottom:18px;z-index:200;display:grid;gap:8px}.toast{background:#2e2025;color:#fff;padding:12px 15px;border-radius:11px;box-shadow:0 12px 35px #0003;min-width:260px;max-width:420px;font-size:13px}.toast.success{background:#17694b}.toast.danger{background:#a92c3c}.toast.warning{background:#80580d}
.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 15%,#ffe8ef,transparent 35%),radial-gradient(circle at 85% 85%,#fff0d8,transparent 35%),#f7f3f1}.login-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);box-shadow:0 24px 70px #5e35451c;border-radius:24px;padding:32px}.login-card h1{text-align:center;margin:4px 0 8px}.login-card>p{text-align:center}.demo-access{margin-top:18px;background:#fff8ef;border-radius:12px;padding:13px;display:grid;gap:5px;font-size:11px}.demo-access strong{font-size:12px}.security-note{font-size:11px;color:var(--muted);margin:11px 0 0!important}.demo-access code{background:#fff;padding:2px 4px;border-radius:4px}
.media-preview{max-width:220px;max-height:160px;border-radius:12px;border:1px solid var(--line)}.permission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.permission-group{border:1px solid var(--line);border-radius:12px;padding:12px}.permission-group h4{margin:0 0 8px;text-transform:capitalize}.permission-group label{display:flex;align-items:center;gap:6px;font-size:12px;margin:6px 0}.recipe-row{display:grid;grid-template-columns:1fr 120px 38px;gap:8px;align-items:center;margin-bottom:8px}.hero-note{background:linear-gradient(135deg,#fff0f5,#fff9ed);border:1px solid #f2dce3;border-radius:14px;padding:16px;margin-bottom:16px;display:flex;justify-content:space-between;gap:15px;align-items:center}.hero-note strong{display:block;margin-bottom:4px}.hero-note p{margin:0;color:var(--muted);font-size:12px}.mobile-only{display:none}.overlay{display:none}
@media(max-width:1250px){.grid.kpis{grid-template-columns:repeat(3,1fr)}.permission-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:980px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-280px;width:265px;transition:.22s}.sidebar.open{left:0}.overlay{position:fixed;inset:0;background:#0007;z-index:25}.overlay.show{display:block}.mobile-only{display:grid}.content{padding:18px}.pos-layout{grid-template-columns:1fr}.cart-panel{position:static}.grid.two,.grid.three{grid-template-columns:1fr}.topbar{padding:0 16px}.compact-select{max-width:190px}}
@media(max-width:680px){.grid.kpis{grid-template-columns:repeat(2,1fr);gap:10px}.kpi{min-height:105px;padding:14px}.kpi .value{font-size:20px}.content{padding:12px}.topbar{height:70px}.topbar h1{font-size:18px}.topbar p{display:none}.top-actions{gap:5px}.compact-select{padding:6px;max-width:150px}.compact-select>span,.compact-select{font-size:10px}.form-grid,.form-grid.three{grid-template-columns:1fr}.permission-grid{grid-template-columns:1fr}.modal-backdrop{padding:8px}.modal-body{padding:15px}.toolbar{align-items:stretch}.toolbar .group{width:100%}.toolbar .group>*{flex:1}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.product-card{min-height:150px;padding:11px}.product-card h3{font-size:13px}.product-card .price{font-size:14px}.hero-note{align-items:flex-start;flex-direction:column}.login-card{padding:24px 20px}.bar-row{grid-template-columns:95px 1fr auto}.toast-root{left:10px;right:10px;bottom:10px}.toast{min-width:0;max-width:none}.recipe-row{grid-template-columns:1fr 85px 36px}.custom-price-box{grid-template-columns:1fr}.custom-price-box .custom-total{border-left:0;border-top:1px solid var(--line);padding:8px 0 0}.rule-row{grid-template-columns:1fr 1fr}.rule-row>.check,.rule-row>small{grid-column:1/-1}.option-group-head{align-items:flex-start;flex-direction:column}.included-badge{align-self:flex-start}}
@media(max-width:430px){.grid.kpis{grid-template-columns:1fr 1fr}.product-grid{grid-template-columns:1fr}.compact-select select{max-width:100px}}
.setup-steps{padding-left:22px;margin:12px 0 18px}.setup-steps li{margin:9px 0;color:var(--ink);font-size:13px}.form-grid>.group{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.printer-cups-field small{display:block;margin-top:4px;color:var(--muted)}


/* Producción: el cierre de sesión conserva el aspecto de la navegación. */
.sidebar-foot form { margin: 0; }
.logout-button { width: 100%; border: 0; background: transparent; text-align: left; cursor: pointer; }


/* Logo Lulú solo para login y barra lateral */
.lulu-brand-icon{
  width:42px;
  height:42px;
  object-fit:contain;
  border-radius:10px;
  display:block;
}


/* === LULU VISUAL FINANCE DASHBOARD START === */

.finance-dashboard-root{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.finance-filter-card,
.finance-chart-card,
.finance-health-panel{
  background:#fff;
  border:1px solid #eddde3;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(72,31,46,.06);
}

.finance-filter-card{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  padding:16px;
  margin-bottom:16px;
}

.finance-filter-main,
.finance-quick-periods{
  display:flex;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:10px;
}

.finance-filter-main label{
  min-width:155px;
}

.finance-health-panel{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:28px;
  padding:24px;
  overflow:hidden;
  position:relative;
}

.finance-health-panel::before{
  content:"";
  position:absolute;
  width:240px;
  height:240px;
  border-radius:50%;
  right:-90px;
  top:-110px;
  opacity:.1;
  background:#159a77;
}

.finance-health-panel.observacion::before{
  background:#f0a134;
}

.finance-health-panel.critico::before{
  background:#e05276;
}

.finance-health-copy{
  position:relative;
  z-index:1;
  max-width:760px;
}

.finance-health-copy h2{
  margin:4px 0 8px;
  font-size:26px;
}

.finance-health-copy p{
  margin:0;
  color:#6c5b62;
  line-height:1.55;
}

.finance-eyebrow{
  color:#d92d63;
  font-weight:800;
  font-size:11px;
  letter-spacing:.11em;
}

.finance-period-line{
  display:flex;
  flex-wrap:wrap;
  gap:10px 24px;
  margin-top:18px;
  font-size:12px;
  color:#74656a;
}

.finance-health-side{
  display:flex;
  align-items:center;
  gap:20px;
  position:relative;
  z-index:1;
}

.finance-health-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:165px;
}

.finance-health-ring{
  --ring-color:#159a77;
  width:126px;
  height:126px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:
    conic-gradient(
      var(--ring-color)
      calc(var(--health-score)*1%),
      #f1e8eb 0
    );
  position:relative;
}

.finance-health-ring.observacion{
  --ring-color:#f0a134;
}

.finance-health-ring.critico{
  --ring-color:#e05276;
}

.finance-health-ring::before{
  content:"";
  position:absolute;
  inset:11px;
  background:#fff;
  border-radius:50%;
}

.finance-health-inner{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  line-height:1;
}

.finance-health-inner strong{
  font-size:30px;
}

.finance-health-inner span{
  font-size:11px;
  color:#87767c;
  margin-top:5px;
}

.finance-kpi-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.finance-kpi-card{
  --finance-accent:#d92d63;
  background:#fff;
  border:1px solid #eddde3;
  border-radius:16px;
  padding:17px;
  box-shadow:0 8px 22px rgba(72,31,46,.05);
  position:relative;
  overflow:hidden;
}

.finance-kpi-card::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--finance-accent);
}

.finance-kpi-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.finance-kpi-icon{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:10px;
  background:
    color-mix(
      in srgb,
      var(--finance-accent) 14%,
      white
    );
  color:var(--finance-accent);
  font-weight:900;
}

.finance-kpi-title{
  color:#74656a;
  font-size:12px;
  margin-top:12px;
}

.finance-kpi-value{
  font-size:23px;
  font-weight:850;
  margin-top:4px;
  color:#2d2327;
}

.finance-kpi-subtitle{
  color:#95878c;
  font-size:11px;
  margin-top:6px;
}

.finance-delta{
  display:inline-flex;
  padding:4px 7px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
}

.finance-delta.positive{
  color:#08795b;
  background:#e2f7ef;
}

.finance-delta.negative{
  color:#bc274e;
  background:#fde7ed;
}

.finance-delta.neutral{
  color:#75686d;
  background:#f2edef;
}

.finance-chart-card{
  padding:20px;
}

.finance-card-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:16px;
}

.finance-card-heading h2{
  margin:3px 0 0;
  font-size:18px;
}

.finance-card-heading p{
  margin:6px 0 0;
}

.finance-granularity{
  display:flex;
  gap:4px;
  padding:4px;
  background:#f5eff1;
  border-radius:12px;
}

.finance-granularity button{
  border:0;
  background:transparent;
  border-radius:9px;
  padding:7px 11px;
  cursor:pointer;
  font-size:11px;
  font-weight:700;
}

.finance-granularity button.active{
  background:#fff;
  color:#d92d63;
  box-shadow:0 3px 10px rgba(72,31,46,.09);
}

.finance-metric-toggles{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.finance-metric-toggles button{
  display:flex;
  align-items:center;
  gap:7px;
  border:1px solid #eadce1;
  background:#fff;
  border-radius:999px;
  padding:6px 10px;
  font-size:11px;
  cursor:pointer;
  color:#8a7a80;
}

.finance-metric-toggles button span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#cfc3c7;
}

.finance-metric-toggles button.active{
  color:#392f33;
  border-color:
    color-mix(
      in srgb,
      var(--metric-color) 45%,
      white
    );
}

.finance-metric-toggles button.active span{
  background:var(--metric-color);
}

.finance-line-svg{
  width:100%;
  min-height:280px;
  overflow:visible;
}

.finance-chart-grid{
  stroke:#eee5e8;
  stroke-width:1;
}

.finance-zero-line{
  stroke:#c6b9be;
  stroke-width:1.2;
  stroke-dasharray:5 5;
}

.finance-chart-axis{
  fill:#97878d;
  font-size:10px;
}

.finance-chart-line{
  transition:opacity .2s ease;
}

.finance-chart-dot{
  stroke:#fff;
  stroke-width:2;
}

.finance-two-column{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:16px;
}

.finance-three-column{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.finance-donut-layout{
  display:grid;
  grid-template-columns:190px 1fr;
  align-items:center;
  gap:18px;
}

.finance-donut-svg{
  width:180px;
  height:180px;
}

.finance-donut-total-label{
  font-size:10px;
  fill:#89787e;
}

.finance-donut-total-value{
  font-size:14px;
  font-weight:800;
  fill:#30262a;
}

.finance-donut-legend{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.finance-donut-legend-row{
  display:grid;
  grid-template-columns:10px 1fr auto;
  align-items:center;
  gap:8px;
  font-size:11px;
}

.finance-dot{
  width:9px;
  height:9px;
  border-radius:50%;
}

.finance-donut-label{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.finance-product-bars{
  display:flex;
  flex-direction:column;
  gap:15px;
}

.finance-product-bar-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font-size:12px;
}

.finance-product-track{
  width:100%;
  height:8px;
  background:#f2eaed;
  border-radius:999px;
  overflow:hidden;
  margin:7px 0 5px;
}

.finance-product-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(
    90deg,
    #d92d63,
    #f0789b
  );
}

.finance-product-fill.negative{
  background:#dc4658;
}

.finance-positive-text{
  color:#08795b;
}

.finance-negative-text{
  color:#bc274e;
}

.finance-alert-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.finance-alert-card{
  display:flex;
  gap:12px;
  padding:14px;
  border-radius:14px;
  border:1px solid #e9dfe2;
  background:#faf8f9;
}

.finance-alert-card.warning{
  background:#fff8e8;
  border-color:#f2d99c;
}

.finance-alert-card.danger{
  background:#fff0f3;
  border-color:#f1bdc9;
}

.finance-alert-card.success{
  background:#edf9f4;
  border-color:#bce5d5;
}

.finance-alert-icon{
  width:29px;
  height:29px;
  flex:0 0 29px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  font-weight:900;
}

.finance-alert-card p{
  margin:5px 0 0;
  color:#77676d;
  line-height:1.45;
  font-size:11px;
}

.finance-loading{
  min-height:270px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color:#77676d;
}

.finance-loading-ring{
  width:38px;
  height:38px;
  border:4px solid #f0dfe5;
  border-top-color:#d92d63;
  border-radius:50%;
  animation:financeSpin .8s linear infinite;
}

@keyframes financeSpin{
  to{
    transform:rotate(360deg);
  }
}

@media (max-width:1100px){
  .finance-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .finance-two-column{
    grid-template-columns:1fr;
  }

  .finance-three-column{
    grid-template-columns:1fr 1fr;
  }

  .finance-health-panel{
    align-items:flex-start;
  }

  .finance-health-side{
    flex-direction:column;
  }
}

@media (max-width:700px){
  .finance-filter-card,
  .finance-health-panel{
    flex-direction:column;
    align-items:stretch;
  }

  .finance-filter-main,
  .finance-quick-periods{
    width:100%;
  }

  .finance-filter-main label,
  .finance-filter-main button{
    width:100%;
  }

  .finance-kpi-grid,
  .finance-three-column,
  .finance-alert-grid{
    grid-template-columns:1fr;
  }

  .finance-health-side{
    flex-direction:row;
    justify-content:space-between;
  }

  .finance-donut-layout{
    grid-template-columns:1fr;
  }

  .finance-donut-wrap{
    display:flex;
    justify-content:center;
  }

  .finance-card-heading{
    flex-direction:column;
  }

  .finance-granularity{
    width:100%;
  }

  .finance-granularity button{
    flex:1;
  }
}

/* === LULU VISUAL FINANCE DASHBOARD END === */

/* === LULU OPTION GROUP EDITOR START === */

.rule-section-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.rule-section-heading h3{
  margin-bottom:4px;
}

.rule-section-heading p{
  margin:0;
}

.rule-toolbar{
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto;
  gap:12px;
  align-items:end;
  margin:14px 0;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbf8fa;
}

.rule-show-all{
  padding-bottom:10px;
  white-space:nowrap;
}

.rule-row.rule-row-detailed{
  grid-template-columns:minmax(330px,1.8fr) 145px 145px 120px;
  align-items:start;
  opacity:1;
  padding:14px;
}

.rule-row.rule-row-detailed:not(.enabled){
  background:#fafafa;
  opacity:.72;
}

.rule-main{
  min-width:0;
}

.rule-category-check{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
}

.rule-options-preview{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 11px;
}

.rule-option-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:5px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  font-size:11px;
  line-height:1.1;
}

.rule-option-chip small{
  color:var(--berry);
  font-weight:800;
}

.rule-edit-category{
  margin-top:2px;
}

.rule-option-count{
  padding-top:29px;
  text-align:right;
}

.option-editor-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-top:8px;
}

.option-editor-header h3{
  margin:0 0 4px;
}

.option-editor-header p{
  margin:0;
}

#optionEditorRows{
  display:grid;
  gap:9px;
  margin-top:12px;
}

.option-edit-row{
  display:grid;
  grid-template-columns:minmax(240px,1.6fr) 145px 145px 80px;
  gap:10px;
  align-items:end;
  padding:11px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}

.option-edit-row.inactive{
  opacity:.58;
  background:#f7f7f7;
}

.option-edit-name{
  min-width:0;
}

.option-active-check{
  padding-bottom:10px;
  white-space:nowrap;
}

.option-editor-footer{
  margin:18px -20px -20px;
}

@media(max-width:850px){
  .rule-row.rule-row-detailed{
    grid-template-columns:1fr 1fr;
  }

  .rule-main,
  .rule-option-count{
    grid-column:1/-1;
  }

  .rule-option-count{
    padding-top:0;
    text-align:left;
  }

  .option-edit-row{
    grid-template-columns:1fr 1fr;
  }

  .option-edit-name{
    grid-column:1/-1;
  }
}

@media(max-width:680px){
  .rule-toolbar{
    grid-template-columns:1fr;
  }

  .rule-show-all{
    padding-bottom:0;
  }

  .rule-row.rule-row-detailed{
    grid-template-columns:1fr;
  }

  .rule-main,
  .rule-option-count{
    grid-column:auto;
  }

  .option-editor-header{
    flex-direction:column;
  }

  .option-edit-row{
    grid-template-columns:1fr;
  }

  .option-edit-name{
    grid-column:auto;
  }

  .option-active-check{
    padding-bottom:0;
  }
}

/* === LULU OPTION GROUP EDITOR END === */
