/* Styles for live feed listing and image grid */

.feed-item{ background:var(--glass-95); border:1px solid rgba(0,0,0,.04); }
.feed-item h4{ font-weight:700; margin-bottom:0.25rem }
.feed-content{ color:var(--text-secondary); font-size:1rem }
.images-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap:10px; }
.images-grid .img-wrap{ display:block; overflow:hidden; border-radius:10px; border:1px solid rgba(0,0,0,.04); padding:0; }
.images-grid img{ width:100%; height:120px; object-fit:cover; display:block; transition:transform .25s ease; }
.images-grid img:hover{ transform:scale(1.05); }

@media (min-width: 576px){
  .images-grid img{ height:140px; }
}
@media (min-width: 768px){
  .images-grid img{ height:180px; }
}

.feed-meta{ color:#6b7280; font-size:.9rem }

.livefeed-teaser{ background:linear-gradient(135deg, rgba(5,150,105,.06), rgba(14,165,233,.04)); border-radius:12px; padding:2rem; }

/* Modal image fit */
.modal-body .carousel-item img{ height:65vh; object-fit:contain; background:#000 }

/* Live indicator dot */
.live-dot{
  display:inline-block; width:12px; height:12px; border-radius:50%; background:var(--accent-color); box-shadow:0 0 8px rgba(234,88,12,.3);
  animation: livePulse 1.6s infinite;
  vertical-align:middle; margin-right:.5rem;
}
@keyframes livePulse{
  0%{ opacity:1; transform:scale(1) }
  50%{ opacity:.25; transform:scale(.85) }
  100%{ opacity:1; transform:scale(1) }
}

.live-teaser-list .teaser-item{ display:flex; gap:1rem; align-items:flex-start; padding:1rem; border-radius:12px; background:var(--glass-95); border:1px solid rgba(0,0,0,.04); }
.live-teaser-list .teaser-thumb{ width:120px; height:72px; flex:0 0 120px; border-radius:8px; overflow:hidden; }
.live-teaser-list .teaser-thumb img{ width:100%; height:100%; object-fit:cover }
.live-teaser-list .teaser-body h5{ margin:0 0 .25rem 0 }
.live-teaser-list .teaser-time{ color:#6b7280; font-size:.9rem }

/* Feed type styles */
.feed-type-announcement{ border-left:6px solid var(--accent-color); background:linear-gradient(180deg, rgba(249,115,22,0.03), rgba(255,255,255,0.6)); }
.feed-type-announcement .badge{ background: linear-gradient(90deg, var(--accent-color), #fb923c); color:#fff; }

.feed-type-info{ border-left:6px solid var(--secondary-color); background:linear-gradient(180deg, rgba(14,165,233,0.03), rgba(255,255,255,0.6)); }
.feed-type-info .badge{ background: linear-gradient(90deg, var(--secondary-color), #60a5fa); color:#fff; }

.feed-item{ transition: transform .18s ease, box-shadow .18s ease; }
.feed-item:hover{ transform: translateY(-4px); box-shadow: 0 12px 36px rgba(2,6,23,0.08); }

.feed-item .feed-content{ font-size:1.02rem; color:var(--text-secondary); }
.feed-item .images-grid{ margin-top: .75rem }
.images-grid .img-wrap{ border-radius:8px; overflow:hidden; }

.feed-item h4{ font-size:1.25rem }

/* Viewer styles */
.viewer-inner{ min-height:60vh; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.7); }
.viewer-image{ max-width:98%; max-height:85vh; object-fit:contain; transition:opacity .18s ease; }
.viewer-image.opacity-0{ opacity:0 }
.viewer-prev, .viewer-next{ width:48px; height:48px; border-radius:50%; opacity:.9 }
.viewer-spinner{ background: rgba(0,0,0,.5); z-index:1051 }

/* Global overlay viewer (Bootstrap-free) */
.lf-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.85); display:flex; align-items:center; justify-content:center; z-index:20000; }
.lf-inner{ position:relative; max-width:95vw; max-height:95vh; display:flex; align-items:center; justify-content:center; }
.lf-img{ max-width:100%; max-height:100%; object-fit:contain; transition:opacity .18s ease; }
.lf-close{ position:absolute; top:-12px; right:-12px; background:#fff; border-radius:50%; width:40px; height:40px; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,.3); cursor:pointer }
.lf-control{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.92); border-radius:50%; width:56px; height:56px; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 8px 24px rgba(0,0,0,.25); }
.lf-prev{ left:18px }
.lf-next{ right:18px }
.lf-spinner{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.lf-hidden{ display:none !important }
.lf-counter{ position:absolute; bottom:18px; left:50%; transform:translateX(-50%); color:#fff; background:rgba(0,0,0,.4); padding:.25rem .6rem; border-radius:999px; font-weight:600 }
.lf-control[aria-disabled="true"]{ opacity:.35; pointer-events:none }