/* =====================================================
   BASE CONTAINER
===================================================== */
.bcd-simulator-calendar {
    background: none;
    color: #ffffff;
    font-family: Arial, sans-serif;
}

.bcd-simulator-calendar-heading {
    text-align: center;
    text-transform: uppercase; /* makes all letters capitals */
    margin-bottom: 20px;       /* spacing between heading and calendar */
    font-weight: bold;          /* optional, makes it stand out */
}

/* =====================================================
   HEADER TOOLBAR
===================================================== */
.fc .fc-header-toolbar {
    background: none;
    border-bottom: 2px solid #40ae49;
    margin-bottom: 0 !important;
    padding: 6px 10px;
}

.fc .fc-toolbar-title {
    color: #ffffff;
}

.fc .fc-button {
    background: #40ae49;
    border: none;
    color: #ffffff;
    font-weight: bold;
}

.fc .fc-button:hover {
    background: #42584A;
}

.fc .fc-button-primary:not(:disabled).fc-button-active {
    background: #223228;
}

/* =====================================================
   DAY HEADERS (TOP ROW)
===================================================== */
.fc .fc-col-header-cell {
    background: #414141;
    border-right: 1px solid #7c7c7c; /* vertical lines */
}

.fc .fc-col-header-cell-cushion {
    color: #ffffff;
    font-weight: bold;
    padding: 6px 0;
}

.fc .fc-scrollgrid-section-sticky > * {
    background: #014406 !important;
    position: sticky;
    z-index: 3;
}

/* =====================================================
   FULL GRID LINES (VERTICAL + HORIZONTAL)
===================================================== */
.fc-theme-standard td,
.fc-theme-standard th {
    border: 1px solid #7c7c7c; /* black lines for both vertical & horizontal */
}

/* =====================================================
   REMOVE CURRENT DAY HIGHLIGHT COMPLETELY
===================================================== */
.fc .fc-day-today,
.fc .fc-day-today .fc-col-header-cell-cushion,
.fc .fc-day-today .fc-timegrid-slot {
    background: transparent !important;
    color: #ffffff !important; /* or whatever your normal text color is */
}


/* =====================================================
   TIME AXIS (LEFT COLUMN)
===================================================== */
.fc .fc-timegrid-axis {
    background: none;
    color: #ffffff;
    border-right: 1px solid #7c7c7c;
}

/* =====================================================
   EVENTS: COLOR, BORDER, CENTER, NO WRAP
===================================================== */
.fc .fc-event {
    background-color: #207a00 !important;
    border-color: #207a00 !important;
    border-radius: 0 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;  
    justify-content: center !important;
    white-space: nowrap !important;
}

/* Event main content (ensures full slot coverage and no wrap) */
.fc .fc-event .fc-event-main,
.fc .fc-event .fc-event-main-frame {
    background-color: #207a00 !important;
    color: #ffffff !important;
    border-radius: 0px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 100%;
}

/* Hover effect */
.fc .fc-event:hover .fc-event-main,
.fc .fc-event:hover .fc-event-main-frame {
    background-color: #207a00 !important;
    color: #ffffff !important;
    border-radius: 0px !important;
}

/* =====================================================
   CURRENT TIME INDICATOR
===================================================== */
.fc .fc-now-indicator-line {
    border-color: #7c7c7c;
}

/* ===============================
   RESPONSIVE HEADER TOOLBAR
=============================== */
@media (max-width: 768px) {
    /* Reduce toolbar padding */
    .fc .fc-header-toolbar {
        padding: 4px 6px;
    }

    /* Make title smaller */
    .fc .fc-toolbar-title {
        font-size: 16px !important;
    }
	
	.bcd-simulator-calendar-heading {
    	text-align: center;
    	text-transform: uppercase; /* makes all letters capitals */
	}

    /* Shrink buttons */
    .fc .fc-button {
        font-size: 12px !important;
        padding: 4px 6px !important;
        min-width: 30px !important;
    }

    /* Stack buttons and title if needed */
    .fc .fc-header-toolbar > div {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    /* Reduce spacing between buttons */
    .fc .fc-button + .fc-button {
        margin-left: 4px !important;
    }
}