/* Styles specific for the event details page to provide a consistent, modern look */
:root{
  --primary:#0d6efd;
  --primary-2:#00b4d8;
  --ink:#111827;
  --muted:#6b7280;
  --surface:#ffffff;
  --soft:#f3f6fb;
  --border:#e6edf5;
  --card-radius:0.9rem;
}

.event-page {
  font-family: var(--font-primary, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial);
  color: var(--ink);
}

.event-page .card {
  border-radius: var(--card-radius);
  box-shadow: 0 10px 28px rgba(15,23,42,0.08);
  border: 1px solid var(--border);
  background: var(--surface);
}

.event-page h1,
.event-page .display-5 {
  letter-spacing: 0.2px;
}

.event-page h3,
.event-page .h5 {
  font-size: 1.2rem;
  color: #7a5ad6;
  font-weight: 700;
}

.event-page h3 i,
.event-page .h5 i {
  color: #7a5ad6 !important;
}

.event-page .event-details-card strong {
  color: #7a5ad6;
}

.event-page .event-details-card .detail-value {
  font-weight: 500;
  color: #374151;
  text-transform: capitalize;
}

.event-page .event-description {
  line-height: 1.75;
  color: #374151;
  font-size: 1rem;
}

.event-page .text-muted {
  color: var(--muted) !important;
}

.event-page .badge {
  font-weight: 600;
  letter-spacing: 0.2px;
}

.event-page .gallery img {
  transition: transform .25s ease, box-shadow .25s ease;
  border-radius: .5rem;
}
.event-page .gallery img:hover{
  transform: scale(1.03);
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

/* Gallery thumbnail grid */
.event-page .gallery-grid { }
.event-page .gallery-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: .375rem;
  transition: opacity .2s ease, transform .15s ease;
  cursor: pointer;
}
.event-page .gallery-grid a:hover .gallery-thumb {
  opacity: .85;
  transform: scale(1.04);
}
.event-page .gallery-grid .ratio { overflow: hidden; border-radius: .375rem; }

.event-page .btn-outline-secondary {
  border-color: var(--border);
  color: #1f2937;
  background: #fff;
}
.event-page .btn-outline-secondary:hover {
  background: var(--soft);
}

.event-page .btn-primary {
  background: linear-gradient(120deg,var(--primary),var(--primary-2));
  border: none;
  box-shadow: 0 8px 16px rgba(13,110,253,0.25);
}
.event-page .btn-primary:hover {
  filter: brightness(0.98);
}

.event-page .appointment-slots .list-group-item {
  background: transparent;
  padding-left: 0;
  padding-right: 0;
  border-color: var(--border);
}

.event-page .details-row { display:flex; gap:10px; align-items:flex-start; }
.event-page .details-ico { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px; background:var(--soft); margin-right:8px; color:var(--primary); }

/* Date range pills for compact, readable date presentation */
.event-page .date-range { display:inline-flex; gap:8px; align-items:center; flex-wrap:wrap; }
.event-page .date-pill { background: linear-gradient(120deg, #ffffff, #f7f9ff); padding:6px 10px; border-radius:999px; border:1px solid var(--border); color:var(--primary); font-weight:600; box-shadow: 0 6px 18px rgba(15,23,42,0.04); }
.event-page .date-sep { color:var(--muted); padding:0 8px; font-weight:700; }

/* Buttons using heavier font with slightly larger icons */
.btn-fw-icons { font-weight: 600 !important; }
.btn-fw-icons .bi { font-size: calc(1em + 2px); vertical-align: -0.08em; }

.event-page .back-btn { margin-bottom: 1rem; }

/* Make breadcrumbs subtle but readable */
.event-page .breadcrumb a { text-decoration: none; color: var(--muted); }
.event-page .breadcrumb .active { color: #374151; }

/* Responsive tweaks */
@media (max-width: 767px){
  .event-page .gallery img{ height:120px; object-fit:cover; }
}

/* Full-bleed gallery: make the card span the full viewport width while centering content */
.event-page .full-bleed-gallery {
  position: relative;
  width: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: transparent;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}
.event-page .full-bleed-gallery .card-body {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.event-page .full-bleed-gallery .row.g-3 { gap: 1rem; }
.event-page .full-bleed-gallery img {
  height: 220px;
  object-fit: cover;
  border-radius: .5rem;
}

@media (min-width: 992px) {
  .event-page .full-bleed-gallery img { height: 260px; }
}

/* Gallery inner padding: provide 20px lateral spacing from container edge */
.event-page .gallery-inner {
  padding-left: 30px;
  padding-right: 30px;
  margin-top: 0; /* spacing moved to title */
}

/* Title spacing: apply top/bottom margin to the gallery title instead of the container */
.event-page .gallery-title { margin-top: 20px; margin-bottom: 12px; }


  /* Location card styling */
  .event-page .location-info { display: flex; flex-direction: column; gap: 8px; color: #1f2937; }
  .event-page .location-info .location-line { display:flex; align-items:center; }
  .event-page .location-info .location-line i { width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; background:var(--soft); color:var(--primary); margin-right:10px; }
  .event-page .location-info a { color:var(--primary); text-decoration:none; font-weight:600; }
  .event-page .location-info .location-line span { color:#374151; }

  @media (max-width: 575px) {
    .event-page .location-info .location-line i { width:26px; height:26px; margin-right:8px; }
  }