/* Zadeo:ProjectBoard — Basis-Styles (wird in Phase 3 erweitert) */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
.hidden { display: none !important; }

:root {
    --bg: #F3F4F6;
    --surface: #FFFFFF;
    --border: #E5E7EB;
    --text: #111827;
    --muted: #6B7280;
    --primary: #3B82F6;
    --primary-dark: #2563EB;
    --danger: #EF4444;
    --success: #10B981;

    /* Aliase — mehrere Templates referenzieren diese Namen mit Hex-Fallback,
       ohne dass sie je definiert waren (var()-Aufruf lief immer ins Leere).
       Hier an die echten Tokens anbinden, damit Theming sie tatsächlich erreicht. */
    --card-bg: var(--surface);
    --page-bg: var(--bg);
    --hover-bg: rgba(0, 0, 0, .06);
    --text-muted: var(--muted);
}

body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
       background: var(--bg); color: var(--text); min-height: 100vh; }

/* ── Header ─────────────────────────────────────────────── */
.app-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 1.5rem; height: 56px;
    background: var(--surface); border-bottom: 1px solid var(--border);
    position: sticky; top: 0; z-index: 100;
}
.app-logo-link { text-decoration: none; }
.app-logo { font-size: 1.1rem; color: var(--muted); }
.app-logo strong { color: var(--primary); }
.header-right { display: flex; align-items: center; gap: 1rem; }
.user-info { font-size: 0.85rem; color: var(--muted); }

/* ── User-Dropdown ───────────────────────────────────────── */
.header-desktop-only { display: flex; align-items: center; gap: .5rem; }
.user-dropdown { position: relative; }
.header-icon-btn {
    display: flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; border-radius: 50%;
    text-decoration: none; font-size: 1.05rem; opacity: .7;
    transition: opacity .15s, background .15s;
}
.header-icon-btn:hover { opacity: 1; background: var(--hover-bg, rgba(0,0,0,.06)) }
.user-dropdown-btn {
    background: none; border: none; cursor: pointer; padding: .15rem;
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    transition: opacity .15s;
}
.user-dropdown-btn:hover { opacity: .75; }
.user-avatar-circle {
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--primary); color: #fff;
    font-size: .7rem; font-weight: 700; letter-spacing: .03em;
    display: flex; align-items: center; justify-content: center;
    user-select: none; flex-shrink: 0;
}
.user-burger-icon { display: none; font-size: 1.35rem; color: var(--text); line-height: 1; }
.user-dropdown-menu {
    position: absolute; right: 0; top: calc(100% + 6px);
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.12);
    min-width: 190px; z-index: 200; overflow: hidden;
}
.dropdown-mobile-section { display: none; }
.user-dropdown-menu.hidden { display: none; }
.dropdown-item {
    display: block; width: 100%; padding: .55rem 1rem;
    font-size: .875rem; color: var(--text); background: none; border: none;
    text-align: left; cursor: pointer; text-decoration: none;
    transition: background .12s;
}
.dropdown-item:hover { background: var(--hover, #f1f5f9); }
.dropdown-item-danger { color: #dc2626; }
.dropdown-item-danger:hover { background: #fef2f2; }
.dropdown-divider { height: 1px; background: var(--border); margin: .25rem 0; }
.dropdown-branding {
  padding: .45rem .9rem .5rem;
  font-size: .6rem;
  color: var(--muted, #9CA3AF);
  letter-spacing: .02em;
  border-top: 1px solid var(--border, #e5e7eb);
  margin-top: .25rem;
}
.dropdown-branding strong     { color: var(--muted, #9CA3AF); font-weight: 600; }
.dropdown-branding span       { opacity: .6; margin-left: .3rem; }
.dropdown-branding-sync       { opacity: .7; margin-bottom: .1rem; }

/* ── Sync-Hintergrund-Status (Header-Symbol, erscheint nur während ein
     Sync-Job läuft) ──────────────────────────────────────────────────── */
.sync-status-widget { position: relative; }
.sync-status-widget.hidden { display: none; }
.sync-status-btn.running .sync-status-spin { animation: pb-spin .8s linear infinite; display: inline-block; }
.sync-status-btn.running { opacity: 1; color: var(--primary); }
.sync-status-menu {
    position: absolute; right: 0; top: calc(100% + 6px);
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.12);
    min-width: 220px; z-index: 200; padding: .7rem .8rem;
}
.sync-status-menu.hidden { display: none; }
.sync-status-title { font-size: .875rem; font-weight: 600; color: var(--text); }
.sync-status-meta  { font-size: .78rem; color: var(--muted, #6b7280); margin: .25rem 0 .6rem; }
.sync-status-abort { width: 100%; justify-content: center; }
.sync-status-abort:disabled { opacity: .6; cursor: default; }
@keyframes pb-spin { to { transform: rotate(360deg); } }

/* ── Auth-Seiten ─────────────────────────────────────────── */
.auth-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; }

.auth-card {
    background: var(--surface); border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0,0,0,.08);
    padding: 2.5rem 2rem; width: 100%; max-width: 400px;
}
.auth-logo { font-size: 1.3rem; color: var(--muted); margin-bottom: 1.5rem; }
.auth-logo strong { color: var(--primary); }
.auth-subtitle { font-size: 0.9rem; color: var(--muted); margin-bottom: 1.5rem; }

/* ── Formulare ───────────────────────────────────────────── */
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; font-size: 0.875rem; font-weight: 500;
                    margin-bottom: .35rem; color: var(--text); }
.form-group label small { font-weight: 400; color: var(--muted); }
.form-group input, .form-group select, .form-group textarea {
    width: 100%; padding: .55rem .75rem;
    border: 1px solid var(--border); border-radius: 6px;
    font-size: 0.95rem; background: var(--surface); color: var(--text);
    transition: border-color .15s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
    outline: none; border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .55rem 1.1rem; border-radius: 6px; font-size: 0.9rem;
    font-weight: 500; cursor: pointer; border: 1px solid transparent;
    text-decoration: none; transition: background .15s, opacity .15s;
}
.btn-primary   { background: var(--primary); color: #fff; border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.btn-full      { width: 100%; justify-content: center; }
.btn-link      { background: none; border: none; color: var(--muted); cursor: pointer;
                 font-size: 0.875rem; padding: 0; }
.btn-link:hover { color: var(--danger); }

/* ── Alerts ──────────────────────────────────────────────── */
.alert { padding: .7rem 1rem; border-radius: 6px; font-size: 0.875rem; margin-bottom: 1rem;
         transition: opacity .4s; }
.alert-error   { background: #FEF2F2; color: #B91C1C; border: 1px solid #FECACA; }
.alert-success { background: #ECFDF5; color: #065F46; border: 1px solid #A7F3D0; }
.alert-warning { background: #FFFBEB; color: #92400E; border: 1px solid #FDE68A; }
.alert-info    { background: #EFF6FF; color: #1E40AF; border: 1px solid #BFDBFE; }

/* ── Badges ──────────────────────────────────────────────── */
.badge { display: inline-flex; align-items: center; padding: .2rem .55rem;
         border-radius: 999px; font-size: .75rem; font-weight: 600; }
.badge-success { background: #D1FAE5; color: #065F46; }
.badge-error   { background: #FEE2E2; color: #991B1B; }
.badge-info    { background: #DBEAFE; color: #1E40AF; }

.muted { color: var(--muted); }

/* ── Settings Layout ─────────────────────────────────────── */
.settings-wrap { max-width: 900px; margin: 0 auto; padding: 2rem 1.5rem; }
.settings-header { display: flex; align-items: center; justify-content: space-between;
                   margin-bottom: 1.5rem; }
.settings-header h1 { font-size: 1.4rem; }
.settings-nav a { font-size: .9rem; color: var(--muted); text-decoration: none;
                  padding: .3rem .6rem; border-radius: 4px; }
.settings-nav a.active { background: var(--primary); color: #fff; }

.settings-card { background: var(--surface); border: 1px solid var(--border);
                 border-radius: 10px; padding: 1.5rem; margin-bottom: 1.5rem; }
.card-header { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.25rem; }
.card-header h2 { font-size: 1rem; font-weight: 600; flex: 1; margin: 0; }

.form-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.form-row .form-group { flex: 1; min-width: 200px; }

.btn-sm { padding: .35rem .75rem; font-size: .825rem; }
.btn-secondary { background: var(--bg); color: var(--text); border-color: var(--border); }
.btn-secondary:hover { background: var(--border); }
.btn-timer-start { background: #DCFCE7; color: #15803D; border-color: #86EFAC; }
.btn-timer-start:hover { background: #BBF7D0; }
.btn-timer-stop  { background: #FEE2E2; color: #DC2626; border-color: #FECACA; }
.btn-timer-stop:hover  { background: #FECACA; }

.dm-col-pick-btn {
    display: flex; align-items: center;
    padding: .65rem 1rem; border-radius: 8px;
    font-size: .875rem; font-weight: 500; cursor: pointer;
    background: var(--surface); color: var(--text);
    border: 1px solid var(--border); border-left-width: 3px;
    transition: background .12s, transform .1s;
    min-height: 44px;
}
.dm-col-pick-btn:hover  { background: var(--bg); }
.dm-col-pick-btn:active { transform: scale(.98); }

/* ── Column Picker Panel ─────────────────────────────────── */
.dm-col-picker-label {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: .5rem;
}
.dm-col-picker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: .45rem;
}

/* ── Settings Shell: Sidebar + Main ─────────────────────── */
.st-shell{display:flex;min-height:calc(100vh - 56px)}
.st-sidebar{width:200px;flex-shrink:0;background:#1e293b;position:sticky;top:56px;height:calc(100vh - 56px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent}
.st-back-link{display:flex;align-items:center;gap:.35rem;padding:.9rem 1rem .8rem;color:rgba(255,255,255,.4);text-decoration:none;font-size:.78rem;font-weight:500;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:.5rem;transition:color .15s}
.st-back-link:hover{color:rgba(255,255,255,.85)}
.st-nav-group{padding:0 0 .5rem}
.st-nav-glbl{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.27);padding:.6rem 1rem .2rem}
.st-nav-item{display:flex;align-items:center;gap:.45rem;padding:.42rem 1rem;font-size:.8rem;color:rgba(255,255,255,.6);text-decoration:none;border-left:2px solid transparent;transition:color .12s,background .12s}
.st-nav-item:hover{color:rgba(255,255,255,.95);background:rgba(255,255,255,.05)}
.st-nav-item.active{color:#fff;background:rgba(59,130,246,.22);border-left-color:#3b82f6;font-weight:600}
.st-main{flex:1;min-width:0;background:#f1f5f9;display:flex;flex-direction:column}
.st-page-hd{background:#fff;border-bottom:1px solid #e5e7eb;padding:1.4rem 2rem 1.2rem;flex-shrink:0}
.st-page-title{font-size:1.2rem;font-weight:800;color:#111827;margin:0;line-height:1.25}
.st-page-sub{font-size:.8rem;color:#6b7280;margin:.2rem 0 0}
.st-content{padding:1.5rem 2rem;flex:1;max-width:880px}

/* ── Settings Sections ───────────────────────────────────── */
.settings-title { font-size: 1.4rem; font-weight: 700; margin-bottom: 1.5rem; }
.settings-nav { display: flex; gap: .5rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.settings-nav-link { font-size: .9rem; color: var(--muted); text-decoration: none;
                     padding: .3rem .75rem; border-radius: 6px; border: 1px solid var(--border); }
.settings-nav-link:hover { background: var(--border); }
.settings-nav-link.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.settings-section { background: #fff; border: 1px solid #e5e7eb;
                    border-radius: 12px; padding: 1.5rem; margin-bottom: 1.25rem;
                    box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.section-title { font-size: .9rem; font-weight: 700; margin: 0 0 1rem; color: #374151;
                 text-transform: uppercase; letter-spacing: .04em; }
.section-header { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; flex-wrap: wrap; }

/* ── User Table ──────────────────────────────────────────── */
.user-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.user-table th { text-align: left; padding: .5rem .75rem; border-bottom: 2px solid var(--border);
                 color: var(--muted); font-weight: 600; font-size: .8rem; }
.user-table td { padding: .6rem .75rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
.user-table tr:last-child td { border-bottom: none; }
.user-row-inactive td { opacity: .5; }
.inline-form { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.inp-inline { background: var(--bg); border: 1px solid var(--border); border-radius: 5px;
              padding: .3rem .5rem; font-size: .825rem; color: var(--text); }
.sel-inline { background: var(--bg); border: 1px solid var(--border); border-radius: 5px;
              padding: .3rem .5rem; font-size: .825rem; color: var(--text); }
.user-actions { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.pw-reset-form { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; margin-top: .4rem; }
.pw-reset-form.hidden { display: none; }
.user-create-form .form-group input,
.user-create-form .form-group select { width: 100%; }
.mb-1 { margin-bottom: .75rem; }
.user-card { border: 1px solid var(--border); border-radius: 8px; padding: 1rem;
             margin-bottom: .75rem; background: var(--bg); }
.user-card-inactive { opacity: .6; }
.user-card-header { display: flex; align-items: center; gap: .6rem; margin-bottom: .75rem; }
.user-avatar-sm { width: 28px; height: 28px; border-radius: 50%; background: var(--primary);
                  color: #fff; font-size: .75rem; font-weight: 700;
                  display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.user-email-muted { color: var(--muted); font-size: .85rem; }
.user-edit-row { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.inp-wide { min-width: 200px; }

/* ── Toggle Switch ───────────────────────────────────────── */
.toggle-wrap { position: relative; display: inline-block; width: 42px; height: 24px;
               flex-shrink: 0; }
.toggle-wrap input { opacity: 0; width: 0; height: 0; }
.toggle-slider { position: absolute; cursor: pointer; inset: 0;
                 background: #D1D5DB; border-radius: 24px; transition: .2s; }
.toggle-slider::before { content: ''; position: absolute; height: 18px; width: 18px;
                          left: 3px; top: 3px; background: white; border-radius: 50%;
                          transition: .2s; }
input:checked + .toggle-slider { background: var(--primary); }
input:checked + .toggle-slider::before { transform: translateX(18px); }
input:disabled + .toggle-slider { opacity: .4; cursor: not-allowed; }

/* ── Switch Levels ───────────────────────────────────────── */
.switch-level { border-left: 3px solid var(--border); padding: .75rem 1rem .75rem 1.25rem;
                margin-bottom: .75rem; border-radius: 0 6px 6px 0; }
.switch-level.level-1 { border-color: var(--primary); background: #EFF6FF; }
.switch-level.level-2 { border-color: #8B5CF6; background: #F5F3FF; margin-left: 1.5rem; }
.switch-level.level-3 { border-color: #10B981; background: #F0FDF4; margin-left: 3rem; }
.switch-level.export-level { border-color: #F59E0B; background: #FFFBEB; }
.switch-level.locked { opacity: .55; pointer-events: none; }

.level-label { font-size: .7rem; font-weight: 600; text-transform: uppercase;
               letter-spacing: .05em; color: var(--muted); margin-bottom: .5rem; }

.switch-row { display: flex; align-items: center; gap: .75rem; padding: .4rem 0;
              cursor: pointer; }
.switch-label { flex: 1; display: flex; flex-direction: column; gap: .1rem; }
.switch-label strong { font-size: .9rem; }
.switch-label .muted { font-size: .8rem; }
.export-warning { color: #D97706; }

.switch-badge { font-size: .7rem; font-weight: 700; padding: .15rem .45rem;
                border-radius: 4px; }
.switch-badge.on  { background: #D1FAE5; color: #065F46; }
.switch-badge.off { background: #F3F4F6; color: #6B7280; }

.direction-arrow { font-size: .75rem; font-weight: 600; padding: .15rem .45rem;
                   border-radius: 4px; }
.import-arrow { background: #DBEAFE; color: #1D4ED8; }
.export-arrow { background: #FEF3C7; color: #92400E; }

/* ── Column Table ────────────────────────────────────────── */
.col-table { width: 100%; border-collapse: collapse; }
.col-table th, .col-table td { padding: .5rem .75rem; text-align: left;
                                border-bottom: 1px solid var(--border); font-size: .875rem; }
.col-table th { font-weight: 600; color: var(--muted); font-size: .75rem;
                text-transform: uppercase; letter-spacing: .04em; }
.col-order { display: flex; gap: .25rem; }

.color-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%;
             vertical-align: middle; margin-right: .35rem; border: 1px solid rgba(0,0,0,.1); }

.inline-edit-form { display: flex; align-items: center; gap: .4rem; }
.inline-input { border: 1px solid var(--border); border-radius: 4px; padding: .3rem .5rem;
                font-size: .875rem; flex: 1; min-width: 120px; }
.inline-color { width: 36px; height: 28px; border: 1px solid var(--border);
                border-radius: 4px; cursor: pointer; padding: 1px; }
.inline-form { display: flex; gap: .5rem; align-items: flex-end; flex-wrap: wrap;
               padding-top: .75rem; }

.btn-icon { background: none; border: 1px solid var(--border); border-radius: 4px;
            width: 28px; height: 28px; cursor: pointer; font-size: .8rem; display: flex;
            align-items: center; justify-content: center; transition: background .1s; }
.btn-icon:hover { background: var(--bg); }
.btn-icon.btn-save { color: var(--success); border-color: var(--success); }
.btn-icon.btn-danger { color: var(--danger); border-color: var(--danger); }
.btn-icon:disabled { opacity: .35; cursor: not-allowed; }

.collapsible summary { list-style: none; cursor: pointer; }
.collapsible summary::-webkit-details-marker { display: none; }

/* ── Mapping Table ───────────────────────────────────────── */
.mapping-table { width: 100%; border-collapse: collapse; }
.mapping-table th, .mapping-table td { padding: .5rem .75rem; text-align: left;
                                        border-bottom: 1px solid var(--border); font-size: .875rem; }
.mapping-table th { font-weight: 600; color: var(--muted); font-size: .75rem;
                    text-transform: uppercase; }
.status-pill { display: inline-block; padding: .15rem .5rem; background: var(--bg);
               border-radius: 999px; font-size: .8rem; border: 1px solid var(--border); }
.form-select-sm { padding: .3rem .5rem; border: 1px solid var(--border); border-radius: 4px;
                  font-size: .875rem; background: var(--surface); }

/* ── HTMX Spinner ────────────────────────────────────────── */
.spinner { display: none; width: 16px; height: 16px; border: 2px solid var(--border);
           border-top-color: var(--primary); border-radius: 50%; animation: spin .6s linear infinite; }
.htmx-request .spinner, .htmx-request.spinner { display: inline-block; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Sync-Button Animation ───────────────────────────────── */
.sync-btn .sync-icon { display: inline-block; }
.sync-btn.htmx-request .sync-icon { animation: spin .7s linear infinite; }
.sync-btn.htmx-request { opacity: .8; cursor: wait; }
.sync-btn.sync-ok  { background: #d1fae5 !important; border-color: #10b981 !important; color: #065f46 !important; transition: background .3s, border-color .3s, color .3s; }
.sync-btn.sync-err { background: #fee2e2 !important; border-color: #ef4444 !important; color: #7f1d1d !important; transition: background .3s, border-color .3s, color .3s; }

/* ── Smart-Search Dropdown ───────────────────────────────── */
.search-wrap { position: relative; }
.search-wrap input[type=text]:focus {
    outline: none;
    border-color: #1e40af;
    box-shadow: 0 0 0 3px rgba(30,64,175,.1);
}
.search-results {
    position: absolute; top: calc(100% + 4px); left: 0; right: 0;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.1);
    list-style: none; max-height: 280px; overflow-y: auto;
    z-index: 200; padding: .25rem 0;
}
.search-results:empty { display: none; }

.search-result-item {
    padding: .5rem .85rem; cursor: pointer;
    display: flex; flex-direction: row; align-items: center; gap: .5rem;
    transition: background .1s;
}
.search-result-item:hover { background: #EFF6FF; }
.search-result-item.active {
    background: var(--primary); color: #fff;
}
.search-result-item.active .result-meta { color: rgba(255,255,255,.75); }
.search-result-item.active .result-side-date,
.search-result-item.active .result-side-nr { color: rgba(255,255,255,.6); }
.result-main  { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.result-name  { font-size: .9rem; font-weight: 500; }
.result-meta  { font-size: .75rem; color: var(--muted); display: flex; gap: .35rem; align-items: center; }
.result-side  { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: .05rem; }
.result-side-date { font-size: .72rem; color: #9ca3af; }
.result-side-nr   { font-size: .7rem;  color: #b0b7c3; }
.result-type  { padding: .1rem .35rem; border-radius: 999px; font-size: .68rem; font-weight: 600; }
.type-commercial { background: #DBEAFE; color: #1D4ED8; }
.type-private    { background: #F3F4F6; color: #6B7280; }

.search-hint, .search-no-results, .search-error {
    padding: .6rem .85rem; font-size: .85rem; color: var(--muted); list-style: none;
}
.search-error { color: var(--danger); }

/* Hero-Datenspiegel Phase 5 — gruppierte Suchergebnisse (Kunden-Übersicht,
   scope=full) über Kunden hinaus (Projekt/Dokument/Position/Zeiterfassung) */
.search-group-header {
    padding: .4rem .85rem .2rem; font-size: .68rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em; color: #9ca3af;
    list-style: none; border-top: 1px solid #e5e7eb; margin-top: .2rem;
}
.search-results li.search-group-header:first-child { border-top: none; margin-top: 0; }
.search-result-archive .result-name { font-weight: 400; }

.csr-freetext { flex-direction: row !important; align-items: center; gap: .6rem;
    border-top: 1px solid #e5e7eb; margin-top: .2rem; }
.csr-ft-icon { font-size: 1rem; color: #6b7280; flex-shrink: 0; }
.csr-ft-text { display: flex; flex-direction: column; gap: 1px; }
.csr-ft-label { font-size: .85rem; color: #374151; }
.csr-ft-hint  { font-size: .72rem; color: #9ca3af; }
.csr-freetext:hover .csr-ft-label { color: #1e40af; }
.csr-freetext:hover .csr-ft-icon  { color: #1e40af; }

.csr-hero-link { list-style: none; padding: .5rem .85rem;
    border-top: 1px dashed #e5e7eb; display: flex; align-items: center; gap: .5rem; }
.csr-hero-link a { font-size: .82rem; color: #1e40af; text-decoration: none;
    display: flex; align-items: center; gap: .25rem; }
.csr-hero-link a:hover { text-decoration: underline; }
.csr-hl-icon { font-size: .9rem; }
.csr-hl-hint { font-size: .72rem; color: #9ca3af; }

/* ── Board Dark Theme ────────────────────────────────────────── */
body.board-page { background: #1E1E2E; }
body.board-page main { background: #1E1E2E; overflow: hidden; }

/* Kunden-Übersicht: dieselbe dunkle Bühne wie das Board (Auftrag Mischa
   2026-09-13: "soll die gleiche Farbe haben wie im Kanban Board") — aber
   OHNE overflow:hidden auf main, das Board braucht das nur weil es intern
   selbst scrollt (Spalten), diese Seite ist eine normale, scrollende
   Kartenliste und würde sonst nicht mehr scrollen können. */
/* html.theme-colored body {...} (weiter unten) ist spezifischer als ein
   einfaches "body.customers-page" (2 Elemente+1 Klasse schlägt 1 Element+1
   Klasse) und hätte den dunklen Hintergrund sonst wieder auf hell
   zurückgesetzt, sobald das farbige Theme aktiv ist (das ist der Standard,
   wenn nie explizit "Standard-Theme" gewählt wurde) — deshalb hier zusätzlich
   dieselbe Spezifität getroffen statt nur "body.customers-page" allein.
   min-height:100vh auf main, damit bei kurzem Seiteninhalt kein heller
   Rand unterhalb der letzten Karte durchscheint (Auftrag Mischa: "geht der
   dunkle Hintergrund nur bis Unterkante von der Card"). */
body.customers-page,
html.theme-colored body.customers-page { background: #1E1E2E; }
body.customers-page main,
html.theme-colored body.customers-page main { background: #1E1E2E; min-height: 100vh; }
/* Text, der direkt auf der dunklen Fläche liegt (außerhalb der weißen
   .settings-card-Kacheln) — sonst dunkler Text auf dunklem Grund, unlesbar. */
body.customers-page .ct-header,
body.customers-page .ct-header h1 { color: #F1F5F9; }
body.customers-page .ct-header a { color: #93C5FD; }
body.customers-page .ct-header .field-hint { color: #94A3B8; }

.board-wrap {
    height: calc(100vh - 56px);
    padding: 1.25rem 1.25rem .5rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
/* ── Header: Board-Suche + Benutzer-Filter ─────────────────── */
.header-board-tools {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 1;
    min-width: 0;
}
.board-search-wrap {
    position: relative;
    flex-shrink: 0;
}
.board-search-icon {
    position: absolute;
    left: .55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 13px;
    height: 13px;
    color: rgba(255,255,255,.6);
    pointer-events: none;
}
.board-search-input {
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 7px;
    color: #fff;
    padding: .3rem .65rem .3rem 1.75rem;
    font-size: .82rem;
    width: 150px;
    outline: none;
    transition: border-color .15s, width .2s;
    -webkit-appearance: none;
}
.board-search-input:focus {
    border-color: rgba(255,255,255,.55);
    width: 210px;
}
.board-search-input::placeholder { color: rgba(255,255,255,.5); }
.board-user-filters {
    display: flex;
    align-items: center;
    gap: .3rem;
    overflow-x: auto;
    scrollbar-width: none;
    flex: 1;
    min-width: 0;
}
.board-user-filters::-webkit-scrollbar { display: none; }
.user-chip {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .22rem .5rem;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 20px;
    cursor: pointer;
    font-size: .75rem;
    color: var(--muted);
    transition: background .15s, border-color .15s, color .15s;
    user-select: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.user-chip:hover { background: rgba(255,255,255,.1); color: var(--text); }
.user-chip.active {
    background: rgba(59,130,246,.18);
    border-color: #3b82f6;
    color: #93c5fd;
}
.user-chip-avatar {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #4b5563;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .6rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}
.user-chip.active .user-chip-avatar { background: #3b82f6; }
.user-chip-count { font-weight: 700; opacity: .75; }
@media (max-width: 768px) { .header-board-tools { display: none; } }

/* ── Drag-Drop Abschluss-Kreise (Overlay) ───────────────────── */
.drop-circles {
    position: fixed;
    bottom: 2.5rem;
    left: 0; right: 0;
    display: flex;
    justify-content: center;
    gap: 3rem;
    z-index: 9000;
    pointer-events: none;
}
.drop-circle {
    width: 120px; height: 120px;
    border-radius: 50%;
    border: 2.5px dashed rgba(255,255,255,.25);
    background: rgba(20,20,35,.88);
    backdrop-filter: blur(12px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    color: rgba(255,255,255,.45);
    font-size: .7rem;
    font-weight: 600;
    text-align: center;
    cursor: copy;
    pointer-events: all;
    transition: border-color .15s, color .15s, background .15s, transform .15s, box-shadow .15s;
    user-select: none;
    line-height: 1.3;
}
.drop-circle svg { width: 30px; height: 30px; }
.drop-circle-archive { border-color: rgba(245,158,11,.45); color: rgba(245,158,11,.7); }
.drop-circle-complete { border-color: rgba(16,185,129,.45); color: rgba(16,185,129,.7); }
.drop-circle.drop-active { transform: scale(1.13); box-shadow: 0 0 0 8px rgba(255,255,255,.06); }
.drop-circle-archive.drop-active  { border-color: #f59e0b; color: #fcd34d; background: rgba(245,158,11,.22); }
.drop-circle-complete.drop-active { border-color: #10b981; color: #6ee7b7; background: rgba(16,185,129,.22); }
@media (max-width: 768px) { .drop-circles { display: none !important; } }

.board-columns {
    display: flex;
    gap: 1rem;
    flex: 1;
    overflow-x: auto;
    overflow-y: hidden;
    align-items: flex-start;
    padding-bottom: .5rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.15) transparent;
}

.board-columns::-webkit-scrollbar { height: 6px; }
.board-columns::-webkit-scrollbar-track { background: transparent; }
.board-columns::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 3px; }

.board-column {
    flex: 1 1 0;
    min-width: 200px;
    display: flex;
    flex-direction: column;
    max-height: 100%;
    border-radius: 10px;
    overflow: hidden;
}

.column-header {
    position: relative;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1rem;
    border-top: 3px solid var(--col-color, #3B82F6);
    background: #2A2A3E;
    flex-shrink: 0;
}

.column-title {
    flex: 1;
    font-weight: 600;
    font-size: .875rem;
    color: #E2E8F0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.column-count {
    font-size: .72rem;
    background: rgba(255,255,255,.12);
    color: rgba(255,255,255,.7);
    padding: .1rem .45rem;
    border-radius: 999px;
    font-weight: 600;
    flex-shrink: 0;
}

.column-cards {
    flex: 1;
    overflow-y: auto;
    padding: .5rem;
    background: #24243A;
    min-height: 60px;
    display: flex;
    flex-direction: column;
    gap: .45rem;
    transition: background .1s;
    /* Firefox kennt ::-webkit-scrollbar nicht — hier den dezenten Look nachziehen */
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.1) transparent;
}

.column-cards::-webkit-scrollbar { width: 4px; }
.column-cards::-webkit-scrollbar-track { background: transparent; }
.column-cards::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 2px; }

.column-cards.drag-over {
    background: #2D2D48;
    outline: 2px dashed rgba(255,255,255,.18);
    outline-offset: -2px;
}

.column-drop-placeholder { min-height: 2px; flex-shrink: 0; }

/* Mehrspaltige Karten-Grid (width_factor ≥ 2) */
.column-cards[data-cols="2"] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.column-cards[data-cols="3"] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.column-cards[data-cols="2"] .column-drop-placeholder,
.column-cards[data-cols="3"] .column-drop-placeholder {
    grid-column: 1 / -1;
}
@media (max-width: 768px) {
    .column-cards[data-cols="2"],
    .column-cards[data-cols="3"] {
        display: flex;
        flex-direction: column;
    }
}

/* ── Sub-Spalte ──────────────────────────────────────────────── */
.column-subsection {
    border-top: 2px solid rgba(255,255,255,.1);
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.column-header-sub {
    font-size: .82rem;
    opacity: .85;
    padding: .4rem .75rem;
    border-top: none;
    border-bottom: none;
    --col-color: var(--sub-col-color, #6b7280);
}
.column-header-sub .column-count {
    font-size: .7rem;
}
.column-subsection .column-cards {
    flex: 0 1 auto;
    max-height: 40%;
}

/* ── Board Card ──────────────────────────────────────────────── */
.board-card {
    position: relative;
    background: #FFFFFF;
    border-radius: 7px;
    padding: .7rem .75rem .6rem;
    cursor: grab;
    user-select: none;
    box-shadow: 0 1px 4px rgba(0,0,0,.35);
    transition: transform .1s, box-shadow .1s, opacity .15s;
    border-left: 3px solid #059669;
}
.board-card.card-hero { border-left-color: #2563eb; }

.board-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,.45);
    transform: translateY(-1px);
}

.board-card.dragging {
    opacity: .35;
    cursor: grabbing;
    transform: scale(1.02) rotate(1deg);
}

.board-card.timer-active {
    border-left-color: #10B981;
}

.card-title {
    font-size: .875rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.35;
    margin-bottom: .3rem;
    padding-right: 1.6rem;
    overflow-wrap: break-word;
    word-break: break-word;
}

.card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .5rem;
    margin-bottom: .45rem;
}

.card-meta-item {
    font-size: .73rem;
    color: #6B7280;
}

.card-hero-nr { color: #3B82F6; font-weight: 500; }
.card-assigned { color: #8B5CF6; }

.card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: .3rem;
}

.card-time {
    font-size: .73rem;
    color: #9CA3AF;
    font-variant-numeric: tabular-nums;
}

.card-time.has-time { color: #059669; font-weight: 600; }

/* ── Timer Button ────────────────────────────────────────────── */
.btn-timer {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .2rem .55rem;
    border-radius: 5px;
    font-size: .73rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: background .12s;
    line-height: 1.4;
}

.btn-timer.start { background: #DCFCE7; color: #15803D; }
.btn-timer.start:hover { background: #BBF7D0; }
.btn-timer.stop  { background: #FEE2E2; color: #DC2626; }
.btn-timer.stop:hover  { background: #FECACA; }
.btn-timer:disabled { opacity: .5; cursor: not-allowed; }

/* ── Global Timer Widget ─────────────────────────────────────── */
.global-timer {
    display: flex;
    align-items: center;
    gap: .45rem;
    background: #1E293B;
    color: #E2E8F0;
    padding: .28rem .7rem;
    border-radius: 6px;
    font-size: .8rem;
}

.global-timer.hidden { display: none; }

.timer-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #10B981;
    flex-shrink: 0;
    animation: pulse 1.5s ease-in-out infinite;
}

.timer-project {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .75rem;
    color: #94A3B8;
    font-weight: 500;
}

.timer-clock {
    font-weight: 700;
    font-family: 'Courier New', monospace;
    color: #EF4444;
    font-variant-numeric: tabular-nums;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: .35; }
}

/* ── Board Empty State ───────────────────────────────────────── */
.board-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 1rem;
    color: rgba(255,255,255,.4);
    font-size: .95rem;
}

/* ── Column Add Button ───────────────────────────────────────── */
.btn-col-add {
    background: none;
    border: none;
    color: rgba(255,255,255,.5);
    font-size: 1.1rem;
    line-height: 1;
    width: 22px;
    height: 22px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .1s, color .1s;
    padding: 0;
}
.btn-col-add:hover { background: rgba(255,255,255,.15); color: #fff; }

.btn-col-sort {
    background: none;
    border: none;
    color: rgba(255,255,255,.4);
    width: 22px;
    height: 22px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
    transition: background .1s, color .1s;
}
.btn-col-sort svg { width: 13px; height: 13px; }
.btn-col-sort:hover, .btn-col-sort.sorted { background: rgba(255,255,255,.12); color: #fff; }

.col-sort-menu {
    position: absolute;
    top: calc(100% + 2px);
    right: 30px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.18);
    list-style: none;
    padding: .25rem 0;
    z-index: 300;
    min-width: 180px;
}
.col-sort-item {
    padding: .45rem .9rem;
    font-size: .82rem;
    cursor: pointer;
    white-space: nowrap;
    transition: background .1s;
    color: var(--text);
}
.col-sort-item:hover { background: var(--hover, #f1f5f9); }
.col-sort-item.active { font-weight: 600; color: var(--primary); }

/* ── Neuanlage-Modal (PVM-Stil) ─────────────────────────────── */
.ncm-ov {
    position: fixed;
    inset: 0;
    z-index: 620;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.ncm-ov.hidden { display: none; }
.ncm-bg {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.46);
    backdrop-filter: blur(3px);
    cursor: pointer;
}
.ncm-panel {
    position: relative;
    z-index: 1;
    width: calc(100% - 24px);
    max-width: 520px;
    background: #f8fafc;
    border-radius: 18px;
    box-shadow: 0 20px 60px rgba(0,0,0,.28);
    animation: pvmIn .18s ease-out;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 2rem);
}
.ncm-hd {
    background: #1e40af;
    padding: 16px 18px 14px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.ncm-av {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,.2);
    color: #fff;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}
.ncm-hd-info { flex: 1; min-width: 0; position: relative; z-index: 1; }
.ncm-title   { font-size: 18px; font-weight: 900; color: #fff; margin-bottom: 3px; }
.ncm-sub     { font-size: 12px; color: rgba(255,255,255,.75); display: flex; align-items: center; gap: 5px; }
.ncm-col-tag {
    background: rgba(255,255,255,.2);
    color: #fff;
    font-weight: 700;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 11px;
}
.ncm-close {
    position: absolute;
    top: 12px; right: 14px;
    width: 28px; height: 28px;
    border-radius: 8px;
    background: rgba(255,255,255,.2);
    border: none; cursor: pointer;
    color: #fff; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
    z-index: 2;
}
.ncm-close:hover { background: rgba(255,255,255,.32); }
.ncm-wm {
    position: absolute;
    right: 10px; bottom: -8px;
    font-size: 88px; font-weight: 900;
    color: rgba(255,255,255,.07);
    pointer-events: none;
    z-index: 0; line-height: 1;
}
.ncm-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px 20px 4px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.ncm-field { display: flex; flex-direction: column; gap: 4px; }
.ncm-lbl {
    font-size: 11px;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.ncm-opt { font-size: 10px; font-weight: 500; color: #9ca3af; text-transform: none; letter-spacing: 0; }
.ncm-req { color: #ef4444; }
.ncm-hero-badge { float: right; font-size: 10px; font-weight: 600; padding: 1px 7px; border-radius: 999px; text-transform: none; letter-spacing: 0; }
.ncm-hero-none   { background: #f1f5f9; color: #94a3b8; }
.ncm-hero-linked { background: #dcfce7; color: #16a34a; }

/* ── NCM Mini-Kalender ── */
.nc-cal-wrap { background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 10px; padding: 8px 10px 6px; }
.nc-cal-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; }
.nc-cal-nav-btn { background: none; border: 1px solid #cbd5e1; border-radius: 5px; cursor: pointer; padding: 1px 8px; font-size: .85rem; color: #64748b; line-height: 1.5; }
.nc-cal-nav-btn:hover { background: #e2e8f0; }
.nc-cal-title { font-size: .78rem; font-weight: 700; color: #334155; letter-spacing: .01em; }
.nc-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; }
.nc-cal-dh { font-size: .65rem; color: #94a3b8; text-align: center; padding: 2px 0 4px; font-weight: 600; }
.nc-cal-dh-we { color: #cbd5e1; }
.nc-cal-day, .nc-cal-empty { font-size: .73rem; text-align: center; padding: 4px 1px; border-radius: 5px; cursor: pointer; color: #374151; line-height: 1; transition: background .1s; }
.nc-cal-day:hover { background: #e2e8f0; }
.nc-cal-we { color: #94a3b8; }
.nc-cal-past { color: #cbd5e1; }
.nc-cal-past:hover { background: #f1f5f9; }
.nc-cal-today { background: #dbeafe; color: #1d4ed8; font-weight: 700; }
.nc-cal-today:hover { background: #bfdbfe; }
.nc-cal-selected { background: #2563eb !important; color: #fff !important; font-weight: 700; }
.nc-cal-empty { cursor: default; }
.nc-termin-chip { display: flex; align-items: center; gap: 6px; margin-top: 7px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 6px; padding: 4px 8px; font-size: .8rem; color: #1d4ed8; font-weight: 600; }
.ncm-sel, .ncm-ta {
    width: 100%;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    padding: .5rem .75rem;
    font-size: .875rem;
    color: #1f2937;
    background: #fff;
    font-family: inherit;
    transition: border-color .15s, box-shadow .15s;
    box-sizing: border-box;
}
.ncm-sel:focus, .ncm-ta:focus {
    outline: none;
    border-color: #1e40af;
    box-shadow: 0 0 0 3px rgba(30,64,175,.1);
}
.ncm-ta { resize: vertical; }
.ncm-body .search-wrap input[type=text] {
    width: 100%;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    padding: .5rem .75rem;
    font-size: .875rem;
    color: #1f2937;
    background: #fff;
    font-family: inherit;
    transition: border-color .15s, box-shadow .15s;
    box-sizing: border-box;
}
.ncm-body .search-wrap input[type=text]:focus {
    outline: none;
    border-color: #1e40af;
    box-shadow: 0 0 0 3px rgba(30,64,175,.1);
}
.ncm-foot {
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    padding: 14px 20px 16px;
    border-top: 1px solid #e5e7eb;
    background: #f1f5f9;
    flex-shrink: 0;
}

/* ── Modal ───────────────────────────────────────────────────── */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 620;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.modal-overlay.hidden { display: none; }

.modal-dialog {
    background: var(--surface);
    border-radius: 12px;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 8px 32px rgba(0,0,0,.35);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 4rem);
    overflow: hidden;
}

.modal-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .9rem 1.4rem .75rem;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}
.modal-header h2 {
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}
.hero-log-entry {
    padding: .6rem 0; border-bottom: 1px solid var(--border);
}
.hero-log-entry:last-child { border-bottom: none; }
.hero-log-title { font-size: .82rem; font-weight: 600; color: var(--text); }
.hero-log-meta { font-size: .75rem; color: var(--muted); margin-bottom: .2rem; }
.hero-log-text { font-size: .82rem; color: var(--text); white-space: pre-wrap; }

/* Statuswechsel-Zeile (from → to) */
.log-status-line {
    display: flex; align-items: center; gap: .35rem;
    font-size: .8rem; margin-top: .15rem;
}
.log-status-from {
    color: var(--muted);
    text-decoration: line-through;
    text-decoration-color: color-mix(in srgb, var(--muted) 50%, transparent);
}
.log-status-arrow { color: var(--muted); font-size: .75rem; }
.log-status-to { color: var(--text); font-weight: 600; }
.btn-link { background: none; border: none; color: var(--primary); font-size: .8rem;
            cursor: pointer; padding: 0; text-decoration: underline; font-family: inherit; }

/* ── Mobile Spalten-Navigation ───────────────────────────────── */
.mobile-col-nav {
    display: none;
    align-items: center;
    gap: .4rem;
}
.mobile-col-arrow {
    background: none;
    border: none;
    color: var(--text);
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 .2rem;
    opacity: .7;
}
.mobile-col-arrow:hover { opacity: 1; }
.mobile-col-name {
    font-size: .85rem;
    font-weight: 600;
    min-width: 80px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 140px;
}

@media (max-width: 768px) {
    .mobile-col-nav { display: flex; }
    .last-sync-label { display: none; }
    .board-wrap {
        height: calc(100vh - 54px);
        padding: 0;
    }
    .board-columns {
        flex-wrap: nowrap !important;
        overflow-x: scroll;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0;
        gap: 0;
        align-items: stretch;
    }
    .board-columns::-webkit-scrollbar { display: none; }
    .board-column {
        flex: 0 0 100% !important;
        min-width: 0 !important;
        scroll-snap-align: start;
        border-radius: 0;
        height: 100%;
    }
    .modal-dialog { width: 96vw; max-height: 92vh; }
    .modal-dialog-lg { width: 96vw; height: auto; max-height: 92vh; }
    .header-right { gap: .3rem; }
    .user-info em { display: none; }
    .header-desktop-only { display: none; }
    .user-avatar-circle { display: none; }
    .user-burger-icon { display: block; }
    .user-dropdown-btn { padding: .3rem .45rem; border-radius: 6px; }
    .user-dropdown-btn:hover { opacity: 1; background: var(--hover, #f1f5f9); }
    .dropdown-mobile-section { display: block; }
    .dm-col-pick-btn { min-height: 52px; font-size: .9rem; }
    .dm-col-picker-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
    .btn-col-add  { width: 44px; height: 44px; font-size: 1.4rem; border-radius: 8px; }
    .btn-col-sort { width: 44px; height: 44px; border-radius: 8px; }
    .btn-col-sort svg { width: 18px; height: 18px; }
}

.modal-col-badge {
    font-size: .75rem;
    font-weight: 600;
    color: var(--muted);
    background: var(--bg);
    padding: .15rem .5rem;
    border-radius: 999px;
    border: 1px solid var(--border);
}

.modal-close {
    background: none;
    border: none;
    color: var(--muted);
    cursor: pointer;
    font-size: 1.4rem;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .1s, color .1s;
    flex-shrink: 0;
}
.modal-close:hover { background: var(--bg); color: var(--text); }

.modal-dialog form {
    padding: 1.2rem 1.4rem;
    overflow-y: auto;
    flex: 1;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
    margin-top: .75rem;
}
/* ── Modal Form Helpers ──────────────────────────────────────── */
.required-star { color: var(--danger); }
.field-hint    { font-size: .78rem; font-weight: 400; color: var(--muted); }

/* ── Customer Chip ───────────────────────────────────────────── */
.customer-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: #DBEAFE;
    color: #1E40AF;
    padding: .3rem .65rem;
    border-radius: 999px;
    font-size: .825rem;
    font-weight: 500;
    margin-top: .4rem;
}
.customer-chip.hidden { display: none; }

.chip-clear {
    background: none;
    border: none;
    color: #1E40AF;
    cursor: pointer;
    font-size: .75rem;
    padding: 0;
    line-height: 1;
    opacity: .7;
    transition: opacity .1s;
}
.chip-clear:hover { opacity: 1; }

/* ── Detail-Modal Größe ──────────────────────────────────────── */
.modal-dialog-lg { max-width: 680px; }
.hero-badge {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    background: #1a3c6e;
    border-radius: 5px;
    padding: 3px 7px;
    text-decoration: none;
    transition: opacity .15s;
}
.hero-badge:hover  { opacity: .82; }
.hero-badge img    { display: block; }

/* ── Tabs ────────────────────────────────────────────────────── */
.tab-bar {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--border);
    padding: 0 1.4rem;
    flex-shrink: 0;
}

.tab-btn {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: .7rem 1.1rem;
    font-size: 1rem;
    font-weight: 500;
    color: var(--muted);
    cursor: pointer;
    margin-bottom: -1px;
    transition: color .15s, border-color .15s;
}
.tab-btn:hover   { color: var(--text); }
.tab-btn.active  { color: var(--primary); border-bottom-color: var(--primary); }

.tab-content { overflow: hidden; display: flex; flex-direction: column; flex: 1; }
.tab-pane    { padding: 1.2rem 1.4rem; overflow-y: auto; flex: 1; min-height: 0; }
.tab-pane.hidden { display: none; }

.tab-loading { text-align: center; padding: 2rem; color: var(--muted); font-size: .875rem; }
.tab-empty   { text-align: center; padding: 2rem; color: var(--muted); font-size: .875rem; }
.tab-error   { text-align: center; padding: 1rem; color: var(--danger);  font-size: .875rem; }

/* ── Archiv: Speicherort-Auswahl ──────────────────────────── */
.archive-storage-choice  { display: flex; gap: 1rem; flex-wrap: wrap; }
.storage-option          { display: flex; align-items: center; gap: .85rem;
                           flex: 1 1 240px; padding: 1rem 1.1rem;
                           border: 2px solid var(--border); border-radius: 10px;
                           cursor: pointer; transition: border-color .15s, background .15s;
                           background: var(--surface); }
.storage-option input[type="radio"] { display: none; }
.storage-option:hover    { border-color: var(--primary); }
.storage-option--active  { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.storage-option-icon     { font-size: 1.8rem; flex-shrink: 0; }
.storage-option-label    { font-weight: 600; font-size: .95rem; }
.storage-option-hint     { font-size: .8rem; color: var(--muted); margin-top: .15rem; }

/* ── Kunden-Tabelle (Settings) ────────────────────────────── */
.data-table          { border-collapse: collapse; font-size: .875rem; }
.data-table th       { text-align: left; padding: .5rem .75rem; font-size: .72rem;
                        font-weight: 700; text-transform: uppercase; color: var(--muted);
                        border-bottom: 2px solid var(--border); }
.data-table td       { padding: .5rem .75rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
.data-table tr:hover td { background: var(--surface); }

/* ── Timelog-Tabelle ─────────────────────────────────────────── */
.timelog-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .825rem;
}
.timelog-table th {
    text-align: left;
    padding: .4rem .6rem;
    font-weight: 600;
    color: var(--muted);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 2px solid var(--border);
    white-space: nowrap;
}
.timelog-table td {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.timelog-table tfoot td {
    border-top: 2px solid var(--border);
    border-bottom: none;
    font-weight: 600;
}

.td-num         { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.td-total-label { color: var(--muted); font-size: .8rem; }
.td-total       { color: var(--primary); }

.running-badge {
    display: inline-block;
    background: #DCFCE7;
    color: #15803D;
    padding: .1rem .4rem;
    border-radius: 4px;
    font-size: .72rem;
    font-weight: 600;
}

.log-note  { font-style: italic; color: var(--muted); }
.doc-link  { color: var(--primary); text-decoration: none; font-weight: 500; }
.doc-link:hover { text-decoration: underline; }
.doc-link-hero  { display:inline-flex; align-items:center; padding:.2rem .5rem; border-radius:4px; background:#1a2540; }
.doc-link-hero:hover { background:#263558; text-decoration:none; }
.doc-link-local { font-size:.82rem; padding:.15rem .45rem; border:1px solid #e5e7eb; border-radius:4px; background:#f8fafc; }
.doc-link-local:hover { background:#f3f4f6; text-decoration:none; }

/* ── Card Title Link ─────────────────────────────────────────── */
.card-title-link { cursor: pointer; }
.card-title-link:hover { color: #2563EB; text-decoration: underline; }

/* ── Timer Note Area (inline stop-with-note) ─────────────────── */
/* ── Timer Stop Sheet ───────────────────────────────────────────────────────── */
.ts-backdrop {
    position: fixed; inset: 0; z-index: 2000;
    background: rgba(0,0,0,.45); backdrop-filter: blur(3px);
    display: flex; align-items: flex-end;
}
.ts-backdrop.hidden { display: none; }
.ts-panel {
    width: 100%; background: #fff;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -8px 40px rgba(0,0,0,.2);
    animation: tsSlideUp .22s cubic-bezier(.22,.68,0,1.2);
    max-height: 85vh; overflow-y: auto;
}
@keyframes tsSlideUp {
    from { transform: translateY(100%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}
.ts-drag-handle {
    width: 40px; height: 4px; background: #d1d5db;
    border-radius: 2px; margin: 12px auto 0;
}
.ts-hd {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 18px 12px;
    border-bottom: 1px solid #f1f5f9;
}
.ts-hd-icon { font-size: 18px; color: #dc2626; }
.ts-hd-title {
    flex: 1; font-size: 15px; font-weight: 700; color: #111827;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ts-close {
    width: 30px; height: 30px; border-radius: 50%;
    background: #f3f4f6; border: none; cursor: pointer;
    color: #6b7280; font-size: 13px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.ts-close:hover { background: #e5e7eb; color: #374151; }
.ts-body { padding: 16px 18px calc(16px + env(safe-area-inset-bottom, 0px)); }
.ts-chips-wrap { margin-bottom: 12px; }
.ts-input {
    width: 100%; box-sizing: border-box;
    border: 1.5px solid #d1d5db; border-radius: 10px;
    padding: 12px 14px; font-size: 16px; font-family: inherit;
    outline: none; margin-bottom: 14px; color: #111827;
}
.ts-input:focus { border-color: #dc2626; box-shadow: 0 0 0 3px rgba(220,38,38,.1); }
.ts-stop-btn {
    width: 100%; padding: 15px; border: none; border-radius: 12px;
    background: #dc2626; color: #fff; font-size: 16px; font-weight: 700;
    cursor: pointer; font-family: inherit; transition: background .15s;
    margin-bottom: 9px; letter-spacing: .01em;
    display: flex; align-items: center; justify-content: center; gap: 8px;
}
.ts-stop-btn:hover   { background: #b91c1c; }
.ts-stop-btn:active  { background: #991b1b; }
.ts-stop-btn:disabled { opacity: .55; cursor: not-allowed; }
.ts-cancel-btn {
    width: 100%; padding: 12px; border: 1.5px solid #e5e7eb; border-radius: 12px;
    background: none; color: #6b7280; font-size: 14px; font-weight: 600;
    cursor: pointer; font-family: inherit; transition: background .12s;
}
.ts-cancel-btn:hover { background: #f9fafb; }

/* ── Danger Outline Button ───────────────────────────────────── */
.btn-danger-sm {
    background: none;
    border: 1px solid var(--danger);
    color: var(--danger);
    padding: .4rem .85rem;
    border-radius: 6px;
    font-size: .825rem;
    font-weight: 500;
    cursor: pointer;
    transition: background .12s;
}
.btn-danger-sm:hover { background: #FEF2F2; }

/* ── Column Bottom Sheet ─────────────────────────────────────── */
.col-sheet-overlay {
    position: fixed; inset: 0; z-index: 9100;
    background: rgba(0,0,0,0);
    display: flex; align-items: flex-end;
    transition: background .25s;
}
.col-sheet-overlay.col-sheet-open { background: rgba(0,0,0,.45); }
.col-sheet {
    width: 100%; background: var(--surface);
    border-radius: 18px 18px 0 0;
    padding-bottom: env(safe-area-inset-bottom, 1rem);
    box-shadow: 0 -6px 40px rgba(0,0,0,.18);
    transform: translateY(100%);
    transition: transform .3s cubic-bezier(.32,1,.5,1);
    max-height: 72vh; overflow-y: auto;
    overscroll-behavior: contain;
}
.col-sheet-overlay.col-sheet-open .col-sheet { transform: translateY(0); }
.col-sheet-handle {
    width: 36px; height: 4px; border-radius: 2px;
    background: var(--border); margin: .55rem auto .3rem;
    flex-shrink: 0;
}
.col-sheet-header {
    display: flex; align-items: baseline; gap: .6rem;
    padding: .5rem 1.25rem .75rem;
    border-bottom: 1px solid var(--border);
}
.col-sheet-title {
    font-size: .7rem; font-weight: 700;
    letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
.col-sheet-from {
    font-size: .8rem; font-weight: 600; color: var(--text);
}
.col-sheet-list {
    padding: .6rem .75rem env(safe-area-inset-bottom, .75rem);
    display: flex; flex-direction: column; gap: .4rem;
}
.col-sheet-btn {
    display: flex; align-items: center; gap: .85rem;
    width: 100%; padding: .9rem 1rem;
    background: var(--bg); border: 1px solid var(--border);
    border-radius: 11px; font-size: .95rem; font-weight: 500;
    cursor: pointer; text-align: left; color: var(--text);
    transition: background .12s, transform .1s;
    min-height: 54px;
}
.col-sheet-btn:hover  { background: var(--border); }
.col-sheet-btn:active { transform: scale(.98); background: var(--border); }
.col-sheet-dot {
    width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0;
}
.col-sheet-btn-name { flex: 1; }
.col-sheet-arrow {
    width: 16px; height: 16px; flex-shrink: 0;
    color: var(--muted); opacity: .5;
}

@media (min-width: 769px) {
    .col-sheet-overlay { align-items: center; justify-content: center; }
    .col-sheet {
        border-radius: 14px; max-width: 380px;
        padding-bottom: .75rem;
        transform: translateY(8px) scale(.97);
        opacity: 0;
        transition: transform .22s cubic-bezier(.32,1,.5,1), opacity .22s;
    }
    .col-sheet-overlay.col-sheet-open .col-sheet {
        transform: translateY(0) scale(1); opacity: 1;
    }
}

/* ── Drag-Drop Close Bar ─────────────────────────────────────── */
.drop-bar {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    display: flex;
    gap: 1rem;
    padding: .75rem 1.25rem;
    background: rgba(15,15,15,.88);
    backdrop-filter: blur(10px);
    z-index: 300;
    transition: transform .2s;
}
.drop-bar.hidden { display: none; }
.drop-zone {
    flex: 1;
    border: 2px dashed #4b5563;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    height: 56px;
    font-weight: 600;
    font-size: .9rem;
    color: #9ca3af;
    transition: border-color .15s, color .15s, background .15s;
    cursor: copy;
}
.drop-zone-archive.drop-active { border-color: #f59e0b; color: #fbbf24; background: rgba(245,158,11,.12); }
.drop-zone-complete.drop-active { border-color: #10b981; color: #34d399; background: rgba(16,185,129,.12); }
@media (max-width: 768px) { .drop-bar { display: none !important; } }

/* ── Sync-Badge (Header) ─────────────────────────────────────── */
.sync-badge {
    display: inline-block;
    padding: .15rem .5rem;
    border-radius: 4px;
    font-size: .72rem;
    font-weight: 600;
    white-space: nowrap;
}
.sync-ok    { background: #D1FAE5; color: #065F46; }
.sync-error { background: #FEE2E2; color: #991B1B; }
.badge-neutral { background: #F3F4F6; color: #6B7280; }

/* ── Wochentag-Chip ──────────────────────────────────────────── */
.day-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 6px;
    border: 1.5px solid #D1D5DB;
    font-size: .8rem;
    font-weight: 600;
    color: #6B7280;
    cursor: pointer;
    user-select: none;
    transition: all .12s;
}
.day-chip.active { background: #3B82F6; border-color: #3B82F6; color: #fff; }
.day-chip:hover:not(.active) { border-color: #9CA3AF; color: #374151; }

/* ── Last-Sync Label (Header Center) ────────────────────────── */
.last-sync-label {
    font-size: .7rem;
    color: rgba(255,255,255,.45);
    white-space: nowrap;
    letter-spacing: .01em;
}

/* ── Hero-gesperrt Feld ──────────────────────────────────────── */
.field-locked {
    background: #F9FAFB !important;
    color: #6B7280 !important;
    cursor: not-allowed;
}

/* ── Log-User Badge ──────────────────────────────────────────── */
.log-user {
    font-size: .75rem;
    font-weight: 600;
    background: #EFF6FF;
    color: #1D4ED8;
    padding: .1rem .4rem;
    border-radius: 4px;
}

/* ── Colored-Column Theme (MeisterTask-Stil) ─────────────────── */
html.theme-colored { background: #F1F5F9; }
html.theme-colored body { background: #F1F5F9; }

html.theme-colored .app-header { background: #1E293B; }

html.theme-colored .board-wrap { background: transparent; }

html.theme-colored .board-columns::-webkit-scrollbar-thumb { background: rgba(0,0,0,.18); }
html.theme-colored .board-columns { scrollbar-color: rgba(0,0,0,.18) transparent; }

html.theme-colored .board-column {
    background: color-mix(in srgb, var(--col-color, #3B82F6) 60%, white);
    box-shadow: 0 1px 4px rgba(0,0,0,.10);
}

html.theme-colored .column-header {
    background: var(--col-color, #3B82F6);
    border-top: none;
    border-radius: 0;
}
html.theme-colored .column-title { color: white; }
html.theme-colored .column-count {
    background: rgba(0,0,0,.18);
    color: white;
}
html.theme-colored .btn-col-add {
    color: white;
    opacity: .85;
}
html.theme-colored .btn-col-add:hover {
    background: rgba(255,255,255,.2);
    opacity: 1;
}

html.theme-colored .column-cards {
    background: transparent;
}
html.theme-colored .column-cards.drag-over {
    background: rgba(0,0,0,.04);
    outline: 2px dashed rgba(0,0,0,.18);
}

html.theme-colored .board-card {
    background: white;
    box-shadow: 0 1px 3px rgba(0,0,0,.10);
    border-left-color: #059669;
}
html.theme-colored .board-card.card-hero { border-left-color: #2563eb; }
html.theme-colored .board-card:hover {
    box-shadow: 0 4px 10px rgba(0,0,0,.15);
}
html.theme-colored .board-card.timer-active {
    border-left-color: #10B981;
}
html.theme-colored .card-title { color: #111827; }
html.theme-colored .card-meta-item { color: #4B5563; }
html.theme-colored .card-time { color: #6B7280; }
html.theme-colored .card-time.has-time { color: #059669; }

html.theme-colored .column-cards::-webkit-scrollbar-thumb { background: rgba(0,0,0,.12); }
html.theme-colored .column-cards { scrollbar-color: rgba(0,0,0,.12) transparent; }


/* ── Zugeordneter User: Initialen-Avatar ─────────────────────── */
.card-avatar {
    position: absolute;
    top: .4rem;
    right: .4rem;
    color: #C4C9D4;
    font-size: .7rem;
    font-weight: 700;
    pointer-events: none;
    letter-spacing: -.02em;
    z-index: 1;
    line-height: 1;
}
html.theme-colored .card-avatar { color: #B0B8C4; }

/* ── Projektnummer + Icons unten rechts ──────────────────────── */
.card-br {
    position: absolute;
    bottom: .2rem;
    right: .35rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .08rem;
    pointer-events: none;
    z-index: 0;
}
.card-indicators {
    display: flex;
    gap: .15rem;
    line-height: 1;
}
.card-indicator {
    width: 14px;
    height: 14px;
    color: #C4C9D4;
    flex-shrink: 0;
}
.card-project-nr {
    font-size: .6rem;
    color: #8E97AA;
    line-height: 1;
    font-weight: 500;
}
html.theme-colored .card-project-nr { color: #9BA4B6; }

.card-event-date {
    position: absolute;
    top: 1.35rem;
    right: .4rem;
    font-size: .6rem;
    color: #3b82f6;
    line-height: 1;
    font-weight: 500;
    pointer-events: none;
    z-index: 1;
}
html.theme-colored .card-event-date { color: #93c5fd; }

.card-activity-date {
    font-size: .6rem;
    color: #8E97AA;
    line-height: 1;
}
html.theme-colored .card-activity-date { color: #9BA4B6; }
.card-days-ago {
    opacity: .8;
}
.card-days-ago.stale {
    color: #ef4444;
    font-weight: 700;
    opacity: 1;
}
.board-card.card-stale {
    border-left: 3px solid #ef4444;
}

/* ── Tätigkeits-Vorlagen Chips ───────────────────────────────── */
.preset-chips {
    display: flex; flex-wrap: wrap; gap: .3rem;
    margin-bottom: .4rem;
}
.ts-chips-wrap .preset-chips { gap: .45rem; margin-bottom: 0; }
.ts-chips-wrap .preset-chip  { padding: .4rem .85rem; font-size: .88rem; }
.preset-chip {
    padding: .2rem .55rem; font-size: .78rem;
    border: 1px solid var(--border); border-radius: 20px;
    background: var(--surface); color: var(--text);
    cursor: pointer; transition: background .12s, border-color .12s;
    white-space: nowrap;
}
.preset-chip:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
.preset-chip.selected { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 600; }

/* ── Mobile Timer-Bar ────────────────────────────────────────── */
/* ── Desktop Timer Buttons ────────────────────────────────────── */
.gt-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .25rem .5rem; font-size: .82rem; border-radius: 5px;
    border: 1px solid rgba(255,255,255,.3); cursor: pointer;
    background: rgba(255,255,255,.12); color: #E2E8F0;
    transition: background .12s; line-height: 1; font-weight: 600;
    min-width: 30px; min-height: 28px;
}
.gt-btn:hover { background: rgba(255,255,255,.25); }
.gt-btn-stop { background: rgba(239,68,68,.25); border-color: rgba(239,68,68,.5); }
.gt-btn-stop:hover { background: rgba(239,68,68,.45); }
.gt-btn-confirm { background: rgba(16,185,129,.25); border-color: rgba(16,185,129,.5); color: #6EE7B7; }
.gt-stop-area {
    display: flex; flex-wrap: wrap; gap: .35rem; align-items: center;
    background: #0F172A; border: 1px solid #334155; border-radius: 8px;
    padding: .4rem .6rem; margin-top: .25rem;
    position: absolute; right: 0; top: calc(100% + 4px);
    min-width: 260px; z-index: 200;
    box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.gt-note-row { display: flex; gap: .3rem; align-items: center; width: 100%; }
.gt-note-input {
    flex: 1; padding: .3rem .5rem; border-radius: 6px;
    border: 1px solid #334155; background: #1E293B; color: #E2E8F0; font-size: .82rem;
}
/* timer slot needs relative positioning for the dropdown */
.header-right { position: relative; }

/* Mobile Timer Bar — only visible on mobile */
.mobile-timer-bar { display: none; }

@media (max-width: 768px) {
  .mobile-timer-bar {
    display: flex; flex-direction: column;
    position: fixed; bottom: 54px; left: 0; right: 0;
    width: 100%; box-sizing: border-box; overflow: hidden;
    /* Über dem Projekt-Modal (.pvm-ov = 1100), damit der rote Banner beim
       Starten/Stoppen sofort sichtbar ist und nicht erst nach dem Schließen.
       Das Stop-Sheet (.ts-backdrop = 2000) bleibt weiterhin darüber. */
    z-index: 1200;
    background: #DC2626; color: #fff;
    padding: .4rem .75rem; gap: .3rem;
    box-shadow: 0 -2px 12px rgba(0,0,0,.2);
  }
  .mobile-timer-bar.hidden { display: none; }

  /* Läuft ein Timer, sitzt die rote Leiste über dem Projekt-Modal — Panel
     nach oben rücken und kürzen, damit der Modal-Footer frei bleibt. */
  body.has-timer-bar .pvm-ov { align-items: flex-start; padding-top: 2.5vh; }
  body.has-timer-bar .pvm-panel { max-height: calc(100vh - 140px); }
  .mobile-timer-bar.paused { background: #6B7280; }

  /* One-row layout: [dot] [name] [clock] [pause] [stop] */
  .mtb-row { display: flex; align-items: center; gap: .5rem; min-width: 0; }
  .mtb-main {
    display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 0;
    cursor: pointer;
  }
  .mtb-dot {
    width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0;
    background: rgba(255,255,255,.9);
    animation: mtb-pulse 1s ease-in-out infinite alternate;
  }
  .mobile-timer-bar.paused .mtb-dot { animation: none; background: rgba(255,255,255,.5); }
  @keyframes mtb-pulse {
    from { opacity: .5; transform: scale(.85); }
    to   { opacity: 1;  transform: scale(1.1); }
  }
  .mtb-name {
    flex: 1; min-width: 0; font-size: .88rem; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .mtb-clock { font-size: .88rem; font-variant-numeric: tabular-nums; font-weight: 700; flex-shrink: 0; }
  .mtb-paused-label { font-size: .8rem; color: rgba(255,255,255,.8); flex-shrink: 0; }
  .mtb-actions { display: flex; gap: .4rem; flex-shrink: 0; }
  /* Tätigkeit-Drawer (erscheint über dem grauen Balken) */
  .mtb-drawer-handle {
    display: flex; align-items: center; justify-content: center; gap: .3rem;
    padding: .22rem .75rem;
    border-bottom: 1px solid rgba(255,255,255,.12);
    cursor: pointer;
    font-size: .72rem; color: rgba(255,255,255,.6);
    letter-spacing: .02em;
    user-select: none;
  }
  .mtb-drawer-handle:active { color: rgba(255,255,255,.9); }
  #mtb-drawer-arrow { font-size: .55rem; }
  .mtb-pause-drawer {
    padding: .45rem .75rem .35rem;
    border-bottom: 1px solid rgba(255,255,255,.12);
  }
  .mtb-pause-drawer.hidden { display: none; }
  .mtb-drawer-hint {
    margin: 0 0 .4rem; font-size: .75rem; color: rgba(255,255,255,.75);
  }

  .mtb-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .45rem .7rem; font-size: 1rem; border-radius: 7px; border: none;
    cursor: pointer; font-weight: 700; line-height: 1; min-width: 40px; min-height: 40px;
    background: rgba(255,255,255,.2); color: #fff; transition: background .12s;
  }
  .mtb-btn:hover { background: rgba(255,255,255,.35); }
  .mtb-confirm-stop { background: rgba(0,0,0,.2); }
  .mtb-stop-wrap { display: flex; flex-direction: column; gap: .3rem; overflow: hidden; }
  /* Input: volle Breite, eigene Zeile */
  .mtb-note-input {
    width: 100%; padding: .35rem .55rem; border-radius: 6px; border: none;
    font-size: 16px; background: rgba(255,255,255,.2); color: #fff;
    box-sizing: border-box;
  }
  .mtb-note-input::placeholder { color: rgba(255,255,255,.65); }
  /* Buttons: nebeneinander, volle Breite */
  .mtb-note-row { display: flex; gap: .4rem; }
  .mtb-note-row .mtb-btn { flex: 1; justify-content: center; font-size: .88rem; padding: .42rem .5rem; }
  .mtb-stop-wrap .preset-chips { margin-bottom: .1rem; }
  .mtb-stop-wrap .preset-chip {
    border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.15);
    color: #fff; font-size: .78rem; padding: .18rem .45rem;
  }
  .mtb-stop-wrap .preset-chip:hover,
  .mtb-stop-wrap .preset-chip.selected { background: rgba(255,255,255,.4); border-color: rgba(255,255,255,.6); }

  /* Desktop timer buttons hidden on mobile (bar handles it) */
  .gt-btn { display: none; }
  .gt-stop-area { display: none !important; }

  /* iOS: verhindert Auto-Zoom beim Antippen von Eingabefeldern */
  input, textarea, select { font-size: 16px !important; }
}

/* ── Logs-Tab Steuerung ──────────────────────────────────────── */
.logs-tab-header {
    display: flex; gap: .4rem; align-items: center; margin-bottom: .5rem;
}
.logs-eye-btn, .logs-add-btn {
    padding: .25rem .5rem; font-size: .85rem; border-radius: 6px;
    border: 1px solid var(--border); background: var(--surface);
    cursor: pointer; color: var(--muted); transition: all .12s;
}
.logs-eye-btn:hover, .logs-add-btn:hover { border-color: var(--primary); color: var(--primary); }
.logs-eye-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.logs-filter-panel {
    display: flex; flex-wrap: wrap; gap: .35rem;
    padding: .5rem .6rem; margin-bottom: .5rem;
    border: 1px solid var(--border); border-radius: 8px;
    background: var(--bg);
}
.filter-check {
    display: flex; align-items: center; gap: .3rem;
    font-size: .8rem; cursor: pointer; color: var(--text);
    padding: .15rem .4rem; border-radius: 4px;
    white-space: nowrap;
}
.filter-check:hover { background: var(--border); }
.filter-check input { cursor: pointer; }
.log-group { margin-bottom: .75rem; }
.log-group-label {
    font-size: .72rem; font-weight: 600; letter-spacing: .04em;
    color: var(--muted); text-transform: uppercase;
    padding: .2rem 0; border-bottom: 1px solid var(--border);
    margin-bottom: .35rem;
}
.log-manual-badge { display: none; } /* replaced by log-src-badge */
.log-src-badge {
    display: inline-block; padding: .05rem .3rem; border-radius: 4px;
    font-size: .68rem; font-weight: 600; margin-left: .25rem; vertical-align: middle;
}
.log-src-manual { background: #EFF6FF; color: var(--primary); border: 1px solid #BFDBFE; }
.log-src-doc    { background: #F0FDF4; color: #059669; border: 1px solid #A7F3D0; font-size: .75rem; }
.log-entry-doc  { border-left: 2px solid #A7F3D0; padding-left: .4rem; }
.logs-add-form {
    padding: .6rem .75rem; margin-bottom: .5rem;
    border: 1px solid var(--border); border-radius: 8px;
    background: var(--bg);
}

/* ── Zeithistorie: editierbare Notizen ───────────────────────── */
.td-note { white-space: normal; }
.tl-note-edit-btn {
    padding: .1rem .25rem; font-size: .75rem; border: none;
    background: none; cursor: pointer; color: var(--muted);
    vertical-align: middle; opacity: 0; transition: opacity .15s;
}
tr:hover .tl-note-edit-btn { opacity: 1; }
.tl-note-form { display: inline-flex; align-items: center; gap: .25rem; }
.tl-note-input {
    padding: .2rem .4rem; font-size: .8rem; border: 1px solid var(--border);
    border-radius: 4px; width: 10rem;
}
.btn-save { color: var(--success) !important; }
.tl-summary-row td { font-size: .82rem; color: var(--muted); padding-top: .5rem; }
.td-summary-label { font-style: italic; }
.td-summary-dur { font-weight: 600; }
.tl-summary-divider td { padding: .15rem 0; border-bottom: 2px solid var(--border); }

/* ── Settings Logs-Seite ─────────────────────────────────────── */
.data-table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.data-table th { padding: .4rem .6rem; text-align: left; font-size: .75rem; color: var(--muted); border-bottom: 1px solid var(--border); }
.data-table td { padding: .45rem .6rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
.data-table tr:last-child td { border-bottom: none; }
.section-hint { font-size: .82rem; color: var(--muted); margin-bottom: .75rem; }
.toggle-label { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; font-size: .85rem; }
.form-control-sm { padding: .25rem .45rem; font-size: .82rem; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--text); }

/* ── Mobile Bottom Nav ───────────────────────────────────────── */
/* Mobile Bottom Nav — hidden on desktop */
.mobile-bottom-nav { display: none; }

/* Mobile Menu Overlay — hidden everywhere by default (uses .hidden class) */
.mobile-menu {
    position: fixed; inset: 0; z-index: 600;
    background: rgba(0,0,0,.45);
    display: flex; align-items: flex-end;
    touch-action: none; /* prevent scroll-through on backdrop */
}
.mobile-menu-sheet {
    width: 100%; background: var(--surface);
    border-radius: 14px 14px 0 0;
    padding: .4rem 0 env(safe-area-inset-bottom, 0);
    box-shadow: 0 -4px 24px rgba(0,0,0,.18);
    max-height: 80vh; overflow-y: auto;
}
.mobile-menu-handle {
    width: 36px; height: 4px; border-radius: 2px;
    background: var(--border); margin: .35rem auto .6rem;
}

@media (max-width: 768px) {
  /* Hide desktop header on mobile */
  .app-header { display: none !important; }

  /* Show bottom nav */
  .mobile-bottom-nav {
    display: flex; align-items: center; justify-content: space-between;
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 490;
    height: 54px; width: 100%; box-sizing: border-box;
    background: #1E293B; border-top: 1px solid rgba(255,255,255,.12);
    padding: 0 1rem;
    box-shadow: none;
  }
  .mbn-logo { text-decoration: none; flex-shrink: 0; }
  .mbn-logo-text { font-size: .95rem; color: #94A3B8; }
  .mbn-logo-text strong { color: #60A5FA; }
  .mbn-right { display: flex; align-items: center; gap: .15rem; }
  .mbn-icon-btn {
    background: none; border: none; cursor: pointer;
    font-size: 1.1rem; color: #94A3B8; padding: .35rem;
    border-radius: 6px; line-height: 1;
  }
  .mbn-future { opacity: .35; cursor: default; }
  .mbn-burger {
    background: none; border: none; cursor: pointer;
    font-size: 1.4rem; color: #E2E8F0; padding: .25rem .3rem;
    border-radius: 6px; line-height: 1;
  }

  /* Timer bar: sits above bottom nav, contained within viewport */
  .mobile-timer-bar {
    bottom: 54px;
    left: 0; right: 0; width: 100%; box-sizing: border-box;
    overflow: hidden;
  }

  /* Push main content above bottom nav (+ timer bar when active) */
  main { padding-bottom: 62px; }
  body.has-timer-bar main { padding-bottom: 62px; } /* timer is above nav, not adding to body */
  /* Board fills its own fixed height — no extra padding needed */
  body.board-page main { padding-bottom: 0; overflow: hidden; }

  /* Tabs: scrollbar horizontal, kompakt */
  .tab-bar {
    padding: 0 .4rem;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .tab-bar::-webkit-scrollbar { display: none; }
  .tab-btn {
    padding: .52rem .7rem;
    font-size: .82rem;
    flex-shrink: 0;
    white-space: nowrap;
  }

  /* Tab-Inhalt: weniger Padding, Tabellen lesbar */
  .tab-pane { padding: .8rem .9rem; }
  .tab-pane .timelog-table { font-size: .72rem; }
  .tab-pane .timelog-table th,
  .tab-pane .timelog-table td { padding: .3rem .3rem; }

}

/* ── Folder Browser ───────────────────────────────────────────────────── */
.fb-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .2rem .1rem;
  padding: .6rem 1rem;
  background: var(--bg-alt, #f4f4f4);
  border-bottom: 1px solid var(--border, #e5e7eb);
  font-size: .82rem;
}
.fb-breadcrumb button {
  background: none;
  border: none;
  color: var(--primary, #3B82F6);
  cursor: pointer;
  padding: .1rem .25rem;
  border-radius: 4px;
  font-size: .82rem;
}
.fb-breadcrumb button:hover { background: var(--bg-hover, #e5e7eb); }
.fb-breadcrumb .fb-sep { color: var(--muted, #9CA3AF); padding: 0 .1rem; }
.fb-breadcrumb strong { color: var(--fg, #111); }

.fb-list {
  max-height: 280px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.fb-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  width: 100%;
  padding: .55rem 1rem;
  background: none;
  border: none;
  border-bottom: 1px solid var(--border, #e5e7eb);
  text-align: left;
  cursor: pointer;
  font-size: .875rem;
  color: var(--fg, #111);
  transition: background .1s;
}
.fb-item:hover { background: var(--bg-hover, #F3F4F6); }
.fb-item:last-child { border-bottom: none; }
.fb-item-up { color: var(--muted, #6B7280); font-style: italic; }
.fb-empty {
  padding: 1.25rem 1rem;
  color: var(--muted, #9CA3AF);
  font-size: .875rem;
  text-align: center;
  margin: 0;
}
.fb-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .75rem 1rem;
  border-top: 1px solid var(--border, #e5e7eb);
  flex-wrap: wrap;
}
.fb-current-path {
  font-size: .78rem;
  color: var(--muted, #9CA3AF);
  font-family: monospace;
  min-width: 0;
  word-break: break-all;
}
.fb-spinner {
  padding: 2rem;
  text-align: center;
  color: var(--muted, #9CA3AF);
  font-size: .9rem;
}

/* Subfolder input in archive settings */
.subfolder-row {
  display: flex;
  gap: .5rem;
  align-items: center;
  margin-top: .5rem;
}
.subfolder-row input[type=text] {
  flex: 1;
  font-family: monospace;
  font-size: .875rem;
}

/* ── Logos ────────────────────────────────────────────────────────────────── */
/* Mobile Bottom Nav */
.mbn-logo-img { display: block; }

/* ── Vollbild-Suche (Board Search Overlay) ────────────────────────────────── */
.bso-overlay {
  position: fixed; inset: 0; z-index: 9500;
  background: rgba(8,10,18,.93);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex; flex-direction: column; align-items: center;
  padding: 3.5rem 1rem 1.5rem;
  overflow: hidden;
}
.bso-overlay.hidden { display: none; }

.bso-top {
  width: 100%; max-width: 660px;
  display: flex; align-items: center; gap: .55rem;
  margin-bottom: 1.4rem;
}
.bso-input-wrap {
  position: relative; flex: 1;
}
.bso-search-icon {
  position: absolute; left: .9rem; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; color: rgba(255,255,255,.45);
  pointer-events: none;
}
.bso-input {
  width: 100%; box-sizing: border-box;
  background: rgba(255,255,255,.09);
  border: 1.5px solid rgba(255,255,255,.22);
  border-radius: 13px; color: #fff;
  font-size: 1.08rem;
  padding: .78rem 3rem .78rem 2.75rem;
  outline: none;
  transition: border-color .15s, background .15s;
  -webkit-appearance: none;
}
.bso-input:focus {
  border-color: rgba(255,255,255,.46);
  background: rgba(255,255,255,.12);
}
.bso-input::placeholder { color: rgba(255,255,255,.38); }
.bso-clear-btn {
  position: absolute; right: .7rem; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.14); border: none; border-radius: 50%;
  width: 22px; height: 22px; display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.7); cursor: pointer; font-size: .8rem;
  transition: background .1s;
}
.bso-clear-btn:hover { background: rgba(255,255,255,.25); }
.bso-close-btn {
  flex-shrink: 0;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px; color: rgba(255,255,255,.65);
  font-size: .8rem; padding: .45rem .75rem;
  cursor: pointer; white-space: nowrap;
  transition: background .1s;
}
.bso-close-btn:hover { background: rgba(255,255,255,.18); }

.bso-results {
  width: 100%; max-width: 660px;
  flex: 1; overflow-y: auto; overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.15) transparent;
  padding-bottom: .5rem;
}
.bso-results::-webkit-scrollbar { width: 4px; }
.bso-results::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 2px; }

.bso-group { margin-bottom: .9rem; }
.bso-group-label {
  display: flex; align-items: center;
  border-left: 3px solid #6366f1;
  padding: .25rem .6rem;
  margin-bottom: .3rem;
  gap: .4rem;
}
.bso-group-label-text {
  font-size: .7rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: rgba(255,255,255,.5);
}
.bso-group-label-count {
  margin-left: auto;
  font-size: .68rem; color: rgba(255,255,255,.3);
  background: rgba(255,255,255,.08);
  border-radius: 8px; padding: .05rem .4rem;
}

.bso-item {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  padding: .65rem 1rem; margin-bottom: .25rem;
  cursor: pointer;
  transition: background .1s, border-color .1s;
  display: flex; flex-direction: column; gap: .2rem;
}
.bso-item:hover {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.15);
}
.bso-item:active { background: rgba(255,255,255,.16); }
.bso-item-title {
  font-size: .93rem; font-weight: 500; color: #f1f5f9; line-height: 1.3;
}
.bso-item-meta {
  display: flex; gap: .45rem; align-items: center;
  font-size: .78rem; color: rgba(255,255,255,.48); flex-wrap: wrap;
}
.bso-item-nr {
  font-size: .72rem; font-family: monospace;
  background: rgba(255,255,255,.1); border-radius: 4px;
  padding: .05rem .38rem; color: rgba(255,255,255,.55);
}
.bso-mark {
  background: rgba(253,224,71,.2); color: #fde047;
  border-radius: 2px; padding: 0 1px;
}
.bso-hint, .bso-empty {
  font-size: .9rem; color: rgba(255,255,255,.28);
  text-align: center; margin-top: 4rem;
  width: 100%; max-width: 660px;
}

/* Board-Header Suchbutton (Desktop) */
.bso-trigger-btn {
  display: flex; align-items: center; gap: .35rem;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 8px; color: rgba(255,255,255,.82);
  padding: .28rem .7rem .28rem .55rem;
  cursor: pointer; font-size: .82rem; flex-shrink: 0;
  white-space: nowrap;
  transition: background .15s;
}
.bso-trigger-btn:hover { background: rgba(255,255,255,.22); }
.bso-trigger-btn svg { flex-shrink: 0; width: 13px; height: 13px; }

/* Suchbutton in der mobilen Bottom-Nav */
.bso-mbn-btn {
  background: none; border: none; cursor: pointer;
  color: #94A3B8; padding: .35rem;
  border-radius: 6px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.bso-mbn-btn svg { width: 20px; height: 20px; }
.bso-mbn-btn:hover { color: #E2E8F0; }

/* ════════════════════════════════════════════════════════════════════════════
   PROJECT VIEW MODAL — F3-Design
   ════════════════════════════════════════════════════════════════════════════ */
/* ── Project View Modal (PVM) ─────────────────────────────────────────────── */
.pvm-ov{position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center}
.pvm-bg{position:absolute;inset:0;background:rgba(0,0,0,.46);backdrop-filter:blur(3px);cursor:pointer}
@keyframes pvmIn{from{transform:scale(.93);opacity:0}to{transform:scale(1);opacity:1}}
.pvm-panel{position:relative;z-index:1;width:calc(100% - 24px);max-width:700px;background:#f8fafc;border-radius:18px;height:92vh;max-height:92vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.25);animation:pvmIn .2s ease-out;overflow:hidden}
/* Header */
.pvm-hd{background:var(--pvm-tc,#059669);padding:14px 16px 14px;flex-shrink:0;position:relative;overflow:hidden;display:flex;gap:13px;align-items:flex-start}
.pvm-wm{position:absolute;right:-6px;bottom:-10px;font-size:64px;font-weight:900;color:rgba(255,255,255,.08);white-space:nowrap;pointer-events:none;z-index:0;line-height:1}
.pvm-av{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;font-size:17px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;z-index:1;margin-top:1px;text-transform:uppercase}
.pvm-hd-info{flex:1;min-width:0;position:relative;z-index:1}
.pvm-close{position:absolute;top:12px;right:14px;width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.2);border:none;cursor:pointer;color:#fff;font-size:15px;display:flex;align-items:center;justify-content:center;z-index:2}
.pvm-close:hover{background:rgba(255,255,255,.3)}
.pvm-title-row{display:flex;align-items:center;gap:8px;padding-right:40px;margin-bottom:4px}
.pvm-title{font-size:18px;font-weight:900;color:#fff;line-height:1.2;min-width:0;flex:1}
.pvm-title-input{font-size:16px;font-weight:700;padding:3px 7px;border-radius:5px;border:none;outline:none;background:rgba(255,255,255,.9);color:#111;min-width:200px;flex:1}
.pvm-title-btn-ok,.pvm-title-btn-cancel{background:rgba(255,255,255,.2);border:none;color:#fff;border-radius:4px;padding:3px 7px;cursor:pointer;font-size:13px;flex-shrink:0}
.pvm-title-btn-ok:hover{background:rgba(255,255,255,.35)}
.pvm-title-btn-cancel:hover{background:rgba(255,255,255,.15)}
.pvm-hero-link{display:inline-flex;align-items:center;flex-shrink:0;background:rgba(255,255,255,.18);border-radius:5px;padding:3px 7px;text-decoration:none;transition:background .15s}
.pvm-hero-link:hover{background:rgba(255,255,255,.30)}
.pvm-hero-sync-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:rgba(255,255,255,.18);border:none;border-radius:5px;padding:3px 7px;color:inherit;font-size:.95rem;cursor:pointer;transition:background .15s;line-height:1}
.pvm-hero-sync-btn:hover{background:rgba(255,255,255,.30)}
.pvm-hero-sync-btn:disabled{opacity:.5;cursor:default}
.pvm-hero-sync-btn.spinning{animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pvm-cust-row{font-size:12px;color:rgba(255,255,255,.85);margin-bottom:3px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.pvm-cust-name{font-weight:700;color:#fff}
.pvm-addr{font-size:11px;color:rgba(255,255,255,.65)}
.pvm-hd-pencil{flex-shrink:0;background:none;border:none;color:rgba(255,255,255,.7);font-size:14px;cursor:pointer;padding:2px 4px;line-height:1;border-radius:4px}
.pvm-hd-pencil:hover{background:rgba(255,255,255,.2);color:#fff}
.pvm-int-tag{font-size:10px;color:rgba(255,255,255,.55);font-style:italic}
.pvm-int-save{background:rgba(255,255,255,.25);color:#fff;border:none;border-radius:7px;padding:5px 9px;font-size:11px;cursor:pointer;flex-shrink:0}
/* Combined customer edit panel */
.pvm-cust-edit{display:none;flex-direction:column;margin-top:6px;background:rgba(0,0,0,.18);border-radius:9px;overflow:hidden;position:relative;z-index:10}
.pvm-cust-edit.open{display:flex}
.pvm-ce-header{display:flex;align-items:center;justify-content:space-between;padding:7px 10px 5px;border-bottom:1px solid rgba(255,255,255,.12)}
.pvm-ce-title{font-size:11px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.05em;opacity:.7}
.pvm-cust-edit-close{background:none;border:none;color:rgba(255,255,255,.7);font-size:13px;cursor:pointer;padding:0 2px;line-height:1}
.pvm-cust-edit-close:hover{color:#fff}
.pvm-ce-section{padding:8px 10px;display:flex;flex-direction:column;gap:5px}
.pvm-ce-label{font-size:10px;color:rgba(255,255,255,.55);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.pvm-ce-divider{height:1px;background:rgba(255,255,255,.12);margin:0}
.pvm-cust-edit-row{display:flex;gap:4px;align-items:center}
.pvm-cust-edit-inp{flex:1;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);border-radius:6px;padding:5px 8px;font-size:11px;color:#fff;min-width:0}
.pvm-cust-edit-inp::placeholder{color:rgba(255,255,255,.4)}
.pvm-cust-edit-inp:focus{outline:none;border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.2)}
.pvm-cust-results{list-style:none;margin:0;padding:0;background:#fff;border-radius:6px;max-height:150px;overflow-y:auto;box-shadow:0 4px 16px rgba(0,0,0,.18)}
.pvm-cust-results:empty{display:none}
.pvm-cust-results .search-result-item{padding:6px 10px;cursor:pointer;font-size:12px;color:#111;border-bottom:1px solid #f3f4f6;list-style:none}
.pvm-cust-results .search-result-item:last-child{border-bottom:none}
.pvm-cust-results .search-result-item:hover{background:#eff6ff}
.pvm-cust-results .search-result-item .result-name{display:block;font-weight:600}
.pvm-cust-results .search-result-item .result-meta{display:block;font-size:10px;color:#6b7280}
.pvm-cust-results .search-hint,.pvm-cust-results .search-no-results{display:block;padding:6px 10px;font-size:11px;color:#9ca3af}
/* AP block — column layout, icons before text, left-aligned */
.pvm-ap-block{margin-top:5px;padding-left:31px}
.pvm-ap-name-row{display:flex;align-items:center;gap:5px;margin-bottom:3px}
.pvm-ap-name{font-size:12px;font-weight:700;color:#fff}
.pvm-ap-links{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px}
.pvm-ap-clnk{display:inline-flex;align-items:center;gap:4px;color:rgba(255,255,255,.85);text-decoration:none;font-size:11px;white-space:nowrap}
.pvm-ap-clnk:hover{color:#fff}
.pvm-ap-sel{margin-top:4px;background:rgba(0,0,0,.18);border-radius:7px;overflow:hidden}
.pvm-ap-sel-item{padding:5px 10px;cursor:pointer;font-size:11px;color:rgba(255,255,255,.9);display:flex;align-items:center;gap:5px}
.pvm-ap-sel-item:hover{background:rgba(255,255,255,.15)}
.pvm-ap-sel-item.active{font-weight:700;color:#fff}
.pvm-ap-sel-item.active::before{content:"✓ ";opacity:.8}
/* AP block in body (Kontakt-Tab) */
.pvm-ap-body-block{padding:8px 0;border-bottom:1px solid #f1f5f9}
.pvm-ap-body-block:last-child{border-bottom:none}
.pvm-ap-body-name{font-size:13px;font-weight:600;color:#111;margin-bottom:4px}
.pvm-ap-body-lnk{display:flex;align-items:center;gap:6px;color:#374151;text-decoration:none;font-size:12px;line-height:1.8}
.pvm-ap-body-lnk:hover{color:#2563eb}
/* Strip */
.pvm-strip{display:flex;gap:5px;padding:7px 14px;border-bottom:1px solid #e5e7eb;background:#fff;overflow-x:auto;flex-shrink:0}
.pvm-strip::-webkit-scrollbar{display:none}
.pvm-chip{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.pvm-chip-col{background:#f3f4f6;color:#374151}
.pvm-chip-due{background:#fef2f2;color:#dc2626;border:1px solid #fca5a5}
.pvm-chip-doc{background:#dbeafe;color:#1d4ed8}
.pvm-chip-evt{background:#f0fdf4;color:#166534}
.pvm-chip-time{background:#faf5ff;color:#7c3aed}
.pvm-timebar{display:flex;height:5px;gap:2px;flex-shrink:0}
.pvm-timebar.hidden{display:none}
.pvm-tbar-seg{height:100%;min-width:6px}
/* Tabs */
.pvm-tabs{display:flex;border-bottom:1px solid #e5e7eb;background:#fff;flex-shrink:0;padding:0 14px}
.pvm-tab-btn{padding:9px 14px;font-size:13px;font-weight:500;color:#6b7280;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;margin-bottom:-1px;transition:color .15s,border-color .15s}
.pvm-tab-btn:hover{color:#374151}
.pvm-tab-btn.active{color:var(--pvm-tc,#059669);border-bottom-color:var(--pvm-tc,#059669);font-weight:700}
.pvm-tab-btn:disabled{opacity:.4;cursor:not-allowed}
.pvm-tab-btn:disabled:hover{color:#6b7280}
/* Tab content */
.pvm-tab-content{flex:1;overflow:hidden;min-height:0}
.pvm-tab-pane{height:100%;overflow-y:auto;padding:12px 14px}
.pvm-tab-pane.hidden{display:none}
.pvm-loading{color:#9ca3af;font-size:12px;text-align:center;padding:28px 0}
.pvm-empty{color:#9ca3af;font-size:13px;text-align:center;padding:24px 0}
.pvm-empty-sm{color:#9ca3af;font-size:12px;margin:0}
/* Card sections */
.pvm-sc{background:#fff;border:1px solid #e5e7eb;border-radius:12px;margin-bottom:10px;overflow:hidden}
.pvm-sc-hd{display:flex;align-items:center;gap:7px;padding:9px 12px;border-bottom:1px solid #f1f5f9;background:#fafafa}
.pvm-sc-ico{font-size:14px}
.pvm-sc-ttl{font-size:11px;font-weight:800;color:#374151;flex:1;text-transform:uppercase;letter-spacing:.3px}
.pvm-sc-bdg{font-size:10px;color:#9ca3af}
.pvm-sc-body{padding:10px 12px}
/* Notizen */
.pvm-notiz{background:#fffbeb;border:1.5px solid #fde68a;margin-bottom:10px;overflow:hidden;border-radius:12px}
.pvm-notiz .pvm-sc-hd{background:#fffbeb;border-bottom:1px solid #fde68a;display:flex;align-items:center;gap:6px}
.pvm-notiz .pvm-sc-ttl{color:#92400e;flex:1}
.pvm-notiz-body{padding:10px 12px;cursor:pointer;min-height:58px}
.pvm-notiz-body:hover{background:#fff7d6}
.pvm-notiz-val{font-size:13px;color:#374151;line-height:1.6;white-space:pre-line}
.pvm-notiz-val.empty{color:#a8a29e;font-style:italic;font-size:12px}
.pvm-note-edit-btn{margin-left:auto;background:none;border:none;cursor:pointer;color:#92400e;font-size:14px;padding:2px 6px;border-radius:4px;opacity:.6}
.pvm-note-edit-btn:hover{opacity:1;background:rgba(146,64,14,.1)}
.pvm-notiz-editor{padding:8px 10px}
.pvm-notiz-ta{width:100%;box-sizing:border-box;border:1.5px solid #fde68a;border-radius:7px;padding:8px 10px;font-size:13px;line-height:1.6;font-family:inherit;resize:vertical;background:#fffef7;outline:none;min-height:90px}
.pvm-notiz-ta:focus{border-color:#f59e0b;box-shadow:0 0 0 2px rgba(245,158,11,.15)}
.pvm-notiz-actions{display:flex;align-items:center;gap:7px;margin-top:6px}
.pvm-note-save{background:#059669;color:#fff;border:none;border-radius:6px;padding:5px 14px;font-size:12px;font-weight:600;cursor:pointer}
.pvm-note-save:hover{background:#047857}
.pvm-note-cancel{background:#f3f4f6;color:#374151;border:none;border-radius:6px;padding:5px 12px;font-size:12px;cursor:pointer}
.pvm-note-cancel:hover{background:#e5e7eb}
.pvm-note-status{font-size:11px;color:#6b7280}
.pvm-note-status.ok{color:#059669;font-weight:600}
.pvm-note-status.err{color:#dc2626;font-weight:600}
/* Zeiterfassung-Detail */
.pvm-td-bar{display:flex;height:10px;border-radius:6px;overflow:hidden;margin-bottom:8px}
.pvm-td-seg{min-width:3px}
.pvm-td-legend{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.pvm-td-leg-row{display:flex;align-items:center;gap:6px;font-size:11px}
.pvm-td-leg-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.pvm-td-leg-name{flex:1;color:#374151}
.pvm-td-leg-val{color:#374151;font-weight:600;font-variant-numeric:tabular-nums}
.pvm-td-src-btn{background:none;border:none;cursor:pointer;font-size:12px;color:#9ca3af;padding:0 2px;line-height:1;opacity:.6;transition:opacity .15s}
.pvm-td-src-btn:hover{opacity:1}
.pvm-td-src-list{border-bottom:1px solid #f1f5f9;padding:6px 12px;display:flex;flex-direction:column;gap:2px;background:#fafafa}
.pvm-td-src-item{font-size:11px;color:#6b7280;padding:3px 6px;border-radius:4px;cursor:pointer;transition:background .1s}
.pvm-td-src-item:hover{background:#f1f5f9;color:#374151}
.pvm-td-src-item.active{color:#2563eb;font-weight:600}
.pvm-td-tracked-hd{font-size:10px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.4px;margin:8px 0 5px;border-top:1px solid #f1f5f9;padding-top:8px}
.pvm-td-users{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.pvm-td-row{display:flex;align-items:center;justify-content:space-between;font-size:12px}
.pvm-td-user{color:#374151;font-weight:600}
.pvm-td-dur{color:#059669;font-weight:700}
.pvm-td-date-hd{font-size:10.5px;font-weight:600;color:#6b7280;margin:8px 0 3px;border-top:1px solid #f1f5f9;padding-top:6px}
.pvm-td-date-hd-first{margin-top:0;border-top:none;padding-top:0}
.pvm-td-entries{display:flex;flex-direction:column;gap:4px}
.pvm-td-entry{display:flex;align-items:center;gap:6px;font-size:11px;color:#9ca3af;min-height:22px}
.pvm-td-edur{font-weight:700;color:#374151;min-width:42px;flex-shrink:0}
.pvm-td-edate{min-width:92px;flex-shrink:0}
.pvm-td-euser{flex-shrink:0;max-width:90px;color:#6b7280;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvm-td-enote{flex:1;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvm-td-no-note{color:#d1d5db}
.pvm-td-edit-btn{flex-shrink:0;background:none;border:none;cursor:pointer;color:#9ca3af;font-size:11px;padding:1px 3px;border-radius:3px;line-height:1;opacity:0;transition:opacity .15s}
.pvm-td-entry:hover .pvm-td-edit-btn{opacity:1}
.pvm-td-edit-btn:hover{background:#e0f2fe;color:#0369a1}
.pvm-td-editing{flex-direction:column;align-items:stretch;gap:4px}
.pvm-td-edit-row1{display:flex;align-items:center;gap:5px}
.pvm-td-edit-row2{display:flex}
.pvm-td-edit-date{font-size:11px;color:#9ca3af;flex-shrink:0;min-width:28px}
.pvm-td-dur-inp{width:36px;padding:2px 5px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;font-weight:700;color:#374151;flex-shrink:0}
.pvm-td-dur-unit{font-size:10px;color:#9ca3af;flex-shrink:0;margin-left:-2px;margin-right:6px}
.pvm-td-time-sep{font-size:11px;color:#d1d5db;flex-shrink:0}
.pvm-td-time-inp{width:44px;padding:2px 5px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;color:#374151;flex-shrink:0;text-align:center}
.pvm-td-note-inp{flex:1;min-width:0;padding:2px 5px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;color:#374151}
.pvm-td-save-btn,.pvm-td-cancel-btn{flex-shrink:0;border:none;border-radius:4px;padding:2px 6px;cursor:pointer;font-size:11px;font-weight:700;line-height:1.5}
.pvm-td-save-btn{background:#dcfce7;color:#166534}
.pvm-td-save-btn:hover{background:#bbf7d0}
.pvm-td-cancel-btn{background:#f1f5f9;color:#6b7280}
.pvm-td-cancel-btn:hover{background:#e2e8f0}
/* Zeit manuell nachtragen (pvmToggleAddTime/pvmSaveNewTime) */
.pvm-td-tracked-hd-row{display:flex;align-items:center;justify-content:space-between}
.pvm-td-add-btn{border:none;border-radius:4px;padding:2px 7px;cursor:pointer;font-size:10px;font-weight:700;text-transform:none;letter-spacing:0;background:#eff6ff;color:#2563eb}
.pvm-td-add-btn:hover{background:#dbeafe}
.pvm-td-add-form{margin:2px 0 8px;padding:7px 8px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:6px;display:flex;flex-direction:column;gap:5px}
.pvm-td-add-form.hidden{display:none}
.pvm-nt-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.pvm-nt-sel,.pvm-nt-date,.pvm-nt-time{padding:3px 5px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;color:#374151}
.pvm-nt-sel{flex:1;min-width:110px}
.pvm-nt-date{width:118px}
.pvm-nt-time{width:64px;text-align:center}
.pvm-nt-note{flex:1;min-width:100px;padding:3px 5px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;color:#374151}
.pvm-nt-actions{align-items:center}
.pvm-nt-error{font-size:10.5px;color:#dc2626}
/* Zeiteintrag löschen/verschieben (pvmTlDelete/pvmTlMoveStart) */
.pvm-td-del-btn:hover{background:#fee2e2;color:#dc2626}
.pvm-td-move-inp{flex:1;min-width:0;padding:3px 6px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;color:#374151}
.pvm-td-move-results{list-style:none;margin:3px 0 0;padding:0;max-height:130px;overflow-y:auto;display:flex;flex-direction:column;gap:1px}
.pvm-td-move-results li{padding:4px 6px;border-radius:4px;cursor:pointer;font-size:11px;display:flex;justify-content:space-between;gap:6px}
.pvm-td-move-results li:hover{background:#eff6ff}
.pvm-tl-move-title{color:#374151;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvm-tl-move-title em{color:#9ca3af;font-style:normal}
.pvm-tl-move-nr{color:#9ca3af;flex-shrink:0}
.pvm-tl-move-none{color:#9ca3af;cursor:default}
.pvm-tl-move-none:hover{background:none}
/* Logbuch */
.pvm-lb-item{display:flex;gap:10px;padding-bottom:10px;position:relative}
.pvm-lb-item:last-child{padding-bottom:0}
.pvm-lb-item:not(:last-child)::before{content:'';position:absolute;left:3px;top:10px;bottom:0;width:2px;background:var(--lc,#f1f5f9)}
.pvm-lb-dot{width:8px;height:8px;border-radius:50%;background:#e5e7eb;flex-shrink:0;margin-top:3px;position:relative;z-index:1}
.pvm-lb-dot.act{background:var(--pvm-tc,#059669)}
.pvm-lb-body{flex:1;min-width:0}
.pvm-lb-head{font-size:11px;font-weight:700;color:#111;margin-bottom:1px}
.pvm-lb-msg{font-size:11px;color:#6b7280;white-space:pre-wrap}
.pvm-lb-msg.clamped{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.pvm-lb-msg-wrap{margin-bottom:2px}
.pvm-lb-msg-toggle{display:block;background:none;border:none;padding:0;margin-top:2px;font-size:10px;font-weight:600;color:#2563eb;cursor:pointer}
.pvm-lb-msg-toggle:hover{text-decoration:underline}
.pvm-lb-msg-toggle.hidden{display:none}
.pvm-lb-meta{font-size:10px;color:#9ca3af}
.pvm-lb-hero{font-size:10px;color:#059669;font-weight:600}
.pvm-lb-empty{color:#9ca3af;font-size:12px;margin:0}
/* Bild-Upload-Thumbnails im Logbuch (einzeln + Tagesgruppe) */
.pvm-lb-thumbs{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.pvm-lb-thumb{width:36px;height:36px;border-radius:6px;overflow:hidden;cursor:pointer;background:#f1f5f9;border:1px solid #e5e7eb;flex-shrink:0}
.pvm-lb-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pvm-lb-thumb:hover{border-color:#93c5fd}
.pvm-lb-thumb-more{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#6b7280;background:#f1f5f9}
/* Status-Wechsel Chevron-Marker */
.pvm-lb-st-row{display:flex;gap:10px;padding:4px 0 8px;position:relative;align-items:flex-start}
.pvm-lb-st-row:not(:last-child):not(.pvm-lb-st-hidden)::before{content:'';position:absolute;left:3px;top:0;bottom:0;width:2px;background:var(--lc,#f1f5f9)}
.pvm-lb-chev{flex-shrink:0;margin-top:4px;position:relative;z-index:1}
.pvm-lb-st-body{flex:1;min-width:0;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.pvm-lb-st-lbl{font-size:10px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.3px}
.pvm-lb-st-date{font-size:10px;color:#9ca3af;white-space:nowrap}
.pvm-lb-st-hidden{display:none}
.pvm-lb-st-exp{display:flex;align-items:center;gap:5px;padding:3px 0 6px 18px;cursor:pointer;color:#9ca3af;font-size:10px;user-select:none}
.pvm-lb-st-exp:hover{color:#6b7280}
.pvm-lb-exp-dots{letter-spacing:1px;font-size:11px}
.pvm-lb-exp-lbl{font-style:italic}
/* Status-Legende unter dem Logbuch */
.pvm-st-legend{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:8px;border-top:1px solid #f1f5f9}
.pvm-st-chip{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:#6b7280}
.pvm-st-chip-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
/* Logbuch toggle + add buttons */
.pvm-lb-add-btn{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:#e5e7eb;border:none;color:#374151;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;padding:0}
.pvm-lb-add-btn:hover{background:#bfdbfe;color:#1d4ed8}
/* Log entry form */
.pvm-log-form{padding:8px 12px 10px;background:#f0f9ff;border-bottom:1px solid #bae6fd;display:flex;flex-direction:column;gap:6px}
.pvm-log-form.hidden{display:none}
.pvm-log-inp{padding:5px 8px;border:1px solid #d1d5db;border-radius:5px;font-size:12px;width:100%;box-sizing:border-box;outline:none;background:#fff}
.pvm-log-inp:focus{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.1)}
.pvm-log-ta{padding:5px 8px;border:1px solid #d1d5db;border-radius:5px;font-size:12px;width:100%;box-sizing:border-box;resize:vertical;outline:none;background:#fff;min-height:44px;font-family:inherit}
.pvm-log-ta:focus{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.1)}
.pvm-log-form-footer{display:flex;align-items:center;gap:6px}
.pvm-log-sync-lbl{display:flex;align-items:center;gap:4px;font-size:11px;color:#6b7280;cursor:pointer;margin-right:auto;user-select:none}
.pvm-log-cancel-btn{padding:3px 10px;background:none;color:#6b7280;border:1px solid #d1d5db;border-radius:5px;font-size:11px;cursor:pointer}
.pvm-log-save-btn{padding:3px 12px;background:#2563eb;color:#fff;border:none;border-radius:5px;font-size:11px;font-weight:600;cursor:pointer}
.pvm-log-save-btn:hover{background:#1d4ed8}
.pvm-lb-add{display:flex;align-items:center;gap:8px;padding:7px 9px;background:#f8fafc;border:1px dashed #d1d5db;border-radius:9px;cursor:pointer;margin-bottom:10px}
.pvm-lb-add:hover{border-color:#93c5fd;background:#eff6ff}
.pvm-lb-add span{font-size:12px;color:#9ca3af;font-style:italic;flex:1}
.pvm-lb-add-ico{width:22px;height:22px;border-radius:50%;background:#e5e7eb;display:flex;align-items:center;justify-content:center;font-size:14px;color:#9ca3af;flex-shrink:0}
/* Docs + Images */
.pvm-doc-row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid #f1f5f9}
.pvm-doc-row:last-child{border-bottom:none}
.pvm-doc-nr{font-size:11px;font-weight:700;color:#2563eb;flex-shrink:0}
.pvm-doc-type{font-size:11px;color:#374151;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvm-doc-date{font-size:10px;color:#9ca3af;flex-shrink:0}
.pvm-doc-actions{display:flex;gap:4px;align-items:center;flex-shrink:0;margin-left:auto}
.pvm-img-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pvm-img-tile{aspect-ratio:1;border-radius:8px;background:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:18px;color:#d1d5db;overflow:hidden;text-decoration:none}
.pvm-img-tile img{width:100%;height:100%;object-fit:cover;display:block;border-radius:8px}
.pvm-img-tile:is(a):hover{opacity:.82;transition:opacity .15s}
.pvm-img-tile.pvm-img-err::after{content:'🖼';font-size:18px}
.pvm-img-tile.pvm-img-more{background:#e0e7ff;color:#6366f1;font-size:10px;font-weight:700}
.pvm-img-cat{margin-bottom:14px}
.pvm-img-cat-hd{display:flex;align-items:center;gap:7px;margin-bottom:7px}
.pvm-img-cat-name{font-size:.8rem;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.04em}
.pvm-img-cat-ct{font-size:.72rem;background:#e2e8f0;color:#64748b;border-radius:9px;padding:1px 7px;font-weight:600}
/* Bilder-Upload */
.pvm-upload-zone{border:2px dashed #93c5fd;border-radius:12px;padding:18px 10px 14px;text-align:center;background:#f0f7ff;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;transition:background .15s,border-color .15s;user-select:none}
.pvm-upload-zone.drag-over{background:#dbeafe;border-color:#2563eb}
.pvm-upload-icon{font-size:1.7rem;line-height:1}
.pvm-upload-text{font-size:.82rem;color:#374151;font-weight:600}
.pvm-upload-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:2px}
.pvm-upload-btn{display:inline-flex;align-items:center;justify-content:center;background:#2563eb;color:#fff;border:none;border-radius:9px;padding:9px 18px;font-size:.82rem;font-weight:700;cursor:pointer;min-height:42px;min-width:100px;gap:5px;-webkit-tap-highlight-color:transparent}
.pvm-upload-btn:hover{background:#1d4ed8}
.pvm-upload-btn-cam{background:#059669}
.pvm-upload-btn-cam:hover{background:#047857}
.pvm-upload-pending-inner{background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 10px 12px;margin-bottom:4px;display:flex;flex-direction:column;gap:8px}
.pvm-upload-cat-bar{display:flex;gap:6px;align-items:center}
.pvm-uq-cat-all{flex:1;min-width:0;height:38px;border:1.5px solid #d1d5db;border-radius:8px;padding:0 10px;font-size:.85rem;background:#fff;outline:none;box-sizing:border-box}
.pvm-uq-cat-all:focus{border-color:#2563eb}
.pvm-uq-list{display:flex;flex-direction:column;gap:6px}
.pvm-uq-item{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #e2e8f0;border-radius:9px;padding:6px 8px}
.pvm-uq-item.pvm-uq-done{border-color:#86efac;background:#f0fdf4}
.pvm-uq-item.pvm-uq-error{border-color:#fca5a5;background:#fff1f2}
.pvm-uq-item.pvm-uq-uploading{opacity:.65}
.pvm-uq-thumb{width:52px;height:52px;object-fit:cover;border-radius:7px;flex-shrink:0;background:#e5e7eb;cursor:zoom-in}
.pvm-uq-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.pvm-uq-name{font-size:.72rem;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pvm-uq-cat{height:34px;border:1.5px solid #d1d5db;border-radius:7px;padding:0 8px;font-size:.82rem;width:100%;box-sizing:border-box;background:#f8fafc;outline:none}
.pvm-uq-cat:focus{border-color:#2563eb;background:#fff}
.pvm-uq-cat:disabled{background:#f1f5f9;color:#9ca3af}
.pvm-uq-act{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px}
.pvm-uq-rm{background:none;border:none;color:#94a3b8;cursor:pointer;font-size:1.1rem;padding:4px;line-height:1;min-height:32px;min-width:32px}
.pvm-uq-rm:hover{color:#ef4444}
.pvm-uq-status{font-size:.95rem;font-weight:700;display:block;text-align:center}
.pvm-uq-status.ok{color:#16a34a}
.pvm-uq-status.err{color:#dc2626;cursor:help}
.pvm-uq-status.spin{color:#64748b;animation:spin 1s linear infinite}
.pvm-upload-submit{width:100%;background:#2563eb;color:#fff;border:none;border-radius:10px;padding:13px;font-size:.9rem;font-weight:700;cursor:pointer;min-height:50px;-webkit-tap-highlight-color:transparent}
.pvm-upload-submit:hover{background:#1d4ed8}
.pvm-upload-done-btn{width:100%;background:#059669;color:#fff;border:none;border-radius:10px;padding:13px;font-size:.9rem;font-weight:700;cursor:pointer;min-height:50px;-webkit-tap-highlight-color:transparent}
.pvm-upload-done-btn:hover{background:#047857}
@media(max-width:480px){
  .pvm-upload-btn{padding:10px 14px;font-size:.8rem;min-height:44px}
  .pvm-uq-thumb{width:44px;height:44px}
  .pvm-img-grid{grid-template-columns:repeat(3,1fr)}
}
/* Kontakt-Tab */
.pvm-ap-row.body-row{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid #f1f5f9}
.pvm-ap-row.body-row:last-child{border-bottom:none}
.pvm-ap-row.body-row .pvm-ap-name{font-size:13px;color:#111;flex:1}
.pvm-ap-row.body-row .pvm-ap-lnk{background:#f3f4f6;color:#374151}
.pvm-ap-row.body-row .pvm-ap-lnk:hover{background:#dbeafe;color:#1d4ed8}
/* Termine-Tab */
.pvm-ev-list{display:flex;flex-direction:column;gap:1px}
.pvm-ev-row{display:flex;gap:12px;padding:9px 12px;border-radius:10px;background:#fff;border:1px solid #e5e7eb;margin-bottom:6px;align-items:flex-start}
.pvm-ev-row.past{opacity:.55}
.pvm-ev-date{font-size:11px;font-weight:700;color:#374151;white-space:nowrap;min-width:70px}
.pvm-ev-info{flex:1;min-width:0}
.pvm-ev-title{font-size:13px;font-weight:600;color:#111;display:block;margin-bottom:2px}
.pvm-ev-meta{font-size:11px;color:#6b7280}
.pvm-ev-badge{display:inline-block;font-size:9px;font-weight:700;padding:1px 6px;border-radius:4px;margin-left:6px;vertical-align:middle}
.pvm-ev-badge.hero{background:#dbeafe;color:#1d4ed8}
.pvm-ev-badge.sug{background:#fef3c7;color:#b45309}
.pvm-ev-cal-link{display:inline-block;margin-top:10px;font-size:12px;color:#6b7280;text-decoration:none}
.pvm-ev-cal-link:hover{color:#374151;text-decoration:underline}

/* ── PVM Termine-Tab: Wochenansicht ── */
.pvm-wk-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.pvm-wk-nav-btn{background:none;border:1px solid #d1d5db;border-radius:5px;cursor:pointer;padding:2px 9px;font-size:1rem;color:#6b7280;line-height:1.5}
.pvm-wk-nav-btn:hover{background:#f3f4f6}
.pvm-wk-label{font-size:.78rem;font-weight:700;color:#374151;letter-spacing:.01em}
.pvm-wk-body{display:flex;flex-direction:column;gap:3px}
.pvm-wk-day{display:flex;gap:8px;align-items:flex-start;padding:6px 8px;border-radius:8px;border:1px solid transparent}
.pvm-wk-day.pvm-wk-today{background:#eff6ff;border-color:#bfdbfe}
.pvm-wk-day.pvm-wk-due-day{background:#f0fdf4;border-color:#bbf7d0}
.pvm-wk-day.pvm-wk-past{opacity:.55}
.pvm-wk-date{display:flex;flex-direction:column;align-items:center;min-width:28px;padding-top:1px}
.pvm-wk-wd{font-size:.65rem;font-weight:700;color:#94a3b8;text-transform:uppercase;line-height:1}
.pvm-wk-dd{font-size:.85rem;font-weight:700;color:#374151;line-height:1.3}
.pvm-wk-today .pvm-wk-wd{color:#2563eb}
.pvm-wk-today .pvm-wk-dd{color:#2563eb}
.pvm-wk-evs{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.pvm-wk-ev{display:flex;align-items:baseline;gap:5px;font-size:.75rem;border-radius:5px;padding:3px 7px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pvm-wk-ev-own{background:#dbeafe;color:#1e3a8a;font-weight:600}
.pvm-wk-ev-other{background:#f1f5f9;color:#94a3b8;opacity:.7}
.pvm-wk-ev-time{font-size:.68rem;font-weight:700;flex-shrink:0;color:inherit;opacity:.8}
.pvm-wk-ev-title{overflow:hidden;text-overflow:ellipsis}
.pvm-wk-due-marker{background:#dcfce7;color:#15803d;font-weight:700;font-size:.72rem}
.pvm-wk-due-marker.over{background:#fee2e2;color:#dc2626}
.pvm-wk-free{font-size:.72rem;color:#d1d5db;padding:2px 0}
/* ── PVM Termine Tab (planning system) ──────────────────────── */
.pterm-section{margin-bottom:16px}
.pterm-sec-hd{display:flex;align-items:center;gap:8px;padding:8px 0 6px;border-bottom:2px solid #e5e7eb;margin-bottom:8px}
.pterm-sec-icon{font-size:1.1rem;flex-shrink:0}
.pterm-sec-title{font-size:.88rem;font-weight:700;color:#1e293b;flex:1;letter-spacing:.01em}
.pterm-add-btn{margin-left:auto;background:#2563eb;color:#fff;border:none;border-radius:7px;padding:5px 12px;font-size:.78rem;font-weight:700;cursor:pointer;white-space:nowrap;min-height:34px}
.pterm-add-btn:hover{background:#1d4ed8}
.pterm-empty{font-size:.8rem;color:#94a3b8;padding:6px 0 2px;margin:0}
/* Terminart-Gruppen */
.pterm-group{margin-bottom:14px}
.pterm-group:last-child{margin-bottom:0}
.pterm-group-hd{display:flex;align-items:center;gap:7px;padding:2px 0 6px}
.pterm-group-dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex-shrink:0}
.pterm-group-title{font-size:.78rem;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.03em;flex:1}
.pterm-group-count{font-size:.68rem;font-weight:700;color:#94a3b8;background:#f1f5f9;border-radius:8px;padding:1px 7px}
.pterm-past-group{margin-top:2px}
.pterm-past-summary{font-size:.74rem;color:#94a3b8;cursor:pointer;padding:4px 2px;user-select:none;list-style:none}
.pterm-past-summary::-webkit-details-marker{display:none}
.pterm-past-summary::before{content:'▸ ';display:inline-block}
.pterm-past-group[open] .pterm-past-summary::before{content:'▾ '}
.pterm-past-summary:hover{color:#64748b}
/* Cards */
.pterm-card{background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 12px;margin-bottom:8px}
.pterm-card.is-past{background:#f1f5f9;border-color:#e5e7eb;opacity:.6}
.pterm-card.is-past .pterm-card-date{color:#64748b;font-weight:600}
.pterm-card-top{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap}
.pterm-card-date{font-size:.82rem;font-weight:700;color:#1e293b;flex:1;min-width:0}
.pterm-card-btns{display:flex;gap:5px;flex-shrink:0}
.pterm-btn{background:none;border:1.5px solid #e2e8f0;border-radius:6px;cursor:pointer;font-size:.85rem;padding:3px 9px;color:#64748b;line-height:1.4;min-height:30px;min-width:30px}
.pterm-btn:hover{background:#f1f5f9}
.pterm-btn-shift{color:#2563eb;border-color:#93c5fd;font-size:.75rem;padding:3px 8px}
.pterm-btn-shift:hover{background:#eff6ff}
.pterm-btn-edit{color:#64748b}
.pterm-btn-del{color:#ef4444;border-color:#fca5a5}
.pterm-btn-del:hover{background:#fff1f2}
.pterm-note{font-size:.78rem;color:#64748b;margin-top:5px;line-height:1.4;border-top:1px solid #e5e7eb;padding-top:4px;white-space:pre-wrap;word-break:break-word}
/* Inline form */
.pterm-form{margin-bottom:10px}
.pterm-form.hidden{display:none}
.pterm-form-inner{background:#fff;border:1.5px solid #bfdbfe;border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.pterm-form-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pterm-form-row-check{gap:6px}
.pterm-form-lbl{font-size:.78rem;font-weight:600;color:#374151;min-width:90px;flex-shrink:0}
.pterm-form-input{flex:1;min-width:120px;height:34px;border:1.5px solid #d1d5db;border-radius:7px;padding:0 8px;font-size:.85rem;color:#1e293b;background:#f8fafc;outline:none;box-sizing:border-box}
.pterm-form-input:focus{border-color:#2563eb;background:#fff}
.pterm-form-input-sm{max-width:110px;flex:none}
.pterm-form-ta{flex:1;min-width:120px;border:1.5px solid #d1d5db;border-radius:7px;padding:6px 8px;font-size:.82rem;color:#1e293b;background:#f8fafc;outline:none;resize:vertical;font-family:inherit;box-sizing:border-box}
.pterm-form-ta:focus{border-color:#2563eb;background:#fff}
.pterm-form-hint{font-size:.72rem;color:#94a3b8;flex-shrink:0}
.pterm-check-lbl{display:flex;align-items:center;gap:6px;font-size:.82rem;color:#374151;cursor:pointer;user-select:none}
.pterm-check-lbl input[type=checkbox]{width:16px;height:16px;cursor:pointer;accent-color:#2563eb}
.pterm-form-btns{display:flex;gap:8px;margin-top:2px;flex-wrap:wrap}
/* Capacity week view */
.pterm-cap-section{background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 12px;margin-top:4px}
.pterm-cap-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;gap:6px}
.pterm-cap-nav-btn{background:none;border:1.5px solid #cbd5e1;border-radius:7px;cursor:pointer;padding:4px 13px;font-size:1.1rem;color:#64748b;line-height:1.4;min-height:34px;min-width:36px}
.pterm-cap-nav-btn:hover{background:#e2e8f0}
.pterm-cap-label{font-size:.8rem;font-weight:700;color:#334155;text-align:center;letter-spacing:.01em;flex:1}
.pterm-cap-body{display:flex;flex-direction:column;gap:4px}
.pterm-cap-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;border:1.5px solid transparent;background:#fff;transition:background .1s}
.pterm-cap-row.is-today{background:#eff6ff;border-color:#bfdbfe}
.pterm-cap-row.is-past{opacity:.55}
.pterm-cap-row.is-blocked{background:#fef9c3;border-color:#fde047}
.pterm-cap-date{display:flex;flex-direction:column;align-items:center;min-width:30px;flex-shrink:0}
.pterm-cap-wd{font-size:.62rem;font-weight:700;color:#94a3b8;text-transform:uppercase;line-height:1}
.pterm-cap-dd{font-size:.88rem;font-weight:700;color:#374151;line-height:1.3}
.is-today .pterm-cap-wd,.is-today .pterm-cap-dd{color:#2563eb}
.pterm-cap-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.pterm-cap-bar-wrap{height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}
.pterm-cap-bar{height:100%;border-radius:4px;background:#22c55e;transition:width .3s}
.pterm-cap-bar.busy{background:#f59e0b}
.pterm-cap-bar.full{background:#ef4444}
.pterm-cap-info{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
.pterm-cap-chips{display:flex;flex-wrap:wrap;gap:3px;flex:1;min-width:0}
.pterm-cap-chip{display:inline-block;font-size:.68rem;padding:1px 6px;border-radius:4px;background:#e5e7eb;color:#64748b;white-space:nowrap;max-width:100px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.pterm-cap-chip.own{background:#dbeafe;color:#1e40af;font-weight:700}
.pterm-due-flag{color:#16a34a;font-size:.75rem;vertical-align:middle;margin-left:2px}
.pterm-blocked-tag{font-size:.68rem;padding:1px 7px;border-radius:4px;background:#fde68a;color:#92400e;font-weight:700;white-space:nowrap}
.pterm-cal-link{font-size:.75rem;color:#2563eb;text-decoration:none;white-space:nowrap;flex-shrink:0}
.pterm-cal-link:hover{text-decoration:underline}
.pterm-cap-legend{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:7px;border-top:1px solid #e5e7eb;flex-wrap:wrap}
/* Scheduler */
.pterm-cap-row.is-suggested{background:#f0fdf4;border-color:#22c55e}
.pterm-sug-tag{font-size:.68rem;padding:1px 7px;border-radius:4px;background:#dcfce7;color:#16a34a;font-weight:700;white-space:nowrap}
.pterm-sched{background:#fff;border:1.5px solid #bfdbfe;border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.pterm-sched-inputs{display:flex;flex-direction:column;gap:8px}
.pterm-sched-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pterm-sched-cap{margin-top:0}
.pterm-sched-btns{display:flex;gap:8px;justify-content:space-between;flex-wrap:wrap;align-items:center}
.pterm-sched-cancel{text-align:center}
.pterm-sched-loading{padding:16px;text-align:center;color:#64748b;font-size:.82rem}
.pterm-sched-noslot{font-size:.8rem;color:#ef4444;padding:6px 0 2px;margin:0}
.pterm-sched-nav:disabled,.pterm-sched-nav.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}
.pterm-sched-recalc{flex-shrink:0;font-size:.75rem;padding:4px 10px}
/* Mobile overrides */
@media(max-width:480px){
  .pterm-form-lbl{min-width:70px;font-size:.75rem}
  .pterm-form-input{min-width:0;font-size:.82rem}
  .pterm-form-input-sm{max-width:90px}
  .pterm-add-btn{padding:5px 9px;font-size:.75rem}
  .pterm-cap-chip{max-width:72px}
  .pterm-card-btns{gap:3px}
  .pterm-btn{padding:3px 7px;font-size:.8rem}
  .pterm-cap-nav-btn{padding:4px 10px}
  .pterm-sched-btns{gap:6px}
  .pterm-sched-btns .btn{font-size:.75rem;padding:5px 8px}
}
/* Lightbox */
.dm-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.dm-lb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.88);cursor:zoom-out}
.dm-lb-close{position:absolute;top:14px;right:18px;z-index:2;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:1.3rem;width:38px;height:38px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}
.dm-lb-close:hover{background:rgba(255,255,255,.28)}
.dm-lb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:1.5rem;width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dm-lb-nav:hover{background:rgba(255,255,255,.28)}
.dm-lb-nav:disabled{opacity:.25;pointer-events:none}
.dm-lb-prev{left:14px}
.dm-lb-next{right:14px}
.dm-lb-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;max-width:90vw;max-height:90vh}
.dm-lb-img-wrap{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.dm-lb-img{max-width:88vw;max-height:78vh;object-fit:contain;border-radius:6px;display:block}
.dm-lb-info{text-align:center;padding:8px 4px 0;color:#e5e7eb;display:flex;flex-direction:column;gap:3px}
.dm-lb-meta{display:flex;align-items:center;justify-content:center;gap:8px}
.dm-lb-counter{font-size:.75rem;color:#94a3b8}
.dm-lb-download{font-size:.72rem;color:#93c5fd;background:rgba(37,99,235,.25);border-radius:5px;padding:2px 10px;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.dm-lb-download:hover{background:rgba(37,99,235,.4);color:#dbeafe}
.dm-lb-filename{font-size:.8rem;color:#d1d5db;max-width:70vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dm-lb-category{font-size:.72rem;color:#93c5fd;background:rgba(37,99,235,.25);border-radius:5px;padding:1px 9px;display:inline-block}
/* Logbuch: Dokument-Link + Mail-Zeile/-Modal */
.pvm-lb-doclink{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:#2563eb;margin-top:4px}
.pvm-lb-doclink img{flex-shrink:0}
.pvm-lb-mail-row{display:flex;align-items:center;gap:8px;margin-top:3px}
.pvm-lb-mail-to{font-size:10px;color:#6b7280}
.pvm-lb-mail-open{font-size:10px;font-weight:600;color:#2563eb;background:none;border:none;padding:0;cursor:pointer;text-decoration:underline}
.pvm-mail-ov{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.pvm-mail-bg{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.pvm-mail-panel{position:relative;z-index:1;background:#fff;border-radius:12px;width:min(640px,92vw);max-height:86vh;display:flex;flex-direction:column;padding:20px;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.pvm-mail-close{position:absolute;top:10px;right:10px;background:#f1f5f9;border:none;color:#374151;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center}
.pvm-mail-close:hover{background:#e5e7eb}
.pvm-mail-loading{padding:30px 10px;text-align:center;color:#9ca3af;font-size:13px}
.pvm-mail-subject{font-size:14px;font-weight:700;color:#111;padding-right:30px;margin-bottom:8px}
.pvm-mail-meta{display:flex;flex-direction:column;gap:2px;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #f1f5f9}
.pvm-mail-meta-row{display:flex;gap:6px;font-size:11px}
.pvm-mail-meta-row span:first-child{color:#9ca3af;min-width:40px}
.pvm-mail-meta-row span:last-child{color:#374151}
.pvm-mail-iframe{flex:1;min-height:300px;border:none;border-radius:8px;background:#fff}
/* Footer */
.pvm-foot{display:flex;align-items:center;gap:7px;padding:10px 14px;border-top:1px solid #e5e7eb;flex-shrink:0;background:#fff}
.t-icon{display:inline-block;vertical-align:-0.13em;width:1em;height:1em;flex-shrink:0}
.pvm-ft-timer{display:inline-flex;align-items:center;gap:5px;padding:0 14px;height:36px;background:#2563eb;color:#fff;border:none;border-radius:9px;font-size:12px;font-weight:700;cursor:pointer}
.pvm-ft-timer:hover{background:#1d4ed8}
.pvm-ft-act{height:36px;padding:0 13px;border-radius:9px;font-size:12px;font-weight:600;cursor:pointer;background:none;border:1.5px solid}
.pvm-ft-arch{color:#b45309;border-color:#d97706}
.pvm-ft-arch:hover{background:#fef3c7}
.pvm-ft-done{color:#059669;border-color:#059669}
.pvm-ft-done:hover{background:#d1fae5}
.pvm-ft-move{color:#2563eb;border-color:#2563eb}
.pvm-ft-move:hover{background:#dbeafe}
.pvm-ft-gap{flex:1}
.pvm-ft-ico{width:36px;height:36px;border-radius:9px;border:1.5px solid #e5e7eb;background:#f8fafc;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;color:#374151}
.pvm-ft-ico:hover{background:#eff6ff;border-color:#93c5fd}

/* ── Termin-Formular (#cal-modal) — gemeinsam genutzt von Kalender und Board
   (Projekt-Modal-Termine-Tab). .cal-modal-overlay/.cal-modal-dialog/… werden
   auch von #cal-sug-modal und #cal-ical-modal (nur calendar.html) verwendet. ── */
.ev-project-dropdown{position:absolute;top:100%;left:0;right:0;z-index:1100;background:var(--card-bg,#fff);border:1px solid var(--border,#e5e7eb);border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.12);max-height:220px;overflow-y:auto;margin-top:2px}
.ev-project-opt{padding:6px 10px;cursor:pointer;font-size:13px;line-height:1.35}
.ev-project-opt:hover,.ev-project-opt.active{background:var(--hover-bg,#f3f4f6)}
.ev-project-opt .epo-customer{color:var(--text-muted,#6b7280);font-size:11px}
.ev-project-opt.epo-empty{color:var(--text-muted,#6b7280)}
.ev-project-opt.epo-none{color:var(--text-muted,#6b7280);padding:8px 10px;cursor:default}
.ev-project-opt.epo-allsearch{color:#2563eb;font-weight:600;border-top:1px solid var(--border,#e5e7eb)}
.ev-project-opt.epo-allsearch:hover{background:#eff6ff}

.cal-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}
.cal-modal-overlay.hidden{display:none}
.cal-modal-dialog{background:var(--card-bg,#fff);border-radius:10px;width:100%;max-width:800px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.cal-modal-head{padding:16px 20px 14px;border-bottom:1px solid var(--border,#e5e7eb);display:flex;align-items:center;justify-content:space-between}
.cal-modal-head h2{font-size:15px;font-weight:600;margin:0}
.cal-modal-body{padding:18px 20px}
.cal-modal-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;align-items:start}
@media (max-width:640px){.cal-modal-cols{grid-template-columns:1fr}}
/* Sticky statt am Ende des (teils langen) Formulars vergraben — der Speichern-
   Button muss immer sichtbar bleiben, ohne dass man erst runterscrollen muss
   (v.a. mobil und im ins Projekt-Modal eingebetteten Termine-Tab relevant, s.
   #pvm-tab-termine .cal-modal-foot unten). Funktioniert unabhängig davon, ob
   der jeweils nächste scrollende Vorfahre .cal-modal-dialog oder .pvm-tab-pane
   ist — sticky bezieht sich immer auf den nächsten Scroll-Container. */
.cal-modal-foot{padding:12px 20px;border-top:1px solid var(--border,#e5e7eb);display:flex;justify-content:flex-end;gap:8px;position:sticky;bottom:0;z-index:2;background:var(--card-bg,#fff);box-shadow:0 -6px 10px -8px rgba(0,0,0,.18)}
.ev-user-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}

.ev-title-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.ev-color-swatch{width:34px;height:34px;padding:0;flex-shrink:0;cursor:pointer;border:2px solid var(--border,#e5e7eb);border-radius:50%;background:none;-webkit-appearance:none;appearance:none;overflow:hidden}
.ev-color-swatch::-webkit-color-swatch-wrapper{padding:0;border-radius:50%}
.ev-color-swatch::-webkit-color-swatch{border:none;border-radius:50%}
.ev-color-swatch::-moz-color-swatch{border:none;border-radius:50%}
.ev-title-input{flex:1;min-width:0;font-size:17px;font-weight:700;padding:9px 12px;border:1px solid var(--border,#e5e7eb);border-radius:8px;background:var(--card-bg,#fff);color:var(--text,#111827)}
.ev-title-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.15)}

.ev-allday-lbl{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;font-weight:500;margin-bottom:10px}
.ev-time-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end}

.ev-subhead{font-size:10px;font-weight:700;color:var(--text-muted,#6b7280);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.ev-users-wrap{display:flex;flex-direction:column;gap:2px;max-height:160px;overflow-y:auto}
.ev-user-row{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:13px;padding:4px 3px;border-radius:5px}
.ev-user-row:hover{background:var(--hover-bg,#f3f4f6)}
.ev-ext-row{display:flex;gap:6px}
.ev-ext-list{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px}
.ev-ext-chip{display:inline-flex;align-items:center;gap:4px;font-size:12px;background:var(--hover-bg,#f3f4f6);border:1px solid var(--border,#e5e7eb);border-radius:12px;padding:2px 8px}
.ev-ext-chip button{background:none;border:none;cursor:pointer;color:var(--text-muted,#6b7280);line-height:1;padding:0 1px}

.time-info-box{background:rgba(59,130,246,.06);border:1px solid rgba(59,130,246,.2);border-radius:6px;padding:10px 12px;margin-top:8px;font-size:12px}
.time-info-box .ti-total{font-weight:600;color:#1d4ed8;font-size:13px}
.time-info-box .ti-row{display:flex;justify-content:space-between;color:var(--text-muted,#6b7280);margin-top:2px}
.time-info-box .ti-doc{font-size:11px;color:var(--text-muted,#6b7280);margin-top:4px}

.soll-ist-box{background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.25);border-radius:6px;padding:10px 12px;margin-top:8px;font-size:12px}
.soll-ist-box .si-row{display:flex;justify-content:space-between;margin-top:2px}
.soll-ist-box .si-delta{font-weight:600;margin-top:6px;font-size:13px}
.si-over{color:#ef4444}
.si-under{color:#10b981}

/* Klassifizierung/Projekt-Sperre/Mehr-Optionen (neu für das vereinheitlichte Formular) */
.ev-project-locked{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;margin-bottom:10px;background:var(--hover-bg,#f3f4f6);border:1px solid var(--border,#e5e7eb);border-radius:6px;font-size:13px;font-weight:600}
.ev-project-locked-link{font-size:12px;font-weight:500;color:#2563eb;text-decoration:none;white-space:nowrap}
.ev-project-locked-link:hover{text-decoration:underline}
.ev-more-toggle{display:block;background:none;border:none;color:#2563eb;font-size:12px;font-weight:600;cursor:pointer;padding:6px 0;margin-top:4px}
.ev-more-toggle:hover{text-decoration:underline}

@media (max-width:768px){
  #cal-modal.cal-modal-overlay{padding:0;align-items:flex-end}
  #cal-modal .cal-modal-dialog{width:100%;max-width:100%;height:90dvh;max-height:90dvh;border-radius:14px 14px 0 0;display:flex;flex-direction:column}
  #cal-modal .cal-modal-body{flex:1;overflow-y:auto}
  #cal-modal .cal-modal-head,#cal-modal .cal-modal-foot{flex-shrink:0}
  .cal-modal-dialog input,.cal-modal-dialog select,.cal-modal-dialog textarea,
  #pvm-tab-termine input,#pvm-tab-termine select,#pvm-tab-termine textarea{font-size:16px !important}
  #ev-time-row,#ev-allday-row{grid-template-columns:1fr 1fr !important}
  #ev-time-row > div:nth-child(3),#ev-allday-row > div:nth-child(3){grid-column:1 / -1}
}
@media (max-width:400px){
  .cal-modal-body{padding:14px}
}

/* Termin-Formular eingebettet im Termine-Tab (Termin ohne Projekt bzw.
   Termine-Tab eines echten Projekts) — eigene Innenabstände statt doppeltem
   Padding mit .pvm-tab-pane; reine Nachfahren-Selektoren, gelten nur solange
   die Knoten dort tatsächlich stecken. Die Zwei-Spalten-Grid (.cal-modal-cols)
   ist fürs 800px breite Standalone-Popup gedacht — im schmaleren Panel (max.
   700px) einfach immer einspaltig, unabhängig von der Viewport-Breite (auf
   der die reguläre Mobile-Regel sonst basiert). */
#pvm-tab-termine .cal-modal-body{padding:0}
/* Sticky-Hintergrund hier ans Panel (#f8fafc) statt ans weiße Standalone-Dialog
   angleichen, sonst zeichnet sich beim Scrollen eine weiße Kante durch. */
#pvm-tab-termine .cal-modal-foot{padding:12px 0 0;background:#f8fafc;margin:0 -14px;padding-left:14px;padding-right:14px}
#pvm-tab-termine .cal-modal-cols{grid-template-columns:1fr}

/* Eigene SVG-Symbole in Kopfleiste / Menü (z.B. Farbfächer der Farbkarte) */
.header-icon-btn .header-svg-icon { width: 1.35em; height: 1.35em; display: block; }
.dropdown-item .menu-svg-icon { width: 1.1em; height: 1.1em; vertical-align: -.15em; }