body {
    font-family: Calibri, "Segoe UI", Century Gothic, system-ui, sans-serif;
}

.card {
    background-color: GhostWhite;
    padding: 4px;
    margin-bottom: 12px;
}

.right {
    margin-left: 4pt;
}

.left {
    margin-right: 4pt;
}

.card .big {
    font-size: 16pt;
}

.statusbadge {
    background-color: OliveDrab;
    color: #f8f8ff !important;
    padding: 1px 6px !important;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bolder;
    text-transform: uppercase;
}

.header_view {
    padding: 24pt;
}

.ticket_title {
    font-weight: bold;
    font-size: 16pt;
}

.container {
    display: flex;
    max-width: calc(100% - 48pt);
    margin-left: 24pt;
    margin-right: 24pt;
}

.column-1 {
    flex: 1 1 66%; /* grow/shrink, base 75% */    
}

.column-2 {
    flex: 0 0 34%; /* fixed to 25% width */
}

.fieldLabel {
    margin-right: 4pt; 
    font-weight: bolder;
}

.fieldContent {
    
}

.blockLabel {
    display: block;
}

.richTextField {
    border: 1px solid lightgrey; 
    border-radius: 4px;
    margin-left: 4pt;
    padding: 4pt;
    overflow-wrap: anywhere;
}

.ddItem {
    background-color: #024355;
    color: #f8f8ff;
    padding: 1px 8px;
    margin-right: 6px;
    margin-bottom: 3px;
    margin-top: 3px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.emptyValue {
    font-style: italic;
    color: Silver;
}

.field-required label::after {
    color: red !important;
    content: ' *';
}

.cardheader {
    font-weight: bold;
    font-size: 10pt;
}

.expandbutton {
    padding: 0px;
}

.commentCreator {
    font-weight: bold;
    font-size: 12pt;
    display: block;
    margin-left: 4pt;
}

.commentDate {
    font-weight: bold;
    font-size: 8pt;
    color: gray;
    display: block;
    margin-left: 4pt;
}

.commentContent {
    margin-top: 4pt;
    margin-bottom: 8pt;
    border: 1px solid lightgrey;
    border-radius: 4px;
    margin-left: 4pt;
    padding: 4pt;
}

.page_header {
    font-weight: bold;
    font-size: 18pt;
}

.page_description {
    margin-left: 96pt;
    margin-right: 96pt;
    margin-bottom: 32pt;
    font-size: 12pt;
}

.workspacecard {
    background-color: GhostWhite;
    padding: 4px;
    border-radius: 8px;
}

.page_logo {
    height: 40px;
}

.sidebar-appbar-layout-appbarlogo-normal {
    height: 45%;
}

.sidebar-appbar-layout-appbarlogo-small {
    height: 45%;
}

.workspace_logo {
    width: 45px;
}

.workspace_header {
    align-content: center;
    margin-left: 12px;
    font-weight: 500;
    font-size: 16pt;
}

.workspace_description {
    font-weight: 500;
    font-size: 12pt;
}

.workspace_title {
    margin-bottom: 12px;
}

.ticket_logo {
    padding-right: 8px;
    align-content: center;
}

    .ticket_logo img {
        width: 28px;
    }

.ticket_list_logo {    
    
}

    .ticket_list_logo img {
        margin-right: 4px;
        width: 24px;
    }

.board-container {
    height:100%;
}

.dropzone {
    overflow-y: auto;
    border: 2px solid transparent;
}

.dropzone-accept {
    border: 2px dashed #28a745; /* soft green */
    background-color: rgba(40, 167, 69, 0.1); /* light green tint */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.dropzone-reject {
    border: 2px dashed #dc3545; /* soft red */
    background-color: rgba(220, 53, 69, 0.1);
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.board-tile {
    background-color: var(--mud-palette-surface, #fff);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    padding: 0.8rem 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s ease, transform 0.1s ease;
    margin: 8px;
}

.board-tile-key {
    font-weight: bold;
}

.board-tile-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    margin-top: 0px;
    margin-bottom: 0px;
    overflow-wrap: break-word;
    font-style: italic;
}

.board-tile-selected {
    border: 1px solid #2e7d32;
    background-color: #e8f5e9;
    box-shadow: 0 0 0 3px rgba(46,125,50,0.2);
}

.stats_item_logo {
    width: 24px;
    padding-left: 8px;
}
    .stats_item_logo img {
        height: 16px;
    }

.stats_item_name {
    padding-left: 8px;
}

.stats_item_value {
    width: 60px;
    padding-left: 8px;
}

.stats_group {
    margin-top:12px;
}

.stats_ws_title {
    margin-top: 8px;
    font-size: 16px;
    font-weight: 600;
}

.star-icon-favorite-set {
    color: var(--mud-palette-appbar-background);
}