:root,[data-theme="light"]{--text-xs:clamp(.75rem,.7rem + .25vw,.875rem);--text-sm:clamp(.875rem,.8rem + .35vw,1rem);--text-base:clamp(1rem,.95rem + .25vw,1.125rem);--text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);--text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--bg:#f4f7fb;--surface:#fff;--surface-2:#f7f9fc;--surface-offset:#edf2f8;--border:#d8e1ec;--divider:#e7edf4;--text:#172336;--muted:#5d6b7d;--faint:#95a3b7;--primary:#173b74;--primary-hover:#102b53;--success:#1b8d5a;--warning:#d38716;--error:#bd4152;--info:#2e69cc;--radius:.95rem;--radius-lg:1.2rem;--shadow:0 12px 30px rgba(16,24,40,.08);--font-body:'Satoshi',system-ui,sans-serif;--font-display:'Cabinet Grotesk','Satoshi',sans-serif}
[data-theme="dark"]{--bg:#0c1420;--surface:#121c2a;--surface-2:#172334;--surface-offset:#1e2b3f;--border:#2a3a52;--divider:#223148;--text:#ebf1f7;--muted:#a7b4c5;--faint:#75849a;--primary:#6d9cf1;--primary-hover:#8db3ff;--shadow:0 18px 38px rgba(0,0,0,.38)}
*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:none;text-size-adjust:none}body{font-family:var(--font-body);background:var(--bg);color:var(--text);font-size:var(--text-base);line-height:1.5;min-height:100vh}img,svg{display:block;max-width:100%;height:auto}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}input,select,textarea{padding:.85rem 1rem;border:1px solid var(--border);background:var(--surface-2);border-radius:1rem;width:100%}textarea{min-height:92px;resize:vertical}h1,h2,h3,h4,h5,h6{line-height:1.15}p{max-width:72ch}small{font-size:var(--text-xs)}.app{display:grid;grid-template-columns:290px minmax(0,1fr);min-height:100vh}.sidebar{background:linear-gradient(180deg,var(--primary),var(--primary-hover));color:#fff;padding:var(--space-8) var(--space-6);display:flex;flex-direction:column;gap:var(--space-8);min-width:0}.brand{display:flex;gap:var(--space-4);align-items:center}.brand-mark{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.12)}.brand h1{font-family:var(--font-display);font-size:var(--text-lg)}.brand p{color:rgba(255,255,255,.75)}.nav{display:grid;gap:var(--space-2)}.nav button{padding:var(--space-4);border-radius:1rem;display:flex;justify-content:space-between;align-items:center;color:#fff;font-weight:800;text-align:left}.nav button.active,.nav button:hover{background:rgba(255,255,255,.12)}.sidebar-actions{margin-top:auto;display:grid;gap:var(--space-3)}.sidebar-actions button{padding:.85rem 1rem;border-radius:1rem;background:rgba(255,255,255,.12);color:#fff}.content{padding:var(--space-8);min-width:0;overflow-x:auto}.topbar{display:flex;justify-content:space-between;gap:var(--space-4);align-items:flex-start;flex-wrap:wrap;margin-bottom:var(--space-6)}.topbar h2{font-family:var(--font-display);font-size:var(--text-xl)}.topbar p{color:var(--muted)}.actions,.toolbar,.toolbar .left,.toolbar .right{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center}.panel{background:var(--surface);border:1px solid var(--border);border-radius:1.2rem;box-shadow:var(--shadow)}.pad{padding:var(--space-5)}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}.stat-label{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}
.stat-value{
    font-family:var(--font-display);
    font-size:2.8rem;
    margin:.35rem 0;
    font-weight:700;
}

.stat-note{font-size:var(--text-sm);color:var(--muted)}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-6)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
.list,.table{display:grid;gap:var(--space-3)}
.item{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-4);border:1px solid var(--divider);background:var(--surface-2);border-radius:1rem;min-width:0}
.item > div{min-width:0}
.item strong{display:block}
.item div,.item p,
.item span{word-break:break-word}
.parts-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr .7fr .7fr .8fr .85fr;gap:var(--space-3);align-items:center}


.mov-cols{

    display:grid;

    grid-template-columns:
        60px
        120px
        60px
        170px
        250px
        220px
        120px;

    gap:15px;

    align-items:center;

}




.table-head{display:grid;padding:0 var(--space-4);color:var(--muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.badge{display:inline-flex;padding:.28rem .68rem;border-radius:999px;font-size:var(--text-xs);font-weight:800}
.ok{background:rgba(27,141,90,.14);color:var(--success)}
.low{background:rgba(189,65,82,.14);color:var(--error)}
.warn{background:rgba(211,135,22,.14);color:var(--warning)}
.btn{padding:.82rem 1rem;border-radius:1rem;font-weight:800;border:1px solid transparent}
.btn-primary{background:var(--primary);color:#fff}
.btn-secondary{background:var(--surface-offset);border-color:var(--border)}
.btn-danger{background:var(--error);color:#fff}
.search{min-width:280px;max-width:100%}
.section-title{font-size:var(--text-lg);margin-bottom:1rem}
.mini{padding:var(--space-4);border:1px solid var(--divider);border-radius:1rem;background:var(--surface-2)}
.bar{height:10px;border-radius:999px;background:var(--surface-offset);overflow:hidden}
.bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--info))}
.hidden{display:none!important}
.auth-wrap{max-width:520px;margin:7vh auto}.auth-card{padding:1.4rem}
.notice{padding:.85rem 1rem;border-radius:1rem;background:var(--surface-offset);border:1px solid var(--border);color:var(--muted)}
dialog{border:0;border-radius:1rem;padding:0;max-width:720px;width:min(92vw,720px);background:var(--surface);color:var(--text);box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(5,10,20,.55)}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--divider)}
.modal-body{padding:1.25rem}
form{display:grid;gap:var(--space-4)}
label{display:grid;gap:.4rem;font-weight:700}
code.inline{padding:.1rem .35rem;border-radius:.4rem;background:var(--surface-offset)}@media(max-width:1180px){.app,.stats,.grid-2,.grid-3{grid-template-columns:1fr}
.parts-cols,.mov-cols{grid-template-columns:1fr 1fr}
.content{padding:var(--space-4)}}@media(max-width:760px){.auth-wrap{margin:2vh auto;padding:0 1rem}
.topbar{flex-direction:column}.actions,.toolbar,.toolbar .left,.toolbar .right{width:100%}.search{min-width:100%}
.parts-cols,.mov-cols{grid-template-columns:1fr}.nav button{padding:.9rem 1rem}.sidebar{padding:1.25rem}.content{padding:1rem}}

.modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}


.modal-box {

    background:white;

    padding:25px;

    border-radius:16px;

    width:700px;

    max-width:90%;

    max-height:90vh;

    overflow-y:auto;

    box-shadow:
        0 20px 60px rgba(0,0,0,.25);

}


.stats .panel{

    min-height:140px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.table .item{

    transition:.2s;

}

.table .item:hover{

    background:#eef5ff;

    transform:translateY(-2px);

}


#farmaciasTable .item{

    display:flex !important;

    flex-direction:column;

    gap:12px;

    padding:24px;

    border-radius:20px;

    background:white;

    box-shadow:
        0 10px 30px rgba(0,0,0,.06);

    border:1px solid #eef2f7;

    transition:.25s;

}


#reportResult .item{

    border-left:5px solid var(--primary);

    cursor:pointer;

    transition:.2s;

}

.btn{

    transition:.2s;

}

.btn{

    transition:.2s;

}



#movementHistory{

    width:100%;

    overflow-x:hidden;

}



input:focus,
select:focus,
textarea:focus{

    outline:none;

    border-color:var(--primary);

    box-shadow:
        0 0 0 3px rgba(23,59,116,.15);

}



#reportResult{

    display:grid;

    grid-template-columns:
        repeat(auto-fill,minmax(280px,1fr));

    gap:15px;

}



#reportResult .item {

    padding: 18px;

    border-radius: 14px;

    background: white;

    border-left: 5px solid var(--primary);

    cursor: pointer;

    transition: .2s;

}

#farmaciasTable {

    display:grid;

    grid-template-columns:
        repeat(auto-fill,minmax(450px,1fr));

    gap:20px;

}

#farmaciasTable .item {

    display:block !important;

    padding:20px;

    border-radius:16px;

    background:white;

    box-shadow:
        0 5px 15px rgba(0,0,0,.08);

}

.btn-secondary,
.btn-danger{

    min-width:90px;

    white-space:nowrap;

}


#movementHistory{

    max-height:700px;

    overflow-y:auto;

}

#movementHistory .item{

    border-left:4px solid var(--primary);

}

.nav button{

    transition:.2s;

}

.nav button:hover{

    transform:translateX(5px);

}

.nav button{

    transition:.2s;

}

.nav button:hover{

    transform:translateX(5px);

}

.stats .panel{

    min-height:140px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}


.stat-value{

    font-size:3.8rem;

    font-weight:800;

    color:var(--primary);

}


#farmaciasTable .item strong{

    font-size:1.3rem;

    color:var(--primary);

    margin-bottom:10px;

    display:block;

}


.btn-secondary{

    background:#eef4ff;

    color:var(--primary);

    border:none;

}



.btn-danger{

    background:#d74c61;

    color:white;

}


#farmaciasTable .item:hover{

    transform:translateY(-4px);

    box-shadow:
        0 15px 40px rgba(0,0,0,.12);

}

#farmaciasTable strong{

    font-size:1.35rem;

    color:var(--primary);

    margin-bottom:5px;

}

.stats{

    gap:25px;

}

.stats .panel{

    border-radius:22px;

    min-height:170px;

}


#movementHistory .item{

    background:white;

    border-radius:16px;

    border:1px solid #e5eaf2;

    padding:16px;

}


#movementHistory .item:hover{

    background:#f8fbff;

}

.topbar{

    padding-bottom:15px;

    border-bottom:
        1px solid #edf1f7;

}

input,
select,
textarea{

    background:white;

    border:1px solid #dfe7f2;

}

input:focus,
select:focus,
textarea:focus{

    border-color:var(--primary);

    box-shadow:
        0 0 0 4px rgba(23,59,116,.12);

}

#reportResult .item{

    background:white;

    border:none;

    border-radius:20px;

    min-height:110px;

    padding:20px;

    box-shadow:
        0 8px 20px rgba(0,0,0,.06);

}

#movimentos .grid-2{

    display:flex !important;

    flex-direction:column !important;

}


#movimentos form{

    max-width:none;

    width:100%;

}



#movimentos .panel:first-child{

    max-width:1000px;

    width:100%;

}


.mov-cols div{

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;

}
