body.areas-mode main>:not(#areasPage):not(#toast){display:none!important}body.areas-mode #areasPage{display:block!important}.warehouse-areas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:14px}.warehouse-area{min-width:0;border:1px solid #dce4e7;border-radius:14px;padding:18px;background:#fff}.warehouse-area.inactive{opacity:.58;background:#f2f4f4}.warehouse-area header{display:grid;grid-template-columns:minmax(0,1fr);gap:13px;align-items:start}.warehouse-area h2{overflow-wrap:anywhere;margin:3px 0}.warehouse-area header small{color:#718096;font-size:10px;letter-spacing:.1em}.area-head-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,.55fr);gap:7px;width:100%}.area-head-actions button{min-width:0;max-width:100%;white-space:normal}.area-occupancy{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.area-person{display:inline-flex;max-width:100%;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;font-weight:750;overflow-wrap:anywhere}.area-person i{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:currentColor}.area-person.clocked,.area-assign-user.clocked{background:#dcfce7;color:#17603a}.area-person.offline,.area-assign-user.offline{background:#e5e7eb;color:#5d6670}.area-empty{padding:8px 0;color:#9a5b14}.area-assign-card{width:min(570px,100%)}.area-assign-users{display:grid;gap:8px;margin:18px 0;max-height:55vh;overflow:auto}.area-assign-user{display:flex;align-items:center;gap:12px;padding:12px;border:2px solid transparent;border-radius:11px}.area-assign-user.selected{border-color:#5b21b6;box-shadow:0 0 0 2px #ede9fe}.area-assign-user input{width:22px;height:22px;flex:0 0 auto}.area-assign-user span{display:grid;min-width:0}.area-assign-user strong,.area-assign-user small{overflow-wrap:anywhere}.commission-areas-mode #commissionContent{display:none!important}.commission-areas-mode #commissionAreasPage{display:block!important}.area-person>span{min-width:0;overflow-wrap:anywhere}.area-person-message{width:11px;height:11px;flex:0 0 auto;border-radius:50%;background:#e3b01c;box-shadow:0 0 0 3px #e3b01c26}.area-person-message.red{background:#d94438;box-shadow:0 0 0 3px #d9443826}.area-person-message.green{background:#20a66a;box-shadow:0 0 0 3px #20a66a26}@media(max-width:700px){.warehouse-areas{grid-template-columns:minmax(0,1fr)}.warehouse-area{padding:15px}.area-head-actions{grid-template-columns:minmax(0,1fr) minmax(86px,.55fr)}}

.personnel-overview{grid-column:1/-1;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:12px}
.personnel-status-group{min-width:0;padding:16px;border:1px solid #dce4e7;border-radius:16px;background:#f7f9fa}
.personnel-status-group>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.personnel-status-group>header small{display:block;margin-bottom:3px;color:#75828a;font-size:9px;font-weight:850;letter-spacing:.13em}
.personnel-status-group>header h2{margin:0;color:#26333b;font-size:17px}
.personnel-status-group>header>b{display:grid;place-items:center;min-width:30px;height:30px;border-radius:999px;background:#fff;color:#4b5961;font-size:13px;box-shadow:0 1px 0 #fff inset}
.personnel-status-group.absent{background:#eef1f2;border-color:#d6dcdf}
.personnel-status-group.available{background:#effbf4;border-color:#c7ead5}
.personnel-status-group.delivery{background:#fff0fd;border-color:#efc3e9}
.personnel-status-group.available>header>b{color:#17603a}.personnel-status-group.delivery>header>b{color:#9c137d}
.personnel-status-people{display:flex;flex-wrap:wrap;gap:7px;min-height:36px;align-items:center}
.personnel-chip{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:8px 10px;border-radius:12px;background:#fff;color:#536068;box-shadow:0 1px 4px #17212a12}
.personnel-chip>i{width:9px;height:9px;flex:0 0 auto;border-radius:50%;background:currentColor}
.personnel-chip>span{display:grid;min-width:0}.personnel-chip strong,.personnel-chip small{overflow-wrap:anywhere}
.personnel-chip strong{font-size:12px}.personnel-chip small{color:inherit;font-size:9px;opacity:.8}
.personnel-chip.available{color:#17603a}.personnel-chip.delivery{color:#a31584}.personnel-chip.absent{color:#647078;background:#e1e5e7}
.personnel-status-empty{color:#7b878e;font-size:11px;font-weight:650}
.warehouse-area.delivery-area{border-color:#eab6e2;box-shadow:inset 0 3px 0 #c000c8}
.warehouse-area.delivery-area header small{color:#a31584}
.area-person.available,.area-assign-user.available{background:#dcfce7;color:#17603a}
.area-person.delivery,.area-assign-user.delivery{background:#f8d7f3;color:#991979}
.area-person.absent,.area-assign-user.absent{background:#dfe3e5;color:#69747b;filter:grayscale(.2);opacity:.82}
.area-assign-user.absent{cursor:pointer}.area-assign-user.absent:hover{opacity:1}
.area-assign-user.delivery small,.area-assign-user.available small,.area-assign-user.absent small{color:inherit;opacity:.78}
@media(max-width:980px){.personnel-overview{grid-template-columns:1fr 1fr}.personnel-status-group.absent{grid-column:1/-1}}
@media(max-width:700px){.personnel-overview{grid-template-columns:minmax(0,1fr)}.personnel-status-group.absent{grid-column:auto}.personnel-status-group{padding:14px}}
