/* LOFT Private Player v3.0.0 */

.loft-player-wrap { max-width: 900px; margin: 0 auto; padding: 8px 0; }

/* Serie-header */
.loft-series-header { display:flex; align-items:center; gap:14px; margin-bottom:12px; padding:12px 14px; background:linear-gradient(135deg,#161616,#242424); border-radius:10px; border:1px solid rgba(255,255,255,.08); }
.loft-series-cover  { width:48px; height:48px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.loft-series-title  { font-size:14px; font-weight:700; color:#f3c44c; }
.loft-series-detail { font-size:11px; color:#aaa; margin-top:2px; }

/* CD accordion lijst */
.loft-cd-list { display:flex; flex-direction:column; gap:4px; }

.loft-cd-item { border-radius:8px; overflow:hidden; background:rgba(255,255,255,.03); }

.loft-cd-header {
    display:flex; align-items:center; gap:12px;
    padding:10px 14px; cursor:pointer;
    background:rgba(255,255,255,.05);
    transition:background .15s;
    user-select:none;
}
.loft-cd-header:hover { background:rgba(255,255,255,.1); }
.loft-cd-header.open  { background:rgba(243,196,76,.12); }

.loft-cd-cover {
    width:44px; height:44px; object-fit:cover; border-radius:6px; flex-shrink:0;
}
.loft-cd-cover-placeholder {
    width:44px; height:44px; border-radius:6px; background:#2a2a2a;
    display:flex; align-items:center; justify-content:center;
    font-size:10px; font-weight:700; color:#555; flex-shrink:0;
}
.loft-cd-info { flex:1; min-width:0; }
.loft-cd-name  { font-size:14px; font-weight:700; color:#f3c44c; display:block; }
.loft-cd-count { font-size:11px; color:#888; }
.loft-cd-chevron {
    font-size:11px; color:#888; transition:transform .2s; flex-shrink:0;
}
.loft-cd-header.open .loft-cd-chevron { transform:rotate(90deg); }

.loft-cd-tracks {
    display:none;
    padding:4px 8px 8px 8px;
}
.loft-cd-tracks.open { display:block; }

/* Track nummerbadge */
.loft-recording-grid { display:flex; flex-direction:column; gap:1px; }

.loft-track-num-badge {
    display:inline-block; width:24px; text-align:right;
    font-size:11px; color:#666; padding:0 4px;
    align-self:center; flex-shrink:0;
}

/* Card = één flex-rij */
.loft-recording-card { border-radius:6px; transition:background .12s; }
.loft-recording-card:hover { background:rgba(255,255,255,.06); }

.loft-recording-cover, .loft-cover-placeholder,
.loft-recording-card img:not(.loft-track-thumb) { display:none !important; }

.loft-recording-content {
    display:flex !important; flex-direction:row !important;
    align-items:center !important; gap:10px !important;
    padding:5px 8px !important; min-height:46px;
}

.loft-track-thumb { display:block !important; width:32px !important; height:32px !important; object-fit:cover; border-radius:4px; flex-shrink:0; }
.loft-track-thumb-placeholder { width:32px !important; height:32px !important; border-radius:4px; background:#2a2a2a; flex-shrink:0; display:flex !important; align-items:center; justify-content:center; font-size:12px; color:#555; }

.loft-track-info { flex:0 0 200px !important; width:200px !important; min-width:0; display:flex !important; flex-direction:column !important; justify-content:center; }
.loft-track-title { font-size:13px !important; font-weight:600 !important; color:#f3c44c !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block !important; }
.loft-track-meta  { font-size:11px !important; color:#888 !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block !important; margin-top:1px; }

.loft-player-row { flex:1 1 auto !important; min-width:0; display:flex !important; align-items:center; gap:8px; }
.loft-player-row audio { flex:1 1 auto !important; height:28px !important; min-width:0; }

.loft-download-icon { flex-shrink:0; width:26px; height:26px; display:flex !important; align-items:center; justify-content:center; border-radius:50%; background:rgba(243,196,76,.1); color:#f3c44c; text-decoration:none; font-size:15px; }
.loft-download-icon:hover { background:rgba(243,196,76,.25); color:#f3c44c; }

/* Toegang */
.loft-access-box { max-width:400px; margin:28px auto; padding:22px; background:linear-gradient(135deg,#1a1a1a,#252525); border:1px solid rgba(255,255,255,.08); border-radius:12px; color:#fff; }
.loft-access-box h2 { color:#f3c44c; margin-top:0; font-size:16px; }
.loft-access-box p  { color:#ccc; font-size:13px; }
.loft-access-box input[type="password"] { width:100%; padding:9px 11px; margin:5px 0 10px; border:1px solid #555; border-radius:7px; background:#111; color:#fff; font-size:13px; box-sizing:border-box; }
.loft-access-box input:focus { outline:none; border-color:#f3c44c; }
.loft-access-box button { padding:9px 18px; border:none; border-radius:999px; background:linear-gradient(135deg,#f3c44c,#c98a11); color:#111; font-weight:700; cursor:pointer; }
.loft-error { color:#ff8a8a; font-weight:700; }

/* Admin */
.loft-version { font-size:12px; font-weight:400; color:#888; background:#f0f0f0; padding:2px 8px; border-radius:999px; margin-left:8px; }
.loft-admin-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:16px; }
.loft-admin-card { background:#fff; border:1px solid #dcdcde; border-radius:8px; padding:16px; }
.loft-admin-card h2 { margin-top:0; font-size:15px; }
.loft-recordings-table th,.loft-recordings-table td { vertical-align:middle; }
.loft-no-cover { color:#aaa; }
.loft-delete-btn { color:#b00020 !important; border-color:#b00020 !important; }
.loft-delete-btn:hover { background:#b00020 !important; color:#fff !important; }