:root{
  --bg:#08090b; --panel:#151719; --panel2:#1b1d20; --line:#2b2e31; --text:#f7f7f8;
  --muted:#a2a4a8; --pink:#e83362; --pink2:#b30f39; --green:#62e26f; --red:#ff4b5f;
  --orange:#f6a52c; --blue:#4e9cff; --cyan:#44d7d1; --purple:#9f62ff;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
button,input,select,textarea{font:inherit}
.hidden{display:none!important}
.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,#260711 0,transparent 40%),#050607}
.login-box{width:390px;background:#101214;border:1px solid #303236;border-radius:24px;padding:28px;box-shadow:0 30px 80px #0008;text-align:center}
.login-logo{width:200px;height:200px;object-fit:contain;border-radius:50%}
.login-box h1{font-size:22px;margin:8px 0}.login-box p{color:var(--muted);margin-top:0}.login-box input{margin-bottom:10px}.login-box small{display:block;color:#777;margin-top:10px}
.app{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;background:#0d0f11;border-right:1px solid var(--line);padding:14px 14px 18px;overflow:auto}
.logo-wrap{text-align:center;padding:6px 0 12px}.logo-wrap img{width:200px;height:175px;object-fit:contain}
nav{display:flex;flex-direction:column;gap:4px}.nav{border:0;background:transparent;color:#ddd;padding:12px 14px;border-radius:9px;text-align:left;display:flex;gap:12px;align-items:center}.nav:hover{background:#181a1d}.nav.active{background:linear-gradient(90deg,#8d0b2d,#c11848);color:white}
.stock-alert{border:1px solid #33373b;background:#111315;border-radius:12px;margin-top:16px;padding:10px}.alert-head{display:flex;justify-content:space-between;font-size:12px}.alert-head b{background:#65182b;color:#ffb5c4;border-radius:999px;padding:2px 7px}.stock-mini{display:flex;justify-content:space-between;font-size:10px;border-bottom:1px solid #24272a;padding:7px 0}.stock-mini b{color:#ff8098}
.main{margin-left:260px;width:calc(100% - 260px);min-height:100vh}.topbar{height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#090a0c;position:sticky;top:0;z-index:20}
.title-wrap{display:flex;align-items:center;gap:18px}.title-wrap h1{font-size:22px;margin:0}.title-wrap span{color:#777;font-size:12px}.hamb{border:0;background:transparent;color:white;font-size:24px}.top-actions{display:flex;align-items:center;gap:12px}.top-actions select,.icon{background:#0e1012;border:1px solid #303337;color:white;border-radius:9px;padding:9px 12px}.icon{position:relative}.dot{position:absolute;right:-5px;top:-6px;background:var(--pink);border-radius:50%;font-size:9px;padding:3px 5px}.user-top{display:flex;align-items:center;gap:8px}.user-top .avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(#777,#333);display:grid;place-items:center}.user-top strong,.user-top small{display:block;font-size:11px}.user-top small{color:#777}
.page{display:none;padding:20px}.page.active{display:block}
.metric-grid{display:grid;gap:10px;margin-bottom:12px}.metric-grid.five{grid-template-columns:repeat(5,1fr)}.metric-grid.four{grid-template-columns:repeat(4,1fr)}.metric{background:linear-gradient(145deg,#1b1d20,#131517);border:1px solid #2e3135;border-radius:11px;padding:15px;display:flex;align-items:center;gap:13px}.metric.simple{display:block}.metric-icon{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-size:22px}.metric-icon.pink{background:#5d1730}.metric-icon.purple{background:#32214f}.metric-icon.blue{background:#17304c}.metric-icon.orange{background:#513117}.metric-icon.cyan{background:#143c3b}.metric span{font-size:10px;color:#c4c5c7;display:block}.metric strong{font-size:20px;display:block;margin:5px 0}.metric small{font-size:10px}.up,.green{color:var(--green)!important}.down,.red{color:var(--red)!important}
.dash-row{display:grid;gap:10px;margin-bottom:12px}.dash-row.top{grid-template-columns:1.65fr 1.15fr 1.2fr}.dash-row.bottom{grid-template-columns:1fr 1.25fr 1fr 1.15fr}.dash-row.two{grid-template-columns:1fr 1fr}
.panel{background:linear-gradient(145deg,#1a1c1e,#131517);border:1px solid #303337;border-radius:10px;padding:15px}.panel h3{font-size:12px;margin:0 0 14px}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head select{background:#121416;color:#ccc;border:1px solid #333;border-radius:8px;padding:6px 8px}.link-btn{border:0;background:transparent;color:#ff466d;text-decoration:underline;font-size:10px}
.chart{height:270px;display:flex;align-items:flex-end;gap:12px;padding:18px 12px 0;border-top:1px solid #2c2f32}.bar-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}.bar{width:52%;background:linear-gradient(#ff4169,#9e1238);border-radius:5px 5px 0 0;min-height:3px}.bar-col small{font-size:9px;color:#777}.bar-col b{font-size:8px;color:#aaa}
.rank-row,.sale-row,.activity-row,.low-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #2a2d30}.rank-num,.circle-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#df2857;font-size:10px}.row-text strong{display:block;font-size:10px}.row-text span{font-size:9px;color:#777}.row-value{font-size:10px}.row-value.green{color:var(--green)}.low-row .warn{color:var(--orange)}
.summary-line{display:flex;justify-content:space-between;border-bottom:1px solid #2d3033;padding:11px 0;font-size:11px}.summary-line.total{font-size:14px;border-bottom:0}.full{width:100%}
.btn{border:0;border-radius:8px;padding:11px 14px;font-weight:700}.primary{background:linear-gradient(180deg,#df2a59,#b50f3b);color:white}.secondary{background:#202326;border:1px solid #383b3f;color:white}
.donut-area{display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:center}.donut{width:150px;height:150px;border-radius:50%;background:conic-gradient(#55c85f 0 35%,#43c7cb 35% 65%,#4168d9 65% 80%,#ff9828 80% 95%,#884ddb 95% 100%);position:relative;margin:auto}.donut:after{content:"";position:absolute;inset:38px;border-radius:50%;background:#151719}.legend-row{display:flex;justify-content:space-between;font-size:9px;padding:5px 0}.legend-row span:first-child:before{content:"";display:inline-block;width:7px;height:7px;border-radius:2px;background:#55c85f;margin-right:6px}
.section-tools{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-tools h2{margin:0 0 4px}.section-tools p{margin:0;color:#777;font-size:11px}
.search input,input,select,textarea{width:100%;background:#0e1012;border:1px solid #34373a;color:white;border-radius:8px;padding:10px}.search{margin-bottom:12px}
.pdv-grid{display:grid;grid-template-columns:1.6fr .8fr;gap:12px}.catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.product-card{background:#111315;border:1px solid #2e3134;border-radius:10px;padding:12px}.product-card span{font-size:9px;color:#ff4b70}.product-card h4{font-size:11px;margin:6px 0}.product-card p{font-size:9px;color:#777}.product-card .bottom{display:flex;justify-content:space-between;align-items:center}.product-card button{width:30px;height:30px;border-radius:7px;border:0;background:#5d1730;color:white}.cart label,.panel label{font-size:10px;color:#aaa;display:block;margin:10px 0 5px}.cart-item{border-bottom:1px solid #2b2e31;padding:8px 0}.cart-item-top{display:flex;justify-content:space-between}.cart-item h4{font-size:10px;margin:0}.qty{display:flex;gap:6px;align-items:center;margin-top:7px}.qty button{border:1px solid #333;background:#111;color:white;border-radius:5px}.cart-total{display:flex;justify-content:space-between;align-items:center;margin:15px 0;font-size:14px}.cart-total strong{font-size:22px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid #2b2e31;text-align:left;white-space:nowrap}th{font-size:9px;color:#aaa}td{font-size:10px}.badge{padding:4px 7px;border-radius:999px;font-size:9px}.ok{background:#173b25;color:#65e47d}.warnbadge{background:#4c3411;color:#ffba41}.bad{background:#4b1720;color:#ff6677}.action{border:1px solid #36393d;background:#17191b;color:#ddd;border-radius:6px;padding:5px 7px;font-size:9px;margin-right:4px}
.report-grid,.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.report-line{display:flex;justify-content:space-between;border-bottom:1px solid #2b2e31;padding:10px 0;font-size:10px}.file-btn{display:block;background:#202326;border:1px solid #383b3f;border-radius:8px;padding:10px;text-align:center;margin-top:10px}.file-btn input{display:none}
.modal{display:none;position:fixed;inset:0;background:#000b;z-index:100;place-items:center}.modal.open{display:grid}.modal-card{width:min(720px,92vw);max-height:90vh;overflow:auto;background:#151719;border:1px solid #33373b;border-radius:14px;padding:18px}.modal-card h3{margin-top:0}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.toast{position:fixed;right:20px;bottom:20px;background:#202326;border:1px solid #3a3e42;border-radius:8px;padding:11px 14px;opacity:0;transform:translateY(15px);transition:.2s;z-index:120;font-size:11px}.toast.show{opacity:1;transform:none}
@media(max-width:1200px){.metric-grid.five{grid-template-columns:repeat(2,1fr)}.dash-row.top,.dash-row.bottom{grid-template-columns:1fr 1fr}.catalog{grid-template-columns:repeat(2,1fr)}}
@media(max-width:850px){.sidebar{width:80px}.sidebar .logo-wrap img{width:60px;height:60px}.nav span,.stock-alert{display:none}.nav{justify-content:center}.main{margin-left:80px;width:calc(100% - 80px)}.title-wrap span,.user-top div:last-child{display:none}.pdv-grid,.dash-row.top,.dash-row.bottom,.dash-row.two,.report-grid,.settings-grid{grid-template-columns:1fr}.metric-grid.four,.metric-grid.five{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.topbar{padding:0 12px}.page{padding:12px}.metric-grid.four,.metric-grid.five{grid-template-columns:1fr}.catalog{grid-template-columns:1fr}.section-tools{align-items:flex-start;gap:10px;flex-direction:column}.form-grid{grid-template-columns:1fr}}


/* === Fotos de produtos === */
.product-photo{
  width:48px;height:48px;border-radius:9px;object-fit:cover;
  background:#0b0d0f;border:1px solid #34373a;display:block;
}
.product-photo-placeholder{
  width:48px;height:48px;border-radius:9px;border:1px dashed #44484d;
  display:grid;place-items:center;color:#74777c;background:#0d0f11;font-size:18px;
}
.product-card-photo{
  width:100%;height:120px;object-fit:contain;background:#0b0d0f;
  border:1px solid #2d3033;border-radius:8px;margin-bottom:9px;
}
.product-card-photo.placeholder{
  display:grid;place-items:center;color:#666;font-size:28px;
}
.image-upload{
  grid-column:1/-1;border:1px dashed #555a60;border-radius:10px;padding:14px;
  background:#0e1012;
}
.image-upload-row{
  display:grid;grid-template-columns:1fr 110px;gap:14px;align-items:center;
}
.image-drop{
  min-height:110px;border:1px dashed #555a60;border-radius:9px;
  display:grid;place-items:center;text-align:center;color:#a9adb2;padding:14px;cursor:pointer;
}
.image-drop:hover{border-color:#df2a59;background:#141013}
.image-drop small{display:block;color:#666;margin-top:5px}
.image-drop input{display:none}
.image-preview-box{
  width:110px;height:110px;border:1px solid #34373a;border-radius:9px;overflow:hidden;
  background:#0a0c0e;position:relative;display:grid;place-items:center;
}
.image-preview-box img{width:100%;height:100%;object-fit:contain}
.remove-photo{
  position:absolute;right:5px;top:5px;border:0;background:#d5224f;color:white;
  width:24px;height:24px;border-radius:50%;font-size:12px
}
.form-wide{grid-column:1/-1}
.form-wide textarea{min-height:80px;resize:vertical}
.active-check{
  grid-column:1/-1;display:flex!important;align-items:center;gap:8px!important;
}
.active-check input{width:auto!important}
@media(max-width:600px){
  .image-upload-row{grid-template-columns:1fr}
  .image-preview-box{width:100%;height:180px}
}

.install-app{white-space:nowrap;padding:8px 10px;font-size:10px}
@media(max-width:600px){
  .install-app{display:inline-flex!important}
  .top-actions{gap:6px}
}