/*

Used in the FullCalendar6 library. Copied from web/themes/sjsoadmin/css/colors.css,
the CSS file used in the FullCalendar library. Will contain historical cruft.

*/

/* Smooth transitions for calendar */
.fc {
    transition: height 0.3s ease-in-out;
}

.fc .fc-view-harness {
    transition: height 0.3s ease-in-out;
}

.fc-daygrid-body {
    transition: height 0.3s ease-in-out;
}

.block-all-tours-calendar .white-space,
#book-tour-calendar-wrapper .white-space {
    white-space: normal !important;
}

.block-all-tours-calendar .base,
#book-tour-calendar-wrapper .base {
    background-color: #fff !important;
}

.std_slot {
    white-space: nowrap !important;
}

.full_slot {
    background-color: #d2d2d2 !important;
    white-space: nowrap !important;
}

.past_slot {
    background-color: #d2d2d2 !important;
    white-space: nowrap !important;
}

.hidden_slot {
    display:none !important;
}

.filtered-out {
    display:none !important;
}

/* Make non-interactive events (sold out and past) appear as non-clickable divs */
.non-interactive-event,
.non-interactive-event * {
    pointer-events: none !important;
    cursor: default !important;
}

/* Hide empty anchor tags that FullCalendar creates for non-interactive events */
.fc-daygrid-event-harness a.non-interactive-event:empty {
    display: none !important;
}

/* Ensure divs used for non-interactive events don't show pointer cursor */
div.non-interactive-event,
div.non-interactive-event * {
    cursor: default !important;
}

div.non-interactive-event:hover,
div.non-interactive-event:hover * {
    cursor: default !important;
}

/* Remove anchor tag styling from non-interactive events */
a.non-interactive-event,
a.non-interactive-event * {
    text-decoration: none !important;
    cursor: default !important;
    pointer-events: none !important;
}

/* Hide any anchor with non-interactive-event class that has no text content */
a.non-interactive-event:not(:has(div)):not(:has(span)) {
    display: none !important;
}

/* Prevent pointer cursor on past or sold out events in calendar grid */
.fc-daygrid-event.past_slot,
.fc-daygrid-event.past_slot *,
.fc-daygrid-event.full_slot,
.fc-daygrid-event.full_slot * {
    cursor: default !important;
    pointer-events: none !important;
}

.fc-daygrid-event.past_slot:hover,
.fc-daygrid-event.past_slot:hover *,
.fc-daygrid-event.full_slot:hover,
.fc-daygrid-event.full_slot:hover * {
    cursor: default !important;
}

/*

below are admin design css

*/

/* Scoped to calendar block to prevent conflicts with site-wide CSS */
.block-all-tours-calendar .box,
#book-tour-calendar-wrapper .box {
    border-radius: 0;
    box-shadow: 4px 7px 7px 1px rgba(119, 119, 119, 0.2);
    width:95%;
}

.block-all-tours-calendar .border-grey,
#book-tour-calendar-wrapper .border-grey {
    border-top: 1px solid grey;
}

.block-all-tours-calendar .font-white,
#book-tour-calendar-wrapper .font-white {
    color: white;
}

.block-all-tours-calendar .font-black,
#book-tour-calendar-wrapper .font-black {
    color: black;
}

.block-all-tours-calendar .flex,
#book-tour-calendar-wrapper .flex {
    display: flex;
}

.block-all-tours-calendar .f-item,
#book-tour-calendar-wrapper .f-item {
    width: auto;
}

.block-all-tours-calendar .f-grow1,
#book-tour-calendar-wrapper .f-grow1 {
    flex-grow: 1;
}

.block-all-tours-calendar .vert-center-parent,
#book-tour-calendar-wrapper .vert-center-parent {
    display:table;
    width:100%;
}

.block-all-tours-calendar .vert-center-child,
#book-tour-calendar-wrapper .vert-center-child {
    display:table-cell;
    vertical-align: middle;
}

.block-all-tours-calendar .bold,
#book-tour-calendar-wrapper .bold {
    font-weight: bold;
}

.block-all-tours-calendar .center,
#book-tour-calendar-wrapper .center {
    text-align: center;
}

.block-all-tours-calendar .font-xlrg,
#book-tour-calendar-wrapper .font-xlrg {
    font-size: 2rem;
    padding: .25rem;
}

.block-all-tours-calendar .font-lrg,
#book-tour-calendar-wrapper .font-lrg {
    font-size: 1.5rem;
    padding: .15rem;
}

.block-all-tours-calendar .font-med,
#book-tour-calendar-wrapper .font-med {
    font-size: 1.25rem;
    padding: .1rem;
}

.block-all-tours-calendar .font-sm,
#book-tour-calendar-wrapper .font-sm {
    font-size: 1rem;
    padding: .1rem;
}

.block-all-tours-calendar .font-xsm,
#book-tour-calendar-wrapper .font-xsm {
    font-size: .75rem;
    padding: .1rem;
}

.block-all-tours-calendar .bg-red,
#book-tour-calendar-wrapper .bg-red {
    background-color: red;
}

.block-all-tours-calendar .btn,
#book-tour-calendar-wrapper .btn {
    display: block;
    padding: .75rem;
    text-align: center;
}

.block-all-tours-calendar .black-button,
#book-tour-calendar-wrapper .black-button {
    background-color: #1a252f !important
}

.block-all-tours-calendar .btn:hover,
#book-tour-calendar-wrapper .btn:hover {
    background-color: rgb(197, 197, 197);
    cursor: pointer;
}

.fc-daygrid-block-event {
    margin-bottom: 2px;
    border: none !important;
}

/* Remove borders from all calendar events */
.fc-event,
.fc-daygrid-event,
.fc-h-event {
    border: none !important;
}

.block-all-tours-calendar .none,
#book-tour-calendar-wrapper .none {
    background-color: #fff;
}

/*

fixes against GIN theme

*/

table.fc-scroll-grid tr:hover {
    background-color: 'green' !important;
}

/*

Calendar filters

*/

#calendar-filters {
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
    align-items: center;
    flex-wrap: wrap;
    padding: 15px;
    background-color: #f5f5f5;
    border-radius: 4px;
    border: 1px solid #ddd;
}

#calendar-filters > div {
    display: flex;
    align-items: center;
    gap: 5px;
}

#calendar-filters label {
    font-weight: 600;
    margin-right: 5px;
    font-size: 14px;
}

#calendar-filters select {
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    background-color: white;
    cursor: pointer;
    min-width: 150px;
}

#calendar-filters select:hover {
    border-color: #999;
}

#calendar-filters select:focus {
    outline: none;
    border-color: #128dcf;
    box-shadow: 0 0 0 2px rgba(18, 141, 207, 0.1);
}

#book-tour {
    min-height: 500px;
}
/* Filter reset button styles */
#filter-reset {
    padding: 8px 16px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    background-color: #f5f5f5;
    cursor: pointer;
    font-weight: 600;
}
#filter-reset:hover {
    background-color: #e0e0e0;
}

/* List view customizations */

/* Time column in list view - brand font, color set via inline styles in JS */
.fc-list-event-time {
    font-family: "bn_carta_noir", Sans-Serif;
    font-weight: bold;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    font-variant-numeric: tabular-nums;
}

/* Hide event graphic/dot in list view */
.fc-list-event-graphic {
    display: none !important;
}

/* Remove hover background color change for list items */
.fc-list-event:hover td {
    background-color: inherit !important;
}

/* Text color for list view content is set via inline styles in JS */

/* Sold Out text should remain red */
.fc-list-event-title .sold-out-text {
    color: red !important;
    font-weight: bold !important;
}

/* List view day headers and dates - black color, no underline */
.fc-list-day-text,
.fc-list-day-side-text {
    color: black !important;
    text-decoration: none !important;
}

/* List view program description text - font-weight 500, color set via inline styles in JS */
.fc-list-event-title div > div {
    font-weight: 500 !important;
}

/* List view day cell background - white */
.fc-list-day {
    background-color: white !important;
}

.fc-list-day-cushion {
    background-color: white !important;
}

/* List view header background - white */
.fc-list-table thead th {
    background-color: white !important;
}

/* Calendar header toolbar alignment */
.fc-header-toolbar {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 1em !important;
}

.fc-header-toolbar .fc-toolbar-chunk:first-child {
    flex: 0 0 auto;
}

.fc-header-toolbar .fc-toolbar-chunk:last-child {
    flex: 0 0 auto;
    display: flex;
    gap: 10px;
    align-items: center;
}

/* Ensure title stays on the left */
.fc-toolbar-title {
    text-align: left !important;
    margin: 0 !important;
}

/* Calendar day headers and dates - black color, no underline */
.fc-col-header-cell-cushion {
    color: black !important;
    text-decoration: none !important;
}

.fc-daygrid-day-number {
    color: black !important;
    text-decoration: none !important;
    cursor: default;
    font-family: "bn_carta_noir", Sans-Serif;
    font-weight: bold;
    letter-spacing: 0.35px;
}

/* If a browser/theme applies link colors to <a>, keep it consistent */
.fc a.fc-daygrid-day-number {
  color: inherit;
}

/* Calendar event row - single-line flex layout matching Figma compact variant */
.calendar-event-row {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    align-items: center !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    width: 100% !important;
}

/* Brand font for time label within events - fixed width, no shrink */
.event-time-label {
    font-family: "Arial Narrow", Arial, sans-serif;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 0.3px;
    flex-shrink: 0;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Tour name within event - fills remaining space, truncates if needed */
.event-tour-label {
    flex: 1 0 0;
    min-width: 0;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Calendar program description text - font-weight 500, color set via inline styles in JS */
.fc-event-main .f-item {
    font-weight: 500 !important;
    text-align: left !important;
}

/* Left/right padding on event content to match Figma compact variant (px-[4px]) */
.block-all-tours-calendar .fc-event-main {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

/* Calendar day cell background - white */
.fc-daygrid-day {
    background-color: white !important;
}

/* Calendar header background - white */
.fc-col-header-cell {
    background-color: white !important;
}

/* Group the right side controls with proper spacing */
.fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group {
    margin: 0 5px;
}

/* NOTE: cursor rules are defined later in this file (see "Cursor rules (minimal + deterministic)") */

/* Smooth transitions for calendar height changes */
.fc {
    transition: height 0.5s ease-in-out, min-height 0.5s ease-in-out;
}

.fc .fc-view-harness {
    transition: height 0.5s ease-in-out;
}

.fc-view-harness-active {
    transition: height 0.5s ease-in-out;
}

.fc .fc-daygrid-body {
    transition: height 0.5s ease-in-out;
}

.fc .fc-scrollgrid-sync-table {
    transition: height 0.5s ease-in-out;
}

/* Smooth transitions for filtered events */
.filtered-out {
    transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
}

/* Ensure visible events maintain their height */
.fc-daygrid-event:not(.filtered-out) {
    transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
    opacity: 1;
}
/* Responsive styles for mobile devices */
@media (max-width: 600px) {
    #book-tour-calendar-wrapper {
        min-height: 400px;
    }
    #book-tour {
        min-height: 300px;
    }
    #calendar-filters {
        flex-direction: column;
        gap: 10px;
        padding: 10px;
    }
    #calendar-filters > div {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
    #calendar-filters select {
        width: 100%;
        min-width: 100%;
    }
    #filter-reset {
        width: 100%;
        padding: 12px 16px;
    }
    /* Adjust calendar header for mobile */
    .fc .fc-toolbar {
        flex-direction: column;
        gap: 10px;
    }
    .fc .fc-toolbar-chunk {
        display: flex;
        justify-content: center;
    }
    /* Make list view items more readable on mobile */
    .fc-list-event {
        font-size: 14px;
    }
    .fc-list-event-time {
        font-size: 13px;
    }
}
/* List view - pointer cursor for clickable items */
/* (handled by the cursor rules block below) */

/*
  Accessibility: month grid day numbers are not navigational in this implementation.
  Keep FullCalendar's markup but remove interactive affordance.

  NOTE: Don't disable pointer-events here — it can prevent hover/cursor feedback in some browsers.
  We already remove focusability in JS (tabindex=-1) and remove link styling via CSS.
*/
.fc-dayGridMonth-view .fc-daygrid-day-number {
  /* pointer-events: none; */
}

/*
  Cursor behavior
  - Month grid events are clickable unless marked .non-interactive-event
  - List view rows are clickable only when marked .is-clickable (set in JS)
*/

/* Cursor rules (minimal + deterministic)
   - Month grid events: pointer on the actual click target (<a.fc-event>)
   - Non-interactive events (past/sold out): default
   - List view: pointer only when JS marks the row as .is-clickable
*/

/* Month grid: clickable events (apply to wrappers too so hover always shows pointer) */
.fc-dayGridMonth-view .fc-daygrid-event-harness:not(:has(.non-interactive-event)),
.fc-dayGridMonth-view .fc-daygrid-event:not(.non-interactive-event),
.fc-dayGridMonth-view .fc-event:not(.non-interactive-event),
.fc-dayGridMonth-view a.fc-event:not(.non-interactive-event) {
  cursor: pointer !important;
}

/* Month grid: non-interactive events - must come after clickable rules */
.fc-dayGridMonth-view .fc-daygrid-event-harness:has(.non-interactive-event),
.fc-dayGridMonth-view .fc-daygrid-event-harness:has(.non-interactive-event) *,
.fc-dayGridMonth-view .fc-daygrid-event.non-interactive-event,
.fc-dayGridMonth-view .fc-daygrid-event.non-interactive-event *,
.fc-dayGridMonth-view .fc-event.non-interactive-event,
.fc-dayGridMonth-view .fc-event.non-interactive-event *,
.fc-dayGridMonth-view a.fc-event.non-interactive-event,
.fc-dayGridMonth-view a.fc-event.non-interactive-event *,
.fc-dayGridMonth-view .non-interactive-event,
.fc-dayGridMonth-view .non-interactive-event * {
  cursor: default !important;
  pointer-events: none !important;
}

/* List view: default cursor everywhere by default */
.fc-list-event,
.fc-list-event td {
  cursor: default !important;
}

/* List view: clickable rows */
tr.fc-list-event.is-clickable,
tr.fc-list-event.is-clickable td,
tr.fc-list-event.is-clickable a {
  cursor: pointer !important;
}

/* Block title "Book Now" - brand font, uppercase */
.block-all-tours-calendar h2 {
  font-family: "bn_carta_noir", Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: clamp(40px, 4vw, 72px);
  letter-spacing: 0.35px;
  color: #000;
  line-height: initial;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
}

/* Calendar month/year title - brand font */
.fc-toolbar-title {
  font-family: "bn_carta_noir", Sans-Serif !important;
  font-weight: bold !important;
  letter-spacing: 0.35px !important;
  text-transform: uppercase !important;
}

/* Calendar buttons (Today, Calendar, List, prev/next) - brand font */
.fc-button,
.fc-button-primary {
  font-family: "bn_carta_noir", Sans-Serif !important;
  font-weight: bold !important;
  letter-spacing: 0.35px !important;
  text-transform: uppercase !important;
}
