/* Existing VeLog artwork, dark red actions and charcoal text. */
.shell[data-app="velog"] { --accent:#9b0000; --deep:#202124; --soft:#f6f6f7; --accent-soft:#fce9e9; }
.shell[data-app="velog"] .sidebar { background-image:url('/assets/velog/nav-web.webp'); background-color:#1f2023; }
.shell[data-app="velog"] .main { min-width:0; background:#f6f6f7; color:#24262b; }
.shell[data-app="velog"] .topbar { background:#fff; color:#24262b; border-color:#dedfe3; }
.shell[data-app="velog"] .tenant-select { background:#fff; color:#24262b; border-color:#cdd0d5; }
.shell[data-app="velog"] .content { padding:30px clamp(20px,3vw,44px) 90px; }
.vl-app,.vl-dialog { --vl-line:#dedfe3; --vl-muted:#5c626d; font:14px/1.6 Lexend,Arial,sans-serif; color:#24262b; }
.vl-app *,.vl-dialog * { box-sizing:border-box; }
.vl-app :is(h2,h3,p),.vl-dialog :is(h2,h3,p) { margin:0; }
.vl-header { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:30px; }
.vl-eyebrow { color:#9b0000; font-size:10px; font-weight:700; letter-spacing:1.5px; margin-bottom:9px!important; }
.vl-header h2 { font-size:clamp(28px,3vw,36px); letter-spacing:-.7px; line-height:1.2; }
.vl-header p:not(.vl-eyebrow) { color:var(--vl-muted); margin-top:10px; }
.vl-actions { display:flex; flex-wrap:wrap; gap:9px; }
.vl-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border:1px solid #cbd0d7; border-radius:10px; background:#fff; color:#33363d; font:600 13px/1.4 Lexend,Arial,sans-serif; cursor:pointer; }
.vl-button:hover { background:#f0f1f3; border-color:#aeb4bf; }
.vl-button.vl-primary { background:#9b0000; border-color:#9b0000; color:#fff; }
.vl-button.vl-primary:hover { background:#7c0000; border-color:#7c0000; }
.vl-button:disabled { opacity:.5; cursor:default; }
.vl-app :is(input,button,summary):focus-visible,.vl-dialog :is(input,select,button):focus-visible { outline:3px solid #c95454; outline-offset:3px; }
.vl-toolbar { display:flex; align-items:flex-end; gap:24px; padding:20px; border:1px solid var(--vl-line); border-radius:14px; background:#fff; margin-bottom:25px; }
.vl-search { display:grid; gap:7px; flex:1; max-width:500px; font-size:12px; font-weight:600; }
.vl-search input,.vl-field input,.vl-field select { min-height:46px; min-width:0; width:100%; padding:11px 12px; border:1px solid #cbd0d7; border-radius:9px; background:#fff; color:#24262b; font:14px/1.5 Lexend,Arial,sans-serif; }
.vl-check { display:flex; align-items:center; gap:10px; min-height:46px; font-size:13px; }
.vl-check input { width:19px; height:19px; margin:0; accent-color:#9b0000; }
.vl-result-count { color:var(--vl-muted); font-size:12px; margin-bottom:12px!important; }
.vl-vehicles { display:grid; grid-template-columns:repeat(auto-fill,minmax(275px,1fr)); gap:18px; }
.vl-vehicle { padding:22px; border:1px solid var(--vl-line); border-radius:15px; background:#fff; min-width:0; }
.vl-vehicle-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:22px; flex-wrap:wrap; }
.vl-plate { display:inline-flex; min-height:39px; align-items:center; padding:6px 11px; border:1.5px solid #33363d; border-radius:5px; color:#202124; font:700 19px/1.2 ui-monospace,monospace; letter-spacing:.6px; overflow-wrap:anywhere; max-width:100%; }
.vl-state { display:inline-block; padding:4px 9px; border-radius:6px; background:#f0f1f3; color:#626975; font-size:11px; font-weight:600; }
.vl-state.is-active { background:#edf5ef; color:#24603b; }
.vl-state.is-maintenance { background:#fff3db; color:#85570c; }
.vl-vehicle h3 { font-size:17px; font-weight:600; line-height:1.4; margin-bottom:10px; overflow-wrap:anywhere; }
.vl-seats { color:#555c67; font-size:13px; }
.vl-seats strong { color:#262a31; font-weight:600; }
.vl-seats span { display:block; font-size:11px; margin-top:3px; }
.vl-vehicle-subtitle { color:var(--vl-muted); font-size:12px; margin-bottom:14px!important; overflow-wrap:anywhere; }
.vl-odometer { margin-top:10px!important; font-size:12px; color:var(--vl-muted); }
.vl-references { border-top:1px solid var(--vl-line); margin-top:22px; padding-top:13px; color:var(--vl-muted); font-size:11px; }
.vl-references summary { cursor:pointer; font-weight:600; padding:5px 0; }
.vl-references dl { display:grid; grid-template-columns:90px minmax(0,1fr); gap:7px 10px; margin:12px 0 0; }
.vl-references dt { font-weight:600; }
.vl-references dd { margin:0; overflow-wrap:anywhere; }
.vl-empty { display:grid; place-items:center; gap:12px; text-align:center; padding:50px 24px; border:1px dashed #cdd0d8; border-radius:15px; background:#fff; }
.vl-empty strong { font-size:18px; font-weight:600; }
.vl-empty p { max-width:540px; color:var(--vl-muted); }
.vl-footnote { color:var(--vl-muted); font-size:12px; line-height:1.8; margin-top:25px!important; max-width:780px; }
.vl-dialog { width:min(610px,calc(100vw - 40px)); max-height:calc(100dvh - 60px); border:1px solid var(--vl-line); padding:0; border-radius:18px; background:#fff; box-shadow:0 24px 90px #18243440; }
.vl-dialog::backdrop { background:rgba(28,29,33,.55); backdrop-filter:blur(3px); }
.vl-dialog-head { position:sticky; top:0; display:flex; align-items:center; justify-content:space-between; gap:15px; background:#fff; border-bottom:1px solid var(--vl-line); padding:20px 24px; }
.vl-dialog-head h2 { font-size:20px; }
.vl-dialog form { display:grid; gap:20px; padding:24px; }
.vl-field { display:grid; gap:7px; font-size:13px; font-weight:600; }
.vl-form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.vl-note { background:#f4f4f6; border-radius:9px; padding:13px 15px; font-size:12px; color:var(--vl-muted); }
.vl-form-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:9px; border-top:1px solid var(--vl-line); padding-top:17px; }
[data-vl-error]:empty { display:none; }
[data-vl-error]:not(:empty) { color:#8c1f1f; background:#fff0f0; border:1px solid #efcbcb; border-radius:9px; padding:12px 14px; font-size:13px; }
@media(min-width:901px) { [dir="rtl"] .shell[data-app="velog"] .sidebar { left:auto!important; right:0!important; } }
@media(max-width:1100px) { .vl-header { align-items:flex-start; flex-direction:column; gap:18px; } }
@media(max-width:900px) {
  .shell[data-app="velog"] .topbar { flex-wrap:wrap; }
  .shell[data-app="velog"] .master-preview-switch { flex-basis:100%; flex-wrap:wrap; }
  .shell[data-app="velog"] .master-preview-switch button { min-height:44px; }
  .shell[data-app="velog"] .content { padding:24px 18px 145px!important; }
  .shell[data-app="velog"] .sidebar { height:calc(64px + env(safe-area-inset-bottom))!important; padding-bottom:env(safe-area-inset-bottom)!important; }
  body:has(.shell[data-app="velog"])>.global-info-cluster { left:0!important; right:0!important; bottom:calc(64px + env(safe-area-inset-bottom))!important; transform:none!important; width:100%!important; height:56px!important; padding:6px 64px!important; background:#f6f6f7!important; border-top:1px solid #dedfe3!important; z-index:31!important; }
  body:has(.shell[data-app="velog"]) :is(.global-dsgvo-link,.global-info-menu>summary,.global-mobile-language) { width:44px!important; height:44px!important; min-width:44px!important; min-height:44px!important; }
  body:has(.shell[data-app="velog"]) .system-applex-slot { position:fixed!important; left:10px!important; bottom:calc(70px + env(safe-area-inset-bottom))!important; width:44px!important; height:44px!important; }
  body:has(.shell[data-app="velog"]) .system-help-launcher { position:fixed!important; right:10px!important; bottom:calc(70px + env(safe-area-inset-bottom))!important; width:44px!important; height:44px!important; min-height:44px!important; }
  body:has(.shell[data-app="velog"]) .system-help-mobile-icon,body:has(.shell[data-app="velog"]) .system-help-mobile-icon>img { width:42px!important; height:42px!important; }
}
@media(max-width:620px) {
  .vl-toolbar { align-items:stretch; flex-direction:column; gap:9px; padding:16px; }
  .vl-vehicles { grid-template-columns:minmax(0,1fr); }
  .vl-search { max-width:none; }
  .vl-search input,.vl-field input,.vl-field select { font-size:16px; }
  .vl-dialog { width:100%; max-width:100%; max-height:92dvh; margin:auto 0 0; border-radius:20px 20px 0 0; border:0; }
  .vl-dialog-head { padding:17px 18px; }
  .vl-dialog form { padding:20px 18px max(24px,env(safe-area-inset-bottom)); }
  .vl-form-row { grid-template-columns:minmax(0,1fr); }
  .vl-form-actions .vl-button { flex:1; }
}
