/* V8 Asszisztens – oldalsó panelek (jeles, holiday, birthday, namedays) */

/* ── Sötét mód: Holiday modal ── */
[data-theme="dark"] #holiday-list-container > div { background: #242938 !important; }

/* ── Születésnapok / Névnapok ── */
.day-birthday-label {
    font-size: 0.7rem; color: #d97706; font-weight: 600;
    text-align: center; padding: 2px 4px; background: #fef3c7;
    border-radius: 3px; margin-top: 2px; display: block;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

[data-theme="dark"] .day-birthday-label { background: #4a3209; color: #fcd34d; }

.birthday-month-badge {
    font-size: 0.62rem; color: #d97706; font-weight: 600;
    line-height: 1.15; margin-top: 1px; display: block;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

[data-theme="dark"] .birthday-month-badge { color: #fcd34d; }

/* ── Jeles napok + Ünnepnapok panel – közös stílus ── */
.jeles-kiemelt-badge {
    font-size: 0.68rem; color: #3b5bdb; font-weight: 600;
    line-height: 1.2; margin-top: 2px; display: block;
}

.day-jeles-label {
    font-size: 0.72rem; color: #3b5bdb; font-weight: 600;
    text-align: center; padding: 2px 4px; background: #ebf4ff;
    border-radius: 3px; margin-top: 2px; display: block;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

[data-theme="dark"] .day-jeles-label { background: #1e2a4a; color: #7b9cff; }

/* Közös panel stílus */
.naptar-panel {
    position: fixed; top: 0; right: 0;
    width: 340px; max-width: 98vw; height: 100vh;
    background: var(--panel-bg); z-index: 9985;
    display: flex; flex-direction: column;
    box-shadow: -6px 0 24px rgba(0,0,0,0.18);
    transform: translateX(100%); transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}

.naptar-panel.open { transform: translateX(0); }

.naptar-panel-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 18px; color: white; flex-shrink: 0;
    font-weight: 700; font-size: 1rem;
}

.naptar-panel-header button {
    background: none; border: none; color: white;
    font-size: 1.3rem; cursor: pointer; padding: 2px 6px;
    border-radius: 4px; transition: background 0.15s;
}

.naptar-panel-header button:hover { background: rgba(255,255,255,0.2); }

.naptar-panel-body { flex: 1; overflow-y: auto; padding: 10px 8px; }

/* Hónapfejléc */
.panel-ho-cim {
    font-size: 0.75rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.08em;
    padding: 10px 8px 4px 8px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 2px;
}

.panel-ho-cim.kek   { color: #3b5bdb; }

.panel-ho-cim.zold  { color: #38a169; }

/* Sor */
.panel-sor {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px; border-radius: 8px;
    font-size: 0.86rem; transition: background 0.12s; cursor: default;
}

.panel-sor:hover { background: rgba(0,0,0,0.04); }

.panel-sor.kiemelt { background: rgba(59,91,219,0.07); }

.panel-sor-datum {
    font-weight: 700; min-width: 26px; text-align: right;
    font-size: 0.82rem; flex-shrink: 0;
}

.panel-sor-datum.kek  { color: #3b5bdb; }

.panel-sor-datum.piros { color: #e53e3e; }

.panel-sor-datum.zold  { color: #38a169; }

.panel-sor-datum.kek2  { color: #3182ce; }

.panel-sor-ikon { font-size: 1.15rem; flex-shrink: 0; width: 24px; text-align: center; }

.panel-sor-nev  { flex: 1; color: var(--text); line-height: 1.3; }

.panel-sor-tag  {
    font-size: 0.68rem; color: var(--cancel);
    background: var(--border); padding: 1px 6px;
    border-radius: 8px; flex-shrink: 0; white-space: nowrap;
}

/* Overlay */
#jeles-overlay, #holiday-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.35); z-index: 9984; display: none;
}

/* Sötét mód */
[data-theme="dark"] .naptar-panel { background: #242938; }

[data-theme="dark"] .panel-sor:hover { background: rgba(255,255,255,0.06); }

[data-theme="dark"] .panel-sor.kiemelt { background: rgba(59,91,219,0.15); }

[data-theme="dark"] .panel-sor-tag { background: #2d3748; color: #a0aec0; }

/* ── Ünnepnapok panel sötét mód ── */
[data-theme="dark"] #holiday-modal { background: #242938; }

[data-theme="dark"] #holiday-list-container { background: #242938; }