html[data-theme=light]{color-scheme:light;--bg: #f2f2f7;--bg-elevated: #ffffff;--label: #000000;--label-secondary: rgba(60, 60, 67, .6);--separator: rgba(60, 60, 67, .18);--fill: rgba(120, 120, 128, .12);--accent: #1a5c44;--accent-soft: rgba(26, 92, 68, .12);--on-accent: #ffffff;--danger: #ff3b30;--danger-soft: rgba(255, 59, 48, .12);--warning: #c93400;--warning-soft: rgba(255, 149, 0, .18);--ok: #1a5c44;--surface-blur: rgba(242, 242, 247, .78);--shadow: 0 8px 28px rgba(0, 0, 0, .1);--overlay: rgba(0, 0, 0, .4)}html[data-theme=dark]{color-scheme:dark;--bg: #000000;--bg-elevated: #1c1c1e;--label: #ffffff;--label-secondary: rgba(235, 235, 245, .6);--separator: rgba(84, 84, 88, .65);--fill: rgba(120, 120, 128, .24);--accent: #3ddc97;--accent-soft: rgba(61, 220, 151, .16);--on-accent: #04140c;--danger: #ff453a;--danger-soft: rgba(255, 69, 58, .18);--warning: #ffd60a;--warning-soft: rgba(255, 214, 10, .16);--ok: #3ddc97;--surface-blur: rgba(28, 28, 30, .78);--shadow: 0 10px 32px rgba(0, 0, 0, .45);--overlay: rgba(0, 0, 0, .55)}:root{--radius: 16px;--font: "Montserrat", sans-serif;--nav-space: calc(84px + env(safe-area-inset-bottom, 0px)) ;--safe-b: env(safe-area-inset-bottom, 0px);--safe-t: env(safe-area-inset-top, 0px)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}html{background:var(--bg);color:var(--label);-webkit-text-size-adjust:100%;text-size-adjust:100%}body{min-height:100dvh;min-height:-webkit-fill-available;font-family:var(--font);font-weight:400;font-synthesis:none;color:var(--label);background:var(--bg);-webkit-font-smoothing:antialiased;touch-action:manipulation}button,input,select,textarea{font:inherit;font-weight:400}button,a{-webkit-tap-highlight-color:transparent}strong,b,h1,h2,h3,.money,.badge,.btn,.kpi-value{font-weight:400}.app{min-height:100dvh;min-height:-webkit-fill-available;display:flex;flex-direction:column;padding-bottom:var(--nav-space)}.topbar{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:calc(14px + var(--safe-t)) max(16px,env(safe-area-inset-right,0px)) 4px max(16px,env(safe-area-inset-left,0px))}.brand{font-size:1.35rem;line-height:1.15;letter-spacing:-.03em;color:var(--label)}.brand-meta{font-size:.8rem;color:var(--label-secondary)}.content{flex:1;display:flex;flex-direction:column;gap:14px;padding:8px max(16px,env(safe-area-inset-right,0px)) 24px max(16px,env(safe-area-inset-left,0px));width:min(720px,100%);margin:0 auto}.section-title{font-size:2rem;margin:0;line-height:1.1;letter-spacing:-.03em}.section-sub{margin:4px 0 0;color:var(--label-secondary);font-size:.95rem}.group-title{margin:6px 4px 0;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--label-secondary)}.status-grid,.kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.status-item,.kpi-card,.invoice-card,.panel,.list-item{background:var(--bg-elevated);border:.5px solid var(--separator);border-radius:var(--radius)}.status-item,.kpi-card{display:flex;flex-direction:column;gap:4px;padding:12px;min-width:0;overflow:hidden;container-type:inline-size;container-name:status}.kpi-value{font-size:1.35rem;line-height:1.2;letter-spacing:-.03em;overflow-wrap:anywhere}.status-amount{font-size:clamp(.78rem,18cqw,1.05rem);line-height:1.15;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.status-label{font-size:.75rem;color:var(--label-secondary);line-height:1.2}.panel{padding:14px;display:flex;flex-direction:column;gap:12px}.stack{display:flex;flex-direction:column;gap:10px}.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.field{display:flex;flex-direction:column;gap:6px;flex:1 1 100%;min-width:0}.field label{font-size:.8125rem;color:var(--label-secondary)}.field input,.field select,.field textarea,.combobox input{width:100%;border:none;border-radius:12px;padding:12px 14px;min-height:44px;background:var(--fill);color:var(--label);font-size:16px}.field input:not([type=date]):not([type=time]),.field select,.field textarea,.combobox input{-webkit-appearance:none;-moz-appearance:none;appearance:none}.field select{background-image:linear-gradient(45deg,transparent 50%,var(--label-secondary) 50%),linear-gradient(135deg,var(--label-secondary) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 12px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:32px}.field input:focus,.field select:focus,.field textarea:focus,.combobox input:focus{outline:none;box-shadow:0 0 0 2px var(--accent)}.field textarea{min-height:88px;resize:vertical}.cart-line{align-items:flex-end}.cart-items{display:flex;flex-direction:column;gap:8px;margin:4px 0 8px}.cart-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;background:var(--fill)}.pago-plan{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}.pago-plan li{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;padding:8px 12px;border-radius:12px;background:var(--fill);font-size:.9rem}.cart-item-meta,.meta{margin-top:2px;color:var(--label-secondary);font-size:.86rem}.field-material,.field-qty{flex:1 1 100%;min-width:0}.combobox{position:relative;z-index:1}.combobox-open{z-index:160}.combobox input{padding-right:40px}.combobox-clear{position:absolute;top:50%;right:8px;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:999px;background:var(--bg-elevated);color:var(--accent);font-size:1.15rem;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}.combobox-list{position:absolute;z-index:160;top:calc(100% + 6px);left:0;right:0;margin:0;padding:6px;list-style:none;max-height:min(260px,40dvh);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border:.5px solid var(--separator);border-radius:14px;background:var(--bg-elevated);box-shadow:var(--shadow)}.combobox-option{width:100%;min-height:44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;border:0;border-radius:10px;padding:10px 12px;background:transparent;text-align:left;cursor:pointer;color:inherit}.combobox-option-active{background:var(--accent-soft)}.combobox-option-selected{box-shadow:inset 2px 0 0 var(--accent)}.combobox-option-name{font-size:.95rem;line-height:1.25;overflow-wrap:anywhere}.combobox-option-meta{font-size:.78rem;color:var(--label-secondary);font-variant-numeric:tabular-nums}.combobox-empty{padding:14px 12px;color:var(--label-secondary);font-size:.9rem}.btn{border:0;border-radius:12px;min-height:44px;padding:12px 14px;cursor:pointer}.btn-primary{background:var(--accent);color:var(--on-accent)}.btn-secondary{background:var(--accent-soft);color:var(--accent)}.btn-danger{background:var(--danger-soft);color:var(--danger)}.btn-ghost{background:transparent;color:var(--label-secondary)}.btn:disabled{opacity:.55}.home-cta,.sheet-logout{width:100%}.list{display:flex;flex-direction:column;gap:8px}.list-item,.invoice-card{display:flex;flex-direction:column;gap:6px;padding:12px}.invoice-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.list-item strong,.invoice-card strong{font-size:1rem}.badge{display:inline-flex;align-self:flex-start;padding:4px 10px;border-radius:999px;font-size:.75rem}.badge-pendiente,.badge-por-vencer{background:var(--warning-soft);color:var(--warning)}.badge-pagada{background:var(--accent-soft);color:var(--ok)}.badge-cancelada,.badge-vencida{background:var(--danger-soft);color:var(--danger)}.error-banner,.success-banner{border-radius:12px;padding:12px;font-size:.92rem}.error-banner{background:var(--danger-soft);color:var(--danger)}.success-banner{background:var(--accent-soft);color:var(--ok)}.empty{text-align:center;color:var(--label-secondary);padding:16px 8px;background:var(--bg-elevated);border-radius:var(--radius)}.bottom-nav{position:fixed;z-index:100;left:50%;right:auto;transform:translate(-50%);bottom:calc(.75rem + var(--safe-b));width:max-content;max-width:calc(100vw - 16px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));display:flex;align-items:center;gap:2px;padding:5px;border-radius:999px;background:var(--surface-blur);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border:.5px solid var(--separator);box-shadow:var(--shadow);overflow-x:auto;-webkit-overflow-scrolling:touch}.nav-item{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:0;min-width:40px;min-height:40px;padding:8px;border:0;border-radius:999px;background:transparent;color:var(--label-secondary);cursor:pointer}.nav-label{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;font-size:.78rem;transition:max-width .25s ease,opacity .2s ease}.nav-item.active{gap:6px;padding:8px 12px;color:var(--accent);background:var(--accent-soft)}.nav-item.active .nav-label{max-width:5.6rem;opacity:1}.nav-settings .nav-label{display:none}.icon{display:block;flex:0 0 auto}.login-wrap{min-height:100dvh;min-height:-webkit-fill-available;display:flex;align-items:center;justify-content:center;padding:calc(24px + var(--safe-t)) 16px calc(24px + var(--safe-b))}.login-panel{width:min(420px,100%);display:flex;flex-direction:column;gap:14px;background:var(--bg-elevated);border:.5px solid var(--separator);border-radius:20px;padding:22px 18px;box-shadow:var(--shadow)}.login-panel .brand,.login-panel .section-sub{text-align:center}.money{font-variant-numeric:tabular-nums}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;padding:0;background:var(--overlay)}.modal-dialog{width:min(520px,100%);background:var(--bg-elevated);border-radius:20px 20px 0 0;padding:20px 18px calc(18px + var(--safe-b));box-shadow:var(--shadow)}.modal-dialog h2{margin:0 0 8px;font-size:1.25rem;letter-spacing:-.02em}.modal-dialog p{margin:0 0 14px;color:var(--label-secondary);line-height:1.45}.sheet-root{position:fixed;top:0;right:0;bottom:0;left:0;z-index:400;display:flex;align-items:flex-end;justify-content:center}.sheet-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;border:0;background:var(--overlay);cursor:pointer}.sheet{position:relative;z-index:1;width:min(100%,560px);max-height:min(88dvh,720px);display:flex;flex-direction:column;background:var(--bg);border:.5px solid var(--separator);border-bottom:0;border-radius:20px 20px 0 0;box-shadow:var(--shadow);animation:sheet-up .28s cubic-bezier(.22,1,.36,1)}.sheet-grabber{width:36px;height:5px;border-radius:999px;background:var(--separator);margin:8px auto 0}.sheet-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px 10px}.sheet-header h2{margin:0;font-size:1.25rem;letter-spacing:-.02em}.sheet-close{width:32px;height:32px;border:0;border-radius:999px;background:var(--fill);color:var(--label-secondary);display:grid;place-items:center;cursor:pointer}.sheet-body{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0 16px calc(16px + var(--safe-b));display:flex;flex-direction:column;gap:16px}.sheet-group{display:flex;flex-direction:column;gap:10px;background:var(--bg-elevated);border-radius:var(--radius);padding:12px}.sheet-group .group-title{margin:0}.sheet-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.theme-toggle{flex-shrink:0;padding:0;border:0;background:transparent;cursor:pointer}.theme-toggle-track{display:block;width:52px;height:30px;border-radius:999px;background:var(--fill);border:.5px solid var(--separator);position:relative}.theme-toggle-thumb{position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:999px;background:var(--bg-elevated);color:var(--accent);display:grid;place-items:center;transition:transform .2s ease}.theme-toggle-thumb.is-dark{transform:translate(22px);background:var(--accent);color:var(--on-accent)}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.sheet,.nav-label,.theme-toggle-thumb{animation:none;transition:none}}@media(min-width:480px){.field-material{flex:1 1 calc(100% - 120px)}.field-qty{flex:0 0 108px}.modal-backdrop{align-items:center;padding:16px}.modal-dialog{border-radius:20px;padding-bottom:18px}}@media(min-width:720px){.status-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.field{flex:1 1 calc(50% - 8px)}.field.full{flex:1 1 100%}.field-material{flex:1 1 calc(70% - 8px)}.field-qty{flex:0 0 120px}.content{padding-top:16px}}
