/* Ticketality Connect v1.7.49 — shared native Event Card component.
   School and Promoter directories share this stylesheet and do not depend on
   Golo Place card markup, layout classes, image ratios, or archive CSS. */

.tktc-event-directory,
.tktc-event-directory *,
.tktc-school-archive .tktc-school-events,
.tktc-school-archive .tktc-school-events *{
  box-sizing:border-box;
}

.tktc-event-directory,
.tktc-school-archive{
  --tktc-event-accent:var(--tktc-native-accent,var(--accent-color,#23d3d3));
  --tktc-event-text:var(--tktc-native-heading,#2d2d2d);
  --tktc-event-muted:var(--tktc-native-text,#5d5d5d);
  --tktc-event-border:var(--tktc-native-border,#ececec);
  --tktc-event-surface:var(--tktc-native-surface,#fff);
  --tktc-event-filter-bg:var(--tktc-native-surface-alt,#f7f7f7);
}

.tktc-event-directory{
  width:100%;
  max-width:1170px;
  margin:0 auto;
  color:var(--tktc-event-text);
  font-family:inherit;
}

.tktc-events-heading{
  margin:0 0 20px;
}
.tktc-events-heading h2{
  margin:0;
}

.tktc-event-results{
  transition:opacity .16s ease;
}
.tktc-event-directory.is-loading .tktc-event-results{
  opacity:.42;
  pointer-events:none;
}

/* Filters */
.tktc-event-filters{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) auto;
  gap:12px;
  align-items:end;
  width:100%;
  margin:0 0 28px;
  padding:16px 17px;
  border-radius:10px;
  background:var(--tktc-event-filter-bg);
}
.tktc-event-filter-field{
  min-width:0;
}
.tktc-event-filter-field label{
  display:block;
  margin:0 0 6px;
  color:var(--tktc-event-muted);
  font-size:12px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.tktc-event-filter-field select{
  display:block;
  width:100%;
  height:48px;
  min-width:0;
  margin:0;
  padding:0 42px 0 16px;
  border:1px solid #ddd;
  border-radius:7px;
  background-color:#fff;
  color:var(--tktc-event-text);
  font:inherit;
  font-size:15px;
  line-height:48px;
  box-shadow:none;
}
.tktc-event-filter-field select:focus{
  border-color:var(--tktc-event-accent);
  outline:2px solid color-mix(in srgb,var(--tktc-event-accent) 18%,transparent);
  outline-offset:1px;
}
.tktc-event-filter-button{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:112px;
  height:48px;
  margin:0;
  padding:0 24px;
  border:0;
  border-radius:7px;
  background:var(--tktc-event-accent);
  color:#fff;
  font:inherit;
  font-size:15px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  box-shadow:none;
}
.tktc-event-filter-button:hover,
.tktc-event-filter-button:focus{
  filter:brightness(.96);
  color:#fff;
}
.tktc-event-filter-button:disabled{
  cursor:wait;
  opacity:.72;
}
.tktc-filter-loading{
  display:none;
}
.tktc-event-filters.is-loading .tktc-filter-label{
  display:none;
}
.tktc-event-filters.is-loading .tktc-filter-loading{
  display:inline;
}

/* Result toolbar */
.tktc-event-toolbar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:20px;
  margin:0 0 24px;
}
.tktc-event-toolbar__count{
  justify-self:start;
  font-size:16px;
  font-weight:500;
  line-height:1.4;
}
.tktc-event-view-switch{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.tktc-event-view-button{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  margin:0;
  padding:4px;
  border:0;
  background:transparent;
  color:#333;
  cursor:pointer;
  box-shadow:none;
}
.tktc-event-view-button svg{
  display:block;
  width:20px;
  height:20px;
  fill:currentColor;
}
.tktc-event-view-button.is-active,
.tktc-event-view-button:hover,
.tktc-event-view-button:focus{
  color:var(--tktc-event-accent);
}
.tktc-event-sort{
  display:flex;
  align-items:center;
  justify-self:end;
  gap:9px;
  margin:0;
  color:var(--tktc-event-text);
  font-size:15px;
  font-weight:500;
  white-space:nowrap;
}
.tktc-event-sort__select{
  display:block;
  width:auto;
  min-width:130px;
  height:44px;
  margin:0;
  padding:0 34px 0 12px;
  border:1px solid var(--tktc-event-border);
  border-radius:7px;
  background-color:#fff;
  color:var(--tktc-event-text);
  font:inherit;
  font-size:14px;
  box-shadow:none;
}

/* Grid */
.tktc-event-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  width:100%;
  margin:0;
  padding:0;
  align-items:stretch;
}
.tktc-event-grid--cols-1{
  grid-template-columns:minmax(0,1fr);
}
.tktc-event-grid--cols-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.tktc-event-grid--cols-3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.tktc-event-grid--cols-4{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

/* Shared event card */
.tktc-event-card{
  display:flex;
  min-width:0;
  height:100%;
  margin:0;
  overflow:hidden;
  border:1px solid var(--tktc-event-border);
  border-radius:15px;
  background:var(--tktc-event-surface);
  box-shadow:0 4px 14px rgba(0,0,0,.045);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.tktc-event-card:hover{
  border-color:#dedede;
  box-shadow:0 8px 22px rgba(0,0,0,.07);
  transform:translateY(-2px);
}

.tktc-event-card{
  flex-direction:column;
}

.tktc-event-card__media{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 196px;
  width:100%;
  height:196px;
  min-height:196px;
  overflow:hidden;
  border-bottom:1px solid #f1f1f1;
  background:#fff;
  text-decoration:none;
}
.tktc-event-card__media img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  margin:0;
  object-fit:contain;
  background:#fff;
  box-sizing:border-box;
}
.tktc-event-card--school .tktc-event-card__media img{
  padding:22px;
}
.tktc-event-card--promoter .tktc-event-card__media img{
  padding:12px;
}

.tktc-event-card__body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  min-width:0;
  padding:16px 17px 17px;
}
.tktc-event-card__type{
  align-self:flex-start;
  margin:0 0 8px;
  padding:3px 8px;
  border:1px solid color-mix(in srgb,var(--tktc-event-accent) 56%,#fff);
  border-radius:3px;
  color:var(--tktc-event-accent);
  font-size:11.5px;
  font-weight:500;
  line-height:1.25;
}
.tktc-event-card__context{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:5px;
  min-width:0;
  margin:0 0 7px;
  color:var(--tktc-event-muted);
  font-size:14px;
  line-height:1.35;
}
.tktc-event-card__context span{
  min-width:0;
}
.tktc-event-card__dot{
  color:#b8b8b8;
}
.tktc-event-card__title{
  margin:0 0 10px;
  padding:0;
  color:var(--tktc-event-text);
  font-size:17px;
  font-weight:500;
  line-height:1.35;
}
.tktc-event-card__title a{
  color:var(--mt-color__heading,var(--tktc-native-heading,#171b24));
  text-decoration:none;
}
.tktc-event-card__title a:hover,
.tktc-event-card__title a:focus{
  color:var(--tktc-event-accent);
}
.tktc-event-card__meta{
  display:grid;
  gap:5px;
  margin:0;
  padding:0;
}
.tktc-event-card__meta-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
  margin:0;
  color:var(--tktc-event-muted);
  font-size:14px;
  line-height:1.4;
}
.tktc-event-card__meta-row svg{
  flex:0 0 14px;
  width:14px;
  height:14px;
  margin-top:2px;
  fill:var(--tktc-event-accent);
}
.tktc-event-card__meta-row span{
  min-width:0;
}
/* Grid cards show the event date only. Event time is retained in the markup
   and becomes visible when the directory switches to list view. */
.tktc-event-card__time{
  display:none;
}
.tktc-event-card__date-row--time-only{
  display:none;
}
.tktc-event-grid--list .tktc-event-card__time{
  display:inline;
}
.tktc-event-grid--list .tktc-event-card__date-row--time-only{
  display:flex;
}
.tktc-event-card__excerpt{
  margin:9px 0 0;
  color:var(--tktc-event-muted);
  font-size:14px;
  line-height:1.5;
}
.tktc-event-card__footer{
  margin-top:auto;
  padding-top:12px;
}
.tktc-event-card__cta{
  display:inline-flex;
  align-items:center;
  color:var(--tktc-event-accent);
  font-size:14px;
  font-weight:600;
  line-height:1.25;
  text-decoration:none;
}
.tktc-event-card__cta:hover,
.tktc-event-card__cta:focus{
  color:var(--tktc-event-accent);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* List view keeps an independent 3/2/1 responsive directory grid.
   The card composition uses a compact horizontal layout. */
.tktc-event-grid--list{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.tktc-event-grid--list .tktc-event-card{
  display:grid;
  grid-template-columns:118px minmax(0,1fr);
  min-height:178px;
  transform:none;
}
.tktc-event-grid--list .tktc-event-card__media{
  width:118px;
  height:100%;
  min-height:178px;
  border-right:1px solid #f1f1f1;
  border-bottom:0;
}
.tktc-event-grid--list .tktc-event-card--school .tktc-event-card__media img{
  padding:14px;
}
.tktc-event-grid--list .tktc-event-card--promoter .tktc-event-card__media img{
  padding:7px;
}
.tktc-event-grid--list .tktc-event-card__body{
  padding:14px 15px;
}
.tktc-event-grid--list .tktc-event-card__type{
  margin-bottom:6px;
}
.tktc-event-grid--list .tktc-event-card__context{
  margin-bottom:6px;
  font-size:12px;
}
.tktc-event-grid--list .tktc-event-card__title{
  margin-bottom:8px;
  font-size:17px;
}
.tktc-event-grid--list .tktc-event-card__meta-row{
  font-size:14px;
}
.tktc-event-grid--list .tktc-event-card__footer{
  padding-top:9px;
}

/* Destination-page insertion uses the same card component. */
.tktc-destination-events-section{
  margin:58px 0 12px;
  padding-top:42px;
  border-top:1px solid #e8e8e8;
}
.tktc-destination-events-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin:0 0 24px;
}
.tktc-destination-events-eyebrow{
  display:block;
  margin-bottom:7px;
  color:var(--tktc-native-accent,var(--accent-color,#23d3d3));
  font-size:12px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.tktc-destination-events-heading h2{
  margin:0 0 7px;
  padding:0;
  font-size:30px;
  line-height:1.2;
}
.tktc-destination-events-heading p{
  max-width:720px;
  margin:0;
  color:var(--tktc-event-muted);
  font-size:15px;
  line-height:1.55;
}

@media (min-width:640px) and (max-width:1023px){
  .tktc-event-filters{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .tktc-event-filter-button{
    width:100%;
  }
  /* Tablet: preserve smaller requested layouts, but cap 3/4-column
     desktop grids at three columns for a denser tablet presentation. */
  .tktc-event-grid,
  .tktc-event-grid--cols-3,
  .tktc-event-grid--cols-4{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .tktc-event-grid--cols-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .tktc-event-grid--cols-1{
    grid-template-columns:minmax(0,1fr);
  }
  /* List view keeps its own responsive layout: 3 desktop, 2 tablet, 1 mobile. */
  .tktc-event-grid--list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:767px){
  .tktc-event-directory{
    max-width:none;
  }
  .tktc-event-toolbar{
    grid-template-columns:1fr auto;
    gap:12px;
  }
  .tktc-event-view-switch{
    justify-self:end;
  }
  .tktc-event-sort{
    display:none;
  }
}

@media (max-width:639px){
  .tktc-event-directory{
    padding-left:0;
    padding-right:0;
  }
  .tktc-event-filters{
    grid-template-columns:minmax(0,1fr);
    padding:14px;
  }
  /* Mobile: 2 columns for 2/3/4-column grids. A deliberately requested
     single-column layout remains single-column. */
  .tktc-event-grid,
  .tktc-event-grid--cols-2,
  .tktc-event-grid--cols-3,
  .tktc-event-grid--cols-4{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .tktc-event-grid--cols-1{
    grid-template-columns:minmax(0,1fr);
    gap:16px;
  }
  .tktc-event-card{
    border-radius:12px;
  }
  .tktc-event-card__media{
    height:180px;
    min-height:180px;
    flex-basis:180px;
    background:#fff;
  }
  /* School/game artwork should fill the media panel on phones. The previous
     22px image padding exposed the media background along the sides/bottom.
     Promoter flyers keep their contained treatment because portrait artwork
     should not be aggressively cropped. */
  .tktc-event-card--school .tktc-event-card__media img{
    width:100%;
    height:100%;
    padding:0;
    object-fit:cover;
    object-position:center;
    background:transparent;
  }
  .tktc-event-card--promoter .tktc-event-card__media img{
    padding:6px;
    object-fit:contain;
  }
  .tktc-event-card__body{
    padding:14px 14px 15px;
  }
  .tktc-event-grid--list{
    grid-template-columns:minmax(0,1fr);
    gap:18px;
  }
  .tktc-event-grid--list .tktc-event-card{
    grid-template-columns:108px minmax(0,1fr);
    min-height:164px;
  }
  .tktc-event-grid--list .tktc-event-card__media{
    width:108px;
    height:100%;
    min-height:164px;
    border-right:1px solid #f1f1f1;
    border-bottom:0;
  }
  .tktc-event-grid--list .tktc-event-card--school .tktc-event-card__media img{
    width:100%;
    height:100%;
    padding:10px;
    object-fit:contain;
    object-position:center;
    background:#fff;
  }
  .tktc-event-grid--list .tktc-event-card--promoter .tktc-event-card__media img{
    padding:6px;
  }
  .tktc-event-grid--list .tktc-event-card__body{
    padding:12px 13px;
  }
  .tktc-destination-events-section{
    margin-top:40px;
    padding-top:32px;
  }
  .tktc-destination-events-heading h2{
    font-size:25px;
  }
}

/* v1.7.68 — persistent GameTrip entry point alongside ticket actions. */
.tktc-event-card__footer{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.tktc-event-card__cta--gametrip{font-weight:700}


/* v1.7.114 — External-provider events behave as direct outbound cards on HBCU GameTrip. */
.tktc-event-card--external-direct.tktc-js-nav,
.tktc-event-item.tktc-event-card--external-direct.tktc-js-nav,
.tktc-side-event.tktc-event-card--external-direct.tktc-js-nav {
  cursor: pointer;
}
.tktc-event-card--external-direct.tktc-js-nav:focus-visible,
.tktc-event-item.tktc-event-card--external-direct.tktc-js-nav:focus-visible,
.tktc-side-event.tktc-event-card--external-direct.tktc-js-nav:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* v1.7.127 — matchup logos keep their native aspect ratio; no circular crop. */
.tktc-event-card__media--matchup{background:#fff}
.tktc-event-card__matchup{display:flex;align-items:center;justify-content:center;gap:24px;width:100%;height:100%;padding:24px;box-sizing:border-box}
.tktc-event-card__matchup>span{display:flex;align-items:center;justify-content:center;width:72px;height:66px;padding:2px;background:#fff;overflow:visible;border-radius:0;box-sizing:border-box}
.tktc-event-card--school .tktc-event-card__media--matchup .tktc-event-card__matchup img{display:block;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;padding:0;object-fit:contain;background:transparent;border-radius:0!important}
.tktc-event-grid--list .tktc-event-card__matchup{gap:12px;padding:10px}
.tktc-event-grid--list .tktc-event-card__matchup>span{width:48px;height:44px}
@media (max-width:767px){
  .tktc-event-card__matchup{gap:16px;padding:18px}
  .tktc-event-card__matchup>span{width:60px;height:56px}
  .tktc-event-grid--list .tktc-event-card__matchup>span{width:40px;height:36px}
}

/* v1.7.154 — stable server-side pagination for School and Promoter event directories. */
.tktc-event-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  margin:32px 0 0;
  font-family:inherit;
}
.tktc-event-page-numbers{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.tktc-event-page-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  height:38px;
  padding:0 12px;
  border:1px solid var(--tktc-event-border);
  border-radius:6px;
  background:var(--tktc-event-surface);
  color:var(--tktc-event-text);
  font:inherit;
  font-size:14px;
  font-weight:600;
  line-height:1;
  text-decoration:none;
  box-shadow:none;
}
.tktc-event-page-link--prev,
.tktc-event-page-link--next{min-width:84px}
.tktc-event-page-link:hover,
.tktc-event-page-link:focus,
.tktc-event-page-link.is-current{
  border-color:var(--tktc-event-accent);
  background:var(--tktc-event-accent);
  color:#fff;
  outline:none;
}
.tktc-event-page-link.is-current{cursor:default}
.tktc-event-page-ellipsis{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  color:var(--tktc-event-muted);
}
@media(max-width:639px){
  .tktc-event-pagination{gap:5px;flex-wrap:wrap}
  .tktc-event-page-numbers{gap:4px}
  .tktc-event-page-link{min-width:34px;height:36px;padding:0 9px}
  .tktc-event-page-link--prev,.tktc-event-page-link--next{min-width:74px}
}
