/*turn on the vertical scrollbar to prevent the navbar twitch with long content*/
body {
    overflow-y: scroll;
}


.rank_small {
    width: 20px;
}

.rank_med {
    width: 100px;
}

.rank_full {
    width: 100%;
}


.grid-column {
    /*outline: 1px solid orange;!* for test *!*/
}

.calendar-grid {
    display: grid;
    grid-auto-rows: 1fr;
    grid-template-columns: repeat(7, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}

.calendar-grid .grid-column {
    aspect-ratio: 1;
    width: 100%;
}

.highlight-info {
}

/* https://getbootstrap.com/docs/5.3/utilities/background/#background-color */
.highlight-info:hover {
    /*background-color: #0dcaf0;*/
    background-color: #0060df;
}

/* FADING SHIT */
/* https://vchu.hashnode.dev/htmx-with-flask-fade-in-and-out */
.fade-me-in.htmx-added {
    opacity: 0;
}

.fade-me-in {
    opacity: 1;
    transition: opacity 1s ease-out;
}

.fade-me-out.htmx-swapping {
    opacity: 0;
    transition: opacity 3s ease-out;
}


/* hx-indicator tweaks */
/* https://stackoverflow.com/a/71114815 */
.loader {
    display: none;
}

.htmx-request .loader {
    display: block;
}

.htmx-request.loader {
    display: block;
}

/* Hide previously loaded content during HTMX request */
.htmx-request .loaded-content {
    display: none;
}

.htmx-request.loaded-content {
    display: none;
}