/* --- General Body and Background --- */
body {
    /* The background image remains the same */
    background-image: url('https://images.unsplash.com/photo-1614094183422-2b62b14a12b7');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
    z-index: 1;
}

body::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* --- CHANGE: Lightened the dark blue overlay --- */
    /* From a heavy rgba(10, 38, 71, 0.7) to a lighter, more modern blue-gray */
    background: rgba(45, 85, 120, 0.65); 
    z-index: -1;
}


/* --- Form Card Styling --- */
.form-card {
    background-color: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* --- Footer Style Recommendation --- */
/* Add this class to your footer element for a consistent look */
.footer-navy {
    background-color: #004080; /* A lighter navy blue that complements the new theme */
    color: white;
}


/* --- Utility and Component Styles --- */
#toastContainer { z-index: 12000; }
.password-toggle-icon { 
    position: absolute; 
    top: 50%; 
    right: 15px; 
    transform: translateY(-50%); 
    cursor: pointer; 
    color: #6c757d; 
    z-index: 5;
}


/* --- Custom Button Theme (Updated) --- */
.btn-navy {
    /* --- CHANGE: Updated to a more vibrant, lighter blue --- */
    background-color: #005A9C; /* A strong, professional blue */
    border-color: #005A9C;
    color: white;
}
.btn-navy:hover {
    /* --- CHANGE: A slightly lighter shade for the hover effect --- */
    background-color: #006FBF;
    border-color: #006FBF;
    color: white;
}


/* --- Fix for floating label padding in grid columns --- */
.form-floating > label {
    padding-left: 0.75rem; 
}
.row > .col-md-6.form-floating > label {
    padding-left: calc(var(--bs-gutter-x) * .5 + 0.75rem);
}


/* --- RESPONSIVE STYLES FOR TABLET & MOBILE --- */
@media (max-width: 992px) {
    .py-4 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
}
@media (max-width: 576px) {
    body {
        background-attachment: scroll;
    }
    .form-card {
        padding: 1.5rem !important;
    }
    main.flex-grow-1 {
        align-items: flex-start !important;
        padding-top: 1rem;
    }
    .text-center.mt-4 {
        margin-top: 1.5rem !important;
    }
}
/* ================================================
   FullCalendar Styling - Black Borders + Better Spacing
   ================================================ */

/* Calendar container with black border */
#calendar {
    border: 2px solid #000000;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    background: #ffffff;
}

/* Calendar header with black border */
#calendar .fc-toolbar {
    border-bottom: 2px solid #000000;
    padding: 12px;
    background: #f8f9fa;
}

/* Day header (Mon, Tue, Wed...) with black borders */
#calendar .fc-col-header-cell {
    border-right: 1px solid #000000 !important;
    border-bottom: 2px solid #000000 !important;
    background: #f1f3f5;
    font-weight: 600;
    padding: 10px 5px !important;
}

#calendar .fc-col-header-cell:last-child {
    border-right: none !important;
}

/* Day cell borders - BLACK */
#calendar .fc-daygrid-day {
    border: 1px solid #000000 !important;
    min-height: 80px; /* Add spacing between rows */
}

/* Event block styling with black borders */
#calendar .fc-event,
#calendar .fc-daygrid-event {
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    margin: 3px !important; /* More margin for spacing */
    padding: 4px 8px !important; /* More padding inside events */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Force center alignment on ALL event text */
#calendar .fc-event,
#calendar .fc-event-main,
#calendar .fc-event-main-frame,
#calendar .fc-event-title-container,
#calendar .fc-event-title,
#calendar .fc-event-time {
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
}

#calendar .fc-event-title,
#calendar .fc-event-time {
    display: block !important;
    width: 100% !important;
    font-weight: 600 !important;
    font-size: 12px !important; /* Slightly larger for readability */
    color: #ffffff !important; /* White text on colored backgrounds */
}

#calendar .fc-event-main {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}

#calendar .fc-event-main-frame {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}

/* Remove default padding that causes left alignment */
#calendar .fc-event-title-container {
    padding: 0 !important;
}

/* Day numbers styling with more spacing */
#calendar .fc-daygrid-day-number {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    padding: 8px !important; /* More padding for day numbers */
    font-weight: 600;
    color: #212529;
    font-size: 14px;
}

/* Today's date highlight with black border */
#calendar .fc-day-today {
    background-color: rgba(255, 215, 0, 0.15) !important;
    border: 2px solid #000000 !important;
}

#calendar .fc-day-today .fc-daygrid-day-number {
    color: #000000;
    font-weight: 700;
}

/* Day header centering */
#calendar .fc-col-header-cell-cushion {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    color: #212529;
    font-size: 13px;
}

/* "More" link styling with black border */
#calendar .fc-daygrid-more-link {
    text-align: center !important;
    display: block !important;
    font-weight: 600;
    color: #005A9C;
    border: 1px solid #000000;
    border-radius: 3px;
    padding: 3px 6px;
    margin: 3px;
    background: #f8f9fa;
}

#calendar .fc-daygrid-more-link:hover {
    background: #e9ecef;
    text-decoration: none;
    border-color: #000000;
}

/* Month/week title styling */
#calendar .fc-toolbar-title {
    text-align: center !important;
    font-weight: 700 !important;
    color: #212529;
    font-size: 20px;
}

/* Calendar buttons with black border */
#calendar .fc-button {
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    background: #005A9C !important;
    color: #ffffff !important;
}

#calendar .fc-button:hover {
    background: #006FBF !important;
    border-color: #000000 !important;
}

#calendar .fc-button:active {
    background: #004080 !important;
}

/* Week row borders - BLACK */
#calendar .fc-daygrid-week {
    border-bottom: 1px solid #000000;
}

/* Add space between calendar body and header */
#calendar .fc-view-harness {
    padding-top: 2px;
}

/* Improve cell spacing */
#calendar .fc-daygrid-day-frame {
    min-height: 70px;
    padding: 4px;
}

/* Responsive borders for mobile */
@media (max-width: 768px) {
    #calendar {
        border: 2px solid #000000;
    }
    
    #calendar .fc-event-title {
        font-size: 10px !important;
    }
    
    #calendar .fc-daygrid-day-number {
        padding: 6px !important;
        font-size: 12px;
    }
    
    #calendar .fc-daygrid-day {
        min-height: 60px;
    }
}