﻿

/*events modal*/
/* Custom class for responsive modal width */
.modal-responsive {
    max-width: 90%; /* Use 90% of available screen width */
    width: auto; /* Auto-adjust width */
}

/* Limit max width on larger screens */
@@media (min-width: 1200px) {
    .modal-responsive {
        max-width: 800px; /* Keep it large but not full-width on desktops */
    }
}

@@media (min-width: 1600px) {
    .modal-responsive {
        max-width: 1000px; /* Even larger on extra-wide screens */
    }
}

/* Dark theme for modal content */
.modal-content {
    background: #222; /* Dark background */
    color: #fff; /* Light text for contrast */
    border-radius: 10px; /* Rounded corners */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5); /* Subtle shadow */
}

/* Modal header styling */
.modal-header {
    background: #333; /* Slightly darker header */
    border-bottom: 1px solid #444;
    color: #f8f9fa;
    font-weight: bold;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

    /* Close button adjustments */
    .modal-header .btn-close {
        filter: invert(1); /* Makes the close button visible on dark backgrounds */
        opacity: 0.8;
    }

        .modal-header .btn-close:hover {
            opacity: 1;
        }

/* Modal body styling */
.modal-body {
    padding: 20px;
    max-height: 70vh; /* Limits to 70% of viewport height */
    overflow-y: auto; /* Allows scrolling if needed */
}

/* Improve modal footer */
.modal-footer {
    background: #333;
    border-top: 1px solid #444;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* Style the modal backdrop */
.modal-backdrop {
    background: rgba(0, 0, 0, 0.7); /* Darker overlay */
}

/* Button styling for modal actions */
.modal-footer .btn {
    background: #555;
    border: none;
    color: white;
}

    .modal-footer .btn:hover {
        background: #777;
    }

/* Style for event description (if present) */
.fc-event-title + div {
    font-size: 0.85em;
    color: #fff;
}

/* Ensure event boxes resize based on content */
.fc-daygrid-event, .fc-timegrid-event {
    height: auto !important;
    min-height: 45px !important;
    padding: 6px !important;
    overflow: hidden !important;
    text-align: left !important;
}



:root {
    --fc-bg-color: #1e1e1e;
    --fc-text-color: #ffffff;
    --fc-event-bg: #ff9800;
    --fc-event-text: #000000;
    --fc-border-color: #444;
    --bs-link-color-rgb: 255, 255, 255;
}


.fc {
    background-color: var(--fc-bg-color);
    color: var(--fc-text-color);
}

    .fc a {
        color: rgb(var(--bs-link-color-rgb)) !important;
    }

.fc-daygrid-day {
    border: 1px solid var(--fc-border-color) !important;
}

.fc-event:hover, .fc-daygrid-event:hover {
    background-color: #aaaaaa !important; /* Light red highlight */
    border-color: #ffd700 !important; /* Optional border change */
    */ outline: none !important;
}

.container-styled-grey {
    font-family: "Raleway", sans-serif;
    background-color: var(--fc-bg-color);
}

    .container-styled-grey a {
        color: rgb(var(--bs-link-color-rgb)) !important;
    }

    .container-styled-grey h4 {
        color: rgb(var(--bs-link-color-rgb)) !important;
    }
