@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.2/font/bootstrap-icons.min.css");

body {
    font-family: 'Space Grotesk', sans-serif;
}

@media (min-width: 768px) {
    .navbar {
        max-height: 60px;
    }
}

.logo {
    filter: grayscale(100%)
}

.tooth {
    stroke: #212529;
    stroke-width: 2px;
    fill: white;
}

.tooth:hover {
    fill: cyan;
    cursor: pointer;
}

.tooth.active {
    fill: cyan;
}

.card-login {
    z-index: 2
}

.print {
    font-size: 14px;
}

.table {
    table-layout: fixed;
}

.th-2_5 {
    width: 2.5em;
}

.th-6 {
    width: 6em;
}

.th-7 {
    width: 7em;
}

.th-8 {
    width: 8em;
}

.th-10 {
    width: 10em;
}

.th-12 {
    width: 12em;
}

.th-16 {
    width: 16em;
}

.tr-clickable:hover {
    cursor: pointer;
}

.table-link {
    padding: 0.75em;
    display: block;
    width: 100%;
    height: 3em;
    color: #212529;
    text-decoration-line: none;
}

td a:hover {
    color: #212529;
    text-decoration: none;
    background-color: #f8f9fa;
}

@media (min-width: 992px) {
    .offcanvas-lg {
        position: fixed;
    }
}

.card-photo {
    min-height: 240px;
}

.card-report {
    height: 150px;
}