/* Calendar event bars - styled like schema page */
.fc-event {
    border-radius: 6px !important;
    opacity: 0.9 !important;
    border: none !important;
    font-weight: 500 !important;
}

.fc-daygrid-event {
    border-radius: 6px !important;
    opacity: 0.9 !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 1px 2px !important;
    margin: 1px 0 !important;
    line-height: 18px !important;
    font-size: 11px !important;
    position: relative !important;
}

.fc-timegrid-event {
    border-radius: 6px !important;
    opacity: 0.9 !important;
    border: none !important;
    margin: 0 0 2px 0 !important; /* tighten vertical spacing between stacked bars */
}

.fc-list-event {
    border-radius: 6px !important;
    opacity: 0.9 !important;
    border: none !important;
}

.fc-daygrid-event-dot {
    display: none !important;
}

/* Hide the separate time element that contains just the number */
.fc-event-time {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Hide any automatic numbering from FullCalendar */
.fc-daygrid-event-number,
.fc-daygrid-event .fc-event-number,
.fc-event-number {
    display: none !important;
}

/* Ensure the title displays properly without the time element */
.fc-daygrid-event .fc-event-title {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    padding-left: 2px !important;
}

.fc-daygrid-event-title {
    display: block !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    color: white !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5) !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 1 !important;
    line-height: 18px !important;
    height: 18px !important;
    padding-left: 2px !important;
}

/* Ensure colors are applied properly in monthly view */
.fc-daygrid-event .fc-event-title {
    color: white !important;
}

.fc-daygrid-event .fc-event-title-container {
    color: white !important;
}

/* Force background colors in monthly view */
.fc-daygrid-event {
    background-color: var(--fc-event-bg-color) !important;
    border-color: var(--fc-event-border-color) !important;
}

/* Ensure inline styles override CSS variables */
.fc-daygrid-event[style*="background-color"] {
    background-color: inherit !important;
}

/* Additional monthly view fixes */
.fc-daygrid-event .fc-event-title {
    color: white !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important;
}

/* Ensure monthly events are properly sized and colored */
.fc-daygrid-event {
    min-height: 20px !important;
    max-height: 20px !important;
    height: 20px !important;
    line-height: 18px !important;
    padding: 1px 2px !important;
    margin: 1px 0 !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    position: relative !important;
}

/* Override any conflicting styles */
.fc-daygrid-event[style*="background-color"] {
    background-color: inherit !important;
}

.fc-daygrid-event[style*="border-color"] {
    border-color: inherit !important;
}

/* Ensure monthly view can accommodate taller events */
.fc-daygrid-day-events {
    min-height: 24px !important;
}

.fc-daygrid-day-frame {
    min-height: 24px !important;
}

/* Make sure event text is fully visible */
.fc-daygrid-event .fc-event-title {
    max-width: none !important;
    width: auto !important;
    overflow: visible !important;
    text-overflow: clip !important;
    flex: 1 !important;
    display: block !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
}

/* Ensure the event title container is properly positioned */
.fc-daygrid-event .fc-event-title-container {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
}

/* Monthly view: add the same white outline as other views, without changing size */
.fc-daygrid-event {
    box-shadow: inset 0 0 0 2px #ffffff !important;
}

/* Removed non-working rules for today's gray column to avoid dead code */


/* Button styles */
.btn {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-primary {
    background: #2563eb;
    color: white;
}

.btn-primary:hover {
    background: #1d4ed8;
}

.btn-secondary {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
    border-bottom: 2px solid #9ca3af;
}

.btn-secondary:hover {
    background: #e5e7eb;
    color: #1f2937;
}

.btn-danger {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.btn-danger:hover {
    background: #fecaca;
}

.calendar-container {
    padding: 0;
    max-width: none;
    margin: 0;
    height: calc(100vh - 12px);
    display: flex;
    flex-direction: column;
}

.calendar-wrapper {
    background: transparent; /* only the grid should be white */
    border-radius: 12px;
    padding: 6px; /* minimal outer padding */
    margin-bottom: 8px;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* FullCalendar Custom Styling */
.fc-theme-standard .fc-scrollgrid {
    background: #ffffff; /* white inner grid */
    border: none !important; /* remove outer outline */
    border-radius: 12px; /* rounded inner grid */
    overflow: hidden; /* clip corners */
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    flex: 1;
    min-height: 0;
}

/* Make the calendar fit the container */
#calendar {
    height: 100% !important;
    flex: 1;
    min-height: 0;
}

.fc {
    height: 100% !important;
}

.fc-view-harness {
    height: 100% !important;
    flex: 1;
    min-height: 0;
}

/* Ensure all view modes fit properly */
.fc-daygrid-view,
.fc-timegrid-view,
.fc-list-view {
    height: 100% !important;
    flex: 1;
    min-height: 0;
}

.fc-daygrid-body,
/* .fc-timegrid-body, */
.fc-list-body {
    height: 100% !important;
    flex: 1;
    min-height: 0;
}

/* Make sure the calendar content area is scrollable if needed */
.fc-scroller {
    height: 100% !important;
    overflow-y: auto !important;
}

/* Day & Week: ensure bars don't sit under the vertical scrollbar */
.fc .fc-timeGridDay-view .fc-timegrid-col-events,
.fc .fc-timeGridWeek-view .fc-timegrid-col-events {
    margin-right: 0px !important; /* smaller right gutter */
}

/* Keep bubbles inside the visible area when a gutter exists */
.fc .fc-timeGridDay-view .fc-timegrid-event .event-bubbles,
.fc .fc-timeGridWeek-view .fc-timegrid-event .event-bubbles {
    right: 0px !important;
}

/* Align right edges across views: remove right padding/margins/gutters so bars reach edge */
/* Timegrid (day/week) */
.fc .fc-timegrid .fc-timegrid-cols {
    margin-right: 0 !important;
}
.fc .fc-timegrid .fc-scrollgrid-sync-table {
    border-right: 0 !important; /* no extra gutter border on the right */
}
.fc .fc-timegrid-col-events {
    margin-right: 0 !important;
}

/* Prevent bars from sitting beneath the vertical scrollbar in day/week */
.fc .fc-timeGridDay-view .fc-timegrid-col-events,
.fc .fc-timeGridWeek-view .fc-timegrid-col-events {
    padding-right: 8px !important; /* small safe gutter to clear scrollbar */
}

.fc .fc-timeGridDay-view .fc-timegrid .fc-timegrid-cols,
.fc .fc-timeGridWeek-view .fc-timegrid .fc-timegrid-cols {
    padding-right: 8px !important; /* match events padding so right edges align */
}

/* Add gutter on the scroller content itself so absolutely-positioned bars don't tuck under the scrollbar */
.fc-timegrid-body .fc-scroller > .fc-timegrid {
    padding-right: 8px !important;
    box-sizing: border-box !important;
}

/* Remove any right-side divider that can create visual cut-off */
.fc .fc-timegrid .fc-timegrid-divider {
    width: 0 !important;
    border: 0 !important;
    padding: 0 !important;
}

/* Daygrid (month) */
.fc .fc-daygrid .fc-daygrid-body {
    padding-right: 0 !important;
    margin-right: 0 !important;
}
.fc .fc-daygrid .fc-scrollgrid-sync-table {
    border-right: 0 !important;
}

/* FullCalendar Toolbar Buttons - Force Override */
.fc-toolbar-title {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #374151 !important;
}

.fc-toolbar { 
    gap: 12px; 
    align-items: center; 
    margin: 8px 0 12px; 
}

/* Force override all FullCalendar buttons */
.fc .fc-button,
.fc-button,
.fc-button-primary,
.fc-button-group .fc-button {
    background: #ffffff !important;
    color: #6b7280 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    padding: 6px 12px !important;
    font-size: 14px !important;
    text-shadow: none !important;
}

.fc .fc-button:hover,
.fc-button:hover,
.fc-button-primary:hover,
.fc-button-group .fc-button:hover { 
    background: #f9fafb !important; 
    border-color: #d1d5db !important;
    color: #374151 !important;
    box-shadow: none !important;
}

.fc .fc-button:focus,
.fc-button:focus,
.fc-button-primary:focus,
.fc-button-group .fc-button:focus { 
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1) !important; 
    border-color: #3b82f6 !important;
    outline: none !important;
}

.fc .fc-button:disabled,
.fc-button:disabled,
.fc-button-primary:disabled,
.fc-button-group .fc-button:disabled { 
    opacity: 0.5 !important; 
    cursor: default !important; 
    background: #ffffff !important;
    color: #9ca3af !important;
}

.fc .fc-button:disabled:hover,
.fc-button:disabled:hover,
.fc-button-primary:disabled:hover,
.fc-button-group .fc-button:disabled:hover {
    background: #ffffff !important;
    color: #9ca3af !important;
    border-color: #e5e7eb !important;
}

/* Prev/next circular buttons - Force Override */
.fc .fc-prev-button,
.fc .fc-next-button,
.fc-prev-button, 
.fc-next-button {
    width: 32px !important; 
    height: 32px !important; 
    padding: 0 !important; 
    display: inline-flex !important; 
    align-items: center !important; 
    justify-content: center !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: #6b7280 !important;
    border: 1px solid #e5e7eb !important;
    font-size: 12px !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.fc .fc-prev-button:hover,
.fc .fc-next-button:hover,
.fc-prev-button:hover, 
.fc-next-button:hover {
    background: #f9fafb !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
    box-shadow: none !important;
}

/* Today button */
.fc-today-button { 
    padding: 8px 16px !important; 
    border-radius: 8px !important;
}

/* View buttons (dag, vecka, månad, lista) */
.fc-timeGridDay-button,
.fc-timeGridWeek-button,
.fc-dayGridMonth-button,
.fc-listWeek-button {
    padding: 8px 16px !important;
    border-radius: 8px !important;
}

/* Custom button (Ny tid) */
.fc-addNyTid-button {
    background: #ffffff !important;
    color: #374151 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    padding: 6px 12px !important;
    font-size: 14px !important;
}

.fc-addNyTid-button:hover {
    background: #f9fafb !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

/* Ensure FullCalendar doesn't reintroduce outer borders */
.fc-theme-standard td, .fc-theme-standard th {
    border-color: #e5e7eb; /* keep internal grid lines subtle */
}

.fc .fc-timegrid, .fc .fc-daygrid {
    border-radius: 10px;
    overflow: hidden;
}

/* List view styling (simple, rounded, no shadows or outlines) */
.fc-list {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: none;
    border: none;
    /* Remove any remaining default borders in list view only */
    --fc-border-color: transparent;
}

/* Aggressively strip borders in list view without affecting dots */
.fc .fc-list, 
.fc .fc-list > .fc-scroller, 
.fc .fc-list table, 
.fc .fc-list th, 
.fc .fc-list td, 
.fc .fc-list tr, 
.fc .fc-list thead, 
.fc .fc-list tbody { 
    border: 0 !important; 
}

.fc .fc-list table { border-collapse: collapse !important; }

.fc .fc-list .fc-list-day, 
.fc .fc-list .fc-list-day-cushion, 
.fc .fc-list .fc-list-day-text, 
.fc .fc-list .fc-list-day-side-text { 
    border: 0 !important; 
}

.fc-list-table,
.fc-list-table tbody,
.fc-list-table thead,
.fc-list-table tr,
.fc-list-table th,
.fc-list-table td {
    border: none !important;
    outline: none !important;
}

.fc-list-day-cushion {
    background: #ffffff;
    border: none !important;
    outline: none !important;
}

.fc-list-day-text, .fc-list-day-side-text { 
    color: #374151; 
    border: none !important;
    outline: none !important;
}

.fc-list-event {
    border: none !important;
    outline: none !important;
    background: #ffffff !important;
}

.fc-list-event:hover { background: #f8fafc !important; }
.fc-list-event:last-child { border-bottom: none !important; }

.fc-list-event-time,
.fc-list-event-title {
    border: none !important;
    outline: none !important;
}

.fc-daygrid-day-number {
    color: #374151;
    font-weight: 500;
}

.fc-day-today {
    background-color: transparent;
}

/* Make current day slot use gray background in monthly view */
.fc-day-today {
    background-color: #f3f4f6 !important;
}

.fc-day-today .fc-daygrid-day-number {
    background: #2563eb !important;
    color: white !important;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2px;
    font-weight: 400;
}

/* removed per request: no extra styling on timegrid today bg */

.fc-event {
    border-radius: 4px;
    border: none;
    font-size: 12px;
    font-weight: 500;
}

.fc-event-title {
    padding: 2px 4px;
}

/* Mobile responsive styles */
@media (max-width: 768px) {
    /* Ensure exit button is visible on mobile */
    #exitToDashboard {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 44px !important;
        height: 44px !important;
        font-size: 20px !important;
        z-index: 1001 !important;
        position: relative !important;
    }
    
    /* Ensure the exit button container is visible on mobile */
    div[style*="position:fixed"][style*="top:14px"][style*="right:20px"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        z-index: 1001 !important;
    }
    
    /* Mobile event bar fixes - prevent text overflow */
    .fc-daygrid-event {
        height: 18px !important;
        min-height: 18px !important;
        max-height: 18px !important;
        line-height: 16px !important;
        padding: 1px 3px !important;
        margin: 1px 0 !important;
        font-size: 10px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        display: flex !important;
        align-items: center !important;
    }
    
    .fc-daygrid-event .fc-event-title {
        font-size: 10px !important;
        line-height: 16px !important;
        height: 16px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        display: block !important;
    }
    
    .fc-daygrid-event .fc-event-title-container {
        width: 100% !important;
        height: 100% !important;
        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;
    }
    
    /* Ensure monthly view can accommodate the smaller events */
    .fc-daygrid-day-events {
        min-height: 20px !important;
    }
    
    .fc-daygrid-day-frame {
        min-height: 20px !important;
    }
    
    /* Timegrid events for day/week view */
    .fc-timegrid-event {
        font-size: 10px !important;
        padding: 1px 3px !important;
        margin: 0 0 1px 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    
    .fc-timegrid-event .fc-event-title {
        font-size: 10px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}