/* Fade-in animation */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Hide MudTable's built-in top loading bar */
.no-top-loader .mud-progress-linear {
    display: none !important;
}

.mud-table-row {
    animation: fadeIn 0.15s ease-in;
}

.asset-details {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1000;
    /*height: calc(100% - 20px);*/
}

.leaflet-tooltip.taggr-custom-position-tooltip {
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 4px 8px;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}


/* Custom marker cluster styling
   Doesn't look great, but better than changing the cluster 3rd party library.
   Current map pin/marker's main color. At least use a theme variable when marker color has been nailed.
*/
.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {
    background-color: rgba(13, 119, 185, 0.6) !important; /* #0D77B9 with transparency */
}

.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
    background-color: #0D77B9 !important; 
    color: white !important;
    font-weight: 700 !important;
}



.taggr-rounded-corners-large {
    border-radius: 16px !important; /* TODO: This is awful; figure out a more canonical way to set border radius on MudPaper etc */
    overflow: hidden;
}

.taggr-panel-content {
    background: var(--mud-palette-surface);
    height: 100%;
}


/* ========================================
   CANONICAL (?) BORDER RADIUS OVERRIDES
   ======================================== */

/* Input controls - 8px (set via theme DefaultBorderRadius) */

/* Papers, Cards - 8px, also using theme default */
.mud-paper,
.mud-card {
    overflow: hidden; /* makes sure to clip corners of content */
}

/* Dialogs - 16px with consistent padding */
.mud-dialog {
    border-radius: 16px !important;
}

.mud-dialog .mud-dialog-content {
    padding: 32px !important;
}

.mud-dialog .mud-dialog-title {
    padding: 32px 32px 0 32px !important;
}

.mud-dialog .mud-dialog-actions {
    padding: 0 32px 32px 32px !important;
}