.vehicle-dashboard-root{gap:10px}
.vehicle-dashboard-title{display:flex;align-items:center;justify-content:space-between;gap:8px}
.vehicle-dashboard-title h3{margin:4px 0;font-size:15px}
.vehicle-dashboard-title select{padding:5px;font-size:12px}
.vehicle-km-reminder{background:#fff3cd;border:1px solid #ffe69c;color:#664d03;padding:10px;border-radius:8px;font-size:12px;line-height:1.4}
.vehicle-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.vehicle-summary-card{border:1px solid #ddd;border-radius:10px;padding:10px;background:#fff}
.vehicle-summary-card small{display:block;color:#666;font-size:10px}
.vehicle-summary-card strong{display:block;font-size:15px;margin-top:3px}
.vehicle-chart-box{height:220px;border:1px solid #ddd;border-radius:10px;padding:8px;background:#fff}
.vehicle-add-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;background:#007bff;color:#fff;border:0;padding:11px 13px;font-weight:700}
.vehicle-add-panel{display:none;border:1px solid #dbe7f5;border-top:0;border-radius:0 0 10px 10px;padding:12px;background:var(--report-bg,#f7f9fc)}
.vehicle-add-panel.open{display:block}
.vehicle-add-panel h4{margin:10px 0 0;font-size:13px;color:#007bff}
.vehicle-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vehicle-form-grid label{display:block;font-size:12px;margin-bottom:3px}
.vehicle-button-bottom{display:flex;align-items:flex-end}
.vehicle-button-bottom button{width:100%;background:#007bff;color:#fff;border:0}
.vehicle-info-box{font-size:12px;line-height:1.45;background:var(--report-bg,#f1f1f1);border:1px solid #ddd;border-radius:8px;padding:10px}
.vehicle-help{font-size:11px;color:#666;line-height:1.4;padding-top:20px}
.vehicle-form-actions{display:flex;gap:7px;flex-wrap:wrap}
.vehicle-form-actions button{flex:1}
.vehicle-save-button{background:#28a745;color:#fff;border:0;font-weight:700}
.vehicle-compare-panel{border:1px solid #cfe2ff;background:#f4f8ff;border-radius:10px;padding:10px}
.vehicle-compare-panel .vehicle-form-grid{margin-top:7px}
.vehicle-import-panel{border:1px solid #ddd;border-radius:10px;padding:10px}
.vehicle-import-panel .vehicle-form-grid{margin-top:7px}
.vehicle-import-panel>button{width:100%;margin-top:7px}
.vehicle-import-panel small{display:block;color:#666;margin-top:5px;line-height:1.4}
.vehicle-card-list{display:flex;flex-direction:column;gap:10px}
.vehicle-card{border:1px solid #ddd;border-radius:10px;padding:10px;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.04)}
.vehicle-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.vehicle-card-title{font-weight:700;font-size:14px}
.vehicle-card-sub{font-size:11px;color:#666;line-height:1.35;margin-top:2px}
.vehicle-btn-row{display:flex;gap:6px;flex-wrap:wrap}
.vehicle-btn-row button{font-size:11px;padding:5px 8px}
.vehicle-pill-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.vehicle-pill{font-size:11px;border:1px solid #ddd;border-radius:999px;padding:3px 7px;background:#f8f8f8}
.vehicle-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px}
.vehicle-stat{background:#f7f8fa;border:1px solid #e5e5e5;border-radius:8px;padding:7px;font-size:11px}
.vehicle-stat b{display:block;font-size:12px;margin-top:2px}
.vehicle-card details{margin-top:8px;border-top:1px solid #eee;padding-top:7px}
.vehicle-card summary{cursor:pointer;font-weight:700;font-size:12px;color:#007bff}
.vehicle-action-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px}
.vehicle-action-form textarea{grid-column:1/-1;min-height:48px;border:1px solid #ccc;border-radius:8px;padding:8px 12px;font-family:inherit}
.vehicle-action-form button{grid-column:1/-1}
.vehicle-entry-row{display:flex;justify-content:space-between;gap:8px;padding:7px 0;border-top:1px dashed #ddd;font-size:11px}
.vehicle-positive{color:#198754}
.vehicle-result-box{margin-top:8px;padding:9px;border-radius:8px}
@media(max-width:700px){
  .vehicle-summary{grid-template-columns:1fr 1fr}
  .vehicle-summary-card strong{font-size:13px}
  .vehicle-form-grid,.vehicle-stat-grid,.vehicle-action-form{grid-template-columns:1fr}
  .vehicle-action-form textarea,.vehicle-action-form button{grid-column:auto}
  .vehicle-card-head{display:block}
  .vehicle-btn-row{margin-top:7px}
  .vehicle-btn-row button{flex:1}
  .vehicle-entry-row{display:block}
  .vehicle-entry-row>div:last-child{text-align:left!important;margin-top:5px}
  .vehicle-help{padding-top:0}
}
@media(prefers-color-scheme:dark){
  .vehicle-summary-card,.vehicle-chart-box,.vehicle-card,.vehicle-add-panel{background:#15161a;border-color:#2a2b2f}
  .vehicle-stat{background:#111216;border-color:#2a2b2f}
  .vehicle-compare-panel{background:#101923;border-color:#263e59}
  .vehicle-pill{background:#1a1b1e;border-color:#333;color:#e9e9ea}
  .vehicle-card-sub,.vehicle-help,.vehicle-import-panel small{color:#aaa}
}

/* Smartphone-Sicherheit: Fahrzeugbereich bleibt immer innerhalb des Displays. */
#accVehiclesContent,
#accVehiclesContent .vehicle-dashboard-root,
#accVehiclesContent .vehicle-dashboard-title,
#accVehiclesContent .vehicle-summary,
#accVehiclesContent .vehicle-summary-card,
#accVehiclesContent .vehicle-chart-box,
#accVehiclesContent .vehicle-add-toggle,
#accVehiclesContent .vehicle-add-panel,
#accVehiclesContent .vehicle-compare-panel,
#accVehiclesContent .vehicle-import-panel,
#accVehiclesContent .vehicle-card-list,
#accVehiclesContent .vehicle-card,
#accVehiclesContent .vehicle-card-head,
#accVehiclesContent .vehicle-pill-row,
#accVehiclesContent .vehicle-stat-grid,
#accVehiclesContent .vehicle-action-form,
#accVehiclesContent .vehicle-entry-row,
#accVehiclesContent details,
#accVehiclesContent summary {
    box-sizing:border-box;
    width:100%;
    max-width:100%;
    min-width:0;
}

#accVehiclesContent {
    overflow-x:hidden;
    padding-left:0;
    padding-right:0;
}

#accVehiclesContent * {
    box-sizing:border-box;
    min-width:0;
}

#accVehiclesContent input,
#accVehiclesContent select,
#accVehiclesContent textarea,
#accVehiclesContent button {
    box-sizing:border-box;
    max-width:100%;
}

#accVehiclesContent input[type="file"] {
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
}

#accVehiclesContent canvas {
    display:block;
    width:100%!important;
    max-width:100%!important;
}

#accVehiclesContent .vehicle-card-title,
#accVehiclesContent .vehicle-card-sub,
#accVehiclesContent .vehicle-pill,
#accVehiclesContent .vehicle-stat,
#accVehiclesContent .vehicle-summary-card,
#accVehiclesContent .vehicle-entry-row,
#accVehiclesContent .vehicle-help,
#accVehiclesContent summary {
    overflow-wrap:anywhere;
    word-break:break-word;
    white-space:normal;
}

#accVehiclesContent .vehicle-pill {
    max-width:100%;
}

@media(max-width:700px){
    #accVehiclesContent .vehicle-dashboard-title {
        align-items:stretch;
        flex-direction:column;
    }

    #accVehiclesContent .vehicle-dashboard-title select {
        width:100%;
    }

    #accVehiclesContent .vehicle-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    #accVehiclesContent .vehicle-card,
    #accVehiclesContent .vehicle-add-panel,
    #accVehiclesContent .vehicle-compare-panel,
    #accVehiclesContent .vehicle-import-panel {
        padding:9px;
    }

    #accVehiclesContent .vehicle-chart-box {
        height:200px;
        padding:5px;
    }

    #accVehiclesContent .vehicle-form-actions,
    #accVehiclesContent .vehicle-btn-row {
        width:100%;
    }

    #accVehiclesContent .vehicle-form-actions button,
    #accVehiclesContent .vehicle-btn-row button {
        width:100%;
        flex:1 1 100%;
    }
}

@media(max-width:420px){
    #accVehiclesContent .vehicle-summary {
        grid-template-columns:1fr;
    }

    #accVehiclesContent .vehicle-summary-card {
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
    }

    #accVehiclesContent .vehicle-summary-card small,
    #accVehiclesContent .vehicle-summary-card strong {
        margin:0;
    }

    #accVehiclesContent .vehicle-summary-card strong {
        text-align:right;
    }

    #accVehiclesContent .vehicle-chart-box {
        height:180px;
    }
}


.vehicle-cost-help {
    width:100%;
    margin:8px 0 12px;
    padding:9px 10px;
    border:1px solid #cfe2ff;
    border-radius:9px;
    background:#f3f8ff;
    font-size:11px;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.vehicle-cost-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}

.vehicle-cost-buttons button {
    min-height:38px;
    font-weight:700;
}

.vehicle-cost-edit-btn {
    background:#0878d1;
    color:#fff;
    border:0;
}

.vehicle-credit-open-btn {
    background:#198754;
    color:#fff;
    border:0;
}

.vehicle-delete-btn {
    background:#dc3545;
    color:#fff;
    border:0;
}

@media(max-width:700px) {
    .vehicle-cost-buttons {
        display:grid !important;
        grid-template-columns:1fr !important;
        width:100% !important;
    }

    .vehicle-cost-buttons button {
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
    }
}

@media(prefers-color-scheme:dark) {
    .vehicle-cost-help {
        background:#101923;
        border-color:#29496b;
    }
}
