
:root{--blue:#0b61c9;--green:#178443;--border:#d9e0ea;--text:#182033;--muted:#687389;--bg:#f5f7fb;--head:#323b49;--red:#e30613}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}
.app-header{height:120px;background:white;display:flex;align-items:center;justify-content:space-between;padding:18px 26px 12px 30px;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.brand{display:flex;align-items:center;gap:34px}.brand img{width:170px;height:auto;display:block}.brand h1{margin:0;font-size:29px}.brand p{margin:8px 0 0;color:#566176;font-size:17px}.login-info{color:#566176}.redline{height:2px;background:var(--red)}
.page{padding:16px 24px 12px}.tabs{display:flex;gap:12px;margin-bottom:14px}.tabs a{text-decoration:none;color:#1c2940;padding:12px 24px;border-radius:5px;font-weight:600}.tabs a.active{background:linear-gradient(#0d6ed1,#084ca5);color:white}
.panel{background:white;border:1px solid var(--border);border-radius:8px;padding:18px 20px;margin-bottom:14px;box-shadow:0 2px 8px rgba(20,30,50,.06)}
.section-title{margin:0 0 14px;font-size:22px}.section-title.small{font-size:20px}.section-title span{font-size:13px;color:var(--muted)}
.form-row{display:grid;gap:14px 18px;margin-bottom:14px;align-items:end}.row-main{grid-template-columns:1.45fr .75fr .9fr 1.15fr}.row-address{grid-template-columns:1.75fr .55fr 1.1fr}.row-contact{grid-template-columns:1fr 1fr 1.1fr}.row-material{grid-template-columns:.8fr .9fr 1.1fr .9fr 1.2fr}.row-dates{grid-template-columns:.8fr .75fr .8fr .65fr .8fr .8fr .9fr .9fr}
label{display:block;font-size:13px;font-weight:700}label span{color:#d60000}
input,select,textarea{width:100%;margin-top:7px;border:1px solid #cfd7e3;border-radius:5px;padding:10px 11px;font:inherit;color:#283246;background:white}
textarea{min-height:60px;resize:vertical}.full{margin-top:8px}
.subline{display:flex;align-items:center;margin:14px 0;color:#1e293b;font-weight:700}.subline:after{content:"";flex:1;height:1px;background:var(--border);margin-left:12px}
.form-actions{display:flex;justify-content:flex-end;gap:18px;margin-top:12px}.btn{border:0;border-radius:5px;padding:11px 20px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font:inherit}.primary-btn{background:linear-gradient(90deg,#0857c8,#0337d8);color:white}.secondary-btn{background:#eef1f5;color:#1c2940;border:1px solid #d6dde8}.print-btn{background:#168540;color:white}
.notice{background:#ecfdf3;border:1px solid #abefc6;color:#067647;border-radius:7px;padding:10px 14px;margin-bottom:14px}
.filter-grid{display:grid;grid-template-columns:1fr .7fr .8fr .8fr .8fr .7fr .7fr .8fr .55fr .8fr .8fr auto;gap:10px;align-items:end}.filter-buttons{display:flex;gap:10px}
.list-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.list-actions{display:flex;gap:16px;align-items:center}.list-actions form{margin:0}
.table-wrap{border:1px solid var(--border);overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:1500px}th{background:var(--head);color:white;padding:12px;text-align:left;font-weight:700;white-space:nowrap}td{padding:11px 12px;border-bottom:1px solid #e5e9ef;vertical-align:top}.empty{text-align:center;color:var(--muted);padding:28px}small{color:#687389}.badge{display:inline-block;background:#eef3ff;color:#143b8f;padding:4px 9px;border-radius:99px;font-weight:700;font-size:12px}.prio{background:#f4f6f9;color:#283246}.actions-cell{display:flex;gap:8px;flex-wrap:wrap}.actions-cell form{margin:0}.mini-btn{border:0;border-radius:5px;padding:7px 10px;text-decoration:none;font-size:12px;font-weight:700;cursor:pointer}.edit{background:#dbeafe;color:#084ca5}.abnahme{background:#dcfce7;color:#166534}.danger{background:#fee4e2;color:#b42318}.restore{background:#dcfce7;color:#166534}.details-row td{background:#fafbfc;color:#344054;font-size:12px}.footer{display:flex;justify-content:space-between;color:#718096;padding:8px 2px 0}.print-only{display:none}.backup-warning{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;padding:10px;border-radius:6px;margin:12px 0}.hint{color:#687389}
@media print{@page{size:A4 landscape;margin:8mm}body{background:white;font-size:9px}.no-print{display:none!important}.page{padding:0}.panel{border:0;box-shadow:none;padding:0;margin:0}.table-wrap{border:0;overflow:visible}table{min-width:0;font-size:8px}th,td{border:1px solid #777;padding:4px}th{background:#eee!important;color:black}.badge{background:white!important;color:black;border:1px solid #777;padding:2px 4px}thead{display:table-header-group}tr{page-break-inside:avoid}}
@media(max-width:1350px){.row-main,.row-address,.row-contact,.row-material,.row-dates,.filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.app-header,.brand,.login-info,.list-head,.list-actions,.footer{flex-direction:column;align-items:flex-start}.row-main,.row-address,.row-contact,.row-material,.row-dates,.filter-grid{grid-template-columns:1fr}.brand img{width:140px}}




/* Version 8.3: Backup-Bereich wirklich einklappbar */
details.backup-panel {
    padding: 0;
    overflow: hidden;
}

details.backup-panel .backup-content {
    padding: 18px 20px;
    border-top: 1px solid var(--border);
}

.backup-summary {
    cursor: pointer;
    list-style: none;
    padding: 18px 20px;
    font-size: 20px;
    font-weight: 800;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
}

.backup-summary::-webkit-details-marker {
    display: none;
}

.backup-summary::before {
    content: "▶";
    margin-right: 10px;
    color: var(--blue);
}

details[open] .backup-summary::before {
    content: "▼";
}

.backup-summary span {
    display: inline-flex;
    align-items: center;
}

.backup-summary small {
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
}

details.backup-panel:not([open]) .backup-content {
    display: none;
}


/* Version 8.6: anklickbare Mitarbeiter und Dauer-Vorgabe */
.field-block{display:block;font-size:13px;font-weight:700}
.field-label{margin-bottom:7px}
.checkbox-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:7px}
.pill-check{display:inline-flex;align-items:center;cursor:pointer;font-weight:700;font-size:13px}
.pill-check input{position:absolute;opacity:0;width:1px;height:1px}
.pill-check span{display:inline-flex;align-items:center;border:1px solid #cfd7e3;border-radius:999px;padding:9px 13px;background:#fff;color:#283246;min-height:38px}
.pill-check input:checked + span{background:#0b61c9;color:#fff;border-color:#0b61c9}
.duration-selects{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.duration-selects select{margin-top:0}

/* Login */
.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f2f4f7;
}

.login-card {
    width: min(420px, calc(100% - 32px));
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(0,0,0,.15);
    padding: 34px;
    text-align: center;
}

.login-logo {
    max-width: 180px;
    margin-bottom: 18px;
}

.login-card h1 {
    margin: 0 0 6px;
}

.login-card p {
    margin: 0 0 22px;
    color: #666;
}

.login-form {
    display: grid;
    gap: 14px;
    text-align: left;
}

.login-form input {
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
}

.login-hint {
    margin-top: 18px;
    padding: 12px;
    border-radius: 12px;
    background: #f7f7f7;
    color: #555;
    font-size: 14px;
}

.login-info a {
    color: inherit;
    font-weight: 700;
}

/* Benutzerverwaltung */
.user-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr)) auto;
    gap: 12px;
    align-items: end;
}

.inline-user-form {
    display: flex;
    gap: 8px;
    align-items: center;
}

.inline-user-form input {
    min-width: 180px;
}

.danger-btn {
    background: #b00020;
    color: #fff;
}

@media (max-width: 900px) {
    .user-form-grid {
        grid-template-columns: 1fr;
    }
    .inline-user-form {
        flex-direction: column;
        align-items: stretch;
    }
}
