*{box-sizing:border-box} :root{--ink:#172033;--muted:#667085;--line:#e4e7ec;--paper:#f5f7fa;--accent:#163d66;--white:#fff} body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:var(--accent)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px max(20px,calc((100% - 1200px)/2));background:#102b47;color:#fff}.topbar strong{font-size:19px;letter-spacing:.06em}.topbar span{margin-left:14px;color:#d0d9e4}.topbar a{color:#fff}.container{max-width:1200px;margin:26px auto;padding:0 18px}.hero{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px;border-radius:18px;background:linear-gradient(125deg,#173e63,#275d83);color:#fff;margin-bottom:20px}.hero h1{font-size:30px;margin:0}.hero p{margin:6px 0 0;color:#e0eaf3}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:700}.stats{display:flex;flex-wrap:wrap;gap:10px}.stats div{min-width:86px;padding:13px;background:#ffffff1b;border:1px solid #ffffff35;border-radius:12px;text-align:center}.stats strong,.stats span{display:block}.stats strong{font-size:25px}.stats span{font-size:12px;color:#e0eaf3}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;margin-bottom:18px;min-width:0}.panel h2{margin:0 0 14px;font-size:19px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.wide-panel{grid-column:1/-1}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:650;color:#344054}.wide{grid-column:1/-1}input,select,textarea{width:100%;border:1px solid #cfd5df;border-radius:9px;background:#fff;padding:10px 11px;font:inherit;color:var(--ink);min-width:0}input:focus,select:focus,textarea:focus{outline:2px solid #a7c5e2;border-color:#4a7ca7}button{border:0;border-radius:9px;background:var(--accent);color:#fff;padding:12px 15px;font:inherit;font-weight:700;cursor:pointer}button:hover{filter:brightness(1.1)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:top}th{background:#f8fafc;color:#475467;white-space:nowrap}small,.muted{color:var(--muted)}.success,.alert{padding:12px 14px;border-radius:10px;margin:0 0 16px}.success{background:#e9f7ef;color:#17663a}.alert{background:#fff0ef;color:#9c2520}.auth-card{max-width:420px;margin:9vh auto;padding:30px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 40px #1720330c}.auth-card h1{margin:0;font-size:27px;letter-spacing:.07em}.auth-card form{display:grid;gap:15px;margin:22px 0}.auth-card .muted{font-size:12px}footer{padding:20px 0;color:var(--muted);font-size:12px}@media(max-width:760px){.topbar{align-items:flex-start;flex-direction:column}.hero{align-items:flex-start;flex-direction:column;padding:22px}.stats{width:100%}.stats div{flex:1;min-width:0}.grid{grid-template-columns:1fr}.wide-panel{grid-column:auto}.panel{padding:17px}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}.container{margin:16px auto;padding:0 12px}.hero h1{font-size:26px}}

.search-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.search-form input{flex:1;min-width:220px}.clear-search,.edit-link{white-space:nowrap;font-weight:700}.edit-link{color:#163d66}

.actions{white-space:nowrap;min-width:130px}.inline-delete{display:inline-block;margin-left:7px}.delete-button{background:#a52828;padding:7px 9px;font-size:12px;border-radius:7px}.delete-button:hover{background:#801d1d}

/* Einheitliche HY-SPEED-Aktionsbuttons */
.action-button{display:inline-flex;align-items:center;justify-content:center;padding:8px 11px;border:1px solid transparent;border-radius:7px;text-decoration:none!important;font-size:12px;font-weight:700;line-height:1.25;white-space:nowrap;cursor:pointer;transition:filter .15s,transform .15s}
.action-button:hover,.delete-button:hover{filter:brightness(.94);transform:translateY(-1px)}
.view-button{background:#3b6df0;color:#fff!important}
.edit-button{background:#238443;color:#fff!important}
.storage-button{background:#244b70;color:#fff!important}
.delete-button{display:inline-flex;align-items:center;justify-content:center;padding:8px 11px;border:1px solid transparent;border-radius:7px;background:#bd1e35;color:#fff;font:inherit;font-size:12px;font-weight:700;line-height:1.25;cursor:pointer}


/* HY-SPEED – verbindliches, seitenübergreifendes Button-Design */
:root{--hy-blue:#3b6df0;--hy-green:#238443;--hy-red:#bd1e35;--hy-neutral:#64748b}
button:not(.delete-button):not(.edit-button):not(.secondary),a.action-button,a.action-btn,a.btn,a.btn-action,button.action-button,button.action-btn,button.btn,button.btn-action,
button.view-button,button.edit-button,button.delete-button,button.storage-button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 min-height:34px!important;padding:8px 12px!important;border:1px solid transparent!important;
 border-radius:7px!important;font:inherit!important;font-size:12px!important;font-weight:700!important;
 line-height:1.25!important;text-decoration:none!important;white-space:nowrap;cursor:pointer!important;
 box-shadow:none!important;transition:filter .15s,transform .15s!important
}
button,a.action-button,a.action-btn,a.btn,a.btn-action{background:var(--hy-blue);color:#fff!important}
a.view-button,button.view-button,.action-blue,.action-btn.action-blue,.view-button{background:var(--hy-blue)!important;color:#fff!important}
a.edit-button,button.edit-button,.action-green,.action-btn.action-green,.btn-edit{background:var(--hy-green)!important;color:#fff!important}
a.delete-button,button.delete-button,.action-red,.action-btn.action-red{background:var(--hy-red)!important;color:#fff!important}
a.storage-button,button.storage-button{background:#244b70!important;color:#fff!important}
a.secondary,button.secondary,a.btn.secondary,button.btn.secondary,.action-outline,.action-btn.action-outline,.clear-search,.back{
 background:var(--hy-neutral)!important;color:#fff!important
}
a.action-button:hover,a.action-btn:hover,a.btn:hover,a.btn-action:hover,button.action-button:hover,button.action-btn:hover,button.btn:hover,button.btn-action:hover{filter:brightness(.94)!important;transform:translateY(-1px)}
button.delete-button{background:var(--hy-red)!important;color:#fff!important}
.dashboard-hints{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}
.hint-panel{min-width:0;margin-bottom:0}
.hint-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.hint-heading h2{margin:0 0 10px}
.hint-panel .table-wrap{overflow-x:auto}
.hint-panel table{min-width:580px}
.hint-panel .seasonal-hint{padding:10px 12px;border-radius:8px;background:#fff0d6;color:#7c4300}
.service-hint-panel{border-color:#c9d9ed}
.tire-hint-panel{border-color:#f0c36d;background:#fffaf0}
@media(max-width:900px){.dashboard-hints{grid-template-columns:1fr}}

button:not(.delete-button):not(.edit-button):not(.secondary){background:var(--hy-blue)!important;color:#fff!important;border:1px solid transparent!important;border-radius:7px!important;font-weight:700!important}


/* Dashboard-Anordnung nach Arbeitsablauf */
.grid.dashboard-grid{grid-template-areas:"customerform vehicleform" "serviceform vehicleform" "tireform tireform" "servicehistory servicehistory" "tirehistory tirehistory"}
.grid.dashboard-grid .tire-form-panel{grid-area:tireform;grid-column:1/-1}
@media(max-width:900px){.grid.dashboard-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"customerform" "vehicleform" "serviceform" "tireform" "servicehistory" "tirehistory"}.grid.dashboard-grid .tire-form-panel{grid-column:auto}}
/* Zwei gleich hohe, gut erkennbare Hinweisbereiche */
.dashboard-hints{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch;margin:18px 0}
.dashboard-hints .hint-panel{height:100%;min-height:340px;display:flex;flex-direction:column;min-width:0}
.dashboard-hints .hint-panel .table-wrap{flex:1;max-height:230px;overflow:auto}
.dashboard-hints .hint-panel table{min-width:600px}
.dashboard-hints .hint-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dashboard-hints .hint-heading h2{margin:0 0 10px}
.dashboard-hints .service-hint-panel{background:#edf5ff;border:1px solid #b8d3f0}
.dashboard-hints .service-hint-panel h2{color:#174a78}
.dashboard-hints .tire-hint-panel{background:#fff8e6;border:1px solid #f0c36d}
.dashboard-hints .tire-hint-panel h2{color:#874600}
.dashboard-hints .more-hints{margin-top:auto;padding-top:12px;font-size:13px;font-weight:650}
@media(max-width:900px){.dashboard-hints{grid-template-columns:1fr}.dashboard-hints .hint-panel{min-height:0}}

/* Einheitliche feste Breiten für Aktionsbuttons in Service- und Reifenwechsel-Tabellen */
td.actions .view-button { width: 108px; min-width: 108px; }
td.actions .edit-button { width: 70px; min-width: 70px; }
td.actions .delete-button { width: 58px; min-width: 58px; }
td.actions .inline-delete { display: inline-block; vertical-align: middle; }

/* Fahrzeugformular über beide linken Formularzeilen strecken:
   Unterkante bündig mit dem Serviceformular ausrichten. */
@media (min-width: 901px) {
  .grid.dashboard-grid > .panel.vehicle-form-panel {
    align-self: stretch;
    height: auto;
    min-height: 0;
    box-sizing: border-box;
  }
}

/* Aktionsbuttons der letzten Serviceeinträge rechtsbündig wie bei Reifenwechseln */
.service-history-panel td.actions {
    text-align: right;
    padding-right: 14px;
}

/* Aktionsbuttons in beiden Dashboard-Verlaufslisten exakt rechtsbündig */
.service-history-panel td.actions,
.tire-history-panel td.actions {
    text-align: right;
    padding-right: 14px;
}

/* HY-SPEED: einheitliche Aktionsbuttons */
a.action-button, a.action-btn, .action-btn, a.btn, button.btn,
button.action-button, button.action-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:34px; padding:8px 12px; border:0; border-radius:6px;
  font:inherit; font-size:13px; font-weight:600; line-height:1.2;
  text-decoration:none!important; cursor:pointer; box-sizing:border-box;
  vertical-align:middle; white-space:nowrap;
}
a.view-button, .action-blue, .btn-view {background:#3b66e8!important;color:#fff!important}
a.edit-button, .action-green, .btn-edit {background:#218838!important;color:#fff!important}
a.delete-button, button.delete-button, .action-red, .btn-delete {background:#c82333!important;color:#fff!important}
a.neutral-button, .action-outline, .btn-neutral, a.btn.secondary, button.btn.secondary {background:#64748b!important;color:#fff!important}
a.action-button:hover, a.action-btn:hover, a.btn:hover, button.btn:hover {filter:brightness(.94)}
/* Einheitliches Suchfeld-Layout für Kategorien und Lager */
.category-search {display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0 18px}
.category-search input[type=search] {flex:1;min-width:220px;min-height:38px;padding:9px 12px;border:1px solid #cbd5e1;border-radius:7px;font:inherit;box-sizing:border-box}
.category-search button {min-height:38px;padding:9px 16px;border:0;border-radius:6px;background:#3b66e8;color:#fff;font-weight:600;cursor:pointer}
.search-form {display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search-form input {flex:1;min-width:220px}

/* Spezifische Priorität für farbige .btn-Varianten gegenüber dem Basislink */
a.btn.btn-view, button.btn.btn-view {background:#3b66e8!important;color:#fff!important}
a.btn.btn-edit, button.btn.btn-edit {background:#218838!important;color:#fff!important}
a.btn.btn-delete, button.btn.btn-delete {background:#c82333!important;color:#fff!important}
a.btn.btn-neutral, button.btn.btn-neutral {background:#64748b!important;color:#fff!important}

/* Dashboard: searchable customer and vehicle selectors */
.dashboard-select-search{width:100%;margin:5px 0 7px;box-sizing:border-box}
.dashboard-select-search::placeholder{color:#7b8798}

/* Dashboard-Kachel Lagerfahrzeuge – optisch passend zu den bestehenden Kennzahlen */
.stats a.lagerfahrzeug-stat{
  min-width:86px;padding:13px;background:#ffffff1b;border:1px solid #ffffff35;
  border-radius:12px;text-align:center;color:#fff;text-decoration:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.stats a.lagerfahrzeug-stat strong,.stats a.lagerfahrzeug-stat span{display:block}
.stats a.lagerfahrzeug-stat strong{font-size:25px;line-height:1.2}
.stats a.lagerfahrzeug-stat span{font-size:12px;color:#e0eaf3}
.stats a.lagerfahrzeug-stat:hover{background:#ffffff2b;filter:none}
@media(max-width:760px){.stats a.lagerfahrzeug-stat{flex:1;min-width:0}}

/* Alle vier Dashboard-Kennzahlen sind als gleich gestaltete Kacheln anklickbar */
.stats a.hero-stat-link{
  min-width:86px;padding:13px;background:#ffffff1b;border:1px solid #ffffff35;
  border-radius:12px;text-align:center;color:#fff;text-decoration:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transition:background .15s,transform .15s;
}
.stats a.hero-stat-link strong{display:block;font-size:25px;line-height:1.2}
.stats a.hero-stat-link span{display:block;font-size:12px;color:#e0eaf3}
.stats a.hero-stat-link:hover{background:#ffffff2b;transform:translateY(-1px);filter:none}
@media(max-width:760px){.stats a.hero-stat-link{flex:1 1 calc(33.333% - 10px);min-width:0}}

/* Separater Kunden-Speichern-Button in Ankauf und Verkauf */
.customer-save-row{display:flex;align-items:center;gap:12px;margin:12px 0 22px;flex-wrap:wrap}
.customer-save-btn{background:#198754!important;color:#fff!important;font-weight:700}
.customer-save-btn:disabled{opacity:.65;cursor:wait}
.customer-save-message{font-size:14px;font-weight:600}
.customer-save-message.success{color:#167344}
.customer-save-message.error{color:#b42318}