/* =====================================================
 * Interactive Space Map — Event Frontend
 * Events grid/cards + single-event meta panel.
 * Matches the editorial-luxury palette from frontend-map.css.
 * ===================================================== */

.ism-events-grid,
.ism-event-meta-panel,
.ism-event-card {
    --ism-bg: #fafaf7;
    --ism-surface: #ffffff;
    --ism-surface-2: #f5f3ee;
    --ism-ink: #1a1814;
    --ism-ink-2: #5c5751;
    --ism-ink-3: #908a82;
    --ism-line: #e8e3da;
    --ism-line-2: #d4ccc0;
    --ism-accent-2: #c89968;
    --ism-radius: 18px;
    --ism-radius-sm: 10px;
    --ism-shadow-sm: 0 1px 2px rgba(26,24,20,.04), 0 2px 8px rgba(26,24,20,.04);
    --ism-shadow-md: 0 4px 16px rgba(26,24,20,.06), 0 8px 32px rgba(26,24,20,.08);
    --ism-font-display: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
    --ism-font-mono: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;
    --ism-font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ===== EVENTS GRID ===== */
.ism-events-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
    gap:24px;
    margin:24px 0;
    font-family:var(--ism-font-body);
}
.ism-events-empty{color:var(--ism-ink-3);text-align:center;padding:40px 0;font-family:var(--ism-font-body)}

.ism-event-card{
    display:flex;flex-direction:column;
    background:var(--ism-surface);
    border:1px solid var(--ism-line);
    border-radius:var(--ism-radius);
    overflow:hidden;
    text-decoration:none;color:var(--ism-ink);
    box-shadow:var(--ism-shadow-sm);
    transition:transform .2s ease, box-shadow .2s ease;
}
.ism-event-card:hover{transform:translateY(-3px);box-shadow:var(--ism-shadow-md)}

.ism-event-card-img{
    width:100%;aspect-ratio:16/10;background-size:cover;background-position:center;background-color:var(--ism-surface-2);
}
.ism-event-card-noimg{
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, var(--ism-surface-2), var(--ism-line));
}
.ism-event-card-noimg::after{
    content:"";display:block;width:36px;height:36px;
    background:var(--ism-accent-2);opacity:.4;border-radius:50%;
}

.ism-event-card-body{padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.ism-event-card-date{
    font-family:var(--ism-font-mono);font-size:12px;letter-spacing:.04em;
    color:var(--ism-ink-3);text-transform:uppercase;
}
.ism-event-card-title{
    font-family:var(--ism-font-display);font-size:20px;font-weight:600;
    margin:2px 0 4px;line-height:1.25;color:var(--ism-ink);
}
.ism-event-card-badge{
    display:inline-flex;align-self:flex-start;
    font-family:var(--ism-font-mono);font-size:11px;font-weight:600;
    letter-spacing:.04em;text-transform:uppercase;
    padding:4px 10px;border-radius:999px;
    background:var(--ism-surface-2);color:var(--ism-ink-2);
    border:1px solid var(--ism-line);
}
.ism-event-card-badge.ism-sold-out{
    background:#fdeceb;color:#b3261e;border-color:#f5d4d1;
}

/* ===== SINGLE EVENT META PANEL ===== */
.ism-event-meta-panel{
    display:flex;flex-wrap:wrap;gap:24px;
    background:var(--ism-surface);
    border:1px solid var(--ism-line);
    border-radius:var(--ism-radius);
    padding:20px 24px;margin:0 0 28px;
    font-family:var(--ism-font-body);
    box-shadow:var(--ism-shadow-sm);
}
.ism-event-meta-item{display:flex;flex-direction:column;gap:4px}
.ism-event-meta-label{
    font-family:var(--ism-font-mono);font-size:11px;letter-spacing:.08em;
    text-transform:uppercase;color:var(--ism-ink-3);
}
.ism-event-meta-value{
    font-family:var(--ism-font-display);font-size:18px;font-weight:500;color:var(--ism-ink);
}
.ism-event-meta-item.ism-event-ended-notice{
    flex:1 1 100%;
    font-family:var(--ism-font-body);font-size:14px;font-weight:600;
    color:#b3261e;background:#fdeceb;border:1px solid #f5d4d1;
    border-radius:var(--ism-radius-sm);padding:10px 14px;
}

@media(max-width:600px){
    .ism-events-grid{grid-template-columns:1fr}
    .ism-event-meta-panel{gap:16px;padding:16px 18px}
    .ism-event-meta-value{font-size:16px}
}

/* =====================================================
 * SINGLE-EVENT HERO (image + info + Buy ticket)
 * ===================================================== */
.ism-event-hero{
    --ism-bg:#ece8d8; --ism-surface:#fffdf6; --ism-surface-2:#e7e2d0;
    --ism-ink:#2f3526; --ism-ink-2:#5a5e4a; --ism-ink-3:#8f9078;
    --ism-line:#ddd6c2; --ism-accent:#4a5239; --ism-accent-2:#c87d6b; --ism-sage:#8a9a6b;
    --ism-font-display:'Fraunces','Cormorant Garamond',Georgia,serif;
    --ism-font-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    display:grid; grid-template-columns:1fr; gap:24px; margin:0 0 28px;
    font-family:var(--ism-font-body); color:var(--ism-ink);
}
.ism-event-hero *,.ism-event-hero *::before,.ism-event-hero *::after{ box-sizing:border-box; }
@media(min-width:860px){ .ism-event-hero{ grid-template-columns:1.25fr 1fr; align-items:start; } }
.ism-event-hero-media{ border-radius:18px; overflow:hidden; background:var(--ism-surface-2); aspect-ratio:16/10; }
.ism-event-hero-img{ width:100%; height:100%; object-fit:cover; display:block; }
.ism-event-hero-info{
    background:var(--ism-surface); border:1px solid var(--ism-line); border-radius:18px;
    padding:24px 26px; display:flex; flex-direction:column; gap:14px;
    box-shadow:0 4px 16px rgba(47,53,38,.07);
}
.ism-event-hero-title{ font-family:var(--ism-font-display); font-size:28px; font-weight:600; line-height:1.12; letter-spacing:-.02em; margin:0; color:var(--ism-ink); }
@media(min-width:860px){ .ism-event-hero-title{ font-size:32px; } }
.ism-event-hero-desc{
    font-size:15px; line-height:1.65; color:var(--ism-ink-2);
    display:-webkit-box; -webkit-line-clamp:5; line-clamp:5; -webkit-box-orient:vertical; overflow:hidden;
}
.ism-event-hero-desc p{ margin:0 0 10px; }
.ism-event-hero-desc p:last-child{ margin-bottom:0; }
.ism-event-hero-info.ism-expanded .ism-event-hero-desc{ -webkit-line-clamp:unset; line-clamp:unset; overflow:visible; display:block; }
.ism-event-readmore{
    align-self:flex-start; background:none; border:none; padding:0; margin:-4px 0 0; cursor:pointer;
    color:var(--ism-accent-2); font-weight:600; font-size:13px; font-family:var(--ism-font-body);
}
.ism-event-readmore:hover{ text-decoration:underline; }
.ism-event-readmore .ism-readmore-less{ display:none; }
.ism-event-hero-info.ism-expanded .ism-readmore-more{ display:none; }
.ism-event-hero-info.ism-expanded .ism-readmore-less{ display:inline; }
.ism-event-hero-divider{ height:1px; background:var(--ism-line); margin:2px 0; }
.ism-event-hero-meta{ display:flex; flex-direction:column; gap:10px; }
.ism-event-hero-meta-row{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--ism-ink-2); }
.ism-event-hero-meta-row svg{ color:var(--ism-sage); flex-shrink:0; }
.ism-event-ended-notice{
    margin-top:4px; font-size:14px; font-weight:600; color:#a8492f;
    background:#f4ddd5; border:1px solid #e7c3b8; border-radius:10px; padding:10px 14px;
}
.ism-buy-ticket{
    margin-top:6px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:15px 22px; border:none; border-radius:12px; background:var(--ism-accent); color:#fff;
    font-family:var(--ism-font-body); font-size:15px; font-weight:600; letter-spacing:.01em; cursor:pointer;
    transition:background .2s ease, transform .15s ease, box-shadow .2s ease;
}
.ism-buy-ticket:hover{ background:#5c6647; transform:translateY(-1px); box-shadow:0 8px 24px rgba(47,53,38,.28); }
.ism-buy-ticket:active{ transform:translateY(0) scale(.98); }

/* =====================================================
 * BOOKING MODAL (promote inline map to fullscreen overlay)
 * Chrome below is hidden inline; only shown in .ism-booking-open
 * ===================================================== */
/* Map is reachable ONLY through the "Buy ticket" modal — hidden on the page until opened */
.ism-event-map:not(.ism-booking-open){ display:none; }
.ism-booking-head{ display:none; }
.ism-booking-hint{ display:none; }
.ism-booking-back,.ism-booking-close{
    width:38px; height:38px; flex-shrink:0; border:none; border-radius:50%;
    background:rgba(47,53,38,.06); color:#2f3526; cursor:pointer;
    align-items:center; justify-content:center; transition:background .15s ease;
}
.ism-booking-back:hover,.ism-booking-close:hover{ background:rgba(47,53,38,.12); }
.ism-booking-back{ display:none; }
.ism-booking-close{ display:flex; }

body.ism-booking-lock{ overflow:hidden; }
.ism-event-map.ism-booking-open{
    position:fixed; top:32px; left:0; right:0; bottom:0;
    margin:0; width:auto; max-width:none;
    z-index:2147483000; padding:0; border-radius:18px 18px 0 0; overflow:hidden;
    background:#fffdf6; box-shadow:0 -8px 60px rgba(47,53,38,.35);
    display:flex; flex-direction:column;
}
.ism-event-map.ism-booking-open .ism-map-header{ display:none; }
.ism-event-map.ism-booking-open .ism-booking-head{
    display:flex; align-items:center; gap:14px; padding:14px 20px;
    background:#fffdf6; border-bottom:1px solid #ddd6c2; flex-shrink:0;
}
.ism-booking-head-text{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.ism-booking-head-title{
    font-family:'Fraunces',Georgia,serif; font-size:18px; font-weight:600; color:#2f3526; line-height:1.2;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ism-booking-head-meta{ font-size:12px; color:#8f9078; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.ism-event-map.ism-booking-open .ism-booking-stage{ display:flex; flex:1; min-height:0; }
.ism-event-map.ism-booking-open .ism-map-container{
    flex:1; min-width:0; height:100%; border:none; border-radius:0; box-shadow:none;
    background:#efeadc; display:flex; align-items:center; justify-content:center; padding:16px;
}
/* Canvas fills the whole map area so zoom/pan use the full space (no trapped top/bottom bands).
   preserveAspectRatio="meet" still shows the entire map centered at default zoom. */
.ism-event-map.ism-booking-open .ism-frontend-canvas{
    width:100%; height:100%; max-width:100%; max-height:100%; background:transparent;
}
.ism-event-map.ism-booking-open .ism-booking-panel{
    width:380px; flex-shrink:0; background:#fffdf6; border-left:1px solid #ddd6c2;
    display:flex; flex-direction:column; min-height:0; overflow:hidden;
}
.ism-event-map.ism-booking-open .ism-booking-hint{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
    flex:1; padding:24px; text-align:center; color:#8f9078; font-size:14px;
}
.ism-event-map.ism-booking-open .ism-booking-hint svg{ opacity:.5; }
/* selection bar fills the docked panel instead of sticking to viewport */
.ism-event-map.ism-booking-open .ism-selection-bar{
    position:static; margin:0; border-radius:0; box-shadow:none; background:transparent; animation:none;
    flex:1; min-height:0; display:flex; flex-direction:column;
}
.ism-event-map.ism-booking-open .ism-selbar-perforation{ display:none; }
.ism-event-map.ism-booking-open .ism-selbar-content{ display:flex; flex-direction:column; flex:1; min-height:0; padding:18px 20px; }
.ism-event-map.ism-booking-open .ism-selbar-top{ margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid #ddd6c2; }
.ism-event-map.ism-booking-open .ism-selection-chips{ flex:1 1 auto; min-height:0; max-height:none; overflow-y:auto; margin-bottom:0; flex-direction:column; flex-wrap:nowrap; gap:8px; align-content:flex-start; }
.ism-event-map.ism-booking-open .ism-chip{ width:100%; border-radius:10px; padding:9px 10px 9px 13px; }
.ism-event-map.ism-booking-open .ism-selection-actions{ margin-top:auto; padding-top:14px; border-top:1px solid #ddd6c2; }

/* Mobile overlay: head on top, map middle, panel as bottom sheet */
@media(max-width:768px){
    .ism-event-map.ism-booking-open{
        top:0; bottom:0; left:0; right:0; margin:0; max-width:none; border-radius:0; box-shadow:none;
    }
    .ism-event-map.ism-booking-open .ism-booking-stage{ flex-direction:column; }
    .ism-event-map.ism-booking-open .ism-map-container{ flex:1; padding:8px; }
    .ism-event-map.ism-booking-open .ism-booking-panel{
        width:auto; border-left:none; border-top:1px solid #ddd6c2; max-height:46vh;
    }
    .ism-event-map.ism-booking-open .ism-booking-back{ display:flex; }
    .ism-event-map.ism-booking-open .ism-booking-close{ display:none; }
    .ism-event-map.ism-booking-open .ism-booking-hint{ flex:none; padding:14px; }
}