@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root {
  --bg:#0f0f13; --surface:#1a1a22; --surface2:#22222e; --border:#2e2e3e;
  --accent:#4f8ef7; --accent2:#7c6af7; --green:#3ecf8e; --red:#f7604f;
  --text:#e8e8f0; --muted:#6b6b80; --label:#9898b0;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Manrope',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;}

/* Nav */
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg);z-index:10;}
.nav-back{width:36px;height:36px;background:var(--surface);border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--label);font-size:18px;transition:all .15s;flex-shrink:0;}
.nav-back:hover{background:var(--surface2);color:var(--text);}
.nav-title{font-size:15px;font-weight:700;letter-spacing:.01em;text-align:center;flex:1;padding:0 8px;}
.nav-lang{font-size:12px;font-weight:700;color:var(--accent);background:rgba(79,142,247,.12);border:1px solid rgba(79,142,247,.25);border-radius:8px;padding:4px 10px;cursor:pointer;transition:all .15s;user-select:none;flex-shrink:0;}
.nav-lang:hover{background:rgba(79,142,247,.2);}

/* Screens */
.screen{display:none;padding:20px;animation:fadeUp .2s ease;}
.screen.active{display:block;}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* Home */
.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.menu-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px 16px;cursor:pointer;transition:all .15s;position:relative;overflow:hidden;}
.menu-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;opacity:0;transition:opacity .15s;}
.menu-card:hover{background:var(--surface2);transform:translateY(-1px);}
.menu-card:hover::before{opacity:1;}
.menu-card.fuel::before{background:linear-gradient(90deg,var(--accent),var(--accent2));}
.menu-card.warehouse::before{background:linear-gradient(90deg,var(--green),#2ab87a);}
.menu-card.vehicle::before{background:linear-gradient(90deg,#f7a34f,#f7604f);}
.menu-card.announce::before{background:linear-gradient(90deg,var(--accent2),#c46af7);}
.menu-icon{font-size:28px;margin-bottom:10px;}
.menu-label{font-size:13px;font-weight:700;line-height:1.3;}
.menu-sub{font-size:11px;color:var(--muted);margin-top:3px;}

/* Forms */
.form-section{margin-bottom:24px;}
.form-section-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}
.field{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:4px;transition:border-color .15s;}
.field:focus-within{border-color:var(--accent);}
.field.error{border-color:var(--red) !important;}
.field-label{font-size:11px;font-weight:600;color:var(--label);margin-bottom:6px;text-transform:uppercase;letter-spacing:.05em;}
.field input,.field select,.field textarea{width:100%;background:transparent;border:none;outline:none;font-family:'Manrope',sans-serif;font-size:15px;font-weight:500;color:var(--text);}
.field select option{background:#1a1a22;}
.field textarea{resize:none;height:72px;line-height:1.5;}
input::placeholder,textarea::placeholder{color:var(--muted);}
.field-err{font-size:11px;font-weight:600;color:var(--red);margin-bottom:8px;padding-left:2px;display:none;}
.field-err.show{display:block;}

/* Chips */
.chip-group{display:flex;gap:8px;flex-wrap:wrap;}
.chip{padding:7px 14px;border-radius:20px;border:1.5px solid var(--border);font-size:13px;font-weight:600;cursor:pointer;transition:all .12s;background:var(--surface);color:var(--label);}
.chip.selected{border-color:var(--accent);background:rgba(79,142,247,.12);color:var(--accent);}
.chip.chip-add{border-style:dashed;color:var(--accent);border-color:rgba(79,142,247,.4);background:transparent;}
.chip.chip-add:hover{background:rgba(79,142,247,.08);}

/* Search list */
.vehicle-search{width:100%;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:10px 13px;margin-bottom:8px;font-family:'Manrope',sans-serif;font-size:14px;color:var(--text);outline:none;transition:border-color .15s;}
.vehicle-search:focus{border-color:var(--accent);}
.vehicle-search::placeholder{color:var(--muted);}
.vehicle-list{display:flex;flex-direction:column;gap:5px;max-height:182px;overflow-y:auto;}
.vehicle-item{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:9px;background:var(--surface2);border:1.5px solid transparent;cursor:pointer;transition:all .12s;}
.vehicle-item:hover{border-color:var(--border);}
.vehicle-item.sel{border-color:var(--accent);background:rgba(79,142,247,.1);}
.vi-inner{display:flex;flex-direction:column;gap:1px;}
.vi-name{font-size:13px;font-weight:700;}
.vi-plate{font-size:11px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;}
.vi-check{color:var(--accent);font-size:15px;font-weight:700;}
.v-last-tag{display:inline-block;font-size:9px;font-weight:700;color:var(--accent);background:rgba(79,142,247,.15);border-radius:4px;padding:1px 5px;margin-bottom:2px;letter-spacing:.04em;text-transform:uppercase;}

/* Add well */
.add-well-form{display:flex;gap:6px;margin-top:8px;}
.add-well-inp{flex:1;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:9px 11px;font-family:'Manrope',sans-serif;font-size:13px;color:var(--text);outline:none;transition:border-color .15s;min-width:0;}
.add-well-inp:focus{border-color:var(--accent);}
.add-well-inp::placeholder{color:var(--muted);}
.add-well-btn{background:var(--accent);border:none;border-radius:10px;padding:9px 14px;font-family:'Manrope',sans-serif;font-size:13px;font-weight:700;color:#fff;cursor:pointer;white-space:nowrap;flex-shrink:0;}

/* Verificators */
.verif-list{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.verif-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--surface);border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s;}
.verif-item:last-child{border-bottom:none;}
.verif-item:hover{background:var(--surface2);}
.verif-item.sel{background:rgba(79,142,247,.08);}
.verif-name{font-size:13px;font-weight:600;flex:1;color:var(--text);}
.verif-check{color:var(--accent);font-size:15px;font-weight:700;flex-shrink:0;}

/* Warehouse location tabs */
.wh-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.wh-tab{padding:7px 14px;border-radius:20px;border:1.5px solid var(--border);font-size:13px;font-weight:600;cursor:pointer;transition:all .12s;background:var(--surface);color:var(--label);}
.wh-tab.sel{border-color:var(--accent);background:rgba(79,142,247,.12);color:var(--accent);}

/* Chemical item rows */
.chem-list{display:flex;flex-direction:column;gap:6px;margin-bottom:10px;}
.chem-row{display:flex;align-items:center;gap:6px;background:var(--surface2);border-radius:10px;padding:8px 10px;border:1.5px solid var(--border);}
.chem-name-wrap{flex:1;position:relative;min-width:0;}
.chem-name-inp{width:100%;background:transparent;border:none;outline:none;font-family:'Manrope',sans-serif;font-size:13px;font-weight:600;color:var(--text);}
.chem-name-inp::placeholder{color:var(--muted);}
.chem-qty-inp{width:54px;background:var(--surface);border:1px solid var(--border);border-radius:7px;padding:5px 6px;font-family:'Manrope',sans-serif;font-size:13px;font-weight:600;color:var(--text);text-align:right;outline:none;}
.chem-unit-lbl{font-size:11px;font-weight:700;color:var(--muted);min-width:22px;text-align:center;flex-shrink:0;}
.chem-del{width:26px;height:26px;border-radius:6px;border:none;background:rgba(247,96,79,.12);color:var(--red);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1;padding-bottom:1px;}
/* Chemical autocomplete dropdown */
.chem-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--surface);border:1px solid var(--border);border-radius:10px;z-index:50;box-shadow:0 8px 24px rgba(0,0,0,.4);overflow:hidden;max-height:180px;overflow-y:auto;}
.chem-opt{padding:9px 12px;font-size:13px;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background .1s;}
.chem-opt:hover{background:var(--surface2);}
.chem-opt-unit{font-size:11px;font-weight:700;color:var(--muted);}

/* Photo */
.photo-upload{background:var(--surface);border:1.5px dashed var(--border);border-radius:12px;padding:28px 16px;text-align:center;cursor:pointer;transition:all .15s;}
.photo-upload:hover{border-color:var(--accent);background:var(--surface2);}
.photo-upload-icon{font-size:32px;margin-bottom:8px;}
.photo-upload-text{font-size:13px;font-weight:600;color:var(--label);}
.photo-upload-sub{font-size:11px;color:var(--muted);margin-top:3px;}
.photo-preview{width:100%;border-radius:10px;margin-top:10px;display:none;}
.lost-link{text-align:center;margin-top:10px;font-size:12px;color:var(--muted);cursor:pointer;text-decoration:underline;}
.lost-notice{background:rgba(247,96,79,.07);border:1px solid rgba(247,96,79,.2);border-radius:10px;padding:10px 14px;margin-top:8px;font-size:13px;color:var(--red);display:none;}

/* Submit */
.submit-btn{width:100%;padding:16px;border-radius:14px;border:none;font-family:'Manrope',sans-serif;font-size:15px;font-weight:800;cursor:pointer;letter-spacing:.02em;transition:all .15s;margin-top:8px;}
.submit-btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;}
.submit-btn.primary:hover{opacity:.9;transform:translateY(-1px);}

/* Toast (non-blocking error display) */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#2a1a1a;border:1px solid rgba(247,96,79,.4);border-radius:12px;padding:12px 20px;font-size:13px;font-weight:600;color:var(--red);z-index:100;opacity:0;transition:opacity .2s;pointer-events:none;max-width:88vw;text-align:center;}
.toast.show{opacity:1;}

/* Bot preview */
.tg-chat{background:#0e1621;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;}
.tg-bubble{background:#182533;border-radius:12px 12px 12px 4px;padding:11px 13px;max-width:88%;}
.tg-sender{font-size:11px;font-weight:700;color:var(--accent);margin-bottom:5px;}
.tg-text{font-size:13px;line-height:1.55;color:#cdd3dc;}
.tg-text b{color:#e8edf3;font-weight:700;}
.tg-photo-thumb{width:100%;height:90px;background:#1d2b3a;border-radius:8px;margin-top:8px;display:flex;align-items:center;justify-content:center;font-size:22px;color:#4a6a88;}
.tg-keyboard{display:flex;gap:5px;margin-top:5px;}
.tg-kb{flex:1;padding:9px 6px;background:#182533;border:1px solid #253648;border-radius:6px;font-size:12px;font-weight:700;color:#cdd3dc;cursor:pointer;text-align:center;transition:all .12s;}
.tg-kb:hover{background:#1e3448;}
.tg-kb.done-approve{background:rgba(62,207,142,.12);color:var(--green);border-color:rgba(62,207,142,.25);pointer-events:none;}
.tg-kb.done-reject{background:rgba(247,96,79,.12);color:var(--red);border-color:rgba(247,96,79,.25);pointer-events:none;}
.tg-ts{font-size:10px;color:#4a6a88;text-align:right;margin-top:5px;}

/* Vehicle info screen */
.vi-hero{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px;display:flex;align-items:center;gap:16px;}
.vi-hero-icon{width:56px;height:56px;border-radius:14px;background:rgba(247,163,79,.1);border:1px solid rgba(247,163,79,.2);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;}
.vi-hero-name{font-size:18px;font-weight:800;}
.vi-hero-plate{font-size:13px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-top:3px;font-weight:600;}
.info-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;overflow:hidden;margin-bottom:16px;}
.info-row{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border-bottom:1px solid var(--border);}
.info-row:last-child{border-bottom:none;}
.info-key{font-size:12px;color:var(--muted);font-weight:600;}
.info-val{font-size:13px;font-weight:700;text-align:right;max-width:60%;word-break:break-all;}
.doc-row{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border-bottom:1px solid var(--border);}
.doc-row:last-child{border-bottom:none;}
.doc-left{display:flex;flex-direction:column;gap:2px;}
.doc-name{font-size:13px;font-weight:700;}
.doc-exp{font-size:11px;color:var(--muted);}
.doc-exp.warn{color:#f7a34f;}
.doc-exp.bad{color:var(--red);}
.doc-dl{font-size:12px;font-weight:700;color:var(--accent);background:rgba(79,142,247,.1);border:1px solid rgba(79,142,247,.2);border-radius:7px;padding:4px 10px;cursor:pointer;text-decoration:none;white-space:nowrap;flex-shrink:0;}

/* Success */
.success-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center;}
.success-icon{width:72px;height:72px;background:rgba(62,207,142,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;margin-bottom:20px;border:2px solid rgba(62,207,142,.3);}
.success-title{font-size:20px;font-weight:800;margin-bottom:8px;}
.success-sub{font-size:13px;color:var(--muted);line-height:1.6;}
