/* v11 -- Attribute-selector centering (class-name independent) */
/* ============================================================
   LPCA -- The Events Calendar Custom Styles
   Lake Powell Community Alliance  -  lpcainc.org
   
   INSTALLATION:
   WordPress Dashboard - Appearance - Customize - Additional CSS
   Paste this entire file, then click "Publish."
   
   PALETTE (drawn from the LPCA logo):
   - Deep Coastal Blue ... #1A5276
   - Warm Sunset Orange .. #E67E22  (accent / CTA)
   - Lagoon Teal ......... #1B8A7A  (secondary accent)
   - Sandy Cream ......... #FDF6E3  (calendar background)
   - Shell White ......... #FFFFFF  (day cells)
   - Driftwood Gray ...... #7F8C8D  (muted text)
   - Deep Charcoal ....... #2C3E50  (primary text)
   ============================================================ */


/* ----------------------------------------------------------
   1. PAGE AND CALENDAR CONTAINER
   ---------------------------------------------------------- */

.tribe-events {
  background-color: #EAF0F5 !important;
  padding: 20px !important;
  border-radius: 12px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif !important;
}

.tribe-common {
  font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif !important;
}


/* ----------------------------------------------------------
   2. SEARCH / EVENTS BAR
   ---------------------------------------------------------- */

.tribe-events-c-events-bar {
  background-color: #FFFFFF !important;
  border: 1px solid #D5DDE5 !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.tribe-events-c-events-bar__search-input,
.tribe-events .tribe-events-c-search__input {
  border: 1px solid #CBD5E0 !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: #2C3E50 !important;
  background: #FAFBFC !important;
}

.tribe-events-c-events-bar__search-input:focus,
.tribe-events .tribe-events-c-search__input:focus {
  border-color: #1A5276 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(26,82,118,0.15) !important;
}

.tribe-events-c-events-bar__search-button,
.tribe-events .tribe-events-c-search__button {
  background-color: #E67E22 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 8px 20px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

.tribe-events-c-events-bar__search-button:hover,
.tribe-events .tribe-events-c-search__button:hover {
  background-color: #CF6D17 !important;
}


/* ----------------------------------------------------------
   3. VIEW SELECTOR (List / Month / Day)
   ---------------------------------------------------------- */

.tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link,
.tribe-events .tribe-events-c-view-selector__list-item--active a {
  color: #1A5276 !important;
  font-weight: 700 !important;
  border-bottom: 3px solid #E67E22 !important;
}

.tribe-events-c-view-selector__list-item-link,
.tribe-events .tribe-events-c-view-selector__list-item a {
  color: #5D6D7E !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  padding-bottom: 4px !important;
  transition: color 0.2s ease !important;
}

.tribe-events-c-view-selector__list-item-link:hover,
.tribe-events .tribe-events-c-view-selector__list-item a:hover {
  color: #1A5276 !important;
}


/* ----------------------------------------------------------
   4. TOP BAR -- Month Title and Navigation Arrows
   ---------------------------------------------------------- */

.tribe-events-c-top-bar {
  margin-bottom: 12px !important;
}

.tribe-events-c-top-bar__datepicker-button,
.tribe-events .tribe-events-calendar-month__header-text {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #1A5276 !important;
  letter-spacing: 0.3px !important;
}

.tribe-events-c-top-bar__today-button,
.tribe-events-c-top-bar a[data-js="tribe-events-view-link"] {
  background-color: transparent !important;
  color: #1A5276 !important;
  border: 1px solid #1A5276 !important;
  border-radius: 5px !important;
  padding: 4px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

.tribe-events-c-top-bar__today-button:hover {
  background-color: #1A5276 !important;
  color: #FFFFFF !important;
}

.tribe-events-c-top-bar__nav-link {
  color: #1A5276 !important;
}

.tribe-events-c-top-bar__nav-link:hover {
  color: #E67E22 !important;
}

.tribe-events-c-top-bar__nav-link svg path,
.tribe-events-c-nav__prev svg path,
.tribe-events-c-nav__next svg path {
  fill: #1A5276 !important;
}


/* ----------------------------------------------------------
   5. CALENDAR GRID -- The Heart of the Redesign
   ---------------------------------------------------------- */

/* Overall grid table */
.tribe-events-calendar-month__grid,
table.tribe-events-calendar-month__grid,
table[data-js="tribe-events-month-grid"] {
  background-color: #FDF6E3 !important;
  border-collapse: separate !important;
  border-spacing: 3px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
  table-layout: fixed !important;
  width: 100% !important;
}


/* ---- DAY-OF-WEEK HEADER ROW ----
   v11 FIX: Uses attribute selectors targeting the table by its
   data-js attribute instead of guessing class names.
   This approach is class-name independent.
   ---- */

/* Header row -- transparent background */
table[data-js="tribe-events-month-grid"] thead,
table[data-js="tribe-events-month-grid"] thead tr {
  background-color: transparent !important;
  background: none !important;
  border: none !important;
}

/* Header cells -- center text, no background */
table[data-js="tribe-events-month-grid"] thead th {
  background-color: transparent !important;
  background: none !important;
  border: none !important;
  padding: 10px 4px !important;
  text-align: center !important;
  vertical-align: middle !important;
  color: #1A5276 !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
}

/* Force ALL direct child containers inside each header cell
   to be centered blocks -- overrides flex, grid, float, etc. */
table[data-js="tribe-events-month-grid"] thead th > * {
  display: block !important;
  text-align: center !important;
  width: 100% !important;
  float: none !important;
  position: static !important;
  margin: 0 auto !important;
  padding: 0 !important;
  justify-content: center !important;
}

/* Force ALL nested elements (spans, etc.) inside header cells
   to be inline so they respond to text-align: center */
table[data-js="tribe-events-month-grid"] thead th > * > * {
  display: inline !important;
  float: none !important;
  position: static !important;
  text-align: center !important;
  color: #1A5276 !important;
  font-weight: 800 !important;
  font-size: 15px !important;
}

/* Third level deep -- just in case */
table[data-js="tribe-events-month-grid"] thead th > * > * > * {
  display: inline !important;
  float: none !important;
  position: static !important;
  text-align: center !important;
}


/* ---- DAY CELLS ---- */

.tribe-events-calendar-month__day {
  background-color: #FFFFFF !important;
  border: 1px solid #E8E8E8 !important;
  vertical-align: top !important;
  min-height: 90px !important;
  transition: background-color 0.2s ease !important;
}

.tribe-events-calendar-month__day:hover {
  background-color: #F0F7FA !important;
}

.tribe-events-calendar-month__day--past,
.tribe-events-calendar-month__day--other-month {
  background-color: #F5F5F0 !important;
  opacity: 0.6 !important;
}

/* TODAY */
.tribe-events-calendar-month__day--current {
  background-color: #FFF8E7 !important;
  border: 2px solid #E67E22 !important;
  opacity: 1 !important;
}

/* Date numbers */
.tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__day-date-link,
.tribe-events-calendar-month__day-date-daynum {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #2C3E50 !important;
  padding: 6px 8px !important;
}

/* Today date number */
.tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date,
.tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link,
.tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-daynum {
  color: #E67E22 !important;
  font-weight: 800 !important;
}


/* ----------------------------------------------------------
   6. EVENT ITEMS Inside Calendar Cells
   ---------------------------------------------------------- */

.tribe-events-calendar-month__calendar-event,
.tribe-events-calendar-month__calendar-event-title {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

.tribe-events-calendar-month__calendar-event-title-link,
.tribe-events-calendar-month__calendar-event a {
  color: #1A5276 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  font-size: 12px !important;
  transition: color 0.2s ease !important;
}

.tribe-events-calendar-month__calendar-event-title-link:hover,
.tribe-events-calendar-month__calendar-event a:hover {
  color: #E67E22 !important;
  text-decoration: underline !important;
}

.tribe-events-calendar-month__calendar-event-datetime {
  color: #7F8C8D !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

.tribe-events-calendar-month__mobile-events-icon--event,
.tribe-events-calendar-month__calendar-event-indicator {
  background-color: #E67E22 !important;
}

.tribe-events-calendar-month__multiday-event-bar-inner {
  background-color: #1B8A7A !important;
  border-radius: 3px !important;
  color: #FFFFFF !important;
  padding: 2px 6px !important;
}

.tribe-events-calendar-month__multiday-event-bar-inner:hover {
  background-color: #15705F !important;
}


/* ----------------------------------------------------------
   7. EVENT TOOLTIP (hover popup)
   ---------------------------------------------------------- */

.tribe-events-tooltip,
.tribe-events-calendar-month__calendar-event-tooltip {
  background-color: #FFFFFF !important;
  border: 1px solid #D5DDE5 !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
  padding: 14px !important;
  max-width: 280px !important;
}

.tribe-events-tooltip .tribe-events-c-small-cta__link,
.tribe-events-tooltip a {
  color: #1A5276 !important;
  font-weight: 600 !important;
}

.tribe-events-tooltip .tribe-events-c-small-cta__link:hover {
  color: #E67E22 !important;
}


/* ----------------------------------------------------------
   8. SUBSCRIBE TO CALENDAR DROPDOWN
   ---------------------------------------------------------- */

.tribe-events-c-subscribe-dropdown__button,
.tribe-events .tribe-events-c-subscribe-dropdown button {
  background-color: #1A5276 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

.tribe-events-c-subscribe-dropdown__button:hover {
  background-color: #154360 !important;
}

.tribe-events-c-subscribe-dropdown__list {
  background-color: #FFFFFF !important;
  border: 1px solid #D5DDE5 !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.tribe-events-c-subscribe-dropdown__list-item a {
  color: #2C3E50 !important;
  font-size: 13px !important;
  padding: 8px 14px !important;
}

.tribe-events-c-subscribe-dropdown__list-item a:hover {
  background-color: #EAF0F5 !important;
  color: #1A5276 !important;
}


/* ----------------------------------------------------------
   9. POWERED BY FOOTER
   ---------------------------------------------------------- */

.tribe-events-calendar-month__body + .tribe-events-c-subscribe-dropdown,
.tribe-events .tribe-credits,
.tribe-events-c-footer {
  font-size: 11px !important;
  color: #95A5A6 !important;
  margin-top: 8px !important;
}

.tribe-events-c-footer a,
.tribe-credits a {
  color: #7F8C8D !important;
}


/* ----------------------------------------------------------
   10. LIST VIEW
   ---------------------------------------------------------- */

.tribe-events-calendar-list {
  background-color: #FFFFFF !important;
  border-radius: 8px !important;
  padding: 16px !important;
}

.tribe-events-calendar-list__month-separator-text {
  color: #1A5276 !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  border-bottom: 2px solid #E67E22 !important;
  padding-bottom: 6px !important;
}

.tribe-events-calendar-list__event {
  border-bottom: 1px solid #EEE !important;
  padding: 14px 0 !important;
}

.tribe-events-calendar-list__event:last-child {
  border-bottom: none !important;
}

.tribe-events-calendar-list__event-title a {
  color: #1A5276 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  text-decoration: none !important;
}

.tribe-events-calendar-list__event-title a:hover {
  color: #E67E22 !important;
}

.tribe-events-calendar-list__event-datetime {
  color: #7F8C8D !important;
  font-size: 13px !important;
}

.tribe-events-calendar-list__event-venue {
  color: #5D6D7E !important;
  font-size: 13px !important;
}


/* ----------------------------------------------------------
   11. DAY VIEW
   ---------------------------------------------------------- */

.tribe-events-calendar-day__event {
  background-color: #FFFFFF !important;
  border-left: 4px solid #E67E22 !important;
  border-radius: 0 6px 6px 0 !important;
  padding: 14px !important;
  margin-bottom: 10px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.tribe-events-calendar-day__event-title a {
  color: #1A5276 !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  text-decoration: none !important;
}

.tribe-events-calendar-day__event-title a:hover {
  color: #E67E22 !important;
}

.tribe-events-calendar-day__event-datetime {
  color: #7F8C8D !important;
  font-size: 13px !important;
}


/* ----------------------------------------------------------
   12. RESPONSIVE -- Mobile-friendly
   ---------------------------------------------------------- */

@media (max-width: 768px) {
  .tribe-events {
    padding: 10px !important;
  }

  .tribe-events-calendar-month__grid {
    border-spacing: 1px !important;
  }

  .tribe-events-calendar-month__day-date,
  .tribe-events-calendar-month__day-date-link,
  .tribe-events-calendar-month__day-date-daynum {
    font-size: 13px !important;
    padding: 4px !important;
  }

  /* On mobile, keep letters centered and bold */
  table[data-js="tribe-events-month-grid"] thead th {
    font-size: 13px !important;
    padding: 6px 2px !important;
  }

  table[data-js="tribe-events-month-grid"] thead th > * > * {
    font-size: 13px !important;
  }

  .tribe-events-c-top-bar__datepicker-button {
    font-size: 18px !important;
  }

  .tribe-events-calendar-month__calendar-event-title-link {
    font-size: 10px !important;
  }
}


/* ----------------------------------------------------------
   13. GLOBAL LINK OVERRIDES
   ---------------------------------------------------------- */

.tribe-events a {
  transition: color 0.2s ease !important;
}

.tribe-events-calendar-month__grid a {
  text-decoration: none !important;
}

.tribe-events-calendar-month__grid a:hover {
  text-decoration: underline !important;
}


/* ----------------------------------------------------------
   14. ACCESSIBILITY FOCUS STATES
   ---------------------------------------------------------- */

.tribe-events a:focus,
.tribe-events button:focus {
  outline: 2px solid #E67E22 !important;
  outline-offset: 2px !important;
}

.tribe-events-calendar-month__day:focus-within {
  box-shadow: 0 0 0 2px #E67E22 inset !important;
}


/* ============================================================
   END -- LPCA Calendar Styles v11
   ============================================================ */