/**********************************************************
 * TRIVENTO - GESTOR DE RESERVAS (CSS Architecture)
 * --------------------------------------------------------
 * This file contains purely optimized, unified CSS styles.
 * It uses shared classes (.panel, .page-header, .table-wrapper)
 * to ensure all screens have the exact same alignments, 
 * paddings, and behaviors. 
 **********************************************************/

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");



body {
    font-family: 'Montserrat', sans-serif;
    color: rgb(86, 94, 100);
}

.header {
    height: 80px;
}

.fs-08 {
    font-size: 0.8rem;
}

.fs-07 {
    font-size: 0.7rem;
}

.ls-01 {
    letter-spacing: 1px;
}

.ls-02 {
    letter-spacing: 2px;
}


.nav-link.active {
    font-weight: 800;
}

.col-truncate {
    min-width: 0;

}

.col-truncate div {
    cursor: pointer;
}


/* CALENDAR */


.flatpickr-calendar.inline {
    /* width: 200px !important;*/
    font-size: 12px !important;
    transform: scale(0.75);
    transform-origin: top left;
}

.flatpickr-day.has-reservation {
    font-weight: bold;
}








/* X-Small devices (portrait phones, less than 576px)
// No media query for `xs` since this is the default in Bootstrap */


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .header {
        height: 140px;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {}