/* ============================================================
   Vrool Events — redesigned UI (hero + trending + upcoming + map)
   Scoped under body.file-events
   ============================================================ */
body.file-events .container.primary{display:block !important;max-width:var(--vrool-content-width) !important;width:100% !important;padding-left:16px !important;padding-right:16px !important;margin-left:auto !important;margin-right:auto !important;box-sizing:border-box !important;}

.ev-wrap{display:grid;grid-template-columns:230px minmax(0,1fr) 320px;gap:22px;width:100%;margin:0 auto;padding:18px 0 60px;box-sizing:border-box;align-items:start;}
.ev-wrap *{box-sizing:border-box;}
.ev-left{grid-column:1;grid-row:1 / span 2;}
.ev-hero{grid-column:2 / 4;grid-row:1;}
.ev-center{grid-column:2;grid-row:2;}
.ev-right{grid-column:3;grid-row:2;}

/* LEFT */
.ev-left{position:sticky;top:80px;}
.ev-brand{font-size:18px;font-weight:900;color:#0f172a;padding:0 12px 14px;}
.ev-lnav{display:flex;flex-direction:column;gap:2px;margin:0 0 16px;}
.ev-lnav a i{display:none;}
.ev-lnav a{display:flex;align-items:center;gap:11px;padding:9px 14px;border-radius:10px;font-size:14px;font-weight:500;color:#475569;text-decoration:none;transition:background .12s,color .12s;}
.ev-lnav a:hover{background:#f6edff;color:#6b3fa0;}
.ev-lnav a.on{background:#f3ecff;color:#7c3aed;font-weight:800;}
.ev-lsec-h{font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#94a3b8;padding:4px 14px 8px;}
.ev-cats{display:flex;flex-direction:column;gap:1px;margin-bottom:14px;max-height:360px;overflow:auto;}
.ev-cats::-webkit-scrollbar{width:6px;}
.ev-cats::-webkit-scrollbar-thumb{background:#e9e3f5;border-radius:999px;}
.ev-cat{display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:10px;text-decoration:none;color:#334155;font-size:13.5px;transition:background .12s;}
.ev-cat:hover{background:#f7f5fb;}
.ev-cat.is-active{background:#f3ecff;color:#7c3aed;font-weight:800;}
.ev-cat-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ev-cat-n{font-size:11px;font-weight:700;color:#94a3b8;background:#f1f0f6;border-radius:999px;min-width:22px;text-align:center;padding:1px 7px;}
.ev-cat.is-active .ev-cat-n{background:#ede9fe;color:#7c3aed;}
.ev-tabs{display:flex;gap:0;margin:0 12px 12px;border:1px solid #ececf1;border-radius:10px;overflow:hidden;}
.ev-tab{flex:1;padding:8px;border:none;background:#fff;color:#334155;font-size:12px;font-weight:800;cursor:pointer;}
.ev-tab.on{background:#7c3aed;color:#fff;}
.ev-create-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 12px;padding:12px;border-radius:12px;border:1px dashed #c4b5fd;background:#faf7ff;color:#7c3aed;font-size:13px;font-weight:800;text-decoration:none;}
.ev-create-btn:hover{background:#f3ecff;}

/* CENTER */
.ev-center{min-width:0;}
.ev-hero{position:relative;border-radius:20px;overflow:hidden;background:#1e1b2e;color:#fff;padding:46px 40px 40px;margin-bottom:26px;min-height:230px;}
.ev-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,42,.88) 0%,rgba(15,23,42,.6) 50%,rgba(15,23,42,.42) 100%),url('https://images.unsplash.com/photo-1441984904996-e0b6ba687e04?auto=format&fit=crop&w=1400&q=70');background-size:cover;background-position:center;z-index:0;}
.ev-hero > *{position:relative;z-index:1;}
.ev-hero-create{position:absolute;top:18px;right:18px;z-index:2;display:inline-flex;align-items:center;gap:8px;background:#7c3aed;color:#fff;font-size:13px;font-weight:800;padding:10px 18px;border-radius:999px;text-decoration:none;box-shadow:0 6px 18px rgba(124,58,237,.45);}
.ev-hero-create:hover{background:#6b3fa0;color:#fff;}
.ev-hero h1{display:block;float:none;clear:both;width:100%;max-width:560px;font-size:36px;font-weight:900;line-height:1.1;margin:0 0 12px;letter-spacing:-.02em;color:#fff !important;}
.ev-hero h1 .hl{color:#a78bfa;text-decoration:underline;text-decoration-color:#a78bfa;text-underline-offset:4px;text-decoration-thickness:2px;}
.ev-hero p{display:block;float:none;clear:both;font-size:14.5px;color:rgba(255,255,255,.85) !important;margin:0 0 26px;max-width:420px;line-height:1.5;}
.ev-herobar{display:flex;align-items:stretch;gap:0;background:#fff;border-radius:14px;padding:8px;box-shadow:0 18px 45px rgba(15,23,42,.3);}
.ev-hb-field{display:flex;align-items:center;gap:9px;padding:10px 16px;flex:2 1 auto;min-width:0;}
.ev-hb-field i{color:#94a3b8;}
.ev-hb-field input{border:none;background:transparent;outline:none;font-size:14px;color:#0f172a;width:100%;min-width:0;}
.ev-hb-search{flex:1 1 180px;}
.ev-hb-seg{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:6px 26px 6px 16px;flex:1 1 130px;min-width:120px;border-left:1px solid #eef0f4;}
.ev-hb-lbl{font-size:11px;font-weight:600;color:#94a3b8;}
.ev-hb-val{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:#0f172a;min-width:0;}
.ev-hb-val i{color:#7c3aed;font-size:13px;flex:0 0 auto;}
.ev-hb-val input,.ev-hb-val select{border:none;background:transparent;outline:none;font-size:13.5px;font-weight:700;color:#0f172a;width:100%;min-width:0;cursor:pointer;-webkit-appearance:none;appearance:none;}
.ev-hb-val span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ev-hb-chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:#cbd5e1;font-size:11px;pointer-events:none;}
.ev-hb-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:7px;margin-left:8px;padding:0 32px;border:none;border-radius:11px;background:#7c3aed;color:#fff;font-size:14px;font-weight:800;cursor:pointer;}
.ev-hb-btn:hover{background:#6b3fa0;}
@media(max-width:900px){.ev-herobar{flex-wrap:wrap;}.ev-hb-seg{border-left:none;}.ev-hb-btn{width:100%;margin:6px 0 0;padding:12px;}}

.ev-sec-h{display:flex;align-items:center;justify-content:space-between;margin:0 0 14px;}
.ev-sec-t{font-size:17px;font-weight:900;color:#0f172a;display:flex;align-items:center;gap:8px;}
.ev-sec-t i{color:#f59e0b;}
.ev-sec-link{font-size:12.5px;font-weight:700;color:#7c3aed;text-decoration:none;}

/* trending row */
.ev-trend{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;}
@media(max-width:1100px){.ev-trend{grid-template-columns:repeat(2,1fr);}}
.ev-tcard{position:relative;border-radius:16px;overflow:hidden;background:#f1f0f6;text-decoration:none;color:#fff;aspect-ratio:4/5;display:block;box-shadow:0 1px 3px rgba(15,23,42,.06);transition:transform .15s,box-shadow .15s;}
.ev-tcard:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,23,42,.18);}
.ev-tcard > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ev-tcard::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(15,23,42,.85) 0%,rgba(15,23,42,.05) 55%);}
.ev-tcard-body{position:absolute;left:0;right:0;bottom:0;padding:12px;z-index:2;}
.ev-tcard-badge{position:absolute;top:10px;left:10px;z-index:2;background:#7c3aed;color:#fff;font-size:10px;font-weight:800;padding:4px 9px;border-radius:999px;}
.ev-tcard-date{position:absolute;top:10px;left:10px;z-index:2;background:rgba(255,255,255,.95);color:#0f172a;border-radius:10px;padding:4px 8px;text-align:center;font-weight:900;line-height:1;}
.ev-tcard-date .d{font-size:15px;}
.ev-tcard-date .m{font-size:9px;text-transform:uppercase;color:#7c3aed;}
.ev-tcard-fav{position:absolute;top:10px;right:10px;z-index:2;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.92);border:none;color:#7c3aed;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ev-tcard-t{font-size:14px;font-weight:800;line-height:1.25;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ev-tcard-loc{font-size:11.5px;color:rgba(255,255,255,.85);display:flex;align-items:center;gap:5px;}

.ev-tcard-noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#7c3aed,#ad6dee);color:rgba(255,255,255,.5);font-size:40px;}

/* upcoming list */
.ev-up{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media(max-width:1100px){.ev-up{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.ev-up{grid-template-columns:1fr;}}
.ev-ucard{background:#fff;border:1px solid #ececf1;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 3px rgba(15,23,42,.04);transition:transform .14s,box-shadow .14s;}
.ev-ucard:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(15,23,42,.10);}
.ev-ucard-img{position:relative;width:100%;aspect-ratio:16/10;background:#f1f0f6;overflow:hidden;}
.ev-ucard-img img{width:100%;height:100%;object-fit:cover;}
.ev-ucard-noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#cbd5e1;font-size:30px;}
.ev-ucard-save{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.92);border:none;color:#7c3aed;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ev-ucard-body{display:flex;gap:12px;padding:13px;}
.ev-ucard-date{flex:0 0 auto;text-align:center;background:#f3ecff;border-radius:10px;padding:6px 9px;line-height:1;height:fit-content;}
.ev-ucard-date .d{font-size:17px;font-weight:900;color:#7c3aed;}
.ev-ucard-date .m{font-size:9px;font-weight:800;text-transform:uppercase;color:#7c3aed;}
.ev-ucard-info{min-width:0;}
.ev-ucard-t{font-size:14px;font-weight:800;color:#0f172a;line-height:1.25;margin-bottom:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ev-ucard-meta{font-size:11.5px;color:#64748b;display:flex;align-items:center;gap:5px;margin-bottom:3px;}
.ev-ucard-going{font-size:11px;color:#7c3aed;font-weight:700;margin-top:6px;}
.ev-att{display:flex;align-items:center;gap:8px;margin-top:9px;}
.ev-att-stack{display:flex;}
.ev-att-av{width:24px;height:24px;border-radius:50%;overflow:hidden;border:2px solid #fff;margin-left:-8px;background:#f1f0f6;flex:0 0 auto;}
.ev-att-av:first-child{margin-left:0;}
.ev-att-av img{width:100%;height:100%;object-fit:cover;display:block;}
.ev-att-count{font-size:11.5px;font-weight:700;color:#7c3aed;}
.ev-tcard-body .ev-att-count{color:#fff;}
.ev-tcard-body .ev-att-av{border-color:rgba(255,255,255,.85);}
.ev-up-all{display:block;text-align:center;margin:22px 0 0;padding:13px;border:1px solid #ececf1;border-radius:14px;font-size:13.5px;font-weight:800;color:#7c3aed;text-decoration:none;background:#fff;}
.ev-up-all:hover{background:#faf7ff;}

.ev-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:50px 20px;color:#94a3b8;text-align:center;}
.ev-empty i{font-size:34px;color:#cbd5e1;}

/* RIGHT */
.ev-right{position:sticky;top:80px;display:flex;flex-direction:column;gap:16px;}
.ev-rcard{background:#fff;border:1px solid #ececf1;border-radius:16px;padding:16px;box-shadow:0 1px 3px rgba(15,23,42,.04);}
.ev-rh{font-size:13px;font-weight:800;color:#0f172a;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;}
.ev-rh-link{font-size:11.5px;font-weight:700;color:#7c3aed;text-decoration:none;}
.ev-map{width:100%;height:200px;border-radius:12px;overflow:hidden;background:#eef2f7;}
.ev-map-empty{width:100%;height:200px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:12.5px;background:#f8fafc;text-align:center;padding:0 16px;}
.ev-creator{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f6f5fa;}
.ev-creator:last-child{border-bottom:none;}
.ev-creator-av{width:38px;height:38px;border-radius:50%;overflow:hidden;flex:0 0 38px;background:#f1f0f6;}
.ev-creator-av img{width:100%;height:100%;object-fit:cover;display:block;}
.ev-creator-info{flex:1;min-width:0;}
.ev-creator-name{font-size:13px;font-weight:800;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ev-creator-sub{font-size:11px;color:#94a3b8;}
.ev-creator-btn{flex:0 0 auto;font-size:11.5px;font-weight:800;color:#7c3aed;background:#f3ecff;border:none;border-radius:999px;padding:6px 13px;cursor:pointer;text-decoration:none;}
.ev-host{background:linear-gradient(135deg,#7c3aed,#ad6dee);color:#fff;}
.ev-host .ev-rh{color:#fff;}
.ev-host p{font-size:12.5px;color:rgba(255,255,255,.85);margin:0 0 14px;line-height:1.5;}
.ev-host-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;color:#7c3aed;font-size:13px;font-weight:800;padding:10px 18px;border-radius:11px;text-decoration:none;}

@media(max-width:1180px){.ev-wrap{grid-template-columns:200px minmax(0,1fr);}.ev-right{display:none;}.ev-hero{grid-column:2 / 3;}}
@media(max-width:880px){.ev-wrap{grid-template-columns:1fr;}.ev-left{display:none;}.ev-hero,.ev-center,.ev-right{grid-column:1;grid-row:auto;}}