/* css/vehicles.css - Tmavý motiv pro vozový park */

/* --- OBECNÉ STYLY TABULEK --- */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    margin-bottom: 40px;
    background: var(--surface, #1e1e1e);
    border-radius: 8px;
    border: 1px solid var(--border, #333);
    box-shadow: 0 4px 6px rgba(0,0,0,0.2);
}

.vehicles-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 800px; /* Aby se tabulka na mobilu nesmrskla, ale scrollovala */
    text-align: left;
}

.vehicles-table th, .vehicles-table td {
    padding: 10px 12px;
    border: 1px solid #444;
    vertical-align: middle;
    position: relative; /* Důležité pro okénko s heslem při mazání */
}

.vehicles-table th {
    background-color: #252525;
    color: #4a90e2;
    font-size: 0.95em;
    position: sticky; /* Zafixuje hlavičku při rolování */
    top: 0;
}

.vehicles-table tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

.vehicles-table tr:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* --- STATUSY A ŠTÍTKY --- */
.dcc-badge {
    background: #34495e;
    color: white;
    padding: 3px 8px;
    border-radius: 4px;
    font-weight: bold;
    font-family: monospace;
    font-size: 1.1em;
}

.v-status {
    padding: 4px 10px;
    border-radius: 15px;
    font-weight: bold;
    font-size: 0.85em;
    display: inline-block;
    text-align: center;
    color: #111; 
}

.v-status-ok { background-color: #2ecc71; }       /* Zelená */
.v-status-warning { background-color: #f1c40f; }  /* Žlutá */
.v-status-broken { background-color: #e74c3c; color: white; } /* Červená */

/* Nadpisy tabulek */
.section-title {
    margin-top: 40px;
    margin-bottom: 15px;
    color: #e0e0e0;
    border-bottom: 2px solid #444;
    padding-bottom: 5px;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* --- STYLY PRO FORMULÁŘ (PŘIDÁNÍ VOZIDLA) --- */
.add-vehicle {
    background: var(--surface, #1e1e1e);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
    margin-bottom: 40px;
    border: 1px solid var(--border, #333);
}

.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group {
    display: flex;
    flex-direction: column;
}

.add-vehicle label {
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 0.9em;
    color: var(--text-muted, #a0a0a0);
}

/* Ztmavení a úprava všech textových polí a výběrů */
.add-vehicle input[type="text"],
.add-vehicle input[type="number"],
.add-vehicle input[type="password"],
.add-vehicle select,
.add-vehicle textarea {
    width: 100%;
    padding: 10px;
    background-color: #2d2d2d;
    border: 1px solid #444;
    color: white;
    border-radius: 5px;
    box-sizing: border-box;
    font-family: inherit;
    transition: border-color 0.3s;
}

/* Zvýraznění při psaní do políčka */
.add-vehicle input:focus, 
.add-vehicle select:focus, 
.add-vehicle textarea:focus {
    outline: none;
    border-color: #4a90e2;
}

/* Tlačítko uložení */
.btn-submit {
    width: 100%;
    color: white;
    padding: 12px;
    border: none;
    border-radius: 5px;
    font-size: 1.05em;
    font-weight: bold;
    cursor: pointer;
    transition: opacity 0.2s;
}

.btn-submit:hover {
    opacity: 0.85;
}

/* Responzivita pro mobil - formulář se přeskládá pod sebe */
@media (max-width: 768px) {
    .form-row {
        flex-direction: column;
        gap: 15px;
    }
    #loco-fields {
        flex-direction: column !important; /* Na mobilu musí být i adresy pod sebou */
    }
}

/* Doplnění do vehicles.css */
.loan-badge { background:#f39c12; color:black; padding:2px 5px; border-radius:3px; font-size:0.7em; font-weight:bold; }

.action-btn { background: none; border: none; cursor: pointer; font-size: 1.1em; transition: color 0.2s; }
.edit-btn { color: #3498db; } .edit-btn:hover { color: #5dade2; }
.delete-btn { color: #c0392b; } .delete-btn:hover { color: #e74c3c; }

.checkbox-wrapper { display:flex; align-items:center; gap:5px; background:#2d2d2d; padding:8px; border:1px solid #444; border-radius:5px; }
.checkbox-wrapper input { width:auto; margin:0; cursor:pointer; }
.checkbox-wrapper label { margin:0; font-size:0.85em; cursor:pointer; color:#f1c40f; }