/*
 * ============================================================================
 * FRAMED MINDS — Events Manager Brand Override
 * ============================================================================
 * File:        framed-minds-events.css
 * Version:     1.0.0
 * Platform:    Framed Minds (framedminds.com)
 * Plugin:      Events Manager 7.2.3+ / Events Manager Pro 3.7.2+
 * Author:      Echo — Brand Guardian
 * 
 * INSTALLATION:
 *   Upload to your WordPress child theme directory or add via
 *   Appearance → Customize → Additional CSS, or enqueue in functions.php:
 *
 *   function fm_events_custom_css() {
 *       wp_enqueue_style(
 *           'fm-events-brand',
 *           get_stylesheet_directory_uri() . '/framed-minds-events.css',
 *           array('events-manager'),
 *           '1.0.0'
 *       );
 *   }
 *   add_action('wp_enqueue_scripts', 'fm_events_custom_css', 99);
 *
 * COLOR REFERENCE (Framed Minds Brand):
 *   Primary Neutral:      #151515
 *   Primary CTA Green:    #BCCF97
 *   Primary Background:   #FFFFFF
 *   Light Warm Neutral:   #F4F1E8
 *   Accent Green:         #96CA42
 *   Gradient Beige:       #E9E2D0
 *   Soft Border:          #E7EAED
 *   Body Secondary Text:  #4A5560
 *   Meta Text:            #A0A7B0
 *   Deep Anchor Navy:     #0E1A27
 *   Heal Teal:            #3A5A40
 *   Olive Green:          #647C36
 *   Mastery Gold:         #C9A857
 *   Success:              #96CA42
 *   Error:                #EB5757
 *   Warning:              #F2994A
 *   Info:                 #2F80ED
 * ============================================================================
 */


/* ============================================================================
   1. GLOBAL VARIABLE OVERRIDES
   ============================================================================ */

.em {
  /* --- Core Theme Variables --- */
  --theme-hue: 40;
  --accent-hue: 93;
  --accent-s: 40%;
  --accent-l: 41%;
  --text-color-richer: #151515;
  --text-color-normal: #151515;
  --text-color-softer: #4A5560;
  --accent-color: #3A5A40;
  --accent-color-hover: #2C4832;
  --border-color: #E7EAED;
  --border-color-softer: #E7EAED;
  --background-color: transparent;
  --background-color-softer: #F4F1E8;
  --background-color-checkboxes: #FFFFFF;
  --background-color-inputs: #FFFFFF;
  --background-color-skeleton: #F4F1E8;
  --background-color-skeleton-softer: #F9F7F2;
  --code-background: #F4F1E8;
  --button-primary-color: #151515;

  /* --- Typography --- */
  --font-size: 16px;
  --line-height: 24px;
  --font-weight: 400;
  --font-family: "Work Sans", "Avenir", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* --- Layout Palette --- */
  --default-color: #4A5560;
  --default-border: #BCCF97;
  --palette-1-bg: #3A5A40;
  --palette-1-color: #FFFFFF;
  --meta-color: #A0A7B0;
  --meta-bg: transparent;
  --main-bg: #F4F1E8;
  --main-h3-color: #3A5A40;
  --main-border-color: #E7EAED;

  /* --- Counter/Badge --- */
  --counter-background: #3A5A40;
  --counter-color: #FFFFFF;
  --counter-background-tentative: #E9E2D0;
  --counter-color-tentative: #4A5560;
}


/* ============================================================================
   2. TYPOGRAPHY
   ============================================================================ */

.em.pixelbones,
.em {
  font-family: "Work Sans", "Avenir", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  color: #4A5560 !important;
  line-height: 1.5 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.em.pixelbones h1,
.em.pixelbones h2,
.em.pixelbones h3,
.em.pixelbones h4,
.em.pixelbones h5,
.em.pixelbones h6,
.em h1, .em h2, .em h3,
.em h4, .em h5, .em h6 {
  font-family: "Avenir", "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  color: #151515 !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em;
}

.em.pixelbones a,
.em a {
  color: #3A5A40 !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.em.pixelbones a:hover,
.em.pixelbones a:focus,
.em a:hover,
.em a:focus {
  color: #2C4832 !important;
}


/* ============================================================================
   3. BUTTONS
   ============================================================================ */

/* --- Primary Button --- */
.em.pixelbones .button.input:not([data-nostyle]),
.em.pixelbones button.input:not([data-nostyle]),
.em.pixelbones input[type=submit].input:not([data-nostyle]),
.em.pixelbones .input .button:not([data-nostyle]),
.em.pixelbones .input button:not([data-nostyle]),
.em.pixelbones .input input[type=submit]:not([data-nostyle]),
.em .button.button-primary,
.em button.button-primary,
.em input[type=submit].button-primary {
  background-color: #BCCF97 !important;
  border: 1px solid #BCCF97 !important;
  color: #151515 !important;
  border-radius: 8px !important;
  font-family: "Work Sans", "Avenir", sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em;
  transition: all 0.3s ease !important;
  padding: 10px 28px !important;
  text-transform: none !important;
}

.em.pixelbones .input .button:not([data-nostyle]):hover,
.em.pixelbones .input .button:not([data-nostyle]):focus,
.em.pixelbones .input button:not([data-nostyle]):hover,
.em.pixelbones .input button:not([data-nostyle]):focus,
.em.pixelbones .input input[type=submit]:not([data-nostyle]):hover,
.em.pixelbones .input input[type=submit]:not([data-nostyle]):focus,
.em .button.button-primary:hover,
.em button.button-primary:hover {
  background-color: #9FAF80 !important;
  border-color: #9FAF80 !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(58, 90, 64, 0.15) !important;
}

/* --- Secondary Button --- */
.em.pixelbones .input .button[data-nostyle],
.em.pixelbones .input button[data-nostyle],
.em .button:not(.button-primary) {
  background-color: #F4F1E8 !important;
  border: 1px solid #E7EAED !important;
  color: #151515 !important;
  border-radius: 8px !important;
  transition: all 0.3s ease !important;
}

.em .button:not(.button-primary):hover {
  background-color: #E9E4D9 !important;
  border-color: #D5D9DD !important;
}


/* ============================================================================
   4. FORM INPUTS
   ============================================================================ */

.em.pixelbones .input input:not([type=checkbox]):not([type=radio]),
.em.pixelbones .input select,
.em.pixelbones .input textarea,
.em input:not([type=checkbox]):not([type=radio]),
.em select,
.em textarea {
  background-color: #F4F1E8 !important;
  border: 1px solid #E7EAED !important;
  border-radius: 8px !important;
  color: #151515 !important;
  font-family: "Work Sans", sans-serif !important;
  padding: 10px 14px !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.em.pixelbones .input input:not([type=checkbox]):not([type=radio]):focus,
.em.pixelbones .input select:focus,
.em.pixelbones .input textarea:focus,
.em input:not([type=checkbox]):not([type=radio]):focus,
.em select:focus,
.em textarea:focus {
  border-color: #3A5A40 !important;
  box-shadow: 0 0 0 3px rgba(58, 90, 64, 0.12) !important;
  outline: none !important;
}

/* Selectize dropdown override */
.em .selectize-control.em-selectize .selectize-input,
.em .selectize-control.em-selectize-autocomplete .selectize-input {
  background-color: #F4F1E8 !important;
  border: 1px solid #E7EAED !important;
  border-radius: 8px !important;
}

.em .selectize-control .selectize-dropdown {
  border: 1px solid #E7EAED !important;
  border-radius: 0 0 8px 8px !important;
  background-color: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

.em .selectize-control .selectize-dropdown .option.active {
  background-color: #F4F1E8 !important;
  color: #3A5A40 !important;
}


/* ============================================================================
   5. CALENDAR VIEW
   ============================================================================ */

.em.em-calendar {
  --nav-color: #4A5560;
  --nav-border: 1px solid #E7EAED;
  --nav-background: none;
  --event-border-color: #BCCF97;
  --event-background-color: #3A5A40;
  --event-color: #FFFFFF;
  --event-text-color: #FFFFFF;
  --header-border: 1px solid #E7EAED;
  --header-background: transparent;
  --header-color: #A0A7B0;
  --date-box-border: 1px solid #E7EAED;
  --date-color: #4A5560;
  --date-background: #FFFFFF;
  --date-border-color: #BCCF97;
  --date-border: 2px solid var(--date-border-color);
  --date-today-color: #3A5A40;
  --date-today-background: #F4F1E8;
  --date-today-border: 2px solid #BCCF97;
  --date-more-color: #3A5A40;
  --calendar-background: #FFFFFF;
  --counter-background: #3A5A40;
  border-radius: 12px;
  overflow: hidden;
}

/* Calendar navigation month title */
.em.em-calendar .em-cal-nav .month input,
.em.em-calendar .em-cal-nav .month span.marker {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  color: #151515 !important;
  font-weight: 600 !important;
}

/* Calendar nav arrows */
.em.em-calendar .em-cal-nav .month-nav .em-calnav svg {
  stroke: #3A5A40;
}

.em.em-calendar .em-cal-nav .month-nav .em-calnav:hover svg,
.em.em-calendar .em-cal-nav .month-nav .em-calnav:hover path {
  stroke: #2C4832;
}

/* Calendar header row (day names) */
.em.em-calendar .em-cal-head {
  border-radius: 12px 12px 0 0;
  border-color: #E7EAED;
  background: #FFFFFF;
}

.em.em-calendar .em-cal-head > div {
  color: #A0A7B0 !important;
  font-family: "Work Sans", sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em;
  border-left-color: #E7EAED;
}

/* Calendar body/grid */
.em.em-calendar .em-cal-body {
  border-color: #E7EAED;
  background-color: #FFFFFF;
}

.em.em-calendar .em-cal-body > div {
  border-color: #E7EAED;
}

/* Date circles */
.em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date span {
  color: #4A5560 !important;
  font-family: "Work Sans", sans-serif !important;
  font-weight: 500 !important;
}

/* Eventful date indicator */
.em.em-calendar .em-cal-body .em-cal-day.eventful .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day.eventful-pre .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day.eventful-post .em-cal-day-date a {
  border-color: #BCCF97 !important;
  background-color: rgba(188, 207, 151, 0.1) !important;
}

/* Today indicator */
.em.em-calendar .em-cal-body .em-cal-day.eventful-today .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day.eventful-today .em-cal-day-date span,
.em.em-calendar .em-cal-body .em-cal-day.eventless-today .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day.eventless-today .em-cal-day-date span {
  background-color: #F4F1E8 !important;
  color: #3A5A40 !important;
  font-weight: 600 !important;
}

/* Calendar event pills */
.em.em-calendar .em-cal-body.event-style-pill .em-cal-event > div {
  background-color: #3A5A40 !important;
  border-color: #3A5A40 !important;
  color: #FFFFFF !important;
  border-radius: 6px !important;
  font-family: "Work Sans", sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.em.em-calendar .em-cal-body.event-style-pill .em-cal-event > div:hover {
  background-color: #2C4832 !important;
  filter: none !important;
}

.em.em-calendar .em-cal-body.event-style-pill .em-cal-event > div a {
  color: #FFFFFF !important;
}

/* Calendar "more events" link */
.em.em-calendar .em-cal-body .em-cal-day-limit a {
  color: #3A5A40 !important;
  font-weight: 500 !important;
}


/* ============================================================================
   6. EVENT LIST VIEW
   ============================================================================ */

.em.em-list {
  gap: 0 !important;
}

/* List items */
.em.em-list .em-item {
  border-top: 1px solid #E7EAED !important;
  padding: 28px 4px !important;
  background-color: transparent !important;
  color: #4A5560 !important;
  transition: background-color 0.25s ease;
}

.em.em-list .em-item:hover {
  background-color: rgba(244, 241, 232, 0.5) !important;
}

.em.em-list .em-item:first-child {
  border-top: 0 !important;
}

/* List item accent bar */
.em.em-list .em-item .em-item-info {
  border-left: 3px solid #BCCF97 !important;
  padding-left: 24px !important;
}

/* List item title */
.em.em-list .em-item .em-item-info h3.em-item-title {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-weight: 600 !important;
  color: #151515 !important;
  font-size: 20px !important;
  line-height: 1.3 !important;
  margin-bottom: 8px !important;
}

.em.em-list .em-item .em-item-info h3.em-item-title a {
  color: #151515 !important;
}

.em.em-list .em-item .em-item-info h3.em-item-title a:hover {
  color: #3A5A40 !important;
}

/* Meta lines (date, location, categories) */
.em.em-item .em-item-meta .em-item-meta-line,
.em.em-list .em-item .em-item-meta .em-item-meta-line {
  color: #A0A7B0 !important;
  font-size: 14px !important;
  line-height: 20px !important;
}

.em.em-item .em-item-meta .em-item-meta-line a,
.em.em-list .em-item .em-item-meta .em-item-meta-line a {
  color: #A0A7B0 !important;
  text-decoration: underline dotted #A0A7B0 1px !important;
}

.em.em-item .em-item-meta .em-item-meta-line a:hover,
.em.em-list .em-item .em-item-meta .em-item-meta-line a:hover {
  color: #3A5A40 !important;
}


/* ============================================================================
   7. GRID / CARD VIEW
   ============================================================================ */

.em.em-list.em-grid > div.em-item {
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid #E7EAED !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}

.em.em-list.em-grid > div.em-item:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(-2px) !important;
}

/* Grid card image */
.em.em-list.em-grid > div.em-item .em-item-image {
  border-radius: 12px 12px 0 0 !important;
}

/* Grid card image placeholder */
.em.em-list.em-grid > div.em-item .em-item-image.has-placeholder {
  background-color: #F4F1E8 !important;
}

/* Grid card info area */
.em.em-list.em-grid > div.em-item .em-item-info {
  padding: 16px 20px 24px !important;
  border-left: none !important;
}

.em.em-list.em-grid > div.em-item .em-item-info .em-item-title {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-weight: 600 !important;
  color: #151515 !important;
  font-size: 18px !important;
  margin-bottom: 12px !important;
}

.em.em-list.em-grid > div.em-item .em-item-info .em-item-title a {
  color: #151515 !important;
}

.em.em-list.em-grid > div.em-item .em-item-info .em-item-title a:hover {
  color: #3A5A40 !important;
}


/* ============================================================================
   8. SINGLE EVENT PAGE
   ============================================================================ */

.em.em-item.em-item-single .em-item-header {
  background-color: transparent !important;
  gap: 28px !important;
  margin-bottom: 28px !important;
}

.em.em-item.em-item-single .em-item-image img {
  border-radius: 12px !important;
  border-left: none !important;
  padding: 0 !important;
}

/* Single event meta */
.em.em-item.em-item-single .em-item-meta h3 {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  color: #3A5A40 !important;
  text-transform: uppercase !important;
  font-size: 14px !important;
  letter-spacing: 0.06em !important;
  font-weight: 600 !important;
}

.em.em-item.em-item-single .em-item-content {
  font-family: "Work Sans", sans-serif !important;
  color: #4A5560 !important;
  line-height: 1.7 !important;
}

/* Responsive single event */
.em.em-item.em-item-single.size-medium .em-item-header .em-item-image img,
.em.em-item.em-item-single.size-small .em-item-header .em-item-image img {
  border: none !important;
  border-radius: 12px !important;
}


/* ============================================================================
   9. SEARCH BAR
   ============================================================================ */

.em.em-search {
  --counter-background: #3A5A40;
  --counter-color: #FFFFFF;
}

/* Search bar container */
.em.em-search .em-search-main.em-search-main-bar {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #E7EAED !important;
  background-color: #FFFFFF !important;
}

/* Search inputs */
.em.em-search .em-search-main.em-search-main-bar > .em-search-field input {
  background-color: #FFFFFF !important;
  font-family: "Work Sans", sans-serif !important;
  color: #151515 !important;
}

.em.em-search .em-search-main.em-search-main-bar > .em-search-field input::placeholder {
  color: #A0A7B0 !important;
}

/* Search submit button */
.em.em-search .em-search-main.em-search-main-bar > .em-search-submit button {
  background-color: #BCCF97 !important;
  color: #151515 !important;
  border: none !important;
  font-family: "Work Sans", sans-serif !important;
  font-weight: 500 !important;
  transition: background-color 0.25s ease !important;
}

.em.em-search .em-search-main.em-search-main-bar > .em-search-submit button:hover {
  background-color: #9FAF80 !important;
  color: #FFFFFF !important;
}

/* Advanced search trigger badge */
.em button.em-clickable.em-search-advanced-trigger span.total-count {
  background: #3A5A40 !important;
  border-color: #3A5A40 !important;
  color: #FFFFFF !important;
}

/* View toggle icons (list/grid/calendar) */
.em.em-search .em-search-views [data-view].active,
.em.em-search .em-search-views [data-view]:hover {
  opacity: 1 !important;
}


/* ============================================================================
   10. ADVANCED SEARCH MODAL / INLINE
   ============================================================================ */

.em.em-search-advanced .em-search-advanced-sections.em-search-advanced-style-accordion > section.em-search-advanced-section {
  border-bottom-color: #E7EAED !important;
}

.em.em-search-advanced .em-search-advanced-sections.em-search-advanced-style-accordion > section.em-search-advanced-section header {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  color: #151515 !important;
}

.em.em-search-advanced .em-search-advanced-sections section.em-search-advanced-section span.total-count {
  background: #3A5A40 !important;
  border-color: #3A5A40 !important;
}


/* ============================================================================
   11. BOOKING FORM
   ============================================================================ */

/* Booking form wrapper */
.em.em-event-booking-form .em-booking-form {
  border: 1px solid #E7EAED !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Booking section headers */
.em.em-event-booking-form h3.em-booking-section-title {
  background-color: #F4F1E8 !important;
  color: #3A5A40 !important;
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  border-width: 0 0 1px 0 !important;
  border-style: solid !important;
  border-color: #E7EAED !important;
  padding: 16px 20px !important;
}

/* Booking section body */
.em.em-event-booking-form .em-booking-section {
  padding: 20px !important;
}

/* Booking submit button */
.em.em-event-booking-form .em-button.em-booking-submit {
  background-color: #BCCF97 !important;
  border: 1px solid #BCCF97 !important;
  color: #151515 !important;
  border-radius: 8px !important;
  font-family: "Work Sans", "Avenir", sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 14px !important;
  transition: all 0.3s ease !important;
}

.em.em-event-booking-form .em-button.em-booking-submit:hover {
  background-color: #9FAF80 !important;
  border-color: #9FAF80 !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(58, 90, 64, 0.2) !important;
}

.em.em-event-booking-form .em-button.em-booking-submit:disabled,
.em.em-event-booking-form .em-button.em-booking-submit.disabled {
  background-color: #E7EAED !important;
  border-color: #E7EAED !important;
  color: #A0A7B0 !important;
  cursor: not-allowed !important;
}

/* Booking messages */
.em.em-event-booking-form .em-booking-message {
  border-radius: 8px !important;
  font-family: "Work Sans", sans-serif !important;
}

.em.em-event-booking-form .em-booking-message.em-booking-message-success {
  color: #3A5A40 !important;
  background-color: rgba(150, 202, 66, 0.12) !important;
  border-color: #BCCF97 !important;
}

.em.em-event-booking-form .em-booking-message.em-booking-message-error {
  color: #842029 !important;
  background-color: rgba(235, 87, 87, 0.08) !important;
  border-color: rgba(235, 87, 87, 0.3) !important;
}

/* Ticket table */
.em.em-event-booking-form .em-tickets tr {
  border-top-color: #E7EAED !important;
}

.em.em-event-booking-form .em-tickets tr th {
  background-color: #3A5A40 !important;
  color: #FFFFFF !important;
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-weight: 600 !important;
}


/* ============================================================================
   12. PAGINATION
   ============================================================================ */

.em .em-pagination a,
.em .em-pagination span {
  border-radius: 8px !important;
  font-family: "Work Sans", sans-serif !important;
  font-weight: 500 !important;
  transition: all 0.25s ease !important;
}

.em .em-pagination .page-numbers.current {
  background-color: #3A5A40 !important;
  color: #FFFFFF !important;
  border-color: #3A5A40 !important;
}

.em .em-pagination a:hover {
  background-color: #F4F1E8 !important;
  color: #3A5A40 !important;
}


/* ============================================================================
   13. EVENT TOOLTIP / PREVIEW POPOVER
   ============================================================================ */

.em.em-calendar.preview-tooltips .em-cal-event-content {
  border-radius: 10px !important;
  border: 1px solid #E7EAED !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
  background-color: #FFFFFF !important;
  overflow: hidden !important;
}

.em.em-calendar.preview-tooltips .em-cal-event-content .em-item-title {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-weight: 600 !important;
  color: #151515 !important;
}

.em.em-calendar.preview-tooltips .em-cal-event-content .em-item-title a,
.em.em-calendar.preview-tooltips .em-cal-event-content .em-item-title a:hover {
  color: #151515 !important;
}

.em.em-calendar.preview-tooltips .em-cal-event-content .em-item-desc {
  color: #4A5560 !important;
  font-family: "Work Sans", sans-serif !important;
}

.em.em-calendar.preview-tooltips .em-cal-event-content .em-item-actions .button {
  background-color: #BCCF97 !important;
  color: #151515 !important;
  border-radius: 6px !important;
  border: none !important;
  font-weight: 500 !important;
}


/* ============================================================================
   14. MODALS
   ============================================================================ */

.em.em-modal .em-modal-content {
  border-radius: 12px !important;
  border: 1px solid #E7EAED !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12) !important;
  background-color: #FFFFFF !important;
}

.em.em-modal header {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  color: #151515 !important;
}

.em.em-modal footer {
  border-top: 1px solid #E7EAED !important;
}


/* ============================================================================
   15. ADD-TO-CALENDAR TOOLTIP
   ============================================================================ */

.em .em-add-to-calendar-tooltip {
  border-radius: 8px !important;
  border: 1px solid #E7EAED !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  background-color: #FFFFFF !important;
}


/* ============================================================================
   16. LOCATION MAP
   ============================================================================ */

.em-location-map-container .em-map-overlay {
  background-color: #3A5A40 !important;
}

.em-location-map-container .em-map-overlay div {
  color: #FFFFFF !important;
  font-family: "Work Sans", sans-serif !important;
}


/* ============================================================================
   17. MY BOOKINGS TABLE
   ============================================================================ */

.em.em-bookings-table,
.em .em-bookings-table {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #E7EAED !important;
}

/* Cart table (Pro) */
.em-cart-table th {
  background-color: #3A5A40 !important;
  color: #FFFFFF !important;
  font-family: "Avenir", "Work Sans", sans-serif !important;
  border-color: #3A5A40 !important;
}

.em-cart-table td {
  background-color: #FFFFFF !important;
  border-color: #E7EAED !important;
  font-family: "Work Sans", sans-serif !important;
}


/* ============================================================================
   18. BOOKINGS STATS
   ============================================================================ */

.em .em-bookings-stats {
  font-family: "Work Sans", sans-serif !important;
}


/* ============================================================================
   19. FLATPICKR DATE PICKER OVERRIDE
   ============================================================================ */

.flatpickr-calendar {
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid #E7EAED !important;
  font-family: "Work Sans", sans-serif !important;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover {
  background-color: #3A5A40 !important;
  border-color: #3A5A40 !important;
  color: #FFFFFF !important;
}

.flatpickr-day.today {
  border-color: #BCCF97 !important;
}

.flatpickr-day:hover {
  background-color: #F4F1E8 !important;
  border-color: #F4F1E8 !important;
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #3A5A40 !important;
}


/* ============================================================================
   20. LOADING SPINNER OVERLAY
   ============================================================================ */

.em div.em-loading,
.em div#em-loading {
  background-color: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(2px);
}


/* ============================================================================
   21. WIDGET STYLES (SIDEBAR / FOOTER)
   ============================================================================ */

.em.em-events-widget .em-item,
.em.em-list-widget .em-item {
  border-top-color: #E7EAED !important;
  padding: 12px 0 !important;
}

.em.em-events-widget .em-item h3,
.em.em-list-widget .em-item .em-item-title {
  font-family: "Avenir", "Work Sans", sans-serif !important;
  font-weight: 600 !important;
  color: #151515 !important;
}


/* ============================================================================
   22. BUDDYBOSS INTEGRATION HARMONY
   ============================================================================
   Ensure Events Manager elements look at home within BuddyBoss layouts.
   BuddyBoss already uses similar warm neutrals — these rules bridge gaps.
   */

/* Inside BuddyBoss content areas */
.bb-grid .em.em-calendar,
.bb-grid .em.em-list,
.bb-grid .em.em-search,
.bb-grid .em.em-item,
#buddypress .em.em-calendar,
#buddypress .em.em-list,
#buddypress .em.em-search,
#buddypress .em.em-item {
  max-width: 100%;
}

/* BuddyBoss tab integration */
.bb-grid .em.em-event-booking-form .em-booking-form,
#buddypress .em.em-event-booking-form .em-booking-form {
  border-radius: 12px !important;
}


/* ============================================================================
   23. RESPONSIVE REFINEMENTS
   ============================================================================ */

@media only screen and (max-width: 768px) {
  /* Soften calendar on mobile */
  .em.em-calendar .em-cal-head > div {
    font-size: 11px !important;
    padding: 0 4px !important;
  }

  /* Stack single event header */
  .em.em-item.em-item-single .em-item-header {
    flex-direction: column !important;
    gap: 16px !important;
  }

  .em.em-item.em-item-single .em-item-image {
    flex: none !important;
    width: 100% !important;
  }

  .em.em-item.em-item-single .em-item-image img {
    border-left: none !important;
    border-radius: 12px !important;
    padding: 0 !important;
  }

  /* Grid cards single column on mobile */
  .em.em-list.em-grid {
    grid-template-columns: 1fr !important;
  }

  .em.em-list.em-grid > div.em-item {
    max-width: 100% !important;
  }

  /* Search bar stacks better */
  .em.em-search .em-search-main.em-search-main-bar {
    border-radius: 10px !important;
  }

  /* Booking form tighter padding on mobile */
  .em.em-event-booking-form .em-booking-section {
    padding: 16px 12px !important;
  }

  .em.em-event-booking-form h3.em-booking-section-title {
    padding: 14px 16px !important;
    font-size: 18px !important;
  }
}

@media only screen and (max-width: 480px) {
  /* Compact calendar dates */
  .em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date a,
  .em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date span {
    width: 28px !important;
    height: 28px !important;
    font-size: 13px !important;
    padding: 4px !important;
  }

  /* Even tighter list items */
  .em.em-list .em-item {
    padding: 20px 2px !important;
    grid-template-columns: 1fr !important;
  }

  .em.em-list .em-item .em-item-image {
    margin-bottom: 12px !important;
  }

  .em.em-list .em-item .em-item-info {
    padding-left: 16px !important;
  }
}


/* ============================================================================
   24. ACCESSIBILITY ENHANCEMENTS
   ============================================================================ */

/* High-contrast focus states */
.em a:focus-visible,
.em button:focus-visible,
.em input:focus-visible,
.em select:focus-visible,
.em textarea:focus-visible {
  outline: 2px solid #3A5A40 !important;
  outline-offset: 2px !important;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  .em,
  .em * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }

  .em.em-list.em-grid > div.em-item:hover {
    transform: none !important;
  }
}

/* Dark mode foundation (if your theme supports it) */
@media (prefers-color-scheme: dark) {
  /* Intentionally left empty — Framed Minds currently uses
     light-only design. Add dark overrides here if needed. */
}


/* ============================================================================
   25. PRINT STYLES
   ============================================================================ */

@media print {
  .em.em-calendar .em-cal-body.event-style-pill .em-cal-event > div {
    background-color: #E7EAED !important;
    color: #151515 !important;
    border: 1px solid #151515 !important;
  }

  .em.em-list.em-grid > div.em-item {
    box-shadow: none !important;
    border: 1px solid #151515 !important;
  }

  .em a {
    color: #151515 !important;
    text-decoration: underline !important;
  }
}