/* =========================================================
   Conjurly TEC Events Feed — tec-feed.css
   Version: 0.3.89

   Loaded only when [cnjrly_events_feed] shortcode is present.
   Inherits --cj-* tokens from Conjurly UI Core.

   IMPORTANT: news-feed.css does not load on the Events page.
   All .cnjrly-news-feed__* filter bar styles used in the
   shortcode HTML are copied here verbatim so Events and News
   share identical filter bar appearance from a single source
   of truth per zone.
   ========================================================= */

/* =========================================================
   Feed wrapper
   ========================================================= */

.cnjrly-tec-feed-wrap {
  display: flex;
  flex-direction: column;
}


/* =========================================================
   Page layout — main feed + right rail
   Sidebar-first build for evaluation.
   ========================================================= */

.cnjrly-tec-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr) 300px;
  gap: var(--cj-space-card, 24px);
  align-items: start;
}

.cnjrly-tec-main,
.cnjrly-tec-rail {
  min-width: 0;
}

.cnjrly-tec-main {
  width: 100%;
}

.cnjrly-tec-rail--left,
.cnjrly-tec-rail--right {
  width: 100%;
}

.cnjrly-tec-rail--left .widget,
.cnjrly-tec-rail--right .widget {
  margin: 0 0 var(--cj-gap-card, 18px);
}

.cnjrly-tec-rail--left .widget:last-child,
.cnjrly-tec-rail--right .widget:last-child {
  margin-bottom: 0;
}

@media (max-width: 1024px) {
  .cnjrly-tec-layout {
    grid-template-columns: 1fr;
  }

    .cnjrly-tec-rail--left,
  .cnjrly-tec-rail--right {
    display: none;
  }
}

/* =========================================================
   Section card — Indigo title + white filter zone
   Copied exactly from News to match appearance.
   ========================================================= */

.cnjrly-tec-section-card {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  margin-bottom: 1.5rem;
  border: none; /* components.css adds border to outer .cnjrly-section-card; suppressed here until UI Core removes it */
  background: transparent; /* components.css adds white background; transparent prevents it bleeding through header bottom corners and any sub-pixel gap */
}

.cnjrly-tec-section-card .cnjrly-section-card__header {
  background: var(--cj-indigo, #300557);
  padding: 14px 18px 15px;
  border-radius: var(--cj-radius-card, 14px) var(--cj-radius-card, 14px) 0 0;
}

.cnjrly-tec-section-card .cnjrly-section-card__title {
  color: #fff;
  margin: 0;
  padding: 0;
}

.cnjrly-tec-section-card .cnjrly-section-card__body {
  background: #fff;
  border-radius: 0 0 14px 14px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-top: none;
  padding: 14px 16px;
}

/* =========================================================
   Toggle row — description left | Filter button right
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-news-feed__toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}

.cnjrly-news-feed__filter-desc {
  flex: 1 1 0;
  min-width: 0;
  font-size: 0.82rem;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.55);
}

.cnjrly-news-feed__toggle-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  margin-left: auto;
}

/* =========================================================
   Filter toggle button
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-news-feed__filter-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 16px;
  margin-bottom: 4px;
  border: 1px solid var(--cj-border-light, #e6e7eb);
  border-radius: var(--cj-radius-btn, 10px);
  background: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.7);
  cursor: pointer;
  transition: border-color 0.14s;
}

.cnjrly-news-feed__filter-toggle:hover {
  background: var(--cj-indigo, #300557);
  border-color: var(--cj-link, #4814A0);
  color: #fff;
}

.cnjrly-news-feed__filter-toggle[aria-expanded="true"] {
  border-color: var(--cj-link, #4814A0) !important;
  color: var(--cj-link, #4814A0) !important;
  background: #fff !important;
  opacity: 1 !important;
}

/* =========================================================
   Filter form
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-tec-filter-form {
  display: none;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 0;
}

.cnjrly-tec-filter-form.cnjrly-filter-form--open {
  display: flex;
}

/* Primary row */
.cnjrly-news-feed__filter-primary {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}

/* Action row */
.cnjrly-news-feed__filter-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* =========================================================
   Selects
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-news-feed__filter-select {
  flex: 1 1 0;
  min-width: 0;
  height: 40px;
  padding: 0 28px 0 12px;
  border: 1px solid var(--cj-border-light, #e6e7eb);
  border-radius: var(--cj-radius-input, 10px);
  background: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.72);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23aaa' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  transition: border-color 0.14s, box-shadow 0.14s;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cnjrly-news-feed__filter-select:hover {
  border-color: rgba(0, 0, 0, 0.28);
}

.cnjrly-news-feed__filter-select:focus {
  outline: none;
  border-color: var(--cj-link, #4814A0);
  box-shadow: 0 0 0 3px rgba(72, 20, 160, 0.10);
}

.cnjrly-news-feed__filter-select.cnjrly-active {
  border-color: var(--cj-link, #4814A0);
  color: var(--cj-link, #4814A0);
  font-weight: 600;
}

/* =========================================================
   Apply button + Clear link
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-news-feed__apply {
  height: 40px;
  padding: 0 20px;
  border: 0;
  border-radius: var(--cj-radius-btn, 10px);
  background: var(--cj-indigo, #300557);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  transition: filter 0.14s;
  white-space: nowrap;
}

.cnjrly-news-feed__apply:hover {
  filter: brightness(1.06);
}

.cnjrly-news-feed__clear {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 40px;
  padding: 0 10px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--cj-link, #4814A0);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.14s;
}

.cnjrly-news-feed__clear:hover {
  color: rgba(0, 0, 0, 0.4);
  text-decoration: none;
}

/* =========================================================
   Date range row
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-news-feed__filter-date-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cnjrly-news-feed__filter-date {
  flex: 1 1 0;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--cj-border-light, #e6e7eb);
  border-radius: var(--cj-radius-input, 10px);
  background: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.72);
  cursor: pointer;
  transition: border-color 0.14s, box-shadow 0.14s;
  min-width: 0;
}

.cnjrly-news-feed__filter-date:focus {
  outline: none;
  border-color: var(--cj-link, #4814A0);
  box-shadow: 0 0 0 3px rgba(72, 20, 160, 0.10);
}

.cnjrly-news-feed__filter-date::-webkit-calendar-picker-indicator {
  opacity: 0.5;
  cursor: pointer;
}

.cnjrly-news-feed__filter-date-sep {
  flex-shrink: 0;
  color: rgba(0, 0, 0, 0.35);
  font-size: 0.9rem;
}

/* =========================================================
   Feed loader — CSS spinner
   Copied verbatim from news-feed.css
   ========================================================= */

.cnjrly-feed-loader {
  display: none;
  text-align: center;
  padding: 20px 0 12px;
}

.cnjrly-feed-loader.cnjrly-feed-loader--active {
  display: block;
}

.cnjrly-feed-loader__spinner {
  display: inline-block;
  width: 36px;
  height: 36px;
  border: 3px solid var(--cj-border-light, #e6e7eb);
  border-top-color: var(--cj-link, #4814A0);
  border-radius: 50%;
  animation: cnjrly-spin 0.7s linear infinite;
}

@keyframes cnjrly-spin {
  to { transform: rotate(360deg); }
}

/* =========================================================
   Feed results
   ========================================================= */

.cnjrly-tec-feed-results {
  position: relative;
  transition: opacity 0.25s ease;
}

/* =========================================================
   Mobile — filter rows stack
   Copied from news-feed.css mobile section
   ========================================================= */

@media (max-width: 782px) {
  .cnjrly-news-feed__filter-primary {
    flex-direction: column;
    align-items: stretch;
  }

  .cnjrly-news-feed__filter-select {
    flex: none;
    width: 100%;
    height: 44px;
    font-size: 0.9rem;
  }

  .cnjrly-news-feed__filter-actions {
    flex-wrap: wrap;
  }

  .cnjrly-news-feed__apply {
    flex: 1;
    height: 44px;
    font-size: 0.9rem;
  }

  .cnjrly-news-feed__filter-date {
    height: 44px;
    font-size: 0.9rem;
  }

  .cnjrly-news-feed__toggle-row {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .cnjrly-news-feed__toggle-actions {
    width: 100%;
    justify-content: flex-end;
  }
}

/* =========================================================
   Event cards
   Vertical stack: facts first, image second
   ========================================================= */

.cnjrly-tec-feed {
  display: grid;
  gap: 0;
}

.cnjrly-tec-feed__entry {
  margin: 0;
}

.cnjrly-tec-feed__entry:not(:last-child) {
  position: relative;
  margin-bottom: 3rem;
}

.cnjrly-tec-feed__entry:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(100% + 1rem);
  transform: translateX(-50%);
  width: 60%;
  height: 2px;
  background: var(--cj-divider, rgba(0,0,0,0.05));
  opacity: 0.7;
}

.cnjrly-tec-feed__item {
  display: block;
  border: 1px solid var(--cj-border-light, #e6e7eb);
  border-radius: var(--cj-radius-card, 14px);
  background: #fff;
  color: inherit;
  text-decoration: none;
  overflow: hidden;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.cnjrly-tec-feed__item:hover,
.cnjrly-tec-feed__item:focus {
  color: inherit;
  text-decoration: none;
}

.cnjrly-tec-feed__item:hover {
  transform: translateY(-2px);
  box-shadow: var(--cj-shadow-card, 0 1px 4px rgba(0,0,0,0.04));
  border-color: var(--cj-border-light, #e6e7eb);
}

.cnjrly-tec-feed__item:focus-visible {
  outline: 2px solid var(--cj-link, #4814A0);
  outline-offset: 2px;
}

.cnjrly-tec-feed__content {
  padding: var(--cj-space-card, 24px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background: #fff;
  border-radius: var(--cj-radius-card, 14px) var(--cj-radius-card, 14px) 0 0;
}

.cnjrly-tec-feed__media {
  width: 100%;
  background: var(--cj-border-light, #e6e7eb);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  border-radius: 0 0 var(--cj-radius-card, 14px) var(--cj-radius-card, 14px);
}

.cnjrly-tec-feed__thumb {
  width: 100%;
  max-height: 360px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  background: var(--cj-border-light, #e6e7eb);
  border-radius: 0 0 var(--cj-radius-card, 14px) var(--cj-radius-card, 14px);
}

.cnjrly-tec-feed__thumb img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 360px;
  object-fit: contain;
  object-position: top center;
  margin: 0 auto;
  flex: 0 0 auto;
}

.cnjrly-tec-feed__item--no-thumb .cnjrly-tec-feed__content {
  border-radius: var(--cj-radius-card, 14px);
}

.cnjrly-tec-feed__type {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cj-link, #4814A0);
  margin-bottom: 0.35rem;
}

.cnjrly-tec-feed .cnjrly-tec-feed__title {
  margin: 0 0 0.55rem;
  color: rgba(0, 0, 0, 0.88);
  transition: color 0.16s ease;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.cnjrly-tec-feed__item:hover .cnjrly-tec-feed__title,
.cnjrly-tec-feed__item:focus-visible .cnjrly-tec-feed__title {
  color: var(--cj-link, #4814A0);
}

.cnjrly-tec-feed__date,
.cnjrly-tec-feed__organizer,
.cnjrly-tec-feed__venue {
  font-size: 0.92rem;
  line-height: 1.36;
}

.cnjrly-tec-feed__date {
  color: rgba(0, 0, 0, 0.7);
  font-weight: 500;
  margin-bottom: 0.55rem;
}

.cnjrly-tec-feed__organizer,
.cnjrly-tec-feed__venue {
  color: rgba(0, 0, 0, 0.62);
  font-weight: 400;
}

.cnjrly-tec-feed__organizer {
  margin-bottom: 0.12rem;
}

.cnjrly-tec-feed__venue {
  display: block;
  margin-top: 0;
}

.cnjrly-tec-feed__venue-name,
.cnjrly-tec-feed__venue-location {
  display: block;
  color: inherit;
  font-weight: 400;
  line-height: 1.36;
}

.cnjrly-tec-feed__venue-name {
  margin-bottom: 0.12rem;
}

.cnjrly-tec-feed__venue-location {
  margin-top: 0;
}

.cnjrly-tec-feed__empty {
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.95rem;
  padding: 24px 0;
}

@media (min-width: 783px) {
  .cnjrly-tec-feed__content {
    min-height: 210px;
  }
}

@media (max-width: 782px) {
  .cnjrly-tec-feed__content {
    padding: 0.95rem 1rem 1.05rem;
  }

  .cnjrly-tec-feed .cnjrly-tec-feed__title {
    font-size: 1.4rem;
  }

  .cnjrly-tec-feed__thumb,
  .cnjrly-tec-feed__thumb img {
    max-height: 280px;
  }
}

/* =========================================================
   Pagination
   ========================================================= */

.cnjrly-tec-feed__pagination {
  margin-top: 2rem;
}

.cnjrly-tec-feed__pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  height: 2.4rem;
  margin: 0 0.2rem 0.4rem 0;
  padding: 0 0.75rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: var(--cj-radius-btn, 10px);
  text-decoration: none;
  color: rgba(0, 0, 0, 0.65);
  transition: border-color 0.14s, color 0.14s;
}

.cnjrly-tec-feed__pagination .page-numbers:hover {
  border-color: var(--cj-link, #4814A0);
  color: var(--cj-link, #4814A0);
}

.cnjrly-tec-feed__pagination .current {
  font-weight: 700;
  border-color: var(--cj-link, #4814A0);
  color: var(--cj-link, #4814A0);
}

/* =========================================================
   Events feed shortcode host-page cleanup

   This used to be hard-scoped to page-id-2886. That was too
   brittle because TEC has multiple platform pages and the feed
   shortcode may be used on more than one page. Scope by the
   actual Conjurly TEC feed markup instead. The :has() selector
   lets us remove BuddyBoss article chrome from any page that
   contains the [cnjrly_events_feed] output.
   ========================================================= */

@media (max-width: 782px) {
  body:has(.cnjrly-tec-layout) .content-area {
    padding-top: 0 !important;
  }
}

body:has(.cnjrly-tec-layout) #primary .site-main article.page,
body:has(.cnjrly-tec-layout) #primary .site-main article.type-page {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body:has(.cnjrly-tec-layout) .entry-content {
  padding: 0 !important;
  margin: 0 !important;
}

body:has(.cnjrly-tec-layout) article.page > .entry-header,
body:has(.cnjrly-tec-layout) article.type-page > .entry-header {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

body:has(.cnjrly-tec-layout) .entry-title {
  display: none !important;
}

/* Mobile: BuddyBoss adds container/article padding at narrow breakpoints
   that desktop rules don't catch — reinforce zeroing explicitly. */
@media (max-width: 782px) {
  body:has(.cnjrly-tec-layout) #primary .site-main article.page,
  body:has(.cnjrly-tec-layout) #primary .site-main article.type-page {
    padding: 0 !important;
    margin-top: 0 !important;
  }

  body:has(.cnjrly-tec-layout) .entry-content {
    padding: 0 !important;
    margin: 0 !important;
  }
}

/* =========================================================
   Conjurly TEC Archive Template Spacing
   ---------------------------------------------------------
   Restore the standard vertical page rhythm for TEC archive
   replacement templates, which bypass the normal .content-area
   padding used on standard pages.
   ========================================================= */

.cnjrly-tec-archive-template .cnjrly-events-archive {
  padding-top: 1.875rem;
  padding-bottom: 2.1875rem;
}

/* =========================================================
   Conjurly TEC Heading Correction — 0.3.105
   Use actual Core UI tokens so TEC does not override the
   Conjurly/BuddyBoss heading system on archive/list pages.
   ========================================================= */
.cnjrly-tec-section-card .cnjrly-section-card__title {
  font-family: var(--cj-heading-font-family, "IBM Plex Sans Condensed", sans-serif);
  font-size: var(--cj-page-header-title-size, 1.65rem);
  font-weight: var(--cj-page-header-title-weight, var(--cj-heading-font-weight, 500));
  line-height: var(--cj-heading-line-height-tight, 1.1);
  letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em);
}