@import url("../fonts/noto-sans/400.df963a3cabcd.css");
@import url("../fonts/noto-sans/600.926c816a20a7.css");

:root {
    --tblr-font-sans-serif: "Noto Sans", sans-serif;
    /*--tblr-body-font-weight: 400;*/
    /*--tblr-font-weight-bold: 500;*/
    /*--tblr-body-font-size: 1rem;*/
    /*--tblr-font-size-h2: 1.6rem; */
    /*--tblr-font-size-h3: 1.4rem; */

    --thumb-img-height: 150px;
    --thumb-video-height: 300px;
}

/* Fixes tailwind preflight conflicting with tabler's body height 100% */
body {
    height: auto;
}

.toast-container {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
}

#table-trial-timeline th:first-child,
#table-trial-subjects th:first-child,
#table-trial-subjects td:first-child,
#table-trial-subjects td:nth-child(2) {
    width: 1px;
}

#table-case-documents th:first-child, #table-case-documents th:last-child,
#table-case-documents td:first-child, #table-case-documents td:last-child {
    width: 1px;
}

#table-case-documents td {
    vertical-align: middle;
}

@media print {
    .visit { page-break-before: always; }

    .header-image img {
        height: 5cm;
        max-width: 4cm;
    }

    .maplibregl-ctrl-attrib {
        display: none;
    }
}

.header-image img {
    max-height: 300px;
    max-width: 60vw;
}

aside .dropdown-item {
    padding: calc(var(--tblr-dropdown-item-padding-y) / 2) var(--tblr-dropdown-item-padding-x);
}

.btn-primary > .spinner-border { display: none; }

.modal-placeholder > .loading {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 32rem;
}

.c_placeholder {
    width: 100%;
    height: var(--thumb-img-height);

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    color: var(--tblr-secondary);
    background-color: var(--tblr-secondary-lt);
    border: 1px solid var(--tblr-secondary-border-subtle);

    user-select: none;
    text-align: center;
}

.upload_zone {
    position: relative;
    height: var(--thumb-img-height);
    width: 100%;
    text-align: center;
}

.upload_zone .progress {
    position: absolute;
}

.upload_zone label {
    color: var(--tblr-secondary);
    background-color: var(--tblr-secondary-lt);

    border-width: 4px;
    border-style: dotted;
    border-color: var(--tblr-secondary-border-subtle);

    transition: all .15s ease-in-out;

    user-select: none;
    cursor: pointer;
}

.upload_zone:hover label, .upload_zone.active label {
    background-color: var(--tblr-primary-lt);
    color: var(--tblr-primary) !important;
    border-color: var(--tblr-primary-border-subtle) !important;
}

.upload_zone.error label {
    background-color: var(--tblr-danger-lt);
    color: var(--tblr-danger) !important;
    border-color: var(--tblr-danger-border-subtle) !important;
    cursor: not-allowed;
}

.upload_zone .btn-image-editor {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

.thumb_list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.thumb_list .c_placeholder, .thumb_list .upload_zone {
    width: auto;
    aspect-ratio: 1 / 1;
}

.thumb_buttons {
    position: absolute;
    top: 0.35rem;
    right: 0.35rem;

    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.thumb {
    display: inline-block;
    height: var(--thumb-img-height);
}

.thumb img {
    max-height: var(--thumb-img-height);
}

.markdown > table thead th {
    white-space: normal;
}


.form-check-inline {
    margin-right: 0;
}

.form-check-inline > .btn-check:checked + .btn {
    border-color: transparent;
}

.errorlist {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;
    color: var(--tblr-danger);
}

#notificationModal .text-body p:last-child {
    margin-bottom: 0;
}


.htmx-request .btn-primary > .spinner-border,
.htmx-request.btn-primary > .spinner-border { display: block; }

.htmx-request .btn-primary .icon,
.htmx-request.btn-primary .icon { display: none; }

.cdx-list__checkbox svg {
    top: 0 !important;
    left: 0 !important;
}


/* Lightbox */
#modal-lightbox .modal-content {
    background-color: transparent;
}

.carousel-image {
    width: 100%;
    height: calc(100vh - 2 * var(--tblr-modal-margin));
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel-image img {
    max-height: 100%;
    max-width: 100%;
}

input.totp {
    box-sizing: content-box;

    /*font: 156.5% sans-serif;*/
    font: 250% sans-serif;
    font-family: monospace;

    margin: 0.7rem auto;

    --gap: 0.8ch;
    width: calc(6*(var(--gap) + 1ch));
    letter-spacing: var(--gap);
    padding: calc(var(--gap) / 4) var(--gap);
    padding-right: 0;
    border-radius: calc(var(--gap)/2);
    background: linear-gradient(to right, var(--bs-secondary-bg) 1px 1ch, transparent 0) content-box center left / calc(1ch + var(--gap)) 1em repeat-x;
}

svg.segno {
    width: 100%;
    height: auto;
}

.folder > .card, .folder-home {
    transition: background-color .15s ease-in-out;
}

.breadcrumb-item {
    padding: 1rem 0.5rem;
}

.folder-home {
    padding: 1rem;
    border-radius: var(--tblr-border-radius);
}

.folder.dragover > .card, .folder-home.dragover, .folder-home:hover {
    border-color: var(--tblr-primary-border-subtle);
    background-color: var(--tblr-primary-bg-subtle);
}

.visit-header {
    background-color: var(--tblr-card-bg);
    position:-webkit-sticky;
    position:sticky;
    top:0;
    z-index:1020;
}

@media print {
    .visit-header {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .trial-status .subheader {
        writing-mode: vertical-rl;
        min-height: 6rem;
    }
}

.offcanvas-size-xxl {
    --tblr-offcanvas-width: min(95vw, 90vw) !important;
}

.offcanvas iframe {
    width: 100%;
    height: 99%;
}