:root{--navy:#062747;--blue:#0b5fa8;--green:#05845d;--gold:#d4952d;--ink:#14283b;--muted:#667788;--line:#dce5ec;--paper:#f3f6f8;--white:#fff}
*{box-sizing:border-box}body{margin:0;font-family:"Segoe UI",system-ui,sans-serif;background:var(--paper);color:var(--ink)}button,input{font:inherit}
.brand-logo{overflow:hidden}.brand-logo img{width:100%;height:100%;object-fit:contain;background:white}
.login-card>.brand-mark{align-self:center;margin-bottom:8px}
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(320px,560px) 1fr;background:var(--navy)}.login-card{background:#fff;padding:clamp(32px,6vw,84px);display:flex;flex-direction:column;justify-content:center}.brand-mark,.logo{display:grid;place-items:center;width:58px;height:58px;background:var(--navy);color:white;font-weight:900;letter-spacing:-2px;border-radius:14px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--gold);margin:24px 0 10px}.login-card h1,.hero h1{font-size:clamp(34px,4vw,58px);line-height:1.02;margin:0;letter-spacing:-2px}.muted{color:var(--muted);line-height:1.6}.login-card form{display:grid;gap:14px;margin-top:24px}.login-card label{font-size:13px;font-weight:700}.login-card input{width:100%;margin-top:6px;padding:13px 14px;border:1px solid var(--line);border-radius:9px;outline:none}.login-card input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #0b5fa818}.login-card button{border:0;border-radius:9px;padding:14px;background:var(--green);color:white;font-weight:800;cursor:pointer}.error{color:#b42318;min-height:20px;margin:0}.login-aside{padding:8vw;display:flex;flex-direction:column;justify-content:center;gap:42px;color:white;background:linear-gradient(145deg,#062747,#0b5fa8)}.login-aside div{display:flex;align-items:center;gap:20px;font-size:22px}.login-aside span{color:#66c7aa;font-weight:900}
main{max-width:1500px;margin:auto;min-height:100vh}header{height:82px;padding:12px 32px;display:flex;justify-content:space-between;align-items:center;background:white;border-bottom:1px solid var(--line)}header>div{display:flex;align-items:center;gap:14px}header small{display:block;color:var(--muted);margin-top:3px}nav{display:flex;gap:8px}button.secondary,button.ghost{border:1px solid var(--line);background:white;padding:10px 16px;border-radius:8px;cursor:pointer}button.ghost{border:0;color:var(--muted)}.hero{margin:28px 28px 0;background:var(--navy);color:white;border-radius:18px;padding:38px;display:flex;justify-content:space-between;align-items:end}.hero .eyebrow{margin-top:0}.hero .muted{color:#a9bdcd}.hero-total{text-align:right}.hero-total small,.hero-total span{display:block;color:#a9bdcd}.hero-total strong{display:block;font-size:clamp(34px,5vw,64px);margin:8px 0}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:14px 28px}.metrics article,.panel{background:white;border:1px solid var(--line);border-radius:14px}.metrics article{padding:22px}.metrics span,.metrics small{color:var(--muted);display:block}.metrics strong{font-size:34px;display:block;margin:8px 0;color:var(--navy)}.grid-two{display:grid;grid-template-columns:.8fr 1.2fr;gap:14px;padding:0 28px 14px}.panel-title{padding:20px 22px;border-bottom:1px solid var(--line)}.panel-title .eyebrow{margin:0 0 5px}.panel-title h2{margin:0;font-size:21px}.register-list{padding:8px 22px}.register-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:17px 0;border-bottom:1px solid var(--line)}.register-row:last-child{border:0}.register-row small{display:block;color:var(--muted);margin-top:4px}.register-row strong:last-child{color:var(--green);font-size:20px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:590px}th,td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);white-space:nowrap}th{font-size:11px;color:var(--muted);letter-spacing:1px;background:#f8fafb}td:last-child{font-weight:800}.stock-low{color:#b42318}.stock-ok{color:var(--green)}.sales-panel{margin:0 28px 28px}
.date-control{display:flex;align-items:end;gap:8px;margin-top:22px}.date-control label{display:grid;gap:5px;font-size:12px;color:#a9bdcd;font-weight:700}.date-control input,.date-control button{border:1px solid #ffffff40;border-radius:8px;padding:9px 11px;background:#ffffff12;color:white}.date-control input{color-scheme:dark}.date-control button{cursor:pointer;font-weight:800}.panel-subtitle{padding:18px 22px 0;border-top:1px solid var(--line)}.panel-subtitle .eyebrow{margin:0 0 4px}.panel-subtitle h3{margin:0}.cash-panel{margin:0 28px 14px}.status-pill{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.status-pill.open{background:#dff7ed;color:#087854}.status-pill.closed{background:#edf1f4;color:#536473}.difference-negative{color:#b42318}.difference-ok{color:var(--green)}
.title-with-action{display:flex;justify-content:space-between;align-items:center;gap:12px}.export-button,.whatsapp-button{border:0;border-radius:9px;padding:11px 15px;background:var(--green);color:white;font-weight:800;cursor:pointer}.whatsapp-button{background:#128c56}.payment-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border-bottom:1px solid var(--line)}.payment-summary>div{background:white;padding:16px 20px}.payment-summary span,.payment-summary small{display:block;color:var(--muted)}.payment-summary strong{display:block;font-size:21px;margin:5px 0;color:var(--navy)}
.order-panel{margin:0 28px 28px}.order-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.order-toolbar{padding:16px 22px;display:flex;align-items:end;justify-content:space-between;gap:18px;background:#f8fafb;border-bottom:1px solid var(--line)}.supplier-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;max-width:760px;text-align:left!important}.order-toolbar label{font-size:12px;font-weight:800}.order-toolbar input{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid var(--line);border-radius:8px;background:white}.order-toolbar>div:last-child{text-align:right}.order-toolbar small{display:block;color:var(--muted);margin-top:4px}.order-toolbar strong{display:block;color:var(--green);font-size:26px;margin-top:4px}.order-quantity{width:92px;padding:8px;border:1px solid var(--line);border-radius:7px;text-align:center}.order-subtotal{color:var(--green)}
.accounting-panel{margin:0 28px 14px}.accounting-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}.accounting-metrics>div{padding:18px 22px;background:white}.accounting-metrics span{display:block;color:var(--muted);font-size:13px}.accounting-metrics strong{display:block;margin-top:7px;font-size:25px;color:var(--navy)}.account-type{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.account-type.receivable{background:#dff7ed;color:#087854}.account-type.payable{background:#fff1df;color:#a15b00}.payment-button{border:1px solid var(--line);background:white;border-radius:7px;padding:7px 9px;cursor:pointer;color:var(--navy);font-weight:700}#accountForm{padding:26px;display:grid;gap:16px}#accountForm label{font-size:13px;font-weight:700}#accountForm input,#accountForm select{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid var(--line);border-radius:8px;background:white}
.customers-panel{margin:0 28px 14px}.customer-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}.customer-summary>div{padding:16px 22px;background:white}.customer-summary span{display:block;color:var(--muted);font-size:13px}.customer-summary strong{display:block;margin-top:6px;font-size:24px;color:var(--navy)}.loyalty-pill{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800;background:#edf1f4;color:#536473}.loyalty-pill.frecuente{background:#e5f0ff;color:#145ca8}.loyalty-pill.permanente{background:#fff1cf;color:#8d6100}
.history-button{border:1px solid var(--line);background:white;border-radius:7px;padding:7px 10px;color:var(--navy);font-weight:700;cursor:pointer}.wide-dialog{width:min(900px,calc(100% - 28px))}.history-content{padding:24px}.history-content .table-wrap{margin-top:18px;border:1px solid var(--line);border-radius:10px}
.account-filter-card{cursor:pointer;transition:box-shadow .15s,transform .15s}.account-filter-card:hover,.account-filter-card:focus-visible{box-shadow:inset 0 0 0 2px var(--blue);outline:none}.account-filter-card.active{background:#e7f2ff!important;box-shadow:inset 0 0 0 2px var(--blue)}.account-filter-card small{display:block;margin-top:5px;color:var(--muted);font-size:10px}body.dark-theme .account-filter-card.active{background:#25415b!important}
@media(max-width:850px){.login-shell{grid-template-columns:1fr}.login-aside{display:none}.hero{align-items:start;gap:30px;flex-direction:column}.hero-total{text-align:left}.metrics{grid-template-columns:1fr 1fr}.grid-two{grid-template-columns:1fr}header{padding:12px 16px}.hero,.sales-panel,.cash-panel{margin-left:14px;margin-right:14px}.metrics,.grid-two{padding-left:14px;padding-right:14px}}@media(max-width:520px){.metrics{grid-template-columns:1fr}.hero{padding:26px}.hero h1{font-size:35px}.logo{width:48px;height:48px}header strong{font-size:14px}}
dialog{border:0;border-radius:18px;padding:0;width:min(560px,calc(100% - 28px));box-shadow:0 24px 80px #001b3360}dialog::backdrop{background:#001b3380;backdrop-filter:blur(3px)}#brandingForm{padding:26px;display:grid;gap:18px}#brandingForm label{font-size:13px;font-weight:700}#brandBusinessName{width:100%;margin-top:6px;padding:12px;border:1px solid var(--line);border-radius:9px}.dialog-title,.dialog-actions,.logo-preview{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-title .eyebrow{margin:0 0 4px}.dialog-title h2{margin:0}.icon-button{border:0;background:transparent;font-size:30px;color:var(--muted);cursor:pointer}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.color-grid input{display:block;width:100%;height:44px;margin-top:7px;border:1px solid var(--line);border-radius:9px;padding:4px;background:white}.logo-preview{justify-content:flex-start;padding:12px;background:var(--paper);border-radius:10px}.logo-preview .brand-logo{display:grid;place-items:center;width:72px;height:72px;background:var(--navy);color:white;font-weight:900;border-radius:12px}.dialog-actions{justify-content:flex-end}.dialog-actions button[type="submit"]{border:0;border-radius:9px;padding:11px 18px;background:var(--green);color:white;font-weight:800;cursor:pointer}.form-message{min-height:20px;margin:0;color:var(--green)}
#productDialog{width:min(650px,calc(100% - 28px));max-height:92dvh;overflow:auto}#productForm{padding:26px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 14px}#productForm>.dialog-title,#productForm>.color-grid,#productForm>.logo-preview,#productForm>.muted,#productForm>.dialog-actions,#productForm>label:nth-child(4){grid-column:1/-1}#productForm label{display:grid;gap:7px;min-width:0;font-size:13px;font-weight:700}#productForm input{display:block;width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:white}#productForm input[type="file"]{padding:9px}#productForm>.color-grid label{min-width:0}#productForm>.logo-preview{min-height:46px}#productForm>.muted{margin:0}#productForm>.dialog-actions{padding-top:2px}
#stockDialog{max-height:92dvh;overflow:auto}#stockForm{display:grid;gap:16px;padding:24px}#stockForm>.dialog-title{margin:-24px -24px 2px;padding:18px 22px;background:var(--navy);color:#fff}#stockForm>.dialog-title .eyebrow{color:#e6b64e}#stockForm>.dialog-title .icon-button{color:#fff}#stockForm label{display:grid;gap:7px;min-width:0;font-size:13px;font-weight:750}#stockForm input,#stockForm select{display:block;width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}#stockForm label small{display:block;color:var(--muted);font-size:11px;font-weight:400;line-height:1.35}#stockForm>p{margin:0;padding:10px 12px;border-radius:8px;background:#f2f6fa}#stockForm .dialog-actions{padding-top:2px}
#stockForm .stock-cost-choice{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:9px;background:#f8fafc}#stockForm .stock-cost-choice input{width:18px;height:18px;margin:0;padding:0;flex:0 0 auto}
@media(max-width:600px){#stockDialog{width:calc(100% - 16px);max-height:95dvh}#stockForm{gap:13px;padding:18px}#stockForm>.dialog-title{margin:-18px -18px 0;padding:15px}#stockForm>.dialog-title h2{font-size:20px}#stockForm .dialog-actions{display:grid;grid-template-columns:1fr 1fr}#stockForm .dialog-actions button{width:100%;min-width:0;padding:11px 6px}}
@media(max-width:650px){header{height:auto;align-items:flex-start;gap:10px}header nav{flex-wrap:wrap;justify-content:flex-end}#brandingBtn{order:3}.color-grid{grid-template-columns:1fr}}
@media(max-width:650px){#productDialog{width:calc(100% - 16px);max-height:95dvh}#productForm{grid-template-columns:1fr;padding:18px;gap:13px}#productForm>*{grid-column:1!important}#productForm>.color-grid{grid-template-columns:1fr}#productForm .dialog-actions{display:grid;grid-template-columns:1fr 1fr}#productForm .dialog-actions button{width:100%;min-width:0;padding:11px 7px}}
@media(max-width:850px){.order-panel{margin-left:14px;margin-right:14px}.order-toolbar{align-items:stretch;flex-direction:column}.order-toolbar>div{text-align:left}.supplier-fields{grid-template-columns:1fr;width:100%}}
@media(max-width:850px){.accounting-panel{margin-left:14px;margin-right:14px}.accounting-metrics{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.customers-panel{margin-left:14px;margin-right:14px}.customer-summary{grid-template-columns:1fr}}
@media(max-width:520px){.title-with-action{align-items:flex-start;flex-direction:column}.export-button{width:100%}.order-actions{width:100%;flex-direction:column}.order-actions button{width:100%}}
@media(max-width:520px){.accounting-metrics{grid-template-columns:1fr}}
.order-unselected{opacity:.45;background:#f2f4f7}.order-selected{width:20px;height:20px;accent-color:var(--green)}
body.dark-theme{--ink:#eef4f8;--muted:#a9bdcd;--line:#344a5e;background:#0d1822;color:#eef4f8}body.dark-theme header,body.dark-theme .panel,body.dark-theme .metrics article,body.dark-theme .order-toolbar,body.dark-theme dialog,body.dark-theme .login-card{background:#172737;color:#eef4f8}body.dark-theme th{background:#203447;color:#c1d1dc}body.dark-theme td{color:#eef4f8}body.dark-theme input,body.dark-theme select,body.dark-theme textarea{background:#0f1d29;color:#fff;border-color:#496276}body.dark-theme button.secondary,body.dark-theme button.ghost{background:#263b4e;color:#fff;border-color:#496276}body.dark-theme .order-unselected{background:#101c27}body.dark-theme .accounting-metrics>div,body.dark-theme .payment-summary>div{background:#203447}
.profit-period-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:22px}.profit-period-grid article{padding:24px;border-radius:14px;background:#f5f9fc;border:1px solid var(--line)}.profit-period-grid span,.profit-period-grid small{display:block;color:var(--muted)}.profit-period-grid strong{display:block;font-size:30px;color:var(--green);margin:12px 0}.profit-period-grid strong.negative{color:#b42318}body.dark-theme .profit-period-grid article{background:#203447}@media(max-width:850px){.profit-period-grid{grid-template-columns:1fr}}
.product-offer-row td{background:#aef5bc;color:#004b23;font-weight:700}body.dark-theme .product-offer-row td{background:#08783e;color:#f0fff5}
.app-footer{margin:8px 28px 24px;padding:18px;text-align:center;color:var(--muted);font-size:13px;border-top:1px solid var(--line)}

/* Presentación optimizada para el Panel del Dueño en teléfonos */
@media(max-width:600px){
  body{background:#edf2f6}
  main{width:100%;overflow:hidden}
  .login-shell{display:block;background:#edf2f6;padding:18px;min-height:100dvh}
  .login-card{min-height:calc(100dvh - 36px);padding:28px 22px;border-radius:22px;box-shadow:0 14px 40px #06274718;justify-content:flex-start}
  .login-card>.brand-mark{width:68px;height:68px;border-radius:18px;margin:8px auto 4px}
  .login-card .eyebrow{text-align:center;margin-top:15px}
  .login-card h1{text-align:center;font-size:31px;line-height:1.08;letter-spacing:-1.2px}
  .login-card>.muted{text-align:center;font-size:14px}
  .login-card form{margin-top:18px;gap:11px}
  .login-card input{padding:12px}

  header{position:sticky;top:0;z-index:20;display:block;height:auto;padding:12px 14px;box-shadow:0 4px 18px #06274712}
  header>div{min-width:0}
  header .logo{width:44px;height:44px;border-radius:12px;flex:0 0 44px}
  header>div>div:last-child{min-width:0}
  header strong,header small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  header nav{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%;margin-top:10px}
  header nav button.secondary,header nav button.ghost{min-width:0;padding:9px 4px;font-size:11px;white-space:nowrap}

  .hero{margin:10px;border-radius:16px;padding:20px;gap:16px;align-items:stretch}
  .hero h1{display:none}
  .hero .eyebrow{font-size:11px;margin-bottom:12px}
  .hero .date-control{margin-top:0;align-items:end}
  .hero .date-control label{flex:1}
  .hero .date-control input{width:100%}
  .hero #updatedAt{font-size:11px;margin:10px 0 0}
  .hero-total{border-top:1px solid #ffffff2b;padding-top:15px;text-align:left}
  .hero-total strong{font-size:34px;line-height:1;margin:7px 0}

  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0 10px 10px}
  .metrics article{min-width:0;padding:15px 13px;border-radius:13px;box-shadow:0 5px 16px #0627470b}
  .metrics span{font-size:12px;line-height:1.25;min-height:30px}
  .metrics strong{font-size:21px;line-height:1.08;margin:7px 0;overflow-wrap:anywhere}
  .metrics small{font-size:10px;line-height:1.25}

  .panel,.alert-panel,.sales-panel,.cash-panel,.accounting-panel,.customers-panel,.order-panel{margin:0 10px 10px;border-radius:14px;overflow:hidden}
  .grid-two{display:block;padding:0}
  .grid-two>.panel{margin:0 10px 10px}
  .panel-title{padding:15px}
  .panel-title h2{font-size:18px;line-height:1.2}
  .panel-title .eyebrow{font-size:10px;letter-spacing:1.4px}
  .mobile-collapsible>.panel-title{position:relative;padding-right:52px;cursor:pointer;user-select:none}
  .mobile-collapsible>.panel-title::after{content:"⌄";position:absolute;right:17px;top:50%;transform:translateY(-50%) rotate(180deg);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#edf3f8;color:var(--navy);font-size:20px;font-weight:900;transition:transform .2s}
  .mobile-collapsible.mobile-collapsed>.panel-title::after{transform:translateY(-50%) rotate(0)}
  .mobile-collapsible.mobile-collapsed>:not(.panel-title){display:none!important}
  body.dark-theme .mobile-collapsible>.panel-title::after{background:#263b4e;color:white}
  .panel>.muted,.accounting-panel>.muted{padding:0 15px;font-size:12px}
  .title-with-action{align-items:stretch;flex-direction:column}
  .title-with-action>button,.title-with-action>.order-actions{width:100%}
  .title-with-action button{min-height:42px}

  .register-list{padding:4px 15px}
  .register-row{padding:13px 0}
  .register-row strong:last-child{font-size:17px}
  .payment-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .payment-summary>div{padding:13px}
  .payment-summary strong{font-size:17px}
  .accounting-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .accounting-metrics>div{padding:14px 12px}
  .accounting-metrics span{font-size:11px;line-height:1.25}
  .accounting-metrics strong{font-size:18px;overflow-wrap:anywhere}
  .customer-summary{grid-template-columns:1fr 1fr}
  .customer-summary>div{padding:13px}
  .customer-summary strong{font-size:19px}
  .profit-period-grid{padding:14px;gap:10px}
  .profit-period-grid article{padding:17px}
  .profit-period-grid strong{font-size:25px}

  .table-wrap{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  table{min-width:640px}
  th,td{padding:11px 13px;font-size:12px}
  .order-toolbar{padding:14px}
  .supplier-fields{gap:9px}
  .order-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .order-actions button{width:100%;padding:10px 5px;font-size:11px}
  dialog{max-height:92dvh;overflow:auto;border-radius:16px}
  #productForm,#accountForm,#brandingForm{padding:18px}
  .dialog-title h2{font-size:20px}
  .app-footer{margin:8px 10px 18px;padding:14px 8px;font-size:11px}
}
#userForm{padding:26px;display:grid;gap:15px}#userForm label{font-size:13px;font-weight:700}#userForm input,#userForm select{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid var(--line);border-radius:8px;background:white}.role-pill{display:inline-block;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;background:#edf1f4;color:#536473}.role-pill.owner{background:#fff0c7;color:#8b5d00}.role-pill.admin{background:#eee6ff;color:#6441a5}.role-pill.inventory{background:#dff7ed;color:#087854}.role-pill.cashier{background:#e5f0ff;color:#145ca8}@media(max-width:600px){#userForm{padding:18px}}

/* Acabado profesional del Panel del Dueño */
@media(min-width:601px){
  body{background:#eef3f8}
  main{max-width:1600px;background:#eef3f8}
  header{position:sticky;top:0;z-index:30;height:76px;background:#062747;color:white;border:0;box-shadow:0 6px 24px #06274722}
  header small{color:#bdd0df}
  header .logo{background:white;color:var(--navy);box-shadow:0 5px 14px #001a3038}
  header nav button.secondary{background:#ffffff12;color:white;border-color:#ffffff2e}
  header nav button.secondary:hover{background:#ffffff25}
  header nav button.ghost{color:#d8e5ee}
  button{transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
  button:hover{transform:translateY(-1px)}
  button:focus-visible{outline:3px solid #2f80ed55;outline-offset:2px}
  .hero{margin:22px 24px 0;padding:30px 34px;border-radius:20px;background:linear-gradient(125deg,#062747 0%,#0a477b 68%,#08765b 150%);box-shadow:0 16px 34px #06274722}
  .hero h1{font-size:clamp(30px,3.2vw,48px);letter-spacing:-1.5px}
  .hero-total{min-width:310px;padding-left:30px;border-left:1px solid #ffffff2e}
  .hero-total strong{font-size:clamp(36px,4vw,54px);letter-spacing:-2px}
  .metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:16px 24px}
  .metrics article{position:relative;min-width:0;padding:20px 20px 18px;border:0;border-radius:16px;box-shadow:0 7px 24px #0627470d;overflow:hidden}
  .metrics article{cursor:pointer}
  .metrics article:hover{transform:translateY(-3px);box-shadow:0 12px 30px #0627471b}
  .metrics article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#2f80ed}
  .metrics article:nth-child(2)::before{background:#15a174}
  .metrics article:nth-child(3)::before{background:#e5a823}
  .metrics article:nth-child(4)::before{background:#7b61d1}
  .metrics article:nth-child(5)::before{background:#e35d6a}
  .metrics article:nth-child(6)::before{background:#8b5bd3}
  .metrics article:nth-child(7)::before{background:#0f9d72}
  .metrics span{min-height:34px;font-size:12px;font-weight:700;line-height:1.35}
  .metrics strong{font-size:clamp(20px,1.55vw,27px);line-height:1.08;letter-spacing:-.7px;overflow-wrap:anywhere;word-break:normal}
  .metrics small{font-size:11px;line-height:1.35}
  .panel{border:0;border-radius:16px;box-shadow:0 7px 24px #0627470d}
  .alert-panel{margin:0 24px 14px}
  .grid-two{padding:0 24px 14px}
  .sales-panel,.cash-panel,.accounting-panel,.customers-panel,.order-panel{margin-left:24px;margin-right:24px}
  .panel-title{padding:20px 22px}
  .panel-title h2{font-size:20px;letter-spacing:-.25px}
  .panel-title .eyebrow{font-size:10px;letter-spacing:1.6px}
  th{background:#f4f7fa;color:#536779;font-size:10px}
  tbody tr:hover td{background:#f4f9fd}
  .export-button,.whatsapp-button,button.secondary{font-weight:750}
  .accounting-metrics{gap:8px;padding:14px;background:#f4f7fa}
  .accounting-metrics>div{border-radius:12px}
  .profit-period-grid article{background:linear-gradient(145deg,#f8fbfd,#edf5f8);border:0}
}

@media(min-width:601px) and (max-width:1100px){
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-total{min-width:250px}
}

@media(max-width:600px){
  header{background:#062747;color:white}
  header small{color:#bdd0df}
  header nav button.secondary,header nav button.ghost{background:#ffffff12;color:white;border-color:#ffffff2e}
  .hero{background:linear-gradient(145deg,#062747,#0a527f);box-shadow:0 12px 26px #06274725}
  .metrics article{border:0;position:relative;overflow:hidden}
  .metrics article{cursor:pointer}
  .metrics article::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#2f80ed}
  .metrics article:nth-child(2n)::before{background:#15a174}
  .metrics article:nth-child(3n)::before{background:#e5a823}
  .metrics strong{font-size:18px;line-height:1.12;letter-spacing:-.35px;overflow-wrap:anywhere}
  .mobile-collapsible>.panel-title::after{content:"+";transform:translateY(-50%) rotate(45deg);color:var(--navy)}
  .mobile-collapsible.mobile-collapsed>.panel-title::after{transform:translateY(-50%) rotate(0)}
}
.panel-highlight{animation:panelHighlight 1.2s ease}
@keyframes panelHighlight{0%,100%{box-shadow:0 7px 24px #0627470d}35%{box-shadow:0 0 0 4px #2f80ed45,0 14px 34px #06274720}}
.mobile-collapsible>.panel-title{position:relative;padding-right:58px;cursor:pointer;user-select:none}
.mobile-collapsible>.panel-title::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#edf3f8;color:var(--navy);font-size:21px;font-weight:900;transition:transform .2s,background .2s}
.mobile-collapsible:not(.mobile-collapsed)>.panel-title::after{content:"−";background:#dcecff}
.mobile-collapsible.mobile-collapsed>:not(.panel-title){display:none!important}
body.dark-theme .mobile-collapsible>.panel-title::after{background:#263b4e;color:white}
.owner-restock-button{border:0;border-radius:8px;padding:8px 12px;background:var(--green);color:#fff;font-weight:850;cursor:pointer}
.mobile-app-nav{display:none}
.desktop-app-nav{position:sticky;top:0;z-index:45;display:flex;gap:4px;padding:8px 24px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 14px #0627470b}
.desktop-app-nav button{min-height:40px;padding:8px 18px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-weight:850;cursor:pointer}
.desktop-app-nav button:hover{background:#eef5fb;color:var(--navy)}
.desktop-app-nav button.active{background:var(--blue);color:#fff}
.desktop-area-hidden{display:none!important}
body[data-mobile-area="home"] .app-footer{display:none}
body:not([data-mobile-area="home"]) .hero,
body:not([data-mobile-area="home"]) .metrics,
body:not([data-mobile-area="home"]) .executive-dashboard{display:none}
body.dark-theme .desktop-app-nav{background:#172737;border-color:#344a5e}
body.dark-theme .desktop-app-nav button{color:#bfd0dd}
body.dark-theme .desktop-app-nav button.active{color:#fff}
.notification-button{position:relative;white-space:nowrap}.notification-button span{display:inline-grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border-radius:99px;background:#dce5ec;color:var(--navy);font-size:11px;font-weight:900}.notification-button.has-notifications{border-color:#e4a522;background:#fff8df!important}.notification-button.has-notifications span{background:#c91f37;color:#fff}
.notification-dialog{width:min(760px,calc(100% - 24px));max-height:88dvh;overflow:auto}.notification-dialog>.dialog-title{position:sticky;top:0;z-index:2;padding:20px 22px;background:var(--navy);color:#fff}.notification-dialog>.dialog-title .eyebrow{margin:0 0 4px;color:#9ed7ff}.notification-dialog>.dialog-title .icon-button{color:#fff}
.receive-order-dialog{width:min(980px,calc(100% - 24px));max-height:94dvh;background:#f4f7fa}.receive-order-dialog>.dialog-title{padding:22px 26px;background:linear-gradient(135deg,#062747,#0b4675)}.receive-order-dialog>.dialog-title small{display:block;margin-top:5px;color:#c9dbea}.receive-order-content{display:grid;gap:18px;padding:22px}.receipt-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.receipt-summary>div{padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 6px 18px #0627470d}.receipt-summary span{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.8px}.receipt-summary strong{display:block;margin-top:7px;color:var(--navy);font-size:22px}.receipt-fields{display:grid;grid-template-columns:1fr 1.4fr;gap:14px}.receipt-fields label{display:grid;gap:7px;font-size:12px;font-weight:800;color:var(--navy)}.receipt-fields input{width:100%;min-width:0;padding:12px 13px;border:1px solid #c9d4dc;border-radius:9px;background:#fff;font:inherit}.receipt-help{display:grid;gap:4px;padding:14px 16px;border-left:4px solid #e5a91a;border-radius:8px;background:#fff8e8;color:#654b0d}.receipt-help span{font-size:13px;line-height:1.45}.receive-lines-wrap{border:1px solid var(--line);border-radius:12px;background:#fff}.receive-lines-wrap table{min-width:760px}.receive-lines-wrap th{background:#eaf0f5;color:#31475a}.receive-lines-wrap td{padding:12px 14px}.receive-quantity{width:110px;padding:11px;border:2px solid #b8c7d3;border-radius:9px;font-size:17px;font-weight:800;text-align:center}.receive-quantity:focus{outline:3px solid #168be329;border-color:#168be3}.receive-complete-button{padding:9px 12px!important;color:#08663e!important;border-color:#9bceb5!important;background:#edfaf3!important;font-weight:800}.receive-actions{position:sticky;bottom:-22px;margin:0 -22px -22px;padding:16px 22px;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 24px #06274710}.receive-actions button{min-height:44px;font-weight:800}.receive-actions .receive-all{margin-left:auto;color:#08754a;border-color:#8bc8aa;background:#effaf4}.receive-actions .primary{border:0;border-radius:9px;padding:11px 22px;background:var(--green);color:#fff}
@media(max-width:650px){.receive-order-dialog{width:calc(100% - 10px);max-height:97dvh;border-radius:15px}.receive-order-dialog>.dialog-title{padding:16px}.receive-order-dialog>.dialog-title h2{font-size:19px}.receive-order-content{padding:14px;gap:13px}.receipt-summary{grid-template-columns:1fr 1fr}.receipt-summary>div{padding:12px}.receipt-summary>div:last-child{grid-column:1/-1}.receipt-summary strong{font-size:17px}.receipt-fields{grid-template-columns:1fr}.receipt-help{font-size:12px}.receive-lines-wrap{overflow:visible;border:0;background:transparent}.receive-lines-wrap table{min-width:0}.receive-lines-wrap thead{display:none}.receive-lines-wrap tbody{display:grid;gap:12px}.receive-lines-wrap tr{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:15px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 5px 16px #0627470c}.receive-lines-wrap td{display:grid;gap:3px;padding:0;border:0;white-space:normal}.receive-lines-wrap td:first-child{grid-column:1/-1;padding-bottom:9px;border-bottom:1px solid var(--line);font-size:15px;font-weight:850}.receive-lines-wrap td:nth-child(2)::before{content:"PEDIDO";color:var(--muted);font-size:9px;letter-spacing:.7px}.receive-lines-wrap td:nth-child(3)::before{content:"RECIBIDO ANTES";color:var(--muted);font-size:9px;letter-spacing:.7px}.receive-lines-wrap td:nth-child(4)::before{content:"PENDIENTE";color:var(--muted);font-size:9px;letter-spacing:.7px}.receive-lines-wrap td:nth-child(5)::before{content:"RECIBIR AHORA";color:var(--muted);font-size:9px;letter-spacing:.7px}.receive-lines-wrap td:nth-child(6){grid-column:1/-1}.receive-quantity{width:100%;font-size:19px}.receive-complete-button{width:100%}.receive-actions{bottom:-14px;margin:0 -14px -14px;padding:12px 14px;display:grid;grid-template-columns:1fr 1fr}.receive-actions button{width:100%;padding:10px 6px}.receive-actions .receive-all{margin:0}.receive-actions .primary{grid-column:1/-1;grid-row:1}}
.notification-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 20px;border-bottom:1px solid var(--line)}.notification-toolbar p{margin:0;font-size:12px}.notification-items{display:grid;gap:10px;padding:16px;background:var(--paper)}
.notification-item{display:grid;grid-template-columns:12px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:15px;background:#fff;border:1px solid var(--line);border-radius:12px}.notification-item .notification-dot{width:10px;height:10px;border-radius:50%;background:#2f80ed}.notification-item.severity-red .notification-dot{background:#c91f37}.notification-item.severity-orange .notification-dot{background:#e47b18}.notification-item.severity-yellow .notification-dot{background:#d5a11e}.notification-item.severity-green .notification-dot{background:#0f9d72}.notification-item strong,.notification-item small{display:block}.notification-item p{margin:5px 0;color:var(--muted);font-size:13px;line-height:1.4}.notification-item small{color:var(--muted);font-size:11px}.notification-actions{display:grid;grid-template-columns:1fr;gap:5px}.notification-view,.notification-module,.notification-read{border:0;border-radius:8px;padding:8px 11px;background:var(--blue);color:#fff;font-weight:850;cursor:pointer}.notification-module{background:var(--green)}.notification-read{background:#e8f5ef;color:#087854;font-size:16px}.notification-empty{padding:34px;text-align:center;background:#fff;border-radius:12px;color:var(--green);font-weight:850}
.notification-detail-dialog{width:min(650px,calc(100% - 24px));overflow:hidden}.notification-detail-dialog>.dialog-title{padding:20px 22px;background:var(--navy);color:#fff}.notification-detail-dialog>.dialog-title .eyebrow{color:#9ed7ff}.notification-detail-dialog>.dialog-title .icon-button{color:#fff}.notification-detail-content{display:grid;gap:20px;padding:28px}.notification-detail-content>p{margin:0;padding:20px;border-radius:12px;background:var(--paper);font-size:16px;line-height:1.6;white-space:pre-wrap}.notification-detail-content div{display:grid;gap:5px}.notification-detail-content span{color:var(--muted)}.notification-detail-actions{display:flex;justify-content:flex-end;gap:9px;padding:0 28px 24px}
body.dark-theme .notification-items{background:#0e1e2d}body.dark-theme .notification-item,body.dark-theme .notification-empty{background:#172737}
@media(min-width:601px) and (max-width:1100px){
  main{max-width:100%}
  header{height:auto;min-height:76px;gap:10px;padding:10px 16px}
  header>div{min-width:210px}
  header nav{flex-wrap:wrap;justify-content:flex-end;gap:5px}
  header nav button.secondary,header nav button.ghost{padding:8px 10px;font-size:12px}
  .desktop-app-nav{position:sticky;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;padding:7px 14px}
  .desktop-app-nav button{min-width:0;padding:8px 5px;font-size:12px;line-height:1.15}
  .hero{margin:16px 14px 0;padding:25px}
  .hero h1{font-size:clamp(29px,4vw,42px)}
  .metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:10px 14px}
  .metrics article{padding:16px}
  .metrics strong{font-size:clamp(22px,3vw,29px);overflow-wrap:anywhere}
  .executive-dashboard{padding:0 14px 12px}
  .panel,.cash-panel,.sales-panel,.accounting-panel,.customers-panel,.order-panel{margin-left:14px;margin-right:14px}
  .panel-title{padding:16px}
  .panel-title h2{font-size:18px}
  th,td{padding:11px 12px}
  .inventory-panel .title-with-action{flex-wrap:wrap}
  .inventory-panel .order-actions{max-width:100%}
  .inventory-panel .order-actions button{white-space:nowrap}
  .inventory-panel table{width:100%;min-width:0;table-layout:fixed}
  .inventory-panel th,.inventory-panel td{padding:9px 6px;font-size:11px;overflow-wrap:anywhere;white-space:normal}
  .inventory-panel th:nth-child(1){width:5%}.inventory-panel th:nth-child(2){width:18%}.inventory-panel th:nth-child(3){width:9%}.inventory-panel th:nth-child(4),.inventory-panel th:nth-child(5){width:12%}.inventory-panel th:nth-child(6){width:14%}.inventory-panel th:nth-child(7),.inventory-panel th:nth-child(8){width:6%}.inventory-panel th:nth-child(9){width:18%}
  .inventory-panel td:last-child{display:grid;grid-template-columns:1fr 1fr;gap:4px}
  .inventory-panel td:last-child button{min-width:0;padding:6px 3px;font-size:10px}
}
@media(min-width:601px) and (max-width:760px){
  header{align-items:flex-start;flex-direction:column}
  header nav{width:100%;justify-content:flex-start}
  .desktop-app-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .desktop-app-nav button:last-child{grid-column:1/-1}
  .hero{align-items:stretch}
  .hero-total{text-align:left}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
[hidden]{display:none!important}
body[data-role="ADMIN"] #addStockBtn,
body[data-role="ADMIN"] #newProductBtn,
body[data-role="ADMIN"] .product-edit-button,
body[data-role="ADMIN"] .stock-adjust-button,
body[data-role="ADMIN"] .product-delete-button,
body[data-role="ADMIN"] .approve-payroll,
body[data-role="ADMIN"] .reject-payroll,
body[data-role="ADMIN"] .approve-void,
body[data-role="ADMIN"] .reject-void{display:none!important}
.inventory-panel{min-width:0}
.inventory-panel .title-with-action{flex-wrap:wrap;padding-right:26px}
.inventory-panel .order-actions{flex:0 1 auto;max-width:100%}
.inventory-panel .order-actions button{min-width:0;padding:9px 10px;white-space:nowrap}
@media(max-width:760px){.inventory-panel .title-with-action{display:flex;align-items:stretch;flex-direction:column;padding-right:16px}.inventory-panel .order-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.inventory-panel .order-actions button{width:100%}}
@media(max-width:600px){
  #dashboardView{padding-bottom:82px}
  .desktop-app-nav{display:none}
  .notification-dialog{width:calc(100% - 14px);max-height:94dvh}.notification-toolbar{align-items:stretch;flex-direction:column}.notification-item{grid-template-columns:10px minmax(0,1fr) auto}.notification-actions{grid-column:2/3;width:100%;grid-template-columns:1fr 1fr}.notification-actions button{min-width:0;padding:8px 5px;font-size:11px}.notification-read{grid-column:3;grid-row:1/3}.notification-item p{font-size:12px}.notification-detail-content{padding:18px}.notification-detail-actions{display:grid;grid-template-columns:1fr 1fr;padding:0 18px 18px}
  .mobile-app-nav{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:7px max(5px,env(safe-area-inset-left)) calc(7px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #dce5ec;box-shadow:0 -8px 24px #06274718}
  .mobile-app-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;height:52px;padding:3px;border:0;border-radius:11px;background:transparent;color:#6a7c8d;font-size:10px;font-weight:750}
  .mobile-app-nav button span{display:grid;place-items:center;height:22px;font-size:18px;font-weight:900;line-height:1}
  .mobile-app-nav button.active{background:#eaf3ff;color:#0b5fa8}
  .mobile-area-hidden{display:none!important}
  body[data-mobile-area="home"] .hero,body[data-mobile-area="home"] .metrics{display:flex}
  body[data-mobile-area="home"] .metrics{display:grid}
  body:not([data-mobile-area="home"]) .hero,body:not([data-mobile-area="home"]) .metrics{display:none}
  body:not([data-mobile-area="more"]) .app-footer{display:none}
  body.dark-theme .mobile-app-nav{background:#172737;border-color:#344a5e}
  body.dark-theme .mobile-app-nav button{color:#a9bdcd}
  body.dark-theme .mobile-app-nav button.active{background:#25415b;color:#fff}
}
.executive-dashboard{padding:0 24px 14px}
.executive-highlights{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.executive-highlights article,.executive-card{background:#fff;border-radius:16px;box-shadow:0 7px 24px #0627470d}
.executive-highlights article{padding:18px 20px;border-top:3px solid #2f80ed}
.executive-highlights article:nth-child(2){border-color:#15a174}
.executive-highlights article:nth-child(3){border-color:#dca51f}
.executive-highlights article:nth-child(4){border-color:#9157cf}
.executive-highlights span,.executive-highlights small{display:block;color:var(--muted);font-size:11px}
.executive-highlights strong{display:block;margin:8px 0;font-size:25px;color:var(--navy);overflow-wrap:anywhere}
.trend-positive{color:#087854!important}.trend-negative,.negative{color:#b42318!important}
.executive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.executive-card{min-width:0;overflow:hidden}
.executive-title{padding:18px 20px;border-bottom:1px solid var(--line)}
.executive-title .eyebrow{margin:0 0 4px}
.executive-title h2{margin:0;font-size:18px}
.bar-chart{height:230px;display:grid;grid-template-columns:repeat(7,1fr);gap:10px;padding:20px}
.bar-item{display:grid;grid-template-rows:28px 1fr 18px;text-align:center;min-width:0}
.bar-item strong{font-size:9px;color:var(--muted);overflow:hidden}
.bar-track{position:relative;background:#edf3f8;border-radius:8px;overflow:hidden}
.bar-track span{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#2f80ed,#0b5fa8);border-radius:8px}
.bar-item small{font-size:10px;text-transform:capitalize}
.payment-chart{padding:18px;display:grid;gap:15px}
.payment-bar>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:12px}
.payment-bar>div:last-child{height:9px;background:#edf3f8;border-radius:99px;overflow:hidden;margin-top:7px}
.payment-bar>div:last-child span{display:block;height:100%;background:#0f9d72;border-radius:99px}
.executive-list{padding:6px 18px}
.executive-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid var(--line)}
.executive-row:last-child{border:0}.executive-row div{min-width:0}
.executive-row strong,.executive-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.executive-row small{color:var(--muted);font-size:11px;margin-top:3px}
.executive-row b{font-size:13px;color:var(--green)}
.rank,.sale-dot{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#eaf3ff;color:#0b5fa8;font-weight:900}
.sale-dot{width:10px;height:10px;border-radius:50%;background:#0f9d72}
body.dark-theme .executive-highlights article,body.dark-theme .executive-card{background:#172737}
body.dark-theme .bar-track,body.dark-theme .payment-bar>div:last-child{background:#263b4e}
@media(max-width:850px){.executive-highlights{grid-template-columns:repeat(2,minmax(0,1fr))}.executive-grid{grid-template-columns:1fr}}
@media(max-width:600px){
  .executive-dashboard{padding:0 10px 10px}
  .executive-highlights{gap:8px;margin-bottom:10px}
  .executive-highlights article{padding:14px 12px}
  .executive-highlights strong{font-size:19px}
  .executive-grid{gap:10px}
  .executive-title{padding:15px}
  .bar-chart{height:190px;padding:14px 10px;gap:6px}
  .bar-item strong{font-size:8px}
  body:not([data-mobile-area="home"]) .executive-dashboard{display:none}
}
main{width:100%;overflow-x:hidden}
/* Panel de seguridad del dueño */
.security-dialog{width:min(680px,calc(100% - 24px));max-height:92dvh;overflow:auto;background:#f3f6fa}
.security-dialog>.dialog-title{position:sticky;top:0;z-index:2;padding:22px 24px;background:var(--navy);color:#fff;border-radius:18px 18px 0 0}
.security-dialog>.dialog-title .eyebrow{color:#9ed7ff}.security-dialog>.dialog-title .icon-button{color:#fff}
.security-dialog form{margin:18px 22px;padding:20px;display:grid;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 5px 18px #17355312}
.security-dialog form h3{margin:0;color:var(--navy);font-size:18px}.security-dialog form p{margin:0;line-height:1.5}
.security-dialog form label{font-size:13px;font-weight:800;color:var(--ink)}
.security-dialog form input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:16px}
.security-dialog form button{min-height:46px;border:0;border-radius:10px;padding:12px 16px;background:var(--green);color:#fff;font-weight:900;cursor:pointer}
.security-dialog #resetBusinessForm{border-color:#f1b5ae;background:#fff8f7}.security-dialog #resetBusinessForm button{background:#b42318}
.security-dialog hr{display:none}.security-dialog #securityMessage{margin:0 22px 22px;padding:0 4px;font-weight:800}
body.dark-theme .security-dialog{background:#0e1e2d}body.dark-theme .security-dialog form{background:#172737}body.dark-theme .security-dialog #resetBusinessForm{background:#2b2022;border-color:#7e3c42}
@media(max-width:600px){.security-dialog{width:calc(100% - 16px);max-height:96dvh;border-radius:14px}.security-dialog>.dialog-title{padding:17px 16px;border-radius:14px 14px 0 0}.security-dialog>.dialog-title h2{font-size:21px}.security-dialog form{margin:12px;padding:16px;gap:12px;border-radius:12px;box-shadow:none}.security-dialog form h3{font-size:17px}.security-dialog form button{width:100%;font-size:15px}.security-dialog #securityMessage{margin:0 14px 16px}}
.security-dialog [hidden]{display:none!important}
.security-menu{display:grid;gap:12px;padding:20px}
.security-menu>button{display:grid;grid-template-columns:46px 1fr 20px;align-items:center;gap:13px;width:100%;padding:17px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}
.security-menu>button>span{display:grid;place-items:center;width:44px;height:44px;border-radius:11px;background:#eaf3fb;font-size:21px}
.security-menu>button strong,.security-menu>button small{display:block}.security-menu>button strong{font-size:16px;color:var(--navy)}.security-menu>button small{margin-top:4px;color:var(--muted)}.security-menu>button b{font-size:28px;color:var(--muted)}
.security-menu>button.danger{border-color:#efc1bd}.security-menu>button.danger>span{background:#fff0ee}.security-menu>button.danger strong{color:#b42318}
.security-dialog form .security-back{min-height:auto;width:max-content;padding:7px 0;background:transparent;color:var(--blue);text-align:left}
body.dark-theme .security-menu>button{background:#172737;border-color:#344a5e}
@media(max-width:600px){.security-menu{padding:14px;gap:10px}.security-menu>button{padding:14px;grid-template-columns:42px 1fr 16px}.security-menu>button>span{width:40px;height:40px}.security-menu>button strong{font-size:15px}}