﻿@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');



@media (max-height: 800px) {
    .patient-task-grid {
        height: 70vh !important;
    }
}


@media (min-height: 700px) and (max-height: 1024px) {
    .patient-task-grid {
        height: 80vh !important;
    }
}


html, body {
    font-family: Roboto, Helvetica, sans-serif, Verdana !important;
}



/*  Each page header should use this style */
.sub-appbar {
    background-color: var(--mud-palette-dark-lighten) !important;
    color: var(--mud-palette-dark-text) !important;
}


/*  Used on Careplans */


.careplan-section-title {
    font-size: 1.1em;
    font-weight: 500;
}

.careplan-section-title-color {
    color: var(--mud-palette-text-primary) !important;
}

.card-appbar {
    display: flex !important;
    background-color: var(--mud-palette-action-default-hover) !important;
    color: var(--mud-palette-drawer-text) !important;
    z-index: 3 !important;
}


.boxInfotable {
    width: 100%;
}

    .boxInfotable td {
        padding: 0.25rem 0.25rem;
    }

.subTitleHeader {
    /*    color: var(--mud-palette-primary-text);
    width: 100%;
    padding: 3px;
    padding-left: 10px;
    font-size: 0.80em;
    letter-spacing: 0.15rem;
    background-color: var(--mud-palette-secondary);
    background: linear-gradient(45deg, var(--mud-palette-primary), var(--mud-palette-secondary));*/

    font-weight: 800;
    /*color: #000000;*/
    width: 100%;
    padding: 3px;
    padding-left: 10px;
    font-size: 0.80em;
    letter-spacing: 0.15rem;
    background-color: var(--mud-palette-drawer-background);
}


.form-group {
    border-radius: 5px;
    margin: 12px 0;
    /* background: var(--mud-palette-table-striped); */
    padding: 6px 24px 24px 24px;
}

.form-actions {
    padding: 0 24px 24px 24px;
}


.form-shaded {
    padding: 16px !important;
    border-radius: 5px;
    background: rgba(0, 0, 0, .05) !important;
}


.test {
    background-color: red !important;
}

.cpointer {
    cursor: pointer;
    outline: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: 0;
}

.v-bordered {
    border: 1px solid var(--mud-palette-background);
}

.no-border {
    border: none !important;
}


.text-black {
    color: black;
}

.backdrop-filter-blur {
    backdrop-filter: blur(10px);
}

.no-back {
    background-color: transparent !important;
}



.defaultEmptyBackground {
    background-color: var(--mud-palette-background) !important;
}

.defaultDrawerBackground {
    background-color: var(--mud-palette-drawer-background) !important;
}

.defaultListViewNoScrollWithAppBar {
    height: calc(100vh - 80px);
    width: 100%;
    overflow-y: hidden;
    overflow-x: hidden;
}

.defaultListViewWithAppBar {
    height: calc(100vh - 80px);
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.defaultListViewWithToolbars {
    height: calc(100vh - 100px);
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.defaultListViewWithToolbars2 {
    height: calc(100vh - 150px);
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.defaultListViewWithToolbars3 {
    height: calc(100vh - 200px);
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.defaultListViewWithToolbars4 {
    height: calc(100vh - 250px);
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

/*.active {    
    font-weight: bold !important;
    font-size: 0.9em;
    color: white !important;
    background-color: purple !important;
    border-bottom: 1px solid gray;
}*/

.active {
    font-weight: bold !important;
    font-size: 0.9em;
    color: var(--mud-palette-secondary-text) !important;
    background-color: var(--mud-palette-info) !important;
}

.noactive {
    font-size: 0.9em;
    font-weight: normal !important;
    border-bottom: 1px solid gray;
}

.mud-main-content-padding-remover {
    padding-top: 0px !important;
}

.rotate1 {
    -webkit-animation: spin 2s linear infinite !important;
    -moz-animation: spin 2s linear infinite !important;
    animation: spin 2s linear infinite !important;
}

.pre-wrap {
    white-space: pre-wrap;
}




/* Log out page */

.all-screen {
    background-image: url("../imgs/logout.png");
    background-repeat: no-repeat;
    background-position: center center;
    height: 100%;
    width: 100%;
}


.row-centered {
    display: flex;
    height: 100vh;
}

.col-centered {
    display: flex;
    flex-direction: column;
}

.center-container {
    display: flex;
    justify-content: center;
    align-items: center;
}



/* Icons default size */

i.bi {
    font-size: 16px;
}

.clickable * {
    cursor: pointer !important;
}


/* Favorites */


.favorite-tile {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
}


.favorite-group {
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    color: var( --mud-palette-text-disabled);
    padding: 12px 0 0px 0 !important;
    border-bottom: dotted 1px var(--mud-palette-lines-default);
}



/* Login form */
.login {
    display: flex;
    width: 400px;
    height: 300px;
    padding: 20px;
}


.push-right {
    flex-grow: 1 !important;
}


/* Patient overview */

.overview {
    padding: 4px;
}


    .overview.container {
        border: solid 1px var(--mud-palette-surface);
        background: var(--mud-palette-table-striped);
        border-radius: 5px;
    }


    .overview.scrollable {
        max-height: 430px;
        overflow: auto;
    }

.overview_id {
    font-weight: 200;
    color: var(--mud-palette-default);
    font-size: 1.1em;
    /*white-space: nowrap;*/
}

.overview_name {
    font-weight: 800 !important;
    color: var(--mud-palette-text-primary);
    font-size: 1.3em !important;
    /*white-space: nowrap;*/
}

.overview.label {
    font-weight: 700;
    padding: 0;
    min-width: 70px;
}



/* grid-table */

.grid-table {
    width: 100%;
    /* background-color: var(--mud-palette-background); */
}

    .grid-table tbody tr {
        /* border-bottom: 1px solid var(--mud-palette-background); */
        border-top: 1px solid var(--mud-palette-background);
    }

        .grid-table tbody tr:nth-child(even) {
            background-color: var(--mud-palette-background); /*  var(--mud-palette-secondary-hover); */
        }

        .grid-table tbody tr:hover {
            background-color: color-mix(in srgb, var(--mud-palette-action-default) 30%, transparent);
            color: var(--mud-palette-primary) !important;
            /*border-bottom: 1px solid var(--mud-palette-primary) !important;*/
            /*border-top: 1px solid var(--mud-palette-primary) !important;*/ 
        }

.row-selected {
    /*background-color: var(--mud-palette-primary-hover);*/
    border-bottom: 1px solid var(--mud-palette-secondary) !important;
    border-top: 1px solid var(--mud-palette-secondary) !important;
    color: var(--mud-palette-primary) !important;
}

.grid-table tbody tr {
    cursor: pointer;
}

.grid-table td {
    padding: 0px 4px 0px 4px;
}

.grid-table th {
    padding: 4px;
    /*background-color: var(--mud-palette-tertiary-hover);*/
    /*color: var(--mud-palette-tertiary);*/
    font-weight: bold;
    font-size: 0.9em;
}

/* wizards */

.title1 {
    color: black;
    font-size: 3.2em !important;
    font-weight: 600 !important;
    padding-top: 24px;
}

.title2 {
    color: black;
    font-size: 1.1em;
}

.outcomeBanner {
    background: url('../imgs/outcome-bg.png') no-repeat center;
}

.wizard {
    height: 165px;
}

.mud-dialog-actions > footer {
    background: var(--mud-palette-appbar-background) !important;
    color: var(--mud-palette-primary-text) !important;
}




/* program members */

.program-members {
    max-height: 600px !important;
    padding: 12px !important;
}


    .program-members .label {
        font-weight: 500;
        min-width: 100px;
    }

    .program-members .data {
        opacity: 0.8;
        white-space: nowrap;
    }




/*  Avatar colors  */

.c1 {
    background-color: var(--mud-palette-drawer-background) !important;
    color: #e3e3e3 !important;
    font-size: 0.9em !important;
}

.c2 {
    background-color: #016A70 !important;
}


.c3 {
    background-color: #96B6C5 !important;
}


.c4 {
    background-color: #4B7BE5 !important
}

.c6 {
    background-color: #B01E68 !important;
}


.c5 {
    background-color: #FF8D29 !important;
}

/* mini-buttonTile */

.mini-buttonTileTextColor {
}

.mini-buttonTileSubtitle {
    font-size: 12px;
}

.mini-buttonTile {
    padding: 5px !important;
    /* background: linear-gradient(45deg, var(--mud-@(ButtonColor.Name)-primary), var(--mud-palette-secondary)) !important; */
}

.mini-buttonToggleTile {
}

.mini-buttonTileClickable {
    border: 2px solid var(--mud-palette-surface) !important;
}

    .mini-buttonTileClickable:hover {
        cursor: pointer;
        /*background: linear-gradient(45deg, var(--mud-palette-secondary), var(--mud-palette-primary)) !important;*/
        border: 2px solid var(--mud-palette-primary) !important;
    }

.mini-buttonTileActive {
    cursor: pointer;
    background-color: var(--mud-palette-primary) !important;
}



/*  Tasks */

.task-search {
    max-width: 400px !important;
}

.action-group {
    background-color: var(--mud-palette-action-default-hover)
}


.task-col {
    font-size: 0.8em !important;
}

    .task-col.nowrap {
        white-space: nowrap;
    }

    .task-col.task-title {
        display: flex;
        flex-wrap: wrap;
        white-space: pre-wrap !important;
        align-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        font-weight: 700;
        color: var(--mud-palette-info) !important;
        text-decoration: underline dotted 1px !important;
    }


    .task-col.task-description {
        display: flex;
        flex-wrap: wrap;
        max-width: 230px;
        white-space: pre-wrap !important;
        align-content: flex-start;
        justify-content: flex-start;
        align-items: flex-start;
        opacity: 0.7;
    }


.grid-group {
    font-weight: 700 !important;
    font-size: 1.1em !important;
    color: var(--mud-palette-secondary) !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.link-item {
    cursor: pointer !important;
    text-transform: none !important;
    font-weight: 300 !important;
    color: var(--mud-palette-info) !important;
    text-decoration: underline dotted 1px !important;
}

.highlighted-item {
    background-color: yellow;
    font-weight: 600 !important;
    border-radius: 3px;
}


/* Card */

    .card-outline {
    /*border: 1px solid var(--mud-palette-lines-default) !important;*/
    border-radius: 4px !important;
    padding-left: .875rem !important;
    padding-right: .875rem !important;
    padding-bottom: .875rem !important;
}

.card-border {
    border-radius: 4px !important;
    border: 1px solid var(--mud-palette-lines-default) !important;
}

/* Grid row */

.grid-row-active {
    color: white !important;
    background-color: var(--mud-palette-background) !important;
}

.grid-row-portfolio {
    background-color: color-mix(in srgb, var(--mud-palette-secondary) 3%, transparent) !important;
}

.grid-row-active:hover {
    background-color: color-mix(in srgb, var(--mud-palette-action-default) 30%, transparent) !important;
}
 
/* Outcome */

.outcome-text {
    font-size: 0.90rem;
    font-weight:500;
    color: var(--mud-palette-text-primary) !important;
}

.outcome-text-remove {
    font-size: 0.90rem;
    font-weight: 500;
    color: var(--mud-palette-error) !important;
    text-transform: uppercase;
}


/* WorkItems */
.patient-task-grid {
    overflow-y: auto !important;
}



/* Dim */

.dim-1 {
    opacity: 0.1 !important;
}


.dim-5 {
    opacity: 0.5 !important
}

.dim-8 {
    opacity: 0.8 !important;
}


/* Submenu Divider */

.v-sub-divider {
    /* Keep it slim, simple, not that big, is just a divider */
    color: var(--mud-palette-appbar-text);
    width: 100%;
    padding: 5px 10px;
    font-size: 0.7em;
    font-weight: 800;
    letter-spacing: 0.20rem;
    background-color: color-mix(in srgb, var(--mud-palette-secondary-darken) 100%, transparent) !important;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}



/* Mudblazor Chip - patient status*/
.chip-status {
    scale: 0.9;
    min-width: 70px;
}





.collaborator-report.row {
    color: var(--mud-palette-success-darken);
    background-color: var(--mud-palette-success-hover);
    height: 100%;
    padding: 12px;
}

.collaborator-report-tab {
    border-bottom: solid 1px var(--mud-palette-background-grey);
    border-radius: 0 0 50px 0;
}


/*  Response To care  */

.rtc-tab-button {
    min-width: 150px !important;
    /*background: #fff;*/
}


.rtc-group-button {
    justify-content: center;
    padding: 0 24px;
}

.rtc-group-toolbar {
    height: 40px;
    padding-bottom: 12px;
}


.rtc-group-dropdown {
    margin-top: 0;
    width: 300px;
}

.rtc-group-header {
    margin-top: 24px;
    align-items: center;
    background: #f3f3f3;
    display: flex !important;
    font-weight: 600 !important;
    height: 40px;
    padding: 24px !important;
    width: 100%;
    text-transform: uppercase;
}

.rtc-group-parent {
    background: var(--mud-palette-action-disabled-background);
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 6px 12px !important;
}

    .rtc-group-parent.controls-button {
        justify-content: flex-end;
        gap: 8px;
    }

    .rtc-group-parent.controls-text {
        padding-left: 12px;
    }

    .rtc-group-parent.controls-dropdown {
        justify-content: flex-end;
        padding: 6px 0px 6px 12px;
    }


    .rtc-group-parent.dense {
        min-height: 40px;
    }

.rtc-group-parent-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-top: solid 1px var(--mud-palette-lines-default);
    padding: 10px 6px;
}

.rtc-group-child {
    width: 100%;
    display: flex !important;
    align-items: center;
    align-content: center;
    border-top: solid 1px var(--mud-palette-table-hover);
    padding: 6px 12px !important;
}

.rtc-group-child.controls {

    justify-content: flex-end;
    gap: 8px;
}

.rtc-tab-container {
    border-radius: 4px !important;
    border: 1px solid var(--mud-palette-lines-default) !important;
    padding: 4px;
    margin: 12px 12px 12px 12px;
}

.rtc-dropdown-container {
    width: 100%;
}
/* A unique parent class for the entire dialog */
.rfpd-fullscreen-dialog {
    /* Use the full viewport dimensions for a fullscreen feel */
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

/* iOS Safari workaround */
@supports (-webkit-touch-callout: none) {
    .rfpd-fullscreen-dialog {
        height: -webkit-fill-available;
    }
}

/* Adjustments for smaller devices */
@media (max-width: 600px) {
    .rfpd-fullscreen-dialog {
        width: 100vw;
        height: 100vh;
    }
}

/* The loading container inside the dialog */
.rfpd-loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

/* The iframe that fills the remaining space inside the dialog */
.rfpd-full-iframe {
    flex: 1 1 auto; /* Fill the remaining space */
    width: 100%;
    border: none;
}

/* Targeting the dialog content and actions specifically within .rfpd-fullscreen-dialog */
.rfpd-fullscreen-dialog .rfpd-dialog-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rfpd-fullscreen-dialog .rfpd-dialog-actions {
    flex: 0 0 auto;
    padding: 8px;
    box-sizing: border-box;
}

.mud-typography-h1 {
    font-size: var(--mud-typography-h6-size) !important;
    font-family: var(--mud-typography-h6-family) !important;
    font-weight: var(--mud-typography-h6-weight) !important;
    line-height: var(--mud-typography-h6-lineheight) !important;
    letter-spacing: var(--mud-typography-h6-letterspacing) !important;
    text-transform: var(--mud-typography-h6-text-transform) !important;
}

*:focus-visible:not(.mud-switch-input) {
    outline-style:solid !important;
    outline-color:cornflowerblue !important;
    outline-width:2px !important;
    opacity: 1 !important;
}

/* Documents DataGrid */
.documents {
}

    .documents > .mud-table-container {
        height: calc(100vh - 330px);
    }