:root {
  /* Text Colors */
  --tec-color-text-primary: var(--tertiary);
  --tec-color-text-primary-light: rgba(13, 34, 54, 0.62); /* #0d22369e */
  --tec-color-text-secondary: var(--secondary);
  --tec-color-text-disabled: #d5d5d5;

  /* Icon Colors */
  --tec-color-icon-primary: var(--secondary);
  --tec-color-icon-primary-alt: #757575;
  --tec-color-icon-secondary: #bababa;
  --tec-color-icon-active: var(--tertiary);
  --tec-color-icon-disabled: #d5d5d5;
  --tec-color-icon-focus: var(--primary);
  --tec-color-icon-error: #da394d;

  /* Event Icon */
  --tec-color-event-icon: var(--tertiary);
  --tec-color-event-icon-hover: var(--primary);

  /* Accent Colors */
  --tec-color-accent-primary: var(--tertiary) !important;
  --tec-color-accent-primary-hover: rgba(13, 34, 54, 0.8);
  --tec-color-accent-primary-active: rgba(13, 34, 54, 0.9);
  --tec-color-accent-primary-background: rgba(13, 34, 54, 0.07);

  --tec-color-accent-secondary: var(--primary);
  --tec-color-accent-secondary-hover: rgba(33, 56, 99, 0.8);
  --tec-color-accent-secondary-active: rgba(33, 56, 99, 0.9);
  --tec-color-accent-secondary-background: rgba(33, 56, 99, 0.07);

  /* Button Colors */
  --tec-color-button-primary: var(--tec-color-accent-primary);
  --tec-color-button-primary-hover: var(--tec-color-accent-primary-hover);
  --tec-color-button-primary-active: var(--tec-color-accent-primary-active);
  --tec-color-button-primary-background: var(
    --tec-color-accent-primary-background
  );

  --tec-color-button-secondary: var(--tec-color-accent-secondary);
  --tec-color-button-secondary-hover: var(--tec-color-accent-secondary-hover);
  --tec-color-button-secondary-active: var(--tec-color-accent-secondary-active);
  --tec-color-button-secondary-background: var(
    --tec-color-accent-secondary-background
  );

  /* Link Colors */
  --tec-color-link-primary: var(--tertiary);
  --tec-color-link-accent: var(--primary);
  --tec-color-link-accent-hover: rgba(33, 56, 99, 0.8);

  /* Border Colors */
  --tec-color-border-default: #d5d5d5;
  --tec-color-border-secondary: #e4e4e4;
  --tec-color-border-tertiary: #7d7d7d;
  --tec-color-border-hover: var(--secondary);
  --tec-color-border-active: var(--tertiary);

  /* Backgrounds */
  --tec-color-background: var(--background);
  --tec-color-background-events: transparent;
  --tec-color-background-transparent: rgba(255, 255, 255, 0.6);
  --tec-color-background-secondary: #f7f6f6;
  --tec-color-background-secondary-hover: #f0eeee;
  --tec-color-background-messages: rgba(13, 34, 54, 0.07);
  --tec-color-background-error: rgba(218, 57, 77, 0.08);

  /* Box Shadows */
  --tec-color-box-shadow: rgba(0, 0, 0, 0.14);
  --tec-color-box-shadow-secondary: rgba(0, 0, 0, 0.1);

  /* Scrollbars */
  --tec-color-scroll-track: rgba(0, 0, 0, 0.25);
  --tec-color-scroll-bar: rgba(0, 0, 0, 0.5);

  /* Multiday Event Backgrounds */
  --tec-color-background-primary-multiday: rgba(13, 34, 54, 0.24);
  --tec-color-background-primary-multiday-hover: rgba(13, 34, 54, 0.34);
  --tec-color-background-secondary-multiday: rgba(33, 56, 99, 0.24);
  --tec-color-background-secondary-multiday-hover: rgba(33, 56, 99, 0.34);

  /* Week Event Backgrounds */
  --tec-color-accent-primary-week-event: rgba(13, 34, 54, 0.1);
  --tec-color-accent-primary-week-event-hover: rgba(13, 34, 54, 0.2);
  --tec-color-accent-primary-week-event-featured: rgba(13, 34, 54, 0.04);
  --tec-color-accent-primary-week-event-featured-hover: rgba(13, 34, 54, 0.14);

  /* Datepicker */
  --tec-color-background-secondary-datepicker: var(
    --tec-color-background-secondary
  );
  --tec-color-accent-primary-background-datepicker: var(
    --tec-color-accent-primary-background
  );
}

/* SINGLE EVENT PAGE */

.tribe-events-pg-template * {
  font-family: "Raleway", sans-serif !important;
}

.tribe-events-pg-template {
  padding-block: 2rem !important;
  background-color: var(--background) !important;
}

@media (min-width: 1200px) {
  .tribe-events-pg-template {
    padding-inline: 3rem !important;
  }
}

.tribe-events-c-subscribe-dropdown {
  width: 12rem;
}

.tribe-events-c-subscribe-dropdown__button {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  border: solid var(--primary) 1px !important;
}

.tribe-events-c-subscribe-dropdown__button:hover,
.tribe-events-c-subscribe-dropdown__button:focus,
.tribe-events-c-subscribe-dropdown__button:focus-within {
  background-color: var(--primary) !important;
  color: var(--background) !important;
  opacity: 1;
}

.tribe-events-c-subscribe-dropdown__button:hover svg,
.tribe-events-c-subscribe-dropdown__button:focus svg,
.tribe-events-c-subscribe-dropdown__button:focus-within svg {
  fill: var(--background) !important;
}

.tribe-events-c-subscribe-dropdown__button button {
  white-space: nowrap;
}

.tribe-events-single-event-title {
  letter-spacing: 0.05em !important;
  font-weight: 500 !important;
  color: var(--primary) !important;
  font-family: "Bitter", serif !important;
}

.tribe-organizer-url a,
.tribe-events-gmap,
p a {
  color: var(--primary) !important;
  border-bottom: none !important;
}

.tribe-organizer-url a:hover,
.tribe-events-gmap:hover,
p a:hover {
  color: var(--primary) !important;
}

.tribe-events-back {
  margin-bottom: 2rem !important;
}

.tribe-events-schedule.tribe-clearfix {
  letter-spacing: 0.1em !important;
  font-weight: 500 !important;
  font-size: 1.25rem;
  text-transform: uppercase;
  color: var(--secondary) !important;
}

main:has(.tribe-events-pg-template) {
  background-color: var(--accent);
}

/* EVENTS PAGE */

.tribe-common-l-container.tribe-events-l-container {
  padding-top: 2rem !important;
  background-color: var(--background) !important;
  overflow-x: hidden !important;
}

@media (min-width: 1200px) {
  .tribe-common-l-container.tribe-events-l-container {
    padding-top: 3rem !important;
  }
}

.tribe-events-calendar-list__event-title-link.tribe-common-anchor-thin {
  letter-spacing: 0.05em !important;
  font-weight: 600 !important;
  font-size: 1.5rem;
  text-transform: uppercase;
  color: var(--tertiary) !important;
}

.tribe-events-calendar-list__event-datetime {
  font-weight: 500 !important;
  text-transform: uppercase;
}

.tribe-events-c-top-bar__datepicker-time {
  letter-spacing: 0.05em !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  font-family: "Bitter", serif !important;
}

.tribe-events-view {
  background-color: var(--accent) !important;
}