:root{
  --bg:#0E3A8F;
  --panel:#FFFFFF;
  --line:#D7E2F2;
  --text:#101828;
  --mute:#5B6B85;
  --accent2:#1657C7;
  --good:#1C9A6C;
  --warn:#D97706;
  --bad:#D64545;
}

body{margin:0;font-family:'Manrope',-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:#F2F5FA;color:var(--text);font-size:14px;font-weight:500}

h1,h2,h3{font-family:'Space Grotesk','Segoe UI',sans-serif}

.top{height:60px;background:var(--bg);border-bottom:none;display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:1000;color:#fff}
.top strong{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;color:#fff;letter-spacing:.2px;font-family:'Space Grotesk',sans-serif}
.top span{font-size:13px;font-weight:600;color:#fff;display:flex;align-items:center;gap:8px;opacity:.92}
.top span::before{content:"";width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.25);display:inline-block}

.shell{display:flex;min-height:calc(100vh - 60px)}
.side{width:225px;background:#fff;border-right:1px solid var(--line);padding:16px 12px;flex-shrink:0}
.side a{display:block;color:var(--text);padding:10px 12px;border-radius:8px;margin:2px 0;font-size:13px;font-weight:700;transition:background .12s,color .12s;text-decoration:none}
.side a:hover{background:#EEF3FB;color:var(--accent2)}
.side a.active{background:#EEF3FB;color:var(--accent2);border-left:3px solid var(--accent2)}

main{flex:1;padding:24px 28px;min-width:0}
main>h1{font-size:21px;font-weight:700;color:var(--text);margin:0 0 18px;font-family:'Space Grotesk',sans-serif}

.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-bottom:16px}
.card h2{font-size:14.5px;font-weight:700;color:var(--text);margin:0 0 14px;letter-spacing:.1px;font-family:'Space Grotesk',sans-serif}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
.metric{font-size:28px;font-weight:700;margin-top:6px;color:var(--accent2);font-family:'Space Grotesk',sans-serif}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}

.grid .card{border-left:4px solid var(--line);border-radius:6px 12px 12px 6px}
.grid .card:nth-of-type(4n+1){border-left-color:var(--accent2)}
.grid .card:nth-of-type(4n+2){border-left-color:var(--good)}
.grid .card:nth-of-type(4n+3){border-left-color:var(--bad)}
.grid .card:nth-of-type(4n+4){border-left-color:var(--warn)}

label{font-size:12.5px;font-weight:700;color:#3C4A61}
input,select,textarea{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;margin-top:5px;margin-bottom:10px;font-size:13.5px;font-weight:600;color:var(--text);background:#F7F9FC}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent2);box-shadow:0 0 0 3px rgba(22,87,199,.12);background:#fff}
.upper{text-transform:uppercase}

.btn{display:inline-block;border:0;border-radius:8px;padding:10px 16px;cursor:pointer;color:#fff;margin:2px;font-size:13px;font-weight:700;transition:opacity .12s;font-family:'Space Grotesk',sans-serif}
.btn:hover{opacity:.9}
.primary{background:var(--accent2)}
.success{background:var(--good)}
.danger{background:var(--bad)}
.secondary{background:#fff;color:var(--text);border:1px solid var(--line)}
.secondary:hover{background:#F7F9FC;opacity:1}
.warning{background:var(--warn)}
.gray{background:var(--mute)}

.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:8px 12px;border:1px solid var(--line);text-align:left;vertical-align:top;font-size:13px;font-weight:600}
th{background:#EEF3FB;color:var(--bg);font-weight:800;font-size:11.5px;letter-spacing:.3px;border-color:var(--line)}
tbody tr:nth-child(even){background:#F7F9FC}
tbody tr:hover{background:#EEF3FB}

.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:800}
.ABERTO{background:#DCE9FF;color:var(--accent2)}
.PARCIAL{background:#FFF4DE;color:#92400e}
.DEVOLVIDO{background:#E7F6EF;color:var(--good)}
.CANCELADO{background:#FDECEC;color:var(--bad)}

.alert{padding:12px 14px;border-radius:8px;margin-bottom:16px;font-size:13px;font-weight:600;border:1px solid transparent}
.success-alert{background:#E7F6EF;color:#065f46;border-color:#a7f3d0}
.error{background:#FDECEC;color:#991b1b;border-color:#fecaca}

.active-company-picker{display:flex;align-items:center;gap:8px}
.active-company-picker label{font-size:11px;font-weight:800;color:#fff;letter-spacing:.3px;opacity:.85}
.active-company-picker select{padding:6px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.4);font-weight:700;font-size:13px;background:rgba(255,255,255,.12);color:#fff}

.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:16px}
.login-card{width:min(400px,92vw);background:#fff;padding:36px 32px;border-radius:14px;border:1px solid var(--line);border-top:4px solid var(--accent2)}
.login-card h1{font-size:19px;font-family:'Space Grotesk',sans-serif}
.login-card .btn.primary{width:100%;padding:12px;font-size:14px;margin:6px 0 0}

.report{white-space:pre-wrap;background:#F7F9FC;border:1px solid var(--line);border-radius:8px;padding:14px;font-family:Consolas,monospace;font-size:12.5px;font-weight:600}

.mobile-menu-btn{display:none;background:none;border:0;font-size:24px;color:#fff;cursor:pointer;padding:4px 8px;margin-right:4px;}
.mobile-menu-backdrop{display:none;}

@media(max-width:760px){
    .shell{display:flex}
    .mobile-menu-btn{display:inline-block}
    .top{
        height:auto;
        flex-wrap:wrap;
        row-gap:8px;
        padding:10px 14px;
    }
    .top strong{font-size:14px;white-space:nowrap;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
    .top strong img{height:26px;flex-shrink:0}
    .active-company-picker{order:3;flex:1 1 100%;justify-content:flex-start;gap:8px}
    .active-company-picker label{white-space:nowrap;flex-shrink:0}
    .active-company-picker select{flex:1 1 auto;min-width:0}
    .active-company-picker .active-company-submit{flex-shrink:0;white-space:nowrap;padding:6px 12px}
    .top span{order:4;flex:1 1 100%;justify-content:flex-end;font-size:11.5px}
    .side{
        position:fixed;top:0;left:0;bottom:0;width:250px;z-index:1000;
        padding-top:110px;
        transform:translateX(-100%);transition:transform .2s ease;overflow-y:auto;
    }
    .side.mobile-open{transform:translateX(0)}
    .mobile-menu-backdrop.show{
        display:block;position:fixed;top:0;left:0;right:0;bottom:0;
        background:rgba(0,0,0,.4);z-index:999;
    }
    .top{font-size:13px}
    main{padding:16px}
}

.scan-row{display:grid;grid-template-columns:140px 1fr 160px 90px 100px;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--line);font-weight:600}
.scan-row>*{min-width:0;overflow-wrap:break-word;word-break:break-word}
.scan-qty{margin:0}
.scan-qty-label{display:none}

.part-search-container{position:relative;width:100%;max-width:480px}
.part-search-input{width:100%;box-sizing:border-box;text-transform:uppercase}
.part-search-results{display:none;position:absolute;top:calc(100% + 3px);left:0;right:0;z-index:9999;max-height:280px;overflow-y:auto;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(16,24,40,.16)}
.part-search-results.show{display:block}
.part-search-item{padding:11px 12px;border-bottom:1px solid #F2F5FA;cursor:pointer;background:#fff}
.part-search-item:last-child{border-bottom:none}
.part-search-item:hover,.part-search-item.active{background:#EEF3FB}
.part-search-code{display:block;margin-bottom:3px;color:var(--accent2);font-weight:700}
.part-search-description{display:block;color:#4b5563;font-size:13px}
.part-search-balance{display:block;color:var(--mute);font-size:11.5px;margin-top:2px}
.part-search-empty{padding:13px;color:var(--mute);text-align:center}
.selected-part{display:none;margin-top:8px;padding:9px 12px;border:1px solid #a7f3d0;border-radius:8px;background:#E7F6EF;color:#065f46;font-size:13px;font-weight:700}
.selected-part.show{display:block}
.qty-row{display:flex;align-items:flex-end;gap:12px;margin-top:14px}
.qty-row>div{flex:0 0 auto}
.qty-row input[type="number"]{width:140px}

@media(max-width:700px){
    .scan-row{
        grid-template-columns:1fr;
        gap:4px;
        padding:12px;
        background:#F7F9FC;
        border-radius:8px;
        margin-bottom:8px;
        border:1px solid var(--line);
    }
    .scan-row .scan-qty{
        margin-top:6px;
        width:100%;
        font-size:16px;
        padding:10px;
    }
    .scan-row .scan-qty-label{display:block;font-size:11px;font-weight:800;color:var(--mute);margin-top:6px;}
    .scan-row .btn-remove{width:100%;margin-top:6px}
}

.channel-btn{display:inline-flex;align-items:center;gap:9px}
.channel-icon{width:22px;height:22px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;flex-shrink:0}
.channel-icon-ml{background:#B4790A}
.channel-icon-shopee{background:#D2481C}
.channel-logo{height:20px;width:auto;flex-shrink:0;display:inline-block}

/* ===== Cards clicáveis (acordeão) — painel de detalhe abre embaixo do
   card clicado, na hora, mesmo padrão validado nos mockups. ===== */
.acc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.acc-item{grid-column:span 1}
.acc-item.open{grid-column:1/-1}
.kpi-btn{width:100%;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent2);border-radius:6px 12px 12px 6px;padding:16px 20px;text-align:left;cursor:pointer;font-family:'Manrope',sans-serif;transition:.15s}
.kpi-btn:hover{box-shadow:0 4px 14px rgba(14,58,143,.08)}
.kpi-btn.on{background:#F5F8FF;box-shadow:0 4px 14px rgba(14,58,143,.12)}
.kpi-btn .kpi-label{font-size:13px;font-weight:700;color:var(--text);display:flex;align-items:center;justify-content:space-between;font-family:'Space Grotesk',sans-serif}
.kpi-btn .kpi-label .arrow{color:var(--accent2);font-size:16px;transition:.15s}
.kpi-btn.on .kpi-label .arrow{transform:rotate(90deg)}
.kpi-btn .kpi-value{font-family:'Space Grotesk',sans-serif;font-size:28px;font-weight:700;margin-top:6px;color:var(--accent2)}
.kpi-btn .kpi-note{font-size:11.5px;color:var(--mute);margin-top:2px}

.kpi-panel{display:none;background:var(--panel);border:1px solid var(--accent2);border-radius:0 0 12px 12px;overflow:hidden;margin-top:-1px}
.kpi-panel.show{display:block}
.kpi-panel .kpi-panel-head{padding:12px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.kpi-panel .kpi-panel-head span{font-size:11px;color:var(--mute);background:#F2F5FA;padding:3px 9px;border-radius:6px}
.kpi-panel .kpi-close{background:none;border:none;color:var(--mute);font-size:16px;cursor:pointer;padding:2px 6px}
.kpi-row{display:flex;align-items:center;gap:10px;padding:10px 18px;border-bottom:1px solid #EEF2F8;font-size:13px}
.kpi-row:last-child{border-bottom:none}
.kpi-row .kpi-row-main{flex:1;font-weight:600;color:var(--text)}
.kpi-row .kpi-row-meta{color:var(--mute);font-size:12px}
.kpi-empty{padding:20px;text-align:center;color:var(--mute);font-size:12.5px}

/* ===== ERP 2026 — visual consolidado do protótipo torkparts-visao-geral ===== */
html{background:#F2F5FA}
body{font-family:'Manrope',sans-serif;background:#F2F5FA;color:var(--text)}
.top{height:68px;padding:0 24px;background:#17449A;box-shadow:none;position:sticky;top:0;z-index:1000}
.top-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px}
.top-brand img{height:34px;width:auto;display:block}
.top-brand span{font-size:18px;color:#fff;opacity:1}
.top-brand span::before{display:none}
.top-user{margin-left:auto;color:#fff;font-size:12.5px;background:rgba(255,255,255,.10);padding:8px 14px;border-radius:8px}
.active-company-picker{margin-left:auto;background:rgba(255,255,255,.10);padding:5px 8px;border-radius:8px;gap:4px}
.active-company-picker select{margin:0;background:transparent;border:0;color:#fff;padding:4px 6px;font-size:12.5px;min-width:140px;box-shadow:none}
.active-company-picker select option{color:#101828;background:#fff}
.company-switch{background:transparent;color:#fff;border:0;border-left:1px solid rgba(255,255,255,.22);padding:4px 7px;cursor:pointer;font-family:'Manrope',sans-serif;font-size:12.5px}
.shell{max-width:1110px;margin:0 auto;background:#F2F5FA;min-height:calc(100vh - 68px)}
.side{width:220px;background:#fff;border-right:1px solid var(--line);padding:18px 0;min-height:calc(100vh - 68px);position:relative}
.side .nav-group{font-size:10px;letter-spacing:.12em;color:var(--mute);padding:12px 18px 5px;text-transform:uppercase}
.side a{display:block;padding:10px 18px;margin:0;border-radius:0;color:var(--text);font-weight:500;font-size:13.5px}
.side a:hover{background:#F7F9FC;color:var(--accent2)}
.side a.active{background:#EEF3FB;color:var(--accent2);font-weight:700;border-left:3px solid var(--accent2);padding-left:15px}
.nav-footer{margin-top:22px;padding:14px 18px;border-top:1px solid #EEF2F8;display:flex;flex-direction:column;gap:5px}
.nav-footer span{font-size:11.5px;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-footer a{padding:4px 0;color:var(--bad);font-size:12px;font-weight:700}
main{flex:1;min-width:0;padding:24px 24px 40px}
main>h1{font-family:'Space Grotesk',sans-serif;font-size:20px;margin:0 0 4px;color:var(--text)}
.page-subtitle,.subtitle{color:var(--mute);font-size:13px;margin-bottom:20px}
.card{border:1px solid var(--line);border-radius:12px;box-shadow:none;padding:16px 18px}
.grid{gap:12px}
.grid .card{border-left:1px solid var(--line);border-radius:12px}
.panel-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:16px}
.panel-head{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.panel-head h2{font-family:'Space Grotesk',sans-serif;font-size:14px;margin:0}
.erp-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}
.erp-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 16px;min-height:78px}
.erp-kpi .l{font-size:10.5px;color:var(--mute);text-transform:uppercase;letter-spacing:.04em}
.erp-kpi .v{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;margin-top:5px}
.erp-kpi .v.good{color:var(--good)}
.erp-filter-row{padding:14px 18px;display:flex;gap:10px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.erp-filter-row input,.erp-filter-row select{margin:0;padding:9px 12px;background:#F7F9FC;font-weight:500}
.erp-filter-row .grow{flex:1;min-width:190px}
.erp-table{width:100%;border-collapse:collapse}
.erp-table th{background:#fff;color:var(--mute);font-weight:600;font-size:10.5px;text-transform:uppercase;border:0;border-bottom:1px solid var(--line);padding:10px 18px}
.erp-table td{background:#fff;border:0;border-bottom:1px solid #EEF2F8;padding:12px 18px;font-weight:500}
.erp-table tbody tr:hover td{background:#F9FAFC}
.erp-chip{display:inline-block;font-size:10.5px;font-weight:700;padding:3px 7px;border-radius:5px;white-space:nowrap}
.erp-chip.ml{background:#FFF4DE;color:#B4790A}
.erp-chip.shopee{background:#FFE7E0;color:#D2481C}
.erp-chip.oficina{background:#E8F0FF;color:#1657C7}
.erp-chip.full{background:#E6EEFB;color:#0E3A8F}
.erp-chip.ok{background:#E7F6EF;color:var(--good)}
.erp-chip.warn{background:#FFF4DE;color:#B4790A}
.erp-chip.bad{background:#FDECEC;color:var(--bad)}
.erp-account{font-size:10.5px;color:var(--mute);background:#F2F5FA;padding:3px 7px;border-radius:5px;white-space:nowrap}
.erp-note{background:#F7F9FC;border:1px dashed var(--line);border-radius:10px;padding:11px 13px;font-size:12px;color:var(--mute);margin:10px 0 16px}
.erp-actions{display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid var(--line)}
.erp-empty{padding:24px;text-align:center;color:var(--mute);font-size:12.5px}
.live-dot{width:7px;height:7px;border-radius:50%;background:var(--good);display:inline-block;margin-right:6px;box-shadow:0 0 0 0 rgba(28,154,108,.55);animation:erpPulse 1.8s infinite}
@keyframes erpPulse{0%{box-shadow:0 0 0 0 rgba(28,154,108,.45)}70%{box-shadow:0 0 0 7px rgba(28,154,108,0)}100%{box-shadow:0 0 0 0 rgba(28,154,108,0)}}

@media(max-width:900px){.erp-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .top{height:auto;min-height:60px}.shell{max-width:none}.side{min-height:100vh;padding-top:92px}.erp-kpis{grid-template-columns:1fr 1fr}
  main{padding:16px}.top-brand span{font-size:16px}.active-company-picker{order:3;flex:1 1 100%}
}
@media(max-width:520px){.erp-kpis{grid-template-columns:1fr}.erp-table{min-width:700px}}

/* ===== Painel Geral V2 — fiel ao protótipo aprovado ===== */
.dashboard-proto-subtitle{color:var(--mute);font-size:13px;margin-bottom:22px;display:flex;align-items:center;gap:2px}
.dashboard-stack{width:100%}
.dash-acc-item{margin-bottom:14px}
.dash-kpi{width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;text-align:left;cursor:pointer;transition:.15s;font-family:'Manrope',sans-serif}
.dash-kpi:hover{border-color:var(--accent2);box-shadow:0 4px 14px rgba(14,58,143,.08)}
.dash-kpi.on{border-color:var(--accent2);background:#F5F8FF;box-shadow:0 4px 14px rgba(14,58,143,.12);border-bottom-left-radius:0;border-bottom-right-radius:0}
.dash-label{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;justify-content:space-between}
.dash-arrow{font-size:16px;color:var(--accent2);transition:.15s}.dash-kpi.on .dash-arrow{transform:rotate(90deg)}
.dash-value{font-family:'Space Grotesk',sans-serif;font-size:26px;font-weight:700;margin-top:6px;color:var(--accent2)}
.dash-value.good,.dash-empty.good{color:var(--good)}.dash-value.warn{color:var(--warn)}.dash-value.bad{color:var(--bad)}
.dash-note{font-size:11.5px;color:var(--mute);margin-top:2px}
.dash-panel{display:none;background:#fff;border:1px solid var(--accent2);border-top:none;border-radius:0 0 12px 12px;overflow:hidden;animation:dashReveal .18s ease}
.dash-panel.show{display:block}@keyframes dashReveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.dash-panel-head{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:8px}
.dash-panel-head span{font-size:11px;color:var(--mute);background:#F2F5FA;padding:3px 8px;border-radius:6px}
.dash-panel-head button{background:none;border:none;color:var(--mute);font-size:18px;cursor:pointer;line-height:1;padding:2px 6px}
.dash-card-grid{display:grid;grid-template-columns:1fr;gap:1px;background:#EEF2F8;padding:1px}
@media(min-width:640px){.dash-card-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.dash-sale-card{background:#fff;padding:12px 14px;display:flex;gap:10px;align-items:flex-start;font-size:13px}
.dash-thumb{width:36px;height:36px;border-radius:8px;background:#EEF2F8;color:#7C8AA3;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}
.dash-card-body{flex:1;min-width:0}.dash-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:5px}.dash-card-name{font-weight:600;line-height:1.3;margin-bottom:5px;word-break:break-word}.dash-card-name .code{font-size:11px;color:var(--mute);font-weight:500}
.dash-card-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--mute);font-size:12px}.dash-card-meta span:last-child{white-space:nowrap;font-size:11.5px}
.dash-list-row{display:flex;align-items:flex-start;gap:10px;padding:12px 18px;border-bottom:1px solid #EEF2F8;font-size:13px}.dash-list-row:last-of-type{border-bottom:none}.dash-row-body{flex:1}.dash-row-top{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.dash-row-desc{color:var(--mute);font-size:12px;margin-top:3px}
.dash-status{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:5px;background:#EEF3FB;color:var(--accent2);white-space:nowrap}.dash-status.bad{background:#FDECEC;color:var(--bad)}.dash-status.warn{background:#FFF4DE;color:#B4790A}
.dash-empty{grid-column:1/-1;padding:26px 18px;text-align:center;color:var(--mute);font-size:12.5px;background:#fff}.dash-footer{padding:12px 18px;display:flex;justify-content:flex-end;border-top:1px solid #EEF2F8}.dashboard-report-row{padding:2px 4px 16px;display:flex;justify-content:flex-end}

/* ===== ERP visual 2026 — tipografia e componentes suaves ===== */
body{font-family:'Manrope',Arial,sans-serif;font-weight:400;color:#101828;background:#F2F5FA}
.side a{font-size:13.5px;font-weight:500;letter-spacing:0;color:#344054}
.side a.active{font-weight:650}.nav-group{font-weight:600;letter-spacing:.08em;color:#7C8AA3}
main>h1{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;letter-spacing:-.01em;text-transform:none}
.card h2,.panel-head h2{font-family:'Space Grotesk',sans-serif;font-weight:600;text-transform:none}
label,th{font-weight:600}.btn{font-family:'Manrope',sans-serif;font-weight:600;text-transform:none;letter-spacing:0}
input,select,textarea{font-family:'Manrope',sans-serif;font-weight:400}
.erp-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.erp-tab{display:inline-flex;align-items:center;padding:9px 16px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--mute);font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:500;text-decoration:none;cursor:pointer}.erp-tab.active{background:var(--accent2);border-color:var(--accent2);color:#fff}.erp-tab:hover{border-color:var(--accent2);color:var(--accent2)}.erp-tab.active:hover{color:#fff}
.erp-form-pad{padding:18px}.erp-item-row{display:flex;gap:12px;align-items:center;padding:13px 18px;border-bottom:1px solid #EEF2F8}.grow{flex:1;min-width:0}
.product-thumb{width:44px;height:44px;object-fit:cover;border-radius:9px;border:1px solid #E4EAF2;background:#EEF2F8;flex:0 0 auto}.product-thumb-empty{display:flex;align-items:center;justify-content:center;color:#8A99AF;font-size:18px}.dash-sale-card .product-thumb,.dash-list-row .product-thumb{width:38px;height:38px}
.part-cell-soft{display:flex;align-items:center;gap:10px;min-width:220px}.soft-help{font-size:11px;color:var(--mute);font-weight:400}.part-photo-editor{display:flex;align-items:center;gap:16px;padding:12px 0 18px}.part-photo-preview{width:92px;height:92px;border:1px dashed var(--line);border-radius:12px;background:#F7F9FC;display:flex;align-items:center;justify-content:center;color:var(--mute);font-size:12px;overflow:hidden}.part-photo-preview img{width:100%;height:100%;object-fit:cover}
.score-pill{display:inline-block;min-width:36px;text-align:center;padding:4px 9px;border-radius:7px;font-weight:700}.score-pill.good{background:#E7F6EF;color:#1C9A6C}.score-pill.warn{background:#FFF4DE;color:#B4790A}.score-pill.bad{background:#FDECEC;color:#D64545}
.quote-item-row{display:grid;grid-template-columns:minmax(220px,2fr) 1fr 1.4fr .7fr 1fr auto;gap:10px;align-items:end;padding:14px 18px;border-top:1px solid #EEF2F8}.quote-item-row label{margin:0}.discount-buttons{display:flex;gap:4px;margin-bottom:4px}.discount-buttons button{flex:1;border:1px solid var(--line);background:#fff;border-radius:6px;padding:7px 4px;cursor:pointer}.mini-label{font-size:10.5px;color:var(--mute);margin-bottom:5px}.quote-total{display:flex;justify-content:flex-end;align-items:center;gap:24px;padding:18px;background:#F7F9FC;border-top:1px solid var(--line)}.quote-total span{color:var(--mute)}.quote-total strong{font-family:'Space Grotesk',sans-serif;font-size:24px;color:var(--accent2)}.remove-btn{border:0;background:none;color:#D64545;font-size:18px;cursor:pointer;padding:10px}.inline-payment{display:flex;gap:6px;align-items:center}.inline-payment input{max-width:115px}.btn.whatsapp{background:#1FAA59;color:#fff}
.login-v2{min-height:100vh;background:linear-gradient(135deg,#0E3A8F 0 44%,#F2F5FA 44% 100%);display:flex;align-items:center;justify-content:center;padding:32px}.login-shell{width:min(920px,100%);display:grid;grid-template-columns:1.05fr .95fr;min-height:520px;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 24px 80px rgba(14,58,143,.22)}.login-brand-panel{background:#0E3A8F;color:#fff;padding:54px;display:flex;flex-direction:column;justify-content:space-between}.login-brand-panel img{width:210px;height:auto}.login-brand-panel h1{font-family:'Space Grotesk',sans-serif;font-size:30px;margin:0 0 10px}.login-brand-panel p{max-width:360px;color:rgba(255,255,255,.78);line-height:1.6}.login-card-v2{box-shadow:none;border:0;border-radius:0;margin:0;padding:64px 54px;display:flex;flex-direction:column;justify-content:center}.login-mini-brand{display:none}.login-card-v2 h2{font-family:'Space Grotesk',sans-serif;font-size:26px;margin:0 0 6px}.login-card-v2>p{color:var(--mute);margin:0 0 28px}.login-card-v2 label{display:block;margin:0 0 15px;color:#344054}.login-card-v2 input{margin-top:6px}.login-button{width:100%;margin-top:6px;padding:12px}.login-foot{margin-top:24px;text-align:center;font-size:11px;color:#98A2B3}
@media(max-width:820px){.quote-item-row{grid-template-columns:1fr 1fr}.login-shell{grid-template-columns:1fr}.login-brand-panel{display:none}.login-v2{background:#F2F5FA;padding:18px}.login-card-v2{padding:36px 24px}.login-mini-brand{display:block;margin-bottom:22px}.login-mini-brand img{height:48px;width:auto}}
.connection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:0 0 16px}.connection-card{background:#fff;border:1px solid var(--line);border-radius:11px;padding:13px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}.connection-card.active{border-color:var(--accent2);box-shadow:0 0 0 1px rgba(22,87,199,.08)}.connection-company{font-weight:650;font-size:13.5px;margin-bottom:3px}
.top-brand img{height:46px;width:auto}.top-brand span{display:none}
/* Revisão visual 18/08/2026 — tipografia leve e autocomplete global */
body{font-weight:400}.side a{font-weight:450;color:#344054}.side a.active{font-weight:600}button,input,select,textarea{font-weight:400}.btn{font-weight:550}table td{font-weight:400}.erp-kpi .l{text-transform:none;font-size:11px}.erp-chip,.dash-status{text-transform:none!important;letter-spacing:0!important}
.global-part-suggestions{position:absolute;left:0;right:0;top:100%;z-index:500;background:#fff;border:1px solid #D8E1EF;border-radius:10px;box-shadow:0 12px 30px rgba(16,24,40,.12);display:none;max-height:320px;overflow:auto;margin-top:4px}.global-part-suggestions.show{display:block}.global-part-option{width:100%;display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;text-align:left;background:#fff;border:0;border-bottom:1px solid #EEF2F7;padding:9px 10px;cursor:pointer;color:#344054}.global-part-option:hover{background:#F7F9FC}.global-part-option img,.ac-photo{width:34px;height:34px;border-radius:7px;object-fit:cover;border:1px solid #E4EAF3;display:grid;place-items:center;color:#98A2B3}.global-part-option b{display:block;font-size:12.5px;font-weight:600}.global-part-option small{display:block;color:#667085;font-size:11.5px;margin-top:2px}.global-part-option em{font-style:normal;color:#667085;font-size:11px;white-space:nowrap}
.shipping-hero{display:flex;align-items:center;gap:20px;padding:24px}.shipping-icon{width:48px;height:48px;border:1px solid #C9D5E7;border-radius:12px;display:grid;place-items:center;font-size:25px;color:#667085}.shipping-label{font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:600}.shipping-number{font-family:'Space Grotesk',sans-serif;font-size:42px;font-weight:600;color:var(--accent2);line-height:1.05;margin:4px 0}.shipping-hero p{margin:4px 0 0;color:#667085;max-width:820px;line-height:1.5}


/* ==========================================================
   TORK PARTS ERP
   CORRECAO GLOBAL DE LAYOUT RESPONSIVO
   ========================================================== */

/* Todos os elementos respeitam corretamente largura + padding */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow-x: hidden;
}


/* ==========================================================
   DESKTOP
   ========================================================== */

.shell {
    display: flex;
    width: 100%;
    max-width: none;
    margin: 0;
    min-width: 0;
}

.side {
    flex: 0 0 220px;
    width: 220px;
    min-width: 220px;
}

main {
    flex: 1 1 auto;
    width: auto;
    max-width: none;
    min-width: 0;
    margin: 0;
    padding: 24px 32px 40px;
}


/* ==========================================================
   CONTEUDO GERAL
   ========================================================== */

.card,
.panel-card,
.dashboard-stack,
.dashboard-report-row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

main > *,
.card > *,
.panel-card > * {
    min-width: 0;
}


/* ==========================================================
   IMAGENS
   ========================================================== */

img {
    max-width: 100%;
}


/* ==========================================================
   TABELAS
   ========================================================== */

.table-wrap,
.report-table-container {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}


/* ==========================================================
   FORMULARIOS
   ========================================================== */

form {
    max-width: 100%;
}

input,
select,
textarea,
button {
    max-width: 100%;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1100px) {

    .side {
        flex-basis: 205px;
        width: 205px;
        min-width: 205px;
    }

    main {
        padding: 22px 20px 36px;
    }

}


/* ==========================================================
   CELULAR
   ========================================================== */

@media (max-width: 760px) {

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }


    /* ------------------------------------------------------
       HEADER
       ------------------------------------------------------ */

    .top {
        width: 100%;
        min-height: 64px;
        height: auto;
        padding: 8px 12px;

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;

        flex-wrap: wrap;
    }


    /* BOTAO HAMBURGUER */

    .mobile-menu-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 42px;

        width: 42px;
        height: 42px;

        margin: 0;
        padding: 0;

        font-size: 27px;
        line-height: 1;
    }


    /* LOGO */

    .top-brand {
        flex: 1 1 auto;
        min-width: 0;

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .top-brand img {
        display: block;

        width: auto;
        height: 42px;

        max-width: 170px;

        object-fit: contain;
    }


    /* USUARIO DO HEADER */

    .top-user {
        display: none;
    }


    /* SELETOR DE EMPRESA */

    .active-company-picker {
        order: 10;

        flex: 1 0 100%;

        width: 100%;
        max-width: 100%;

        margin: 0;

        display: flex;
        align-items: center;
        gap: 0;
    }

    .active-company-picker select {
        flex: 1 1 auto;

        width: 100%;
        min-width: 0;
        max-width: 100%;
    }


    /* ------------------------------------------------------
       ESTRUTURA PRINCIPAL
       ------------------------------------------------------ */

    .shell {
        display: block;

        width: 100%;
        max-width: 100%;

        margin: 0;
        padding: 0;

        min-height: 0;
    }

    main {
        display: block;

        width: 100%;
        max-width: 100%;

        min-width: 0;

        margin: 0;

        padding: 20px 14px 36px;

        overflow: visible;
    }


    /* ------------------------------------------------------
       MENU LATERAL MOBILE
       ------------------------------------------------------ */

    .side {
        position: fixed;

        top: 0;
        left: 0;
        bottom: 0;

        width: min(280px, 84vw);
        max-width: 84vw;
        min-width: 0;

        height: 100vh;

        margin: 0;

        padding: 82px 12px 24px;

        overflow-y: auto;
        overflow-x: hidden;

        transform: translateX(-105%);

        transition: transform .22s ease;

        z-index: 1000;
    }

    .side.mobile-open {
        transform: translateX(0);
    }


    /* ------------------------------------------------------
       CARDS
       ------------------------------------------------------ */

    .card,
    .panel-card,
    .dashboard-stack,
    .dashboard-report-row,
    .dash-kpi,
    .dash-panel {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .card,
    .panel-card {
        overflow: visible;
    }


    /* ------------------------------------------------------
       DASHBOARD
       ------------------------------------------------------ */

    .dashboard-stack {
        width: 100%;
        margin: 0;
    }

    .dash-kpi {
        width: 100%;
        padding: 16px;
    }

    .dash-card-grid {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .dash-list-row,
    .erp-item-row {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .dash-row-body,
    .dash-card-body {
        min-width: 0;
    }


    /* ------------------------------------------------------
       FORMULARIOS
       ------------------------------------------------------ */

    form {
        max-width: 100%;
    }

    input,
    select,
    textarea {
        max-width: 100%;
        min-width: 0;
    }

    .part-search-container {
        width: 100%;
        max-width: 100%;
    }


    /* Remove larguras fixas comuns no mobile */

    input[style*="width:320px"],
    input[style*="width: 320px"],
    input[style*="width:300px"],
    input[style*="width: 300px"],
    input[style*="width:240px"],
    input[style*="width: 240px"],
    input[style*="width:180px"],
    input[style*="width: 180px"] {
        width: 100% !important;
        max-width: 100% !important;
    }


    /* ------------------------------------------------------
       BOTOES
       ------------------------------------------------------ */

    .btn {
        max-width: 100%;
        white-space: normal;
    }


    /* ------------------------------------------------------
       TABELAS
       ------------------------------------------------------ */

    .table-wrap,
    .report-table-container {
        display: block;

        width: 100%;
        max-width: 100%;

        overflow-x: auto;

        -webkit-overflow-scrolling: touch;
    }

    table {
        max-width: none;
    }


    /* ------------------------------------------------------
       FILTROS
       ------------------------------------------------------ */

    .erp-filter-row {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
    }

    .erp-filter-row > * {
        min-width: 0;
    }

}


/* ==========================================================
   CELULARES MENORES
   ========================================================== */

@media (max-width: 520px) {

    main {
        padding: 18px 12px 32px;
    }

    .top {
        padding-left: 10px;
        padding-right: 10px;
    }

    .mobile-menu-btn {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .top-brand img {
        height: 38px;
        max-width: 150px;
    }

    .card,
    .panel-card {
        width: 100%;
        max-width: 100%;
        border-radius: 10px;
    }

    .erp-kpis {
        grid-template-columns: 1fr;
    }

    .quote-item-row {
        grid-template-columns: 1fr;
    }

    .erp-filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .erp-filter-row > *,
    .erp-filter-row .grow {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

}


/* ==========================================================
   MONITORES GRANDES
   ========================================================== */

@media (min-width: 1600px) {

    main {
        padding-left: 40px;
        padding-right: 40px;
    }

}



/* ==========================================================
   TORK PARTS ERP
   LAYOUT GLOBAL FULL WIDTH + MOBILE
   25/08/2026
   ========================================================== */

/* ---------- BASE ---------- */

html,
body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

body {
    overflow-x: hidden !important;
}

*,
*::before,
*::after {
    box-sizing: border-box !important;
}


/* ==========================================================
   TOPO
   ========================================================== */

.top {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

.top-brand {
    flex: 0 0 auto !important;
}

.top-brand img {
    max-width: 180px !important;
    height: auto !important;
}

.active-company-picker {
    margin-left: auto !important;
    max-width: none !important;
}


/* ==========================================================
   ESTRUTURA PRINCIPAL DESKTOP
   ========================================================== */

.shell {
    display: grid !important;
    grid-template-columns: 220px minmax(0, 1fr) !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    min-width: 0 !important;
}


/* ---------- MENU LATERAL ---------- */

.side {
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;

    margin: 0 !important;

    position: relative;
}


/* ---------- CONTEÚDO ---------- */

main {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin: 0 !important;

    padding-left: 24px !important;
    padding-right: 24px !important;
    padding-top: 24px !important;
    padding-bottom: 40px !important;
}


/* Qualquer container direto não pode limitar a página */

main > *,
.dashboard-stack,
.dashboard-report-row {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}


/* ==========================================================
   CARDS / PAINÉIS
   ========================================================== */

.card,
.panel-card,
.dash-acc-item,
.dash-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}


/* ==========================================================
   FORMULÁRIOS
   ========================================================== */

input,
select,
textarea {
    max-width: 100% !important;
}

form {
    max-width: 100%;
}


/* ==========================================================
   TABELAS
   ========================================================== */

.table-wrap,
.report-table-container {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    overflow-x: auto !important;
    overflow-y: visible !important;

    -webkit-overflow-scrolling: touch;
}

.erp-table {
    max-width: none;
}


/* ==========================================================
   DASHBOARD DESKTOP
   ========================================================== */

.dashboard-stack {
    width: 100% !important;
}

.dash-kpi {
    width: 100% !important;
    max-width: none !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1100px) {

    .shell {
        grid-template-columns: 200px minmax(0, 1fr) !important;
    }

    .side {
        width: 200px !important;
        min-width: 200px !important;
        max-width: 200px !important;
    }

    main {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 760px) {

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }


    /* ---------- HEADER ---------- */

    .top {
        min-height: 72px !important;
        height: auto !important;

        padding: 10px 12px !important;

        display: flex !important;
        align-items: center !important;
        gap: 10px !important;

        width: 100% !important;
    }


    /* botão hamburguer */

    .mobile-menu-btn {
        display: flex !important;

        flex: 0 0 42px !important;

        width: 42px !important;
        height: 42px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;

        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;

        z-index: 1002 !important;
    }


    /* logo */

    .top-brand {
        flex: 0 0 auto !important;

        margin: 0 !important;
        padding: 0 !important;

        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
    }

    .top-brand img {
        display: block !important;

        width: auto !important;
        max-width: 125px !important;
        height: 48px !important;

        object-fit: contain !important;
    }

    .top-brand span {
        display: none !important;
    }


    /* empresa */

    .active-company-picker {
        flex: 1 1 auto !important;

        min-width: 0 !important;

        margin: 0 0 0 auto !important;

        display: flex !important;
        align-items: stretch !important;

        position: relative !important;

        left: auto !important;
        right: auto !important;
        top: auto !important;

        width: auto !important;
        max-width: none !important;
    }

    .active-company-picker select {
        flex: 1 1 auto !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        height: 42px !important;

        padding-left: 10px !important;
        padding-right: 28px !important;

        font-size: 12px !important;
    }

    .company-switch {
        flex: 0 0 auto !important;

        height: 42px !important;

        padding-left: 10px !important;
        padding-right: 10px !important;

        font-size: 12px !important;
    }


    /* ---------- ESTRUTURA ---------- */

    .shell {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ---------- MENU MOBILE ---------- */

    .side {
        position: fixed !important;

        top: 0 !important;
        left: 0 !important;

        width: min(82vw, 300px) !important;
        min-width: 0 !important;
        max-width: 300px !important;

        height: 100vh !important;
        height: 100dvh !important;

        overflow-y: auto !important;

        transform: translateX(-105%);
        transition: transform .22s ease;

        z-index: 1100 !important;

        margin: 0 !important;
        padding-top: 80px !important;
    }

    .side.open,
    .side.is-open,
    body.menu-open .side {
        transform: translateX(0) !important;
    }


    .mobile-menu-backdrop {
        position: fixed !important;

        inset: 0 !important;

        width: 100vw !important;
        height: 100vh !important;

        z-index: 1090 !important;

        display: none;
    }

    .mobile-menu-backdrop.show,
    .mobile-menu-backdrop.open,
    body.menu-open .mobile-menu-backdrop {
        display: block !important;
    }


    /* ---------- CONTEÚDO MOBILE ---------- */

    main {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;

        padding: 16px 12px 32px !important;

        position: relative !important;

        left: auto !important;
        right: auto !important;
        top: auto !important;

        transform: none !important;
    }


    main > *,
    .dashboard-stack,
    .dashboard-report-row,
    .card,
    .panel-card,
    .dash-acc-item,
    .dash-kpi,
    .dash-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    /* ---------- DASHBOARD ---------- */

    .dashboard-proto-subtitle {
        width: 100% !important;
        max-width: 100% !important;
    }

    .dashboard-stack {
        display: block !important;
    }

    .dash-acc-item {
        display: block !important;
        margin-bottom: 12px !important;
    }

    .dash-kpi {
        display: block !important;

        min-height: 0 !important;
        height: auto !important;

        padding: 18px !important;
    }

    .dash-label,
    .dash-note {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .dash-value {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }


    /* ---------- GRIDS ---------- */

    .erp-kpis,
    .dash-card-grid,
    .quote-item-row {
        grid-template-columns: 1fr !important;
    }


    /* ---------- FORMULÁRIOS ---------- */

    main form {
        max-width: 100% !important;
    }

    main input,
    main select,
    main textarea {
        width: 100%;
        min-width: 0 !important;
        max-width: 100% !important;
    }


    /* ---------- TABELAS ---------- */

    .table-wrap,
    .report-table-container {
        width: 100% !important;
        max-width: 100% !important;

        overflow-x: auto !important;

        -webkit-overflow-scrolling: touch;
    }


    /* tabela pode ser maior que celular;
       quem rola é somente o container */

    .erp-table {
        width: max-content !important;
        min-width: 700px !important;
        max-width: none !important;
    }


    /* imagens */

    img {
        max-width: 100%;
        height: auto;
    }
}


/* ==========================================================
   CELULAR PEQUENO
   ========================================================== */

@media (max-width: 520px) {

    .top {
        padding: 8px !important;
        gap: 6px !important;
    }

    .mobile-menu-btn {
        flex-basis: 38px !important;

        width: 38px !important;
        height: 38px !important;
    }

    .top-brand img {
        max-width: 94px !important;
        height: 42px !important;
    }

    .active-company-picker select {
        font-size: 11px !important;
        padding-left: 7px !important;
    }

    .company-switch {
        padding-left: 7px !important;
        padding-right: 7px !important;

        font-size: 11px !important;
    }

    main {
        padding: 14px 10px 28px !important;
    }

    .card,
    .panel-card {
        border-radius: 12px !important;
    }
}


/* ==========================================================
   TELAS GRANDES
   ========================================================== */

@media (min-width: 1600px) {

    .shell {
        grid-template-columns: 240px minmax(0, 1fr) !important;
    }

    .side {
        width: 240px !important;
        min-width: 240px !important;
        max-width: 240px !important;
    }

    main {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}