:root{--bg:#0e0e0e;--panel:#111;--panelBorder:#2b2b2b;--text:#eae6df;--muted:#bdb5a7;--brand:#2fbf71;--accent:#ffcc66;--veil:rgba(245,236,220,.35)}
*{box-sizing:border-box}
html,body{height:100%;}
body{margin:0;font-family:"Noto Naskh Arabic","Amiri",system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);display:flex;flex-direction:column;min-height:100vh;font-size:18px;line-height:1.6}

.app-header,.app-footer{padding:.6rem 1rem;border-bottom:1px solid var(--panelBorder);background:#0b0b0b}
.app-footer{border-top:1px solid var(--panelBorder);border-bottom:none}
.app-header h1{margin:.2rem 0;font-weight:700;font-size:1.1rem}
.header-actions{display:flex;gap:.5rem}

.btn{padding:.45rem .7rem;border:1px solid var(--panelBorder);background:#171717;color:var(--text);border-radius:.5rem;cursor:pointer}
.btn:hover{border-color:#3a3a3a}
.btn-primary{background:var(--brand);border-color:transparent;color:#071b11}
.btn-secondary{background:#1e1e1e}
.icon-btn{border:none;background:transparent;color:var(--muted);font-size:1.3rem;cursor:pointer}

.app{position:relative;display:flex;flex:1;min-height:0}
#map{flex:1;position:relative}
#map .leaflet-control-attribution{font-size:.8rem;opacity:.85}

#mapVeil{position:absolute;inset:0;pointer-events:none;background:var(--veil)}

/* Panel on the right for RTL */
.panel{width:min(40vw,520px);min-width:280px;max-width:640px;background:var(--panel);border-right:1px solid var(--panelBorder);height:100%;overflow:auto;position:absolute;right:0;top:0;transform:translateX(100%);transition:transform .3s ease;z-index:800}
.panel.open{transform:translateX(0)}
.panel-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem .9rem;border-bottom:1px solid var(--panelBorder);position:sticky;top:0;background:var(--panel);z-index:1}
.panel-content{padding:1rem;display:flex;flex-direction:column;gap:.75rem}
.panel-footer{display:flex;gap:.5rem;justify-content:space-between;border-top:1px solid var(--panelBorder);padding:.6rem .9rem;position:sticky;bottom:0;background:var(--panel)}

.event-title{margin:0;font-size:1.1rem}
.event-meta{color:var(--muted);font-size:.95rem}
.event-desc{line-height:1.9}
.event-gallery{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.event-gallery img{width:100%;height:140px;object-fit:cover;border-radius:.4rem;border:1px solid var(--panelBorder)}
.event-qa{margin-top:.5rem;border-top:1px dashed var(--panelBorder);padding-top:.5rem}
.event-qa summary{cursor:pointer;color:var(--accent);font-size:1.4rem}
.event-qa .qa-item{margin:.4rem 0 .6rem 0}
.event-qa .qa-item p{margin:.2rem 0 .5rem 0;font-weight:600;font-size:1.2rem}
.event-qa .qa-item .btn.btn-secondary.qa{font-size:1.2rem;padding:.5rem .7rem}

.leaflet-container{background:#0a0a0a}
.marker-label{background:#171717;color:var(--text);padding:.15rem .4rem;border-radius:.3rem;border:1px solid var(--panelBorder);font-size:.9rem;white-space:nowrap}

/* ضبط مظهر تلميح العلامة لتقليل الانزياح الأفقي ومعالجة RTL */
.leaflet-tooltip.ev-tooltip{direction:rtl;text-align:right;background:#171717;border:1px solid var(--panelBorder);color:var(--text);border-radius:.3rem;padding:.25rem .55rem;box-shadow:none}
.leaflet-tooltip.ev-tooltip.leaflet-tooltip-top:before{border-top-color:#171717}

@media (max-width: 1024px){.panel{width:42vw}}
@media (max-width: 780px){.panel{width:60vw}}
@media (max-width: 520px){.panel{width:86vw}}
#prevEventBtn,#nextEventBtn{font-size:1.05rem;padding:.6rem .9rem}