.metric {
.imperial {
display: none;
}
}
.imperial {
.metric {
display: none;
}
}
.metric.imperial {
.metric,
.imperial {
display: inline-block;
}
.metric + .imperial,
.imperial + .metric {
margin-inline-start: var(--space-2, 0.5rem);
}
}
:root {
--icon-spacing: var(--space-1, 0.25rem);
}
.ms-icon {
margin-inline-start: var(--icon-spacing);
}
.me-icon {
margin-inline-end: var(--icon-spacing);
}
.ps-icon {
padding-inline-start: var(--icon-spacing);
}
.pe-icon {
padding-inline-end: var(--icon-spacing);
}
.badge {
--badge-spacing: var(--space-2, 0.5rem);
&.ms-badge {
margin-inline-start: var(--badge-spacing);
}
&.me-badge {
margin-inline-end: var(--badge-spacing);
}
&.ps-badge {
padding-inline-start: var(--badge-spacing);
}
&.pe-badge {
padding-inline-end: var(--badge-spacing);
}
}
/* Create-row styling Bootstrap utilities can't express. Kept separate from the
shared auto_complete_single_select.css. */
.mwu-createRow-54c15f0 {
cursor: pointer;
/* Solid background so scrolled results don't show through the sticky row. */
background-color: var(--bs-body-bg);
&:hover {
background-color: var(--bs-tertiary-bg);
}
& .mwu-createRowIcon-54c15f0 {
width: 1.25rem;
height: 1.25rem;
}
}
.mwu-searchSelect-ec74073 {
& input {
min-width: 15ex;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
& input:focus {
border-color: var(--bs-primary-bg-subtle) !important;
box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25) !important;
outline: 0;
}
/* SV: Add bolt icon */
& .mwu-tt-input-ec74073 {
background-position: right calc(0.375em + 0.1875rem) center;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml;utf8,");
}
& .mwu-tt-input-ec74073:focus {
background-image: url("data:image/svg+xml;utf8,");
}
& .mwu-tt-input-ec74073.mwu-loading-ec74073,
& .mwu-tt-input-ec74073.mwu-loading-ec74073:focus {
background-image: url("data:image/svg+xml;utf8,");
}
}
.mwu-menu-ec74073 {
width: max-content;
max-width: 90vw;
max-height: 66vh;
overflow-y: auto;
overflow-x: hidden;
& tr {
cursor: pointer;
}
}
.mwu-choiceDisplay-ec74073 {
padding: 0.5rem 1rem;
padding-inline-end: 1.5rem;
display: flex;
align-items: center;
gap: 0.75rem;
& img {
flex-shrink: 0;
max-height: 2rem;
max-width: 2rem;
}
}
.mwu-callout-de1a8a2 {
border-width: var(--bs-border-width, 1px);
border-inline-start-width: 0.5rem;
&.mwu-calloutPrimary-de1a8a2 {
color: var(--bs-primary-text-emphasis) !important;
border-color: var(--bs-primary-border-subtle) !important;
border-inline-start-color: var(--bs-primary) !important;
background-color: var(--bs-primary-bg-subtle) !important;
--bs-card-color: var(--bs-primary-text-emphasis);
--bs-card-border-color: var(--bs-primary-border-subtle);
--bs-card-bg: var(--bs-primary-bg-subtle);
}
&.mwu-calloutSecondary-de1a8a2 {
color: var(--bs-secondary-text-emphasis) !important;
border-color: var(--bs-secondary-border-subtle) !important;
border-inline-start-color: var(--bs-secondary) !important;
background-color: var(--bs-secondary-bg-subtle) !important;
--bs-card-color: var(--bs-secondary-text-emphasis);
--bs-card-border-color: var(--bs-secondary-border-subtle);
--bs-card-bg: var(--bs-secondary-bg-subtle);
}
&.mwu-calloutSuccess-de1a8a2 {
color: var(--bs-success-text-emphasis) !important;
border-color: var(--bs-success-border-subtle) !important;
border-inline-start-color: var(--bs-success) !important;
background-color: var(--bs-success-bg-subtle) !important;
--bs-card-color: var(--bs-success-text-emphasis);
--bs-card-border-color: var(--bs-success-border-subtle);
--bs-card-bg: var(--bs-success-bg-subtle);
}
&.mwu-calloutDanger-de1a8a2 {
color: var(--bs-danger-text-emphasis) !important;
border-color: var(--bs-danger-border-subtle) !important;
border-inline-start-color: var(--bs-danger) !important;
background-color: var(--bs-danger-bg-subtle) !important;
--bs-card-color: var(--bs-danger-text-emphasis);
--bs-card-border-color: var(--bs-danger-border-subtle);
--bs-card-bg: var(--bs-danger-bg-subtle);
}
&.mwu-calloutWarning-de1a8a2 {
color: var(--bs-warning-text-emphasis) !important;
border-color: var(--bs-warning-border-subtle) !important;
border-inline-start-color: var(--bs-warning) !important;
background-color: var(--bs-warning-bg-subtle) !important;
--bs-card-color: var(--bs-warning-text-emphasis);
--bs-card-border-color: var(--bs-warning-border-subtle);
--bs-card-bg: var(--bs-warning-bg-subtle);
}
&.mwu-calloutInfo-de1a8a2 {
color: var(--bs-info-text-emphasis) !important;
border-color: var(--bs-info-border-subtle) !important;
border-inline-start-color: var(--bs-info) !important;
background-color: var(--bs-info-bg-subtle) !important;
--bs-card-color: var(--bs-info-text-emphasis);
--bs-card-border-color: var(--bs-info-border-subtle);
--bs-card-bg: var(--bs-info-bg-subtle);
}
&.mwu-calloutLight-de1a8a2 {
color: var(--bs-light-text-emphasis) !important;
border-color: var(--bs-light-border-subtle) !important;
border-inline-start-color: var(--bs-light) !important;
background-color: var(--bs-light-bg-subtle) !important;
--bs-card-color: var(--bs-light-text-emphasis);
--bs-card-border-color: var(--bs-light-border-subtle);
--bs-card-bg: var(--bs-light-bg-subtle);
}
&.mwu-calloutDark-de1a8a2 {
color: var(--bs-dark-text-emphasis) !important;
border-color: var(--bs-dark-border-subtle) !important;
border-inline-start-color: var(--bs-dark) !important;
background-color: var(--bs-dark-bg-subtle) !important;
--bs-card-color: var(--bs-dark-text-emphasis);
--bs-card-border-color: var(--bs-dark-border-subtle);
--bs-card-bg: var(--bs-dark-bg-subtle);
}
&.mwu-calloutCancelled-de1a8a2 {
color: var(--bs-secondary-text-emphasis) !important;
border-color: var(--bs-secondary-border-subtle) !important;
border-inline-start-color: var(--bs-secondary) !important;
background-color: var(--bs-secondary-bg-subtle) !important;
--bs-card-color: var(--bs-secondary-text-emphasis);
--bs-card-border-color: var(--bs-secondary-border-subtle);
--bs-card-bg: var(--bs-secondary-bg-subtle);
text-decoration: line-through;
opacity: 0.5;
}
}
.mwu-dates-e81eafc {
/*
* Contain the internal z-indexes (today/selected cells, event bars) in
* their own stacking context so they don't compete with z-indexes of
* other components elsewhere in the application.
*/
isolation: isolate;
flex: 1;
display: flex;
flex-direction: column;
gap: 0;
grid-template-columns: repeat(7, minmax(0, 1fr));
grid-auto-rows: minmax(10rem, auto);
margin-top: 0.5rem;
border-top: var(--bs-border-width, 1px) solid;
border-left: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
border-radius: var(--bs-border-radius);
&.mwu-compact-e81eafc {
flex: none;
.mwu-dayItem-e81eafc {
min-height: unset;
}
.mwu-weekRow-e81eafc {
min-height: unset;
}
}
.mwu-dayItem-e81eafc {
position: relative;
border-right: var(--bs-border-width, 1px) solid;
border-bottom: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
cursor: pointer;
min-height: 10rem;
&.mwu-selected-e81eafc {
color: var(--bs-primary-text-emphasis);
background-color: var(--bs-primary-bg-subtle) !important;
border: none;
outline: solid 2px var(--bs-primary-border-subtle);
z-index: 2;
}
&.mwu-today-e81eafc {
background-color: var(--bs-dark-bg-subtle);
border: var(--bs-border-width, 1px) solid
var(--bs-dark-border-subtle);
z-index: 1;
.mwu-dayHeader-e81eafc {
font-weight: bold;
}
}
&.mwu-otherMonth-e81eafc {
color: var(--bs-secondary);
background-color: var(--bs-secondary-bg-subtle) !important;
}
.mwu-dayHeader-e81eafc {
padding: 0.25rem;
}
}
.mwu-weekRow-e81eafc {
--header-height: 1.75rem;
--event-height: 2.25rem;
--footer-height: 0.5rem;
position: relative;
display: grid;
grid-template-columns: repeat(7, minmax(0, 1fr));
height: calc(
var(--lanes-count, 1) * var(--event-height) + var(--header-height) +
var(--footer-height)
);
min-height: 10rem;
.mwu-eventBar-e81eafc {
position: absolute;
grid-row: 1;
margin-top: calc(
var(--event-lane, 0) * var(--event-height) +
var(--header-height)
);
border-radius: 0.25rem;
padding: 0.25rem;
font-size: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
height: var(--event-height);
width: 100%;
z-index: 3;
}
}
}
.mantiqCalendarMonthlyLanes1 {
--lanes-count: 1;
}
.mantiqCalendarMonthlyLanes2 {
--lanes-count: 2;
}
.mantiqCalendarMonthlyLanes3 {
--lanes-count: 3;
}
.mantiqCalendarMonthlyLanes4 {
--lanes-count: 4;
}
.mantiqCalendarMonthlyLanes5 {
--lanes-count: 5;
}
.mantiqCalendarMonthlyLanes6 {
--lanes-count: 6;
}
.mantiqCalendarMonthlyLanes7 {
--lanes-count: 7;
}
.mantiqCalendarMonthlyLanes8 {
--lanes-count: 8;
}
.mantiqCalendarMonthlyLanes9 {
--lanes-count: 9;
}
.mantiqCalendarMonthlyLanes10 {
--lanes-count: 10;
}
.mantiqCalendarMonthlyLanes11 {
--lanes-count: 11;
}
.mantiqCalendarMonthlyLanes12 {
--lanes-count: 12;
}
.mantiqCalendarMonthlyLanes13 {
--lanes-count: 13;
}
.mantiqCalendarMonthlyLanes14 {
--lanes-count: 14;
}
.mantiqCalendarMonthlyLanes15 {
--lanes-count: 15;
}
.mantiqCalendarMonthlyLanes16 {
--lanes-count: 16;
}
.mantiqCalendarMonthlyLanes17 {
--lanes-count: 17;
}
.mantiqCalendarMonthlyLanes18 {
--lanes-count: 18;
}
.mantiqCalendarMonthlyLanes19 {
--lanes-count: 19;
}
.mantiqCalendarMonthlyLanes20 {
--lanes-count: 20;
}
.mantiqCalendarMonthlyLanes21 {
--lanes-count: 21;
}
.mantiqCalendarMonthlyLanes22 {
--lanes-count: 22;
}
.mantiqCalendarMonthlyLanes23 {
--lanes-count: 23;
}
.mantiqCalendarMonthlyLanes24 {
--lanes-count: 24;
}
.mantiqCalendarMonthlyColStart1 {
grid-column-start: 1;
}
.mantiqCalendarMonthlyColStart2 {
grid-column-start: 2;
}
.mantiqCalendarMonthlyColStart3 {
grid-column-start: 3;
}
.mantiqCalendarMonthlyColStart4 {
grid-column-start: 4;
}
.mantiqCalendarMonthlyColStart5 {
grid-column-start: 5;
}
.mantiqCalendarMonthlyColStart6 {
grid-column-start: 6;
}
.mantiqCalendarMonthlyColStart7 {
grid-column-start: 7;
}
.mantiqCalendarMonthlyColEnd2 {
grid-column-end: 2;
}
.mantiqCalendarMonthlyColEnd3 {
grid-column-end: 3;
}
.mantiqCalendarMonthlyColEnd4 {
grid-column-end: 4;
}
.mantiqCalendarMonthlyColEnd5 {
grid-column-end: 5;
}
.mantiqCalendarMonthlyColEnd6 {
grid-column-end: 6;
}
.mantiqCalendarMonthlyColEnd7 {
grid-column-end: 7;
}
.mantiqCalendarMonthlyColEnd8 {
grid-column-end: 8;
}
.mantiqCalendarMonthlyLane0 {
--event-lane: 0;
}
.mantiqCalendarMonthlyLane1 {
--event-lane: 1;
}
.mantiqCalendarMonthlyLane2 {
--event-lane: 2;
}
.mantiqCalendarMonthlyLane3 {
--event-lane: 3;
}
.mantiqCalendarMonthlyLane4 {
--event-lane: 4;
}
.mantiqCalendarMonthlyLane5 {
--event-lane: 5;
}
.mantiqCalendarMonthlyLane6 {
--event-lane: 6;
}
.mantiqCalendarMonthlyLane7 {
--event-lane: 7;
}
.mantiqCalendarMonthlyLane8 {
--event-lane: 8;
}
.mantiqCalendarMonthlyLane9 {
--event-lane: 9;
}
.mantiqCalendarMonthlyLane10 {
--event-lane: 10;
}
.mantiqCalendarMonthlyLane11 {
--event-lane: 11;
}
.mantiqCalendarMonthlyLane12 {
--event-lane: 12;
}
.mantiqCalendarMonthlyLane13 {
--event-lane: 13;
}
.mantiqCalendarMonthlyLane14 {
--event-lane: 14;
}
.mantiqCalendarMonthlyLane15 {
--event-lane: 15;
}
.mantiqCalendarMonthlyLane16 {
--event-lane: 16;
}
.mantiqCalendarMonthlyLane17 {
--event-lane: 17;
}
.mantiqCalendarMonthlyLane18 {
--event-lane: 18;
}
.mantiqCalendarMonthlyLane19 {
--event-lane: 19;
}
.mantiqCalendarMonthlyLane20 {
--event-lane: 20;
}
.mantiqCalendarMonthlyLane21 {
--event-lane: 21;
}
.mantiqCalendarMonthlyLane22 {
--event-lane: 22;
}
.mantiqCalendarMonthlyLane23 {
--event-lane: 23;
}
.mwu-weeklyView-d5d6a8c {
flex: 1;
display: flex;
flex-direction: column;
margin-top: 0.5rem;
border-top: var(--bs-border-width, 1px) solid;
border-left: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
border-radius: var(--bs-border-radius);
overflow-y: auto;
.mwu-weeklyAllDay-d5d6a8c {
display: grid;
grid-template-columns: 4rem repeat(7, minmax(0, 1fr));
border-bottom: 2px solid var(--bs-border-color);
.mwu-weeklyAllDayCell-d5d6a8c {
display: flex;
flex-direction: column;
gap: 0.125rem;
padding: 0.25rem;
min-height: 2.5rem;
border-right: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
.mwu-weeklyAllDayEvent-d5d6a8c {
border-radius: 0.25rem;
padding: 0.125rem 0.25rem;
font-size: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
.mwu-weeklyTimeGutter-d5d6a8c {
display: flex;
align-items: flex-start;
justify-content: center;
padding: 0.125rem 0.25rem;
font-size: 0.75rem;
color: var(--bs-secondary);
border-right: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
}
.mwu-weeklyGridWrapper-d5d6a8c {
--hour-height: 3rem;
--gutter-width: 4rem;
position: relative;
flex: 1;
.mwu-weeklyGrid-d5d6a8c {
display: grid;
grid-template-columns: var(--gutter-width) repeat(7, minmax(0, 1fr));
.mwu-weeklyHourCell-d5d6a8c {
border-right: var(--bs-border-width, 1px) solid;
border-bottom: var(--bs-border-width, 1px) solid;
border-color: var(--bs-border-color);
height: var(--hour-height);
position: relative;
&.mwu-today-d5d6a8c {
background-color: var(--bs-dark-bg-subtle);
}
&.mwu-selected-d5d6a8c {
background-color: var(--bs-primary-bg-subtle);
}
}
}
.mwu-weeklyTimedEvent-d5d6a8c {
--col-width: calc((100% - var(--gutter-width)) / 7);
position: absolute;
left: calc(
var(--gutter-width)
+ var(--day-index, 0) * var(--col-width)
+ var(--event-sub-col, 0) * var(--event-width, var(--col-width))
);
width: var(--event-width, var(--col-width));
top: var(--event-top, 0);
height: var(--event-height, calc(0.5 * var(--hour-height)));
min-height: calc(0.5 * var(--hour-height));
border-radius: 0.25rem;
font-size: 80%;
overflow: hidden;
z-index: 3;
box-sizing: border-box;
/* Make the rendered event content fill the time slot */
> * {
height: 100%;
margin: 0 !important;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
}
.mantiqCalendarWeeklyCol1 { --day-index: 0; }
.mantiqCalendarWeeklyCol2 { --day-index: 1; }
.mantiqCalendarWeeklyCol3 { --day-index: 2; }
.mantiqCalendarWeeklyCol4 { --day-index: 3; }
.mantiqCalendarWeeklyCol5 { --day-index: 4; }
.mantiqCalendarWeeklyCol6 { --day-index: 5; }
.mantiqCalendarWeeklyCol7 { --day-index: 6; }
.mantiqCalendarWeeklyStart0 { --event-top: calc(0 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart1 { --event-top: calc(1 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart2 { --event-top: calc(2 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart3 { --event-top: calc(3 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart4 { --event-top: calc(4 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart5 { --event-top: calc(5 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart6 { --event-top: calc(6 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart7 { --event-top: calc(7 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart8 { --event-top: calc(8 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart9 { --event-top: calc(9 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart10 { --event-top: calc(10 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart11 { --event-top: calc(11 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart12 { --event-top: calc(12 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart13 { --event-top: calc(13 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart14 { --event-top: calc(14 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart15 { --event-top: calc(15 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart16 { --event-top: calc(16 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart17 { --event-top: calc(17 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart18 { --event-top: calc(18 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart19 { --event-top: calc(19 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart20 { --event-top: calc(20 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart21 { --event-top: calc(21 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart22 { --event-top: calc(22 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart23 { --event-top: calc(23 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart24 { --event-top: calc(24 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart25 { --event-top: calc(25 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart26 { --event-top: calc(26 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart27 { --event-top: calc(27 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart28 { --event-top: calc(28 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart29 { --event-top: calc(29 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart30 { --event-top: calc(30 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart31 { --event-top: calc(31 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart32 { --event-top: calc(32 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart33 { --event-top: calc(33 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart34 { --event-top: calc(34 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart35 { --event-top: calc(35 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart36 { --event-top: calc(36 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart37 { --event-top: calc(37 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart38 { --event-top: calc(38 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart39 { --event-top: calc(39 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart40 { --event-top: calc(40 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart41 { --event-top: calc(41 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart42 { --event-top: calc(42 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart43 { --event-top: calc(43 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart44 { --event-top: calc(44 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart45 { --event-top: calc(45 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart46 { --event-top: calc(46 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart47 { --event-top: calc(47 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart48 { --event-top: calc(48 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart49 { --event-top: calc(49 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart50 { --event-top: calc(50 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart51 { --event-top: calc(51 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart52 { --event-top: calc(52 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart53 { --event-top: calc(53 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart54 { --event-top: calc(54 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart55 { --event-top: calc(55 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart56 { --event-top: calc(56 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart57 { --event-top: calc(57 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart58 { --event-top: calc(58 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart59 { --event-top: calc(59 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart60 { --event-top: calc(60 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart61 { --event-top: calc(61 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart62 { --event-top: calc(62 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart63 { --event-top: calc(63 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart64 { --event-top: calc(64 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart65 { --event-top: calc(65 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart66 { --event-top: calc(66 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart67 { --event-top: calc(67 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart68 { --event-top: calc(68 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart69 { --event-top: calc(69 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart70 { --event-top: calc(70 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart71 { --event-top: calc(71 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart72 { --event-top: calc(72 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart73 { --event-top: calc(73 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart74 { --event-top: calc(74 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart75 { --event-top: calc(75 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart76 { --event-top: calc(76 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart77 { --event-top: calc(77 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart78 { --event-top: calc(78 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart79 { --event-top: calc(79 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart80 { --event-top: calc(80 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart81 { --event-top: calc(81 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart82 { --event-top: calc(82 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart83 { --event-top: calc(83 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart84 { --event-top: calc(84 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart85 { --event-top: calc(85 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart86 { --event-top: calc(86 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart87 { --event-top: calc(87 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart88 { --event-top: calc(88 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart89 { --event-top: calc(89 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart90 { --event-top: calc(90 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart91 { --event-top: calc(91 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart92 { --event-top: calc(92 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart93 { --event-top: calc(93 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart94 { --event-top: calc(94 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyStart95 { --event-top: calc(95 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration2 { --event-height: calc(2 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration3 { --event-height: calc(3 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration4 { --event-height: calc(4 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration5 { --event-height: calc(5 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration6 { --event-height: calc(6 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration7 { --event-height: calc(7 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration8 { --event-height: calc(8 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration9 { --event-height: calc(9 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration10 { --event-height: calc(10 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration11 { --event-height: calc(11 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration12 { --event-height: calc(12 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration13 { --event-height: calc(13 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration14 { --event-height: calc(14 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration15 { --event-height: calc(15 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration16 { --event-height: calc(16 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration17 { --event-height: calc(17 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration18 { --event-height: calc(18 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration19 { --event-height: calc(19 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration20 { --event-height: calc(20 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration21 { --event-height: calc(21 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration22 { --event-height: calc(22 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration23 { --event-height: calc(23 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration24 { --event-height: calc(24 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration25 { --event-height: calc(25 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration26 { --event-height: calc(26 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration27 { --event-height: calc(27 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration28 { --event-height: calc(28 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration29 { --event-height: calc(29 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration30 { --event-height: calc(30 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration31 { --event-height: calc(31 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration32 { --event-height: calc(32 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration33 { --event-height: calc(33 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration34 { --event-height: calc(34 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration35 { --event-height: calc(35 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration36 { --event-height: calc(36 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration37 { --event-height: calc(37 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration38 { --event-height: calc(38 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration39 { --event-height: calc(39 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration40 { --event-height: calc(40 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration41 { --event-height: calc(41 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration42 { --event-height: calc(42 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration43 { --event-height: calc(43 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration44 { --event-height: calc(44 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration45 { --event-height: calc(45 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration46 { --event-height: calc(46 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration47 { --event-height: calc(47 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration48 { --event-height: calc(48 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration49 { --event-height: calc(49 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration50 { --event-height: calc(50 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration51 { --event-height: calc(51 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration52 { --event-height: calc(52 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration53 { --event-height: calc(53 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration54 { --event-height: calc(54 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration55 { --event-height: calc(55 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration56 { --event-height: calc(56 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration57 { --event-height: calc(57 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration58 { --event-height: calc(58 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration59 { --event-height: calc(59 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration60 { --event-height: calc(60 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration61 { --event-height: calc(61 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration62 { --event-height: calc(62 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration63 { --event-height: calc(63 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration64 { --event-height: calc(64 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration65 { --event-height: calc(65 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration66 { --event-height: calc(66 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration67 { --event-height: calc(67 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration68 { --event-height: calc(68 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration69 { --event-height: calc(69 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration70 { --event-height: calc(70 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration71 { --event-height: calc(71 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration72 { --event-height: calc(72 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration73 { --event-height: calc(73 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration74 { --event-height: calc(74 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration75 { --event-height: calc(75 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration76 { --event-height: calc(76 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration77 { --event-height: calc(77 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration78 { --event-height: calc(78 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration79 { --event-height: calc(79 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration80 { --event-height: calc(80 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration81 { --event-height: calc(81 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration82 { --event-height: calc(82 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration83 { --event-height: calc(83 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration84 { --event-height: calc(84 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration85 { --event-height: calc(85 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration86 { --event-height: calc(86 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration87 { --event-height: calc(87 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration88 { --event-height: calc(88 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration89 { --event-height: calc(89 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration90 { --event-height: calc(90 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration91 { --event-height: calc(91 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration92 { --event-height: calc(92 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration93 { --event-height: calc(93 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration94 { --event-height: calc(94 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration95 { --event-height: calc(95 * var(--hour-height) / 4); }
.mantiqCalendarWeeklyDuration96 { --event-height: calc(96 * var(--hour-height) / 4); }
.mantiqCalendarWeeklySub0 { --event-sub-col: 0; }
.mantiqCalendarWeeklySub1 { --event-sub-col: 1; }
.mantiqCalendarWeeklySub2 { --event-sub-col: 2; }
.mantiqCalendarWeeklySub3 { --event-sub-col: 3; }
.mantiqCalendarWeeklySub4 { --event-sub-col: 4; }
.mantiqCalendarWeeklySub5 { --event-sub-col: 5; }
.mantiqCalendarWeeklySub6 { --event-sub-col: 6; }
.mantiqCalendarWeeklySub7 { --event-sub-col: 7; }
.mantiqCalendarWeeklySub8 { --event-sub-col: 8; }
.mantiqCalendarWeeklySub9 { --event-sub-col: 9; }
.mantiqCalendarWeeklySub10 { --event-sub-col: 10; }
.mantiqCalendarWeeklySub11 { --event-sub-col: 11; }
.mantiqCalendarWeeklySub12 { --event-sub-col: 12; }
.mantiqCalendarWeeklySub13 { --event-sub-col: 13; }
.mantiqCalendarWeeklySub14 { --event-sub-col: 14; }
.mantiqCalendarWeeklySub15 { --event-sub-col: 15; }
.mantiqCalendarWeeklyTotal1 { --event-width: calc(var(--col-width) / 1); }
.mantiqCalendarWeeklyTotal2 { --event-width: calc(var(--col-width) / 2); }
.mantiqCalendarWeeklyTotal3 { --event-width: calc(var(--col-width) / 3); }
.mantiqCalendarWeeklyTotal4 { --event-width: calc(var(--col-width) / 4); }
.mantiqCalendarWeeklyTotal5 { --event-width: calc(var(--col-width) / 5); }
.mantiqCalendarWeeklyTotal6 { --event-width: calc(var(--col-width) / 6); }
.mantiqCalendarWeeklyTotal7 { --event-width: calc(var(--col-width) / 7); }
.mantiqCalendarWeeklyTotal8 { --event-width: calc(var(--col-width) / 8); }
.mantiqCalendarWeeklyTotal9 { --event-width: calc(var(--col-width) / 9); }
.mantiqCalendarWeeklyTotal10 { --event-width: calc(var(--col-width) / 10); }
.mantiqCalendarWeeklyTotal11 { --event-width: calc(var(--col-width) / 11); }
.mantiqCalendarWeeklyTotal12 { --event-width: calc(var(--col-width) / 12); }
.mantiqCalendarWeeklyTotal13 { --event-width: calc(var(--col-width) / 13); }
.mantiqCalendarWeeklyTotal14 { --event-width: calc(var(--col-width) / 14); }
.mantiqCalendarWeeklyTotal15 { --event-width: calc(var(--col-width) / 15); }
.mantiqCalendarWeeklyTotal16 { --event-width: calc(var(--col-width) / 16); }
.mwu-calendar-1d10bcf {
display: flex;
flex-direction: column;
min-height: 35em;
&.mwu-compact-1d10bcf {
min-height: unset;
}
}
/*
* Default styling for `mantiq_utils_web::chart` SVG components.
*
* Class names follow the `mwu-chart-*` convention used in the components.
* They are emitted as `:global(...)` so the bundled CSS applies wherever the
* components are mounted, regardless of the consumer's stylance scope.
*/
/* ------------------------------------------------------------------ Axes */
/* Horizontal y-grid: a single faint, theme-aware line. The old dark dashed
* grid (rgba(0,0,0,0.35) 3 3) dominated the plot; a light solid rule lets
* the data read first. */
.mwu-chart-y-tick line {
stroke: var(--bs-border-color, rgba(0, 0, 0, 0.08));
stroke-width: 1;
shape-rendering: crispEdges;
}
/* Vertical x-grid lines (one per date tick on the time-series / area /
* multi-line charts) add clutter without aiding reading — hide them and let
* the horizontal y-grid carry the eye. The x-axis tick *labels* are a
* separate `text` rule below and are unaffected. Bar charts don't draw these
* lines at all. */
.mwu-chart-x-tick line {
stroke: none;
}
.mwu-chart-y-tick text,
.mwu-chart-x-tick text {
fill: var(--bs-secondary-color, #6c757d);
font-size: 0.75rem;
font-family: inherit;
}
/* -------------------------------------------------------------- Markers */
.mwu-chart-current-date {
stroke: var(--bs-warning, #ffc107);
stroke-width: 1.5;
stroke-dasharray: 4 3;
}
.mwu-chart-acquisition-line {
stroke: var(--bs-info, #0dcaf0);
stroke-width: 1;
stroke-dasharray: 2 4;
opacity: 0.6;
}
.mwu-chart-pre-acquisition {
fill: var(--bs-tertiary-bg, rgba(0, 0, 0, 0.04));
}
.mwu-chart-endpoint-markers circle {
fill: var(--bs-body-color, #212529);
transform-box: fill-box;
transform-origin: center;
transition:
transform 0.18s ease-out,
opacity 0.18s ease-out;
}
.mwu-chart-endpoint-markers circle:hover {
transform: scale(1.4);
opacity: 0.85;
}
.mwu-chart-endpoint-markers text {
fill: inherit;
font-size: 0.75rem;
}
/* --------------------------------------------------------------- Bars */
.mwu-chart-bar-baseline {
stroke-width: 1;
shape-rendering: crispEdges;
}
.mwu-chart-bar-rect {
transition: opacity 0.15s;
}
.mwu-chart-bar-group:hover .mwu-chart-bar-rect {
opacity: 0.85;
}
.mwu-chart-bar-value {
/* Larger than the axis/category labels — these are the headline numbers
(percentages / values) on each bar. */
font-size: 1.1rem;
font-weight: 600;
fill: var(--bs-body-color, #212529);
}
.mwu-chart-bar-label {
font-size: 0.75rem;
fill: var(--bs-secondary-color, #6c757d);
}
/* --------------------------------------------------------------- Donut */
.mwu-chart-donut-label {
/* The "42.0% Name" slice labels read as the headline figure. Keep
`LABEL_CHAR_WIDTH_PX` in donut.rs in sync with this size. */
font-size: 1.15rem;
font-weight: 600;
fill: var(--bs-body-color, #212529);
pointer-events: none;
}
.mwu-chart-donut-slice path {
transition: filter 0.15s;
}
.mwu-chart-donut-slice path:hover {
filter: brightness(1.1);
}
/* ----------------------------------------------------------- Time-series */
.mwu-chart-line {
stroke-linecap: round;
stroke-linejoin: round;
}
.mwu-chart-stacked-total-line {
stroke-linecap: round;
stroke-linejoin: round;
}
/* ------------------------------------------------------------- Legend */
.mwu-chart-legend {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 1rem;
font-size: 0.875rem;
}
/* Inset the legend to align with the XY plot area's left margin (the donut
is excluded: its disc is centered, not margin-inset). */
.mwu-chart-bar .mwu-chart-legend,
.mwu-chart-stacked-area .mwu-chart-legend,
.mwu-chart-multi-line .mwu-chart-legend,
.mwu-chart-time-series .mwu-chart-legend {
padding-inline-start: 4px;
}
.mwu-chart-legend-item {
display: inline-flex;
align-items: center;
gap: 4px;
/* Allow the label to shrink so the span's ellipsis can engage. */
min-width: 0;
max-width: 100%;
}
/* Swatch keeps its fixed size; only the text label truncates. */
.mwu-chart-legend-item svg {
flex-shrink: 0;
}
.mwu-chart-legend-item span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
min-width: 0;
}
/* Donut legends can carry many long names, so use a fixed two-column grid:
each name truncates to its column instead of sprawling full-width. */
.mwu-chart-donut .mwu-chart-legend {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2px 1rem;
}
/* -------------------------------------------------------------- Focus */
.mwu-chart-focus {
pointer-events: none;
opacity: 0.85;
transition: opacity 0.12s ease-out;
}
.mwu-chart-focus line {
stroke: #333;
stroke-width: 1;
stroke-dasharray: 4 3;
opacity: 0.85;
}
.mwu-chart-focus circle {
transition: r 0.12s ease-out;
}
/* Force the responsive container to fill its slot. */
.mwu-chart-time-series,
.mwu-chart-stacked-area,
.mwu-chart-multi-line,
.mwu-chart-bar,
.mwu-chart-donut {
width: 100%;
position: relative;
}
/* SVG canvas wrapper sized so ResizeObserver can measure it.
*
* `z-index: 1` lifts the canvas above sibling cards that appear later in
* the DOM (a Bootstrap grid row of charts, or the next row of cards):
* the hover tooltip is `position: absolute` inside this canvas, and a
* tall multi-series body easily overflows the 300px slot — without a
* stacking-context bump the overflowing tooltip would render behind the
* next-row cards. */
.mwu-chart-canvas {
width: 100%;
height: 300px;
position: relative;
z-index: 1;
}
.mwu-chart-canvas:hover {
/* While the cursor is over the chart, lift even higher so the
* tooltip wins against any unrelated z-index:1 neighbour (e.g. the
* sticky page header, or another hovered chart card briefly). */
z-index: 10;
}
/* SVG fills its measured wrapper. */
.mwu-chart-svg {
width: 100%;
height: 100%;
}
/* Tooltip card baseline.
*
* Position / left / top are written from Rust via
* `element.style.setProperty(...)`, NOT via an inline `style="..."` attribute,
* because the OWASP CSP (`style-src-attr 'none'`) silently drops every inline
* style. `display: none` here keeps the tooltip invisible until the
* positioning Effect runs once on the first hover. */
.mwu-chart-tooltip {
position: absolute;
pointer-events: none;
z-index: 5;
display: none;
}
/* Donut sizing — see the module docs in `donut.rs`.
*
* The SVG uses a fixed virtual viewBox (0 0 320 320) that already
* reserves padding around the disc for label text, and scales itself
* uniformly to fit its slot via `preserveAspectRatio="xMidYMid meet"`.
* That's enough for the disc to render at the same logical radius in
* every card — labels live inside the padding ring, not outside the SVG.
*
* The square `aspect-ratio: 1 / 1` forces the slot to be square so the
* SVG isn't letter-boxed (which would shrink the disc whenever the
* card is taller than it is wide). The slot's max-height matches the
* normal canvas height (300px) so a donut never grows past the height
* of the surrounding chart cards. `overflow: visible` is no longer
* needed because the labels are inside the viewBox by construction,
* but we keep it defensively in case a custom label mode reaches out
* past the padding ring.
*/
.mwu-chart-donut {
overflow: visible;
}
.mwu-chart-donut-canvas {
/* aspect-ratio is set inline per chart (donut.rs) to match the
* rectangular viewBox, so the canvas hugs its content instead of
* letterboxing in a fixed square. */
height: auto;
max-height: 300px;
margin-inline: auto;
}
.mwu-chart-donut .mwu-chart-svg {
overflow: visible;
}
.mwu-chart-donut-canvas .mwu-chart-svg {
/* Under `aspect-ratio` + `max-height` the parent height is indefinite,
so the svg's `height: 100%` won't resolve and it overflows the clamped
canvas at its intrinsic size — mirror the cap on the svg itself. */
height: auto;
max-height: 300px;
}
/* -------------------------------------------------- Reduced motion */
/* Belt-and-braces opt-out: the Rust `start_tween` already short-circuits
* to the final state when `prefers-reduced-motion: reduce` matches, but
* the CSS hover transitions above run regardless. Disable them here so
* users with the OS-level preference get a fully static chart. */
@media (prefers-reduced-motion: reduce) {
.mwu-chart-bar-rect,
.mwu-chart-donut-slice path,
.mwu-chart-endpoint-markers circle,
.mwu-chart-focus,
.mwu-chart-focus circle {
transition: none;
}
}
.mwu-countryPrefix-130dba7 {
position: relative;
cursor: pointer;
user-select: none;
white-space: nowrap;
}
.mwu-menu-130dba7 {
min-width: 18rem;
& .mwu-tableWrapper-130dba7 {
flex: 1;
min-height: 0;
overflow-y: auto;
overflow-x: hidden;
outline: none;
& tr {
cursor: pointer;
& .mwu-choiceDisplay-130dba7 {
padding-inline: 0.75rem 1.5rem;
display: flex;
align-items: center;
gap: 0.75rem;
}
}
}
}
td {
.mwu-dateDisplay-80fb75f {
white-space: nowrap;
}
}
.mwu-dateInput-797295c {
width: 11rem !important;
}
.mwu-container-9a95008 {
width: 17.5rem !important;
}
.mwu-datesRange-455a39b {
display: flex;
align-items: center;
html[dir="ltr"] & .mwu-hideLtr-455a39b,
html[dir="rtl"] & .mwu-hideRtl-455a39b {
display: none;
}
}
.mwu-icon-9265fd3 {
font-size: 8em;
margin: 2rem;
}
.mwu-container-1e17d4f {
display: inline;
a {
color: inherit;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.mwu-icon-1e17d4f {
font-size: 0.7em;
opacity: 0.5;
}
}
.mwu-durationInput-924c088 {
max-width: 6rem;
}
.mwu-durationPickerPanel-924c088 {
min-width: 10rem;
padding: 0 !important;
.mwu-durationcPickerPanel-924c088 {
width: 10rem;
display: flex;
flex-direction: column;
background: var(--bs-body-bg);
.mwu-time-924c088 {
display: flex;
height: 20rem;
.mwu-hour-924c088,
.mwu-minute-924c088,
.mwu-second-924c088 {
flex: 1;
overflow-y: auto;
.mwu-item-924c088 {
min-height: 4.5ex;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
&.mwu-selected-924c088,
&:hover {
color: #fff;
background-color: var(--bs-primary);
font-weight: bold;
}
}
}
}
}
.mwu-footer-924c088 {
display: flex;
justify-content: center;
align-items: center;
}
}
td .mwu-errorPanel-c566b03 {
margin: 0 !important;
}
/* The tree/list tables use `table-layout: fixed; width: 100%`, whose
intrinsic (max-content) contribution saturates to a huge value in
Chromium and propagates up to flex ancestors, crushing flex siblings
(e.g. the AI panel) to their min-width. Containing inline-size stops
the browser from sizing ancestors off this subtree. */
.mwu-fileBrowser-8344ee0 {
contain: inline-size;
& .mwu-toolbar-8344ee0 {
position: sticky;
top: var(--toolbar-sticky-offset, 0px);
z-index: 10;
background: var(--bs-body-bg);
padding-block: 0.5rem;
}
}
/* Upload progress panel - floating panel in bottom-right corner */
.mwu-uploadProgressPanel-8344ee0 {
position: fixed;
bottom: 20px;
right: 20px;
width: 350px;
max-height: 300px;
overflow-y: auto;
background: var(--bs-body-bg);
border: 1px solid var(--bs-border-color);
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
z-index: 1050;
padding: 12px;
& .mwu-uploadProgressHeader-8344ee0 {
display: flex;
align-items: center;
font-weight: 600;
margin-bottom: 12px;
padding-bottom: 8px;
border-bottom: 1px solid var(--bs-border-color);
color: var(--bs-primary);
}
& .mwu-uploadProgressList-8344ee0 {
display: flex;
flex-direction: column;
gap: 8px;
& .mwu-uploadProgressItem-8344ee0 {
display: flex;
flex-direction: column;
gap: 4px;
& .mwu-uploadProgressFilename-8344ee0 {
font-size: 0.85rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--bs-body-color);
}
& .mwu-uploadProgressBar-8344ee0 {
height: 6px;
& .mwu-uploadProgressFill-8344ee0 {
width: 0%;
}
}
& .mwu-uploadProgressProcessing-8344ee0 {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.75rem;
color: var(--bs-secondary-color);
& .mwu-uploadProgressSpinner-8344ee0 {
width: 0.75rem;
height: 0.75rem;
}
}
}
}
}
.mwu-deleteButton-f59505c {
z-index: 11;
padding: 0.15rem 0.35rem;
line-height: 1;
}
.mwu-lightbox-926aa6c {
/* Default to hidden */
display: none;
/* Overlay entire screen */
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 2000;
/* A bit of padding around content */
padding: 1em;
/* Translucent background */
background: rgba(0, 0, 0, 0.9);
/* Unhide the lightbox when it's the target */
&:target {
display: flex;
align-items: center;
justify-content: center;
}
}
.mwu-lightboxContent-926aa6c {
position: relative;
width: 90%;
max-width: 1400px;
height: 90vh;
display: flex;
flex-direction: column;
background-color: transparent;
}
.mwu-lightboxHeader-926aa6c {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 8px 8px 0 0;
backdrop-filter: blur(10px);
& .mwu-lightboxTitle-926aa6c {
font-size: 1.25rem;
font-weight: 500;
color: white;
display: flex;
align-items: center;
gap: 1rem;
& .mwu-lightboxCounter-926aa6c {
font-size: 0.875rem;
color: rgba(255, 255, 255, 0.7);
font-weight: 400;
}
}
& .mwu-lightboxActions-926aa6c {
display: flex;
gap: 0.5rem;
}
}
.mwu-lightboxBody-926aa6c {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
min-height: 0;
& .mwu-lightboxImage-926aa6c {
width: 100%;
height: 100%;
object-fit: contain;
}
& .mwu-lightboxPdf-926aa6c {
width: 100%;
height: 100%;
border: none;
border-radius: var(--bs-border-radius);
background-color: white;
}
& .mwu-lightboxText-926aa6c {
width: 100%;
height: 100%;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: var(--bs-border-radius);
background-color: white;
}
& .mwu-lightboxModel-926aa6c {
width: 100%;
height: 100%;
position: relative;
border-radius: var(--bs-border-radius);
background-color: rgb(59, 68, 76);
& canvas {
width: 100% !important;
height: 100% !important;
display: block;
}
}
& .mwu-lightboxOffice-926aa6c {
width: 100%;
height: 100%;
overflow: auto;
border-radius: var(--bs-border-radius);
background-color: white;
padding: 1rem;
text-align: left;
& table {
border-collapse: collapse;
font-size: 0.875rem;
}
& th {
background: #f8f9fa;
}
& td,
& th {
border: 1px solid #dee2e6;
padding: 0.25rem 0.5rem;
white-space: nowrap;
}
}
& .mwu-lightboxVideo-926aa6c {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
border-radius: var(--bs-border-radius);
background-color: black;
object-fit: contain;
}
& .mwu-lightboxUnknown-926aa6c {
text-align: center;
padding: 3rem;
color: white;
& .mwu-lightboxUnknownIcon-926aa6c {
font-size: 5rem;
color: rgba(255, 255, 255, 0.7);
margin-bottom: 1.5rem;
}
}
}
.mwu-lightboxFooter-926aa6c {
padding: 0.75rem 1rem;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 0 0 8px 8px;
backdrop-filter: blur(10px);
& .mwu-lightboxInfo-926aa6c {
color: rgba(255, 255, 255, 0.7);
font-size: 0.875rem;
}
}
.mwu-lightboxNav-926aa6c {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 1rem;
pointer-events: none;
}
.mwu-lightboxNavPrev-926aa6c,
.mwu-lightboxNavNext-926aa6c {
width: 50px;
height: 50px;
background-color: rgba(0, 0, 0, 0.5);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background-color 0.2s ease;
pointer-events: all;
text-decoration: none;
}
.mwu-lightboxNavPrev-926aa6c:hover,
.mwu-lightboxNavNext-926aa6c:hover {
background-color: rgba(0, 0, 0, 0.7);
color: white;
}
/* Responsive adjustments */
@media (max-width: 768px) {
.mwu-lightboxContent-926aa6c {
width: 100%;
height: 100vh;
max-width: none;
}
.mwu-lightbox-926aa6c {
padding: 0;
}
.mwu-lightboxHeader-926aa6c,
.mwu-lightboxFooter-926aa6c {
border-radius: 0;
}
.mwu-lightboxNavPrev-926aa6c,
.mwu-lightboxNavNext-926aa6c {
width: 40px;
height: 40px;
}
}
.mwu-filePreviewImageContainer-f88abb9 {
min-height: 350px;
.mwu-filePreviewImage-f88abb9 {
max-height: 350px;
object-fit: contain;
}
}
.mwu-filePreviewPdfContainer-f88abb9 {
min-height: 350px;
height: 500px;
}
.mwu-filePreviewFallback-f88abb9 {
min-height: 200px;
}
.mwu-filePreviewDocxContainer-b669283 {
min-height: 400px;
max-height: 70vh;
overflow: auto;
background: #f5f5f5;
padding: 1rem;
text-align: left;
}
.mwu-filePreviewHeaderList-9431bef {
display: flex;
flex-direction: column;
.mwu-fileItem-9431bef {
background-color: #e9ecef;
border: 1px solid #ced4da;
border-radius: 0.5rem;
transition: all 0.2s ease;
padding: 1rem 1.25rem;
}
.mwu-fileItem-9431bef:hover {
background-color: #dee2e6;
border-color: #adb5bd;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.mwu-fileIcon-9431bef {
color: #dc3545;
font-size: 1.25rem;
display: flex;
align-items: center;
justify-content: center;
width: 2.5rem;
height: 2.5rem;
background-color: #f8f9fa;
border-radius: 50%;
flex-shrink: 0;
}
.mwu-fileName-9431bef {
color: #495057;
font-size: 0.9375rem;
font-weight: 400;
}
.mwu-fileSize-9431bef {
min-width: 4rem;
text-align: right;
color: #6c757d;
font-size: 0.875rem;
}
.mwu-deleteButton-9431bef {
opacity: 0.8;
transition: opacity 0.2s ease;
white-space: nowrap;
}
.mwu-deleteButton-9431bef:hover {
opacity: 1;
}
}
.mwu-filePreviewInline-369fa6e {
min-width: 0;
max-width: 100%;
overflow: hidden;
& .mwu-filePreviewBody-369fa6e {
min-height: 400px;
}
/* Lets text-truncate compress past content width inside the flex
header row, so a long filename can't push the card past the
viewport on narrow screens. */
& .mwu-headerTitle-369fa6e {
min-width: 0;
}
}
.mwu-previewGrid-7b0ac4a {
display: grid !important;
/* minmax(0, 1fr) instead of 1fr — without the explicit min, grid
cells implicitly fall back to min-content and grow to fit
intrinsic content width (e.g. a wide image), pushing the page
past the viewport on narrow screens. */
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
--previewWidth: 100%;
--previewHeight: auto;
& > div {
margin: 0 !important;
& > span {
display: block;
width: 100%;
& > a {
display: block;
width: 100%;
}
}
}
}
@media (max-width: 768px) {
.mwu-previewGrid-7b0ac4a {
grid-template-columns: minmax(0, 1fr);
}
}
.mwu-filePreviewModelFrame-17f58a4 {
display: block;
width: 100%;
border: 0;
&.mwu-filePreviewModelContainer-17f58a4 {
min-height: 350px;
height: 500px;
width: 100%;
}
}
.mwu-filePreviewSheetContainer-5e53bed {
min-height: 400px;
max-height: 70vh;
overflow: auto;
text-align: left;
table {
border-collapse: collapse;
font-size: 0.875rem;
}
td, th {
border: 1px solid #dee2e6;
padding: 0.25rem 0.5rem;
white-space: nowrap;
}
th {
background: #f8f9fa;
}
}
.mwu-thumbnailContainer-1c0b2a0 {
display: inline-block;
position: relative;
img {
image-orientation: from-image;
aspect-ratio: 3/2;
transition:
transform 0.3s ease-in-out,
box-shadow 0.3s ease-in-out;
width: var(--previewWidth, 16rem);
max-width: 100%;
max-height: var(--previewHeight, 10.5rem);
object-fit: cover;
border-radius: 8px;
cursor: pointer;
border: 1px solid #dee2e6;
background-color: white;
&:hover {
transform: scale(1.05);
z-index: 10;
position: relative;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
}
a {
display: inline-block;
text-decoration: none;
color: inherit;
&:hover {
text-decoration: none;
color: inherit;
}
}
.mwu-thumbnailIconWrapper-1c0b2a0 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: var(--previewWidth, 16rem);
max-width: 100%;
height: var(--previewHeight, 10.5rem);
background-color: white;
border: 1px solid #dee2e6;
border-radius: 8px;
position: relative;
transition:
transform 0.3s ease-in-out,
box-shadow 0.3s ease-in-out;
cursor: pointer;
aspect-ratio: 3/2;
&:hover {
transform: scale(1.05);
z-index: 10;
position: relative;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
}
.mwu-thumbnailVideoWrapper-1c0b2a0 {
position: relative;
width: var(--previewWidth, 16rem);
max-width: 100%;
height: var(--previewHeight, 10.5rem);
border-radius: var(--bs-border-radius);
border-width: var(--bs-border-width);
border-color: var(--bs-border-color);
overflow: hidden;
background-color: black;
transition:
transform 0.3s ease-in-out,
box-shadow 0.3s ease-in-out;
cursor: pointer;
aspect-ratio: 3/2;
&:hover {
transform: scale(1.05);
z-index: 10;
position: relative;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
}
.mwu-thumbnailVideo-1c0b2a0 {
width: 100%;
max-width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.mwu-thumbnailVideoOverlay-1c0b2a0 {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.2);
pointer-events: none;
}
.mwu-thumbnailVideoPlayIcon-1c0b2a0 {
font-size: 2.5rem;
color: white;
text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
}
.mwu-thumbnailIcon-1c0b2a0 {
font-size: 3rem;
color: #6c757d;
}
.mwu-thumbnailPdfWrapper-1c0b2a0 {
width: var(--previewWidth, 16rem);
max-width: 100%;
height: var(--previewHeight, 10.5rem);
overflow: hidden;
border-radius: 0.5rem;
border: 1px solid #dee2e6;
background-color: white;
position: relative;
cursor: pointer;
transition:
transform 0.3s ease-in-out,
box-shadow 0.3s ease-in-out;
aspect-ratio: 3/2;
&:hover {
transform: scale(1.05);
z-index: 10;
position: relative;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
}
.mwu-thumbnailPdfIframe-1c0b2a0 {
width: 100%;
height: 100%;
border: none;
overflow: hidden;
}
.mwu-thumbnailInfo-1c0b2a0 {
padding: 0.5rem 0;
background-color: transparent;
}
.mwu-thumbnailFilename-1c0b2a0 {
text-align: center;
font-size: 0.875rem;
font-weight: 500;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: var(--previewWidth, 16rem);
}
}
@media (max-width: 768px) {
.mwu-thumbnailContainer-1c0b2a0 {
.mwu-thumbnailIcon-1c0b2a0,
.mwu-thumbnailVideoPlayIcon-1c0b2a0 {
font-size: 2.5rem;
}
}
}
@media (prefers-color-scheme: dark) {
.mwu-thumbnailIconWrapper-1c0b2a0,
.mwu-thumbnailPdfWrapper-1c0b2a0 {
background-color: #343a40;
}
.mwu-thumbnailInfo-1c0b2a0 {
background-color: transparent;
}
.mwu-thumbnailIcon-1c0b2a0 {
color: #9a9a9a;
}
}
@keyframes raiseUploadCompleteIcon {
0% {
top: 100%;
}
100% {
top: 50%;
}
}
@keyframes uploadProcessingScannerEffect {
0% {
top: -2.5ex;
}
50% {
top: calc(100% + 1.5ex);
}
100% {
top: -2.5ex;
}
}
.mwu-filesDropZone-c028848 {
width: 100%;
flex-grow: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.mwu-dropZone-c028848 {
flex-grow: 1;
width: 100%;
display: flex;
flex-direction: column;
position: relative;
border-radius: var(--bs-border-radius);
transition: box-shadow 0.2s ease;
isolation: isolate;
&::before,
&[data-paste-shortcut]::after {
pointer-events: none;
opacity: 0;
transition:
opacity 0.2s ease,
transform 0.2s ease;
}
&::before {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
background:
radial-gradient(
circle at top right,
rgba(var(--bs-primary-rgb), 0.18),
transparent 42%
),
linear-gradient(
135deg,
rgba(var(--bs-primary-rgb), 0.1),
rgba(var(--bs-info-rgb), 0.06)
);
transform: scale(0.985);
z-index: -1;
}
&[data-paste-shortcut]::after {
content: attr(data-paste-shortcut);
position: absolute;
top: 0.9rem;
right: 1rem;
max-width: calc(100% - 2rem);
padding: 0.35rem 0.75rem;
border-radius: 999px;
background: rgba(var(--bs-body-color-rgb), 0.9);
color: var(--bs-body-bg);
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.05em;
white-space: nowrap;
box-shadow: 0 0.5rem 1rem rgba(var(--bs-dark-rgb), 0.18);
transform: translateY(-0.35rem);
overflow: hidden;
text-overflow: ellipsis;
}
> * {
transition:
transform 0.2s ease,
filter 0.2s ease;
}
&[data-selected="true"] {
&::before,
&[data-paste-shortcut]::after {
opacity: 1;
transform: translateY(0);
}
}
}
.mwu-uploads-c028848 {
--preview-container-width: 7em;
display: grid;
grid-template-columns: repeat(
auto-fill,
minmax(var(--preview-container-width), 1fr)
);
gap: 2em;
width: 100%;
overflow: clip;
&:has(.mwu-uploader-c028848) {
margin-top: 1em;
}
.mwu-uploader-c028848 {
display: flex;
align-items: center;
justify-content: center;
position: relative;
--transition-duration: 0.3s;
.mwu-preview-c028848 {
width: 100%;
margin-top: 1.5em;
img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
svg[role="graphics-symbol"] {
width: 100%;
height: 100%;
}
}
.mwu-fileInfo-c028848 {
position: absolute;
top: 0;
font-weight: bold;
font-size: 66%;
text-align: center;
text-wrap: auto;
}
.progress {
--bs-progress-height: 1.75em;
--bs-progress-border-radius: calc(
var(--bs-progress-height) / 2
);
position: absolute;
top: 55%;
width: 75%;
transition: opacity var(--transition-duration) ease-in-out;
}
.mwu-uploadProgressFill-c028848 {
width: 0%;
}
.mwu-statusMessage-c028848 {
position: absolute;
display: none;
opacity: 0;
transition: opacity var(--transition-duration) ease-in-out;
}
&.Queued,
&.Pending,
&.Processing,
&.Completed,
&.Cancelled,
&.Error {
.mwu-statusMessage-c028848 {
display: block;
opacity: 0.8;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.progress {
opacity: 0;
}
}
&.Processing,
&.Completed,
&.Cancelled {
.mwu-statusMessage-c028848 {
font-size: 300%;
}
.progress {
opacity: 0;
}
.mwu-actionButtons-c028848 {
display: none;
}
}
&.Processing {
overflow: visible;
.mwu-preview-c028848 {
position: relative;
cursor: progress;
svg[role="graphics-symbol"] {
opacity: 0.5;
}
&::after {
content: "";
position: absolute;
left: 0;
width: 100%;
height: 1.5ex;
background: var(--bs-primary);
border-radius: 0.5ex;
box-shadow:
0 0 1ex var(--bs-primary-text-emphasis),
0 0 4ex var(--bs-primary-text-emphasis),
0 0 8ex var(--bs-primary-text-emphasis);
animation: uploadProcessingScannerEffect 6s linear
infinite;
pointer-events: none;
}
}
.mwu-statusMessage-c028848 {
display: none !important;
}
}
&.Completed {
.mwu-statusMessage-c028848 {
color: var(--bs-success);
z-index: 3;
animation: raiseUploadCompleteIcon 0.3s ease-out forwards;
}
}
&.Cancelled {
.mwu-statusMessage-c028848 {
color: var(--bs-warning);
}
}
&.Error {
.mwu-preview-c028848 {
opacity: 0.5;
}
.mwu-statusMessage-c028848 {
color: var(--bs-danger);
font-size: 90%;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.mwu-actionButtons-c028848 {
opacity: 1;
}
}
.mwu-actionButtons-c028848 {
position: absolute;
top: 0;
right: 0;
z-index: 1;
opacity: 0;
transition: opacity var(--transition-duration) ease-in-out;
display: flex;
gap: 0.25em;
}
&:hover .mwu-actionButtons-c028848 {
opacity: 1;
}
}
}
}
.mwu-container-aaad542 {
width: 100%;
padding: 1.5rem;
border: 2px dashed var(--bs-border-color);
border-radius: var(--bs-border-radius);
background: var(--bs-tertiary-bg);
position: relative;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
container-type: inline-size;
container-name: files-drop-zone;
transition:
border-width 0.2s ease,
border-color 0.2s ease,
background-color 0.2s ease,
box-shadow 0.2s ease,
transform 0.2s ease;
[data-selected="true"] & {
border-color: var(--bs-primary);
background: var(--bs-primary-bg-subtle);
}
.mwu-backgroundIconContainer-aaad542 {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
pointer-events: none;
.mwu-backgroundIcon-aaad542 {
width: clamp(5rem, 22cqi, 9rem);
height: clamp(5rem, 22cqi, 9rem);
opacity: 0.075;
color: var(--bs-body-color);
}
}
.mwu-textContainer-aaad542 {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.85rem;
max-width: 34rem;
.mwu-headline-aaad542 {
color: var(--bs-secondary-color);
font-size: 1rem;
font-weight: 600;
line-height: 1.45;
text-wrap: balance;
}
.mwu-actions-aaad542 {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 0.75rem 1rem;
color: var(--bs-secondary-color);
.mwu-selected-aaad542 {
display: none;
[data-selected="true"] & {
display: block;
}
}
}
}
@container files-drop-zone (width <= 28rem) {
.mwu-container-aaad542 {
min-height: 10.5rem;
padding-block: 2rem 1.25rem;
}
.mwu-headline-aaad542 {
font-size: 0.95rem;
}
.mwu-actions-aaad542 {
flex-direction: column;
gap: 0.65rem;
}
}
}
@keyframes mantiqFocusHighlight {
0% {
box-shadow:
0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.95),
0 0 0.85rem 0.5rem rgba(var(--bs-primary-rgb), 0.6);
background-color: rgba(var(--bs-primary-rgb), 0.18);
}
100% {
box-shadow:
0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0),
0 0 0.85rem 0.8rem rgba(var(--bs-primary-rgb), 0);
background-color: transparent;
}
}
/* The focus target itself, plus any descendant opting in with
`.mantiq-focus-emphasis`, pulse together so a deep link can call out both a
region and the precise control inside it. */
.mantiq-focus-highlight,
.mantiq-focus-highlight .mantiq-focus-emphasis {
animation: mantiqFocusHighlight 0.85s ease-out 3;
border-radius: var(--bs-border-radius, 0.375rem);
position: relative;
z-index: 1;
}
.mwu-editor-211bdca {
/* Preserve HTML source indentation and wrap long lines instead of scrolling
horizontally; each source line is its own block . */
white-space: pre-wrap;
word-break: break-word;
overflow-wrap: anywhere;
overflow-y: auto;
min-height: 18em;
max-height: 70vh;
font-size: 0.8125rem;
line-height: 1.55;
tab-size: 2;
.he-line {
min-height: 1.55em;
}
/* Syntax colours. The Bootstrap palette vars are stable hexes that read
acceptably on both light and dark themes. */
.he-text {
color: var(--bs-body-color);
}
.he-punct {
color: var(--bs-secondary-color);
}
.he-tag {
color: var(--bs-blue, #0d6efd);
font-weight: 600;
}
.he-attr {
color: var(--bs-purple, #6f42c1);
}
.he-string {
color: var(--bs-green, #198754);
}
.he-comment {
color: var(--bs-secondary-color);
font-style: italic;
}
.he-placeholder {
color: var(--bs-orange, #fd7e14);
font-weight: 700;
background: var(--bs-warning-bg-subtle);
border-radius: var(--bs-border-radius-sm);
padding-inline: 0.1em;
}
.he-cid {
color: var(--bs-teal, #20c997);
font-weight: 700;
}
}
.mwu-actionColumn-6c7aea4 {
width: 3rem;
padding: 0 !important;
}
.mwu-table-6c7aea4 {
table-layout: fixed;
width: 100%;
thead th {
white-space: nowrap;
&:nth-child(1) {
width: auto;
}
&:nth-child(2) {
width: 8rem;
}
&:nth-child(3) {
width: 11rem;
}
&:nth-child(4) {
width: 10rem;
}
}
tbody td {
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* Hover-reveal three-dots button — match tree view styling */
tbody tr {
.mwu-actionsCell-6c7aea4 button {
opacity: 0;
transition: opacity 0.1s ease;
color: var(--bs-secondary);
background: transparent !important;
border: none !important;
padding: 0.25rem 0.5rem !important;
border-radius: 0.375rem;
&:hover {
color: var(--bs-body-color);
background: var(--bs-secondary-bg) !important;
}
}
/* Keep the trigger visible while its portaled menu is open — the
menu is not a row descendant, so row :hover ends inside it. */
&:hover .mwu-actionsCell-6c7aea4 button,
&.mwu-highlighted-6c7aea4 .mwu-actionsCell-6c7aea4 button,
.mwu-actionsCell-6c7aea4 button[aria-expanded="true"] {
opacity: 1;
}
}
& tbody tr.mwu-renamed-6c7aea4 > td {
animation: renameFlash 500ms ease-out;
}
& tbody tr.mwu-deleting-6c7aea4 {
animation: deleteSlideOut 300ms ease-out forwards;
pointer-events: none;
}
}
.mwu-secondaryInfo-6c7aea4 {
color: var(--bs-secondary);
font-size: 0.8125rem;
}
/* Highlighted file state - target td elements to override Bootstrap */
.mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4 > td,
.mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4:nth-of-type(odd) > td,
.mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4:nth-of-type(even) > td {
background-color: rgba(255, 193, 7, 0.3) !important;
}
[data-bs-theme="dark"] .mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4 > td,
[data-bs-theme="dark"] .mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4:nth-of-type(odd) > td,
[data-bs-theme="dark"] .mwu-table-6c7aea4 tbody tr.mwu-highlighted-6c7aea4:nth-of-type(even) > td {
background-color: rgba(255, 193, 7, 0.4) !important;
}
/* Delete animation - slide out row */
@keyframes deleteSlideOut {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-50px);
}
}
/* Rename animation - info flash */
@keyframes renameFlash {
0% {
background-color: rgba(var(--bs-info-rgb), 0.4);
}
100% {
background-color: transparent;
}
}
/* Character Spinner */
@keyframes characterSpinnerRotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}
.mwu-characterSpinner-a4874d2 {
display: inline-block;
animation: characterSpinnerRotation 2s infinite linear;
}
/* Text Skeleton */
.mwu-textPlaceholder-a4874d2 {
display: inline-block;
width: 8rem;
max-width: 100%;
height: 1em;
vertical-align: middle;
}
/* Horizontal Line */
@keyframes horizontalLineSlider {
0% {
right: 80%;
left: 1%;
}
5% {
left: 1%;
}
50% {
right: 1%;
left: 80%;
}
55% {
right: 1%;
}
100% {
right: 80%;
left: 1%;
}
}
.mwu-horizontalLine-a4874d2 {
width: 25%;
height: 6px;
background-color: var(--bs-secondary);
position: relative;
border-radius: 3px;
box-sizing: border-box;
overflow: hidden;
margin-inline: auto;
margin-top: var(--space-2, 0.5rem);
margin-bottom: var(--space-2, 0.5rem);
&::after {
border-radius: 3px;
content: "";
position: absolute;
background-color: var(--bs-light);
top: 1px;
bottom: 1px;
animation: horizontalLineSlider 2s linear infinite;
}
}
/* Pulsing Grid */
@keyframes pulsingGridAnimation {
0% {
opacity: 0.8;
transform: scale(1);
}
50% {
opacity: 0.35;
transform: scale(0.45);
}
100% {
opacity: 0.8;
transform: scale(1);
}
}
.mwu-pulsingGrid-a4874d2 {
display: block;
font-size: 0;
max-width: 108px;
width: 100%;
margin: auto;
aspect-ratio: 1;
&,
& > div {
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
& > div {
display: inline-block;
float: none;
background-color: var(--bs-body-color);
border: none;
width: 15%; /* 16px / 108px */
height: 15%;
margin: 9%; /* 10px / 108px */
border-radius: 100%;
animation-name: pulsingGridAnimation;
animation-iteration-count: infinite;
}
& > div:nth-child(1) {
animation-duration: 0.65s;
animation-delay: 0.03s;
}
& > div:nth-child(2) {
animation-duration: 1.02s;
animation-delay: 0.09s;
}
& > div:nth-child(3) {
animation-duration: 1.06s;
animation-delay: -0.69s;
}
& > div:nth-child(4) {
animation-duration: 1.5s;
animation-delay: -0.41s;
}
& > div:nth-child(5) {
animation-duration: 1.6s;
animation-delay: 0.04s;
}
& > div:nth-child(6) {
animation-duration: 0.84s;
animation-delay: 0.07s;
}
& > div:nth-child(7) {
animation-duration: 0.68s;
animation-delay: -0.66s;
}
& > div:nth-child(8) {
animation-duration: 0.93s;
animation-delay: -0.76s;
}
& > div:nth-child(9) {
animation-duration: 1.24s;
animation-delay: -0.76s;
}
}
/* Orbit Spinner */
@keyframes orbitSpinner-orbit-one-animation {
0% {
transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
}
100% {
transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
}
}
@keyframes orbitSpinner-orbit-two-animation {
0% {
transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
}
100% {
transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
}
}
@keyframes orbitSpinner-orbit-three-animation {
0% {
transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
}
100% {
transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
}
}
.mwu-orbitSpinner-a4874d2 {
display: flex;
justify-content: center;
align-content: center;
pointer-events: none;
transition-property: opacity;
transition-duration: 0.2s;
transition-timing-function: ease-out;
& .mwu-orbitSpinnerLoader-a4874d2,
& .mwu-orbitSpinnerLoader-a4874d2 * {
box-sizing: border-box;
}
& .mwu-orbitSpinnerLoader-a4874d2 {
display: block;
margin: auto;
position: relative;
width: 100px;
height: 100px;
border-radius: 50%;
perspective: 1454px;
& div {
position: absolute;
box-sizing: border-box;
width: 100%;
height: 100%;
border-radius: 50%;
}
& div:nth-child(1) {
left: 0;
top: 0;
animation: orbitSpinner-orbit-one-animation 1200ms linear infinite;
border-bottom: 6px solid var(--bs-body-color);
}
& div:nth-child(2) {
right: 0;
top: 0;
animation: orbitSpinner-orbit-two-animation 1200ms linear infinite;
border-right: 6px solid var(--bs-body-color);
}
& div:nth-child(3) {
right: 0;
bottom: 0;
animation: orbitSpinner-orbit-three-animation 1200ms linear infinite;
border-top: 6px solid var(--bs-body-color);
}
}
}
.mwu-mapContainer-9e9b456 {
position: relative;
overflow: hidden;
/* Contain the settings panel (and its backdrop — Bootstrap appends it to
the offcanvas' parent) within the map instead of the viewport:
Bootstrap's `position: fixed` would slide it over the whole page. */
.offcanvas {
position: absolute !important;
top: 0 !important;
bottom: 0 !important;
height: auto !important;
max-height: 100% !important;
}
[dir="ltr"] & .offcanvas-end {
right: 0 !important;
}
[dir="rtl"] & .offcanvas-end {
left: 0 !important;
}
.offcanvas-backdrop {
position: absolute !important;
inset: 0 !important;
}
}
/* The Cesium canvas mounts here. It MUST be sized by its parent, not by its
own content: Cesium resizes its