:root{--bg:#f4f7f6;--panel:#fff;--ink:#17211f;--muted:#697773;--line:#dfe7e4;--teal:#0f766e;--teal-dark:#0b5f59;--teal-soft:#dff4f0;--amber:#d97706;--blue:#2563eb;--purple:#7c3aed;--red:#c2413a;--shadow:0 4px 18px rgba(17,55,48,.07);font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}
body{margin:0;overflow:hidden;font-size:13px}
button,input,select{font:inherit}
.hidden{display:none!important}
.login-view{height:100vh;display:grid;grid-template-columns:minmax(400px,1.2fr) minmax(390px,.8fr);background:#fff}
.login-art{position:relative;overflow:hidden;padding:44px 7vw;color:#fff;background:linear-gradient(145deg,#063f3c,#0b756c 68%,#159b8c);display:flex;flex-direction:column;justify-content:space-between}
.login-art:after{content:"";position:absolute;width:430px;height:430px;border:1px solid rgba(255,255,255,.12);border-radius:50%;right:-170px;top:-110px}
.brand-mark{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;font-weight:800;letter-spacing:-1px;color:#0f766e;background:#fff;box-shadow:0 8px 25px rgba(0,0,0,.18)}
.brand-mark.small{width:38px;height:38px;border-radius:11px;background:var(--teal);color:#fff;box-shadow:none;font-size:13px}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:2.5px;opacity:.75}
.eyebrow.teal{color:var(--teal);opacity:1}
.login-art h1{font-size:clamp(36px,4vw,61px);line-height:1.06;letter-spacing:-2.2px;margin:15px 0}
.login-copy{font-size:17px;line-height:1.6;opacity:.78;max-width:550px}
.route-art{height:80px;display:flex;align-items:center;position:relative;max-width:620px}
.route-art:before{content:"";position:absolute;height:2px;left:20px;right:20px;background:rgba(255,255,255,.3)}
.route-art span{z-index:1;width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#11877c;margin-right:25%;box-shadow:0 0 0 7px rgba(255,255,255,.1)}
.route-art i{z-index:2;width:38px;height:25px;background:#f6c453;border-radius:5px 8px 5px 5px;position:absolute;right:15px;box-shadow:inset -8px 0 rgba(0,0,0,.08)}
.login-card{width:min(430px,80%);align-self:center;justify-self:center}
.login-card h2{font-size:32px;letter-spacing:-1px;margin:9px 0}
.muted{color:var(--muted);margin:0 0 28px}
.login-card label,.compact-form label,.driver-add label{display:grid;gap:6px;font-weight:650;color:#33403d;margin-bottom:14px}
.login-card input,.compact-form input,.compact-form select,.driver-add input,.filters input,.filters select{height:39px;border:1px solid #cfdad7;border-radius:8px;padding:0 11px;background:#fff;color:var(--ink);outline:none;transition:.16s}
.login-card input{height:46px}
.login-card input:focus,.compact-form input:focus,.compact-form select:focus,.driver-add input:focus,.filters input:focus,.filters select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,118,110,.12)}
.demo-note{padding:12px;border-radius:9px;background:#f0f7f5;color:#4d5e59;text-align:center;font-size:12px;line-height:1.6}
.error-text{color:var(--red);text-align:center;min-height:18px}
.success-text{color:var(--teal);text-align:center;min-height:18px}
.auth-link{display:block;margin:10px auto 0;border:0;background:transparent;color:var(--teal);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.app{height:100vh;display:flex;flex-direction:column}
.topbar{height:64px;flex:none;padding:0 22px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.brand,.user-menu,.panel-title>div,.list-header>div{display:flex;align-items:center;gap:11px}
.brand strong{display:block;font-size:15px}
.brand small,.user-menu small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.metrics{display:flex;height:100%;gap:3vw}
.metrics>div{display:grid;grid-template-columns:auto auto;grid-template-rows:1fr 1fr;column-gap:8px;align-items:end;padding:10px 14px}
.metrics .dot{width:8px;height:8px;border-radius:50%;grid-row:1/3;align-self:center}
.metrics small{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.metrics strong{font-size:17px;align-self:start}
.dot.waiting,.legend .waiting{background:#94a3b8}
.dot.route,.legend .route{background:#f59e0b}
.dot.delivered,.legend .delivered{background:#22a36a}
.dot.total{background:var(--teal)}
.avatar{width:31px;height:31px;display:grid;place-items:center;background:#dff4f0;color:var(--teal);border-radius:50%;font-size:10px;font-weight:800}
.icon-btn,.text-btn{border:0;background:transparent;cursor:pointer;color:var(--muted)}
.text-btn{color:var(--teal);font-weight:700}
.workspace{height:calc(100vh - 64px);padding:12px 15px 14px;display:grid;grid-template-rows:minmax(455px,55%) minmax(0,45%);gap:11px}
.forms-grid{display:grid;grid-template-columns:1.45fr .9fr .95fr .72fr;gap:10px;min-height:0}
.panel,.list-panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-width:0;overflow:hidden}
.panel{padding:13px 14px}
.panel-title{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid #edf1f0;margin-bottom:10px}
.panel-title h2,.list-header h2{font-size:14px;margin:0;letter-spacing:-.1px}
.panel-title p{font-size:10px;margin:2px 0 0;color:var(--muted)}
.step{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal);font-size:10px;font-weight:800}
.step.amber{background:#fef1d7;color:#ad6204}
.step.blue{background:#e3edff;color:#2563eb}
.step.purple{background:#eee7ff;color:#7c3aed}
.compact-form{font-size:11px}
.compact-form label{margin-bottom:7px;gap:4px}
.compact-form input,.compact-form select{height:32px;border-radius:6px;font-size:11px}
.fields{display:grid;gap:8px}
.fields.two{grid-template-columns:1fr 1fr}
.fields.date-note{grid-template-columns:125px 1fr}
.fields label{min-width:0}
.compact-form .actions{margin-top:8px}
.actions{display:flex;align-items:center;gap:7px}
.actions>span{flex:1}
.btn{height:34px;border-radius:7px;border:1px solid transparent;padding:0 14px;font-weight:700;cursor:pointer;transition:.15s}
.btn:hover{filter:brightness(.96);transform:translateY(-1px)}
.btn.primary{background:var(--teal);color:#fff}
.btn.primary:hover{background:var(--teal-dark)}
.btn.ghost{background:#fff;border-color:#d7e0de;color:#53615e}
.btn.danger{background:#c2413a;color:#fff}
.btn.danger.ghost{background:#fff;color:#b93832;border-color:#efcac7}
.btn.full{width:100%;height:41px}
.btn.amber-btn{background:#e89417;color:#fff}
.btn.blue-btn{background:#2563eb;color:#fff}
.btn.compact{height:34px;padding:0 11px}
.field-hint{height:14px;margin:0;color:var(--teal);font-size:10px}
.centered-form{display:flex;flex-direction:column;height:calc(100% - 48px)}
.summary-card{min-height:55px;border:1px solid #dfe8e5;background:#f8faf9;border-radius:8px;margin-bottom:9px;padding:8px;display:flex;align-items:center;gap:8px}
.summary-card.empty{color:#84908d}
.summary-card p{font-size:10px;line-height:1.4;margin:0}
.summary-card strong{display:block;color:var(--ink);font-size:11px}
.summary-card .tag{font-size:9px}
.summary-icon{width:28px;height:28px;border-radius:50%;flex:none;display:grid;place-items:center;background:#eaf3f1;color:var(--teal)}
.input-action{display:grid;grid-template-columns:1fr 34px}
.input-action input{border-radius:6px 0 0 6px!important;min-width:0}
.input-action button{border:0;border-radius:0 6px 6px 0;background:var(--teal);color:#fff;font-size:17px;cursor:pointer}
.time-info{font-size:9px;color:var(--muted);margin:auto 0 8px;padding-left:16px;position:relative}
.time-info:before{content:"◷";position:absolute;left:0}
.driver-add{font-size:11px}
.driver-list-head{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;padding:4px 0 8px}
.driver-list{height:calc(100% - 125px);overflow:auto}
.driver-item{display:flex;align-items:center;gap:7px;padding:7px 5px;border-top:1px solid #eef2f1}
.driver-item:first-child{border-top:0}
.driver-item .mini-avatar{width:25px;height:25px;border-radius:7px;display:grid;place-items:center;background:#eee7ff;color:#7c3aed;font-weight:800;font-size:9px}
.driver-item strong{font-size:10px;flex:1}
.driver-item button{border:0;background:transparent;color:#a55;cursor:pointer}
.list-panel{display:flex;flex-direction:column;min-height:0}
.list-header{min-height:54px;padding:8px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line)}
.list-header>div{white-space:nowrap}
.list-header>div span{font-size:10px;color:var(--muted);border-left:1px solid var(--line);padding-left:11px}
.filters{display:flex;gap:6px;align-items:center;min-width:0}
.filters input,.filters select{height:34px;font-size:10px;padding:0 8px;max-width:145px}
.filters input[type=date]{max-width:121px}
.search-box{position:relative;display:flex;align-items:center}
.search-box span{position:absolute;left:10px;color:#81908c}
.search-box input{padding-left:27px;min-width:260px}
.legend{display:flex;gap:13px;padding:5px 14px;color:var(--muted);font-size:9px;border-bottom:1px solid #edf1f0}
.legend span{display:flex;align-items:center;gap:4px}
.legend i{width:7px;height:7px;border-radius:50%}
.legend .failed{background:#ef6b65}
.legend .returned{background:#8b5cf6}
.legend .canceled{background:#64748b}
.table-wrap{position:relative;overflow:auto;flex:1;min-height:0}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:10px;white-space:nowrap}
th{position:sticky;top:0;z-index:2;background:#f5f8f7;color:#65726f;text-align:left;text-transform:uppercase;letter-spacing:.35px;font-size:8px;padding:8px 9px;border-bottom:1px solid var(--line)}
td{padding:7px 9px;border-bottom:1px solid rgba(202,213,210,.6);max-width:170px;overflow:hidden;text-overflow:ellipsis}
tbody tr{transition:.12s;cursor:default}
tbody tr:hover{filter:brightness(.975);box-shadow:inset 3px 0 var(--teal)}
tr.status-AGUARDANDO{background:#f4f6f8}
tr.status-EM_ROTA{background:#fff5d9}
tr.status-ENTREGUE{background:#e2f6e9}
tr.status-NAO_ENTREGUE{background:#fde8e7}
tr.status-DEVOLVIDA{background:#eee9fe}
tr.status-CANCELADA{background:#e7eaee;color:#5e6874}
.status-pill{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 7px;background:rgba(255,255,255,.65);font-weight:800;font-size:8px}
.status-pill:before{content:"";width:5px;height:5px;background:currentColor;border-radius:50%}
.row-actions{display:flex;gap:3px}
.row-actions button{width:26px;height:24px;border:1px solid rgba(0,0,0,.09);border-radius:5px;background:rgba(255,255,255,.7);cursor:pointer;color:#51615d}
.row-actions .delete-action{color:#b93832;border-color:#efcac7;background:#fff5f4}
.row-actions .history-action{color:#235f9f;border-color:#cddff6;background:#f2f7ff}
.activity-popover{position:fixed;z-index:70;width:min(340px,calc(100vw - 24px));max-height:330px;overflow:auto;padding:13px;background:#fff;border:1px solid #cfded9;border-radius:10px;box-shadow:0 14px 35px rgba(12,42,36,.18);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-4px);transition:opacity .12s,transform .12s}
.activity-popover.visible{opacity:1;visibility:visible;transform:none}
.activity-popover h4{margin:0 0 9px;font-size:12px;color:#17312d}.activity-observation{padding:7px 8px;margin:6px 0;background:#f4f8f7;border-radius:6px;font-size:10px;line-height:1.35}.activity-observation strong{display:block;color:#45615b;font-size:9px;text-transform:uppercase}.activity-observation p{margin:3px 0 0;color:#263a36;white-space:pre-wrap}.activity-list{list-style:none;padding:0;margin:8px 0 0;border-top:1px solid #e4ece9}.activity-list li{padding:7px 0;border-bottom:1px solid #e9efed;font-size:10px}.activity-list strong{display:block;color:#19332e}.activity-list small{display:block;color:#6b7975;margin-top:2px}.activity-list em{display:block;color:#53635f;font-style:normal;margin-top:2px}
.empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);background:#fff}
.empty-state span{font-size:25px}
.empty-state strong{color:var(--ink);margin:5px}
.empty-state p{margin:0;font-size:11px}
.toast{position:fixed;right:20px;bottom:20px;padding:12px 16px;background:#153f3a;color:#fff;border-radius:9px;box-shadow:0 10px 35px rgba(0,0,0,.2);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s;z-index:50}
.toast.show{opacity:1;transform:none}
.toast.error{background:#9f302b}
.modal{position:fixed;inset:0;background:rgba(12,26,23,.45);display:grid;place-items:center;z-index:60}
.modal-card{width:min(390px,90vw);background:#fff;border-radius:14px;padding:24px;text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.25)}
.modal-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#fee7e5;color:#bd3f38;font-weight:800}
.modal-card h3{margin:12px 0 5px}
.modal-card p{color:var(--muted);line-height:1.5}
.modal-card .actions{justify-content:center;margin-top:18px}
.mobile-tabs{display:none}

@media(max-width:1100px){.forms-grid{grid-template-columns:1.25fr .9fr .9fr}
.driver-panel{display:none}
.metrics{gap:0}
.search-box input{min-width:190px}
.filters input[type=date]{display:none}
}

@media(max-width:820px){body{overflow:hidden}
.topbar{height:58px;padding:0 12px}
.metrics{display:none}
.workspace{height:calc(100vh - 58px);padding:8px;grid-template-rows:38% minmax(0,62%)}
.mobile-tabs{display:flex;background:#e7efed;border-radius:8px;padding:3px;gap:3px}
.mobile-tabs button{flex:1;border:0;background:transparent;border-radius:6px;padding:7px;font-size:11px;color:var(--muted)}
.mobile-tabs button.active{background:#fff;color:var(--teal);box-shadow:0 1px 4px rgba(0,0,0,.08);font-weight:700}
.forms-grid{display:block}
.forms-grid .panel{display:none;height:calc(100% - 40px)}
.forms-grid .panel.active{display:block}
.workspace{grid-template-rows:minmax(280px,43%) minmax(0,57%)}
.forms-grid{position:relative}
.mobile-tabs{position:absolute;top:0;left:0;right:0;z-index:3}
.panel{margin-top:42px}
.list-header{align-items:flex-start}
.filters{flex-wrap:wrap;justify-content:flex-end}
.filters select,.filters .btn.ghost{display:none}
.search-box input{min-width:180px}
.legend{overflow:auto}
.login-view{grid-template-columns:1fr}
.login-art{display:none}
.login-card{width:min(420px,88%)}
}

@media(max-height:760px){.workspace{grid-template-rows:minmax(325px,53%) minmax(0,47%)}
.panel{padding:7px 10px}
.panel-title{padding-bottom:5px;margin-bottom:5px}
.panel-title h2{font-size:12px}
.panel-title p{font-size:9px}
.step{width:24px;height:24px;border-radius:7px;font-size:9px}
.compact-form label{margin-bottom:3px;gap:2px;font-size:10px}
.compact-form input,.compact-form select{height:26px;font-size:10px}
.fields{gap:5px}
.compact-form .actions{margin-top:5px}
.btn{height:29px;padding:0 10px;font-size:10px}
.summary-card{min-height:40px;margin-bottom:5px;padding:6px}
.summary-card p,.time-info{font-size:9px}
.btn.full{height:29px}
.driver-list{height:calc(100% - 98px)}
}

.note-check{min-height:12px;color:var(--muted);font-size:9px;font-weight:500}
.note-check.checking{color:#946000}
.note-check.valid{color:#08795d}
.note-check.invalid{color:#b93832;font-weight:700}
.compact-form input:disabled{background:#eef2f1;color:#8a9693;cursor:not-allowed}
.compact-form input.input-invalid{border-color:#c2413a;background:#fff7f6;box-shadow:0 0 0 3px rgba(194,65,58,.1)}
.compact-form input.input-valid{border-color:#14916f;background:#f6fffb}

.auth-choice{display:flex;gap:4px;padding:4px;background:#edf4f2;border-radius:9px;margin:16px 0}
.auth-choice button{flex:1;border:0;background:transparent;border-radius:6px;padding:8px 5px;color:#66736f;font-weight:700;font-size:10px;cursor:pointer}
.auth-choice button.active{background:#fff;color:var(--teal);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.auth-form label{display:grid;gap:6px;font-weight:650;color:#33403d;margin-bottom:12px}
.auth-form input{width:100%;height:40px;border:1px solid #cfdad7;border-radius:8px;padding:0 11px;outline:none}
.auth-form input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(15,118,110,.12)}
.control-select{max-width:155px;height:31px;border:1px solid var(--line);border-radius:7px;background:#f7faf9;padding:0 7px;color:var(--ink);font-size:10px}
.row-actions button:disabled{opacity:.4;cursor:not-allowed}
.settings-card{width:min(680px,94vw);max-height:88vh;overflow:auto;text-align:left}
.settings-heading{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:11px;margin-bottom:12px}
.settings-heading h3{margin:3px 0}
.settings-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:13px 0;border-bottom:1px solid #e9eeec}
.settings-form:last-child{border-bottom:0}
.settings-form h4,.settings-form .share-link,.settings-form .field-hint,.settings-form button{grid-column:1/-1;margin:0}
.settings-form label{display:grid;gap:5px;font-size:11px;font-weight:700;color:#40504c}
.settings-form input,.settings-form select{height:34px;border:1px solid #cfdad7;border-radius:7px;padding:0 9px}
.settings-form .check-label{display:flex;align-items:center;gap:7px}
.share-link{padding:9px;background:#f0f7f5;border-radius:7px;color:#14655e;font-size:10px;word-break:break-all}
.settings-card .icon-btn{font-size:22px}
.settings-form .btn{justify-self:start}
@media(max-width:820px){.control-select{display:none}
.settings-form{grid-template-columns:1fr}
}
