/* _content/MonitorAndControl.App.Components/Pages/ClaimWizard/ClaimWizardError.razor.rz.scp.css */
/* Scoped styles for ClaimWizardError */

/* A self-contained overlay/card, deliberately NOT reusing app.css's shared .dialog family
   (.dialog/.dialog__inner/.dialog__shim/.dialog__backdrop/.dialog__content). That markup layers
   two different centering mechanisms on the same elements at once - a pre-flexbox
   "shim + inline-block + vertical-align" trick AND modern flexbox centering - plus
   .dialog__inner's own min-height:100vh. In this page's deeply-nested flex layout that
   combination was reliably hiding the Scan Interface content behind it (confirmed live via
   DevTools across many angles - it wasn't opacity, overflow, extensions, stale paint, or any
   ancestor breaking position:fixed's containing block - simplifying away the legacy machinery
   entirely was the most reliable way to rule it out as the cause). */

.claim-error-overlay[b-punhzkz118] {
    position: fixed;
    inset: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    /* A moderate dim, not the original .dialog__backdrop's 75% - just enough that the popup
       reads as floating above the page rather than blending into it (the card itself is white
       on a white page, so with no dim/shadow at all it's indistinguishable from the page
       content behind it, which is what was actually happening here). */
    background-color: rgb(0 0 0 / .4);
}

.claim-error-card[b-punhzkz118] {
    width: 100%;
    max-width: 28rem;
    max-height: 90vh;
    overflow-y: auto;
    border-radius: .5rem;
    background-color: #fff;
    padding: 1.25rem 1rem 1rem;
    text-align: center;
    box-shadow: 0 10px 25px -5px rgb(0 0 0 / .3), 0 5px 10px -6px rgb(0 0 0 / .3);
}
/* _content/MonitorAndControl.App.Components/Pages/ClaimWizard/Common/AddOutdoorUnit.razor.rz.scp.css */
/* Scoped styles for AddOutdoorUnit */

/* Clickable elements (icons, buttons, interactive divs) */
.clickable[b-99eadetqi0] {
    cursor: pointer;
}
/* _content/MonitorAndControl.App.Components/Pages/ClaimWizard/Common/Components/APConfigureComponent.razor.rz.scp.css */
/* Scoped styles for APConfigureComponent */

/* Reduced width for form inputs to allow space for action icons */
.reduced-width[b-4kw9ymqip2] {
    width: 80%;
}

/* Clickable elements (icons, buttons) */
.clickable[b-4kw9ymqip2] {
    cursor: pointer;
}
/* _content/MonitorAndControl.App.Components/Pages/ClaimWizard/Common/ScanFramePlaceholder.razor.rz.scp.css */
/* Scoped styles for ScanFramePlaceholder */

/* The idle "tap to scan" placeholder - also the frame the live camera preview (rendered by the
   platform-specific page that hosts EventShowCamera, via id="qr-scan-frame") is sized/positioned
   to match, so the two states read as one scanner body instead of the icon and the video
   appearing as unrelated elements. width: 100% (rather than a vw unit) ties the size to the
   panel's own content box - which already accounts for the panel/page padding - so it keeps
   shrinking to fit on narrow mobile viewports instead of overflowing them, and simply caps out
   at max-width on anything wider. */
.qr-scan-frame[b-5n220rgjao] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 224px;
    aspect-ratio: 1 / 1;
    border: 2px dashed #adb6c3;
    border-radius: .75rem;
    background-color: #fafbfc;
}

.qr-scan-frame__trigger[b-5n220rgjao] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* _content/MonitorAndControl.App.Components/Pages/CustomErrorBoundary.razor.rz.scp.css */
.dialog[b-ve2qjg2wxt] {
    background: transparent;
}

.dialog__backdrop[b-ve2qjg2wxt] {
    background-color: rgba(0, 0, 0, 0.4);
}
/* _content/MonitorAndControl.App.Components/Pages/Dashboard/FooterComponent.razor.rz.scp.css */
ul.horizontal-list[b-3hm2o40qhq] {
  list-style: none;
}

ul.horizontal-list li[b-3hm2o40qhq] {
   display: inline-block;
   padding: 0 0.5rem;
   min-width: 12rem;
   text-align: center;
}

ul.horizontal-list li:not(:last-child)[b-3hm2o40qhq] {
   border-right: 1px solid black;
}
    
/* _content/MonitorAndControl.App.Components/Pages/Error.razor.rz.scp.css */
.dialog[b-5rz1j5z1ao] {
    background: transparent;
}

.dialog__backdrop[b-5rz1j5z1ao] {
    background-color: rgba(0, 0, 0, 0.4);
}
/* _content/MonitorAndControl.App.Components/Pages/Feedback.razor.rz.scp.css */
/* Shell (card/logo/mel-header) now comes from MelPanelLayout.razor.css — only page-specific
   rules live here. Everything inside <EditForm> (Support Type/Description/consent/
   BuildingSelectionComponent) and <OkModal> keep their existing global classes untouched. */

.feedback__body[b-bpvc61iyq4] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: var(--mel-space-6);
    padding: var(--mel-space-4) var(--mel-space-4) var(--mel-space-6);
}

.feedback__subtitle[b-bpvc61iyq4] {
    margin: 0 0 var(--mel-space-4);
    color: var(--mel-colour-small-print);
    font-size: var(--mel-text-body-font-size);
    line-height: var(--mel-text-body-line-height);
}

.feedback__form[b-bpvc61iyq4] {
    display: block;
}

.feedback__actions[b-bpvc61iyq4] {
    display: flex;
    gap: var(--mel-space-3);
}

.feedback__cancel[b-bpvc61iyq4] {
    flex: 1 1 0;
}

.feedback__send[b-bpvc61iyq4] {
    flex: 2 1 0;
}
/* _content/MonitorAndControl.App.Components/Pages/ImportEstate.razor.rz.scp.css */
.loader[b-eo147m6w7c] {
    margin-left:auto;
    margin-right:auto;
    text-align: center;
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 20px;
    height: 20px;
    0 -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin-b-eo147m6w7c 2s linear infinite;
}

/*Safari  */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin-b-eo147m6w7c {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/ComfortGraph/ComfortGraphReport.razor.rz.scp.css */
.loader[b-pzs76ui0wt] {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 20px;
    height: 20px;
    animation: spin 2s linear infinite;
    position: absolute;
    left: 50%;
    top: 25%
}

.comfort-graph-overlay-legend[b-pzs76ui0wt] {
    margin-top: 1rem;
}

.comfort-graph-overlay-legend__items[b-pzs76ui0wt] {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    gap: 5px;
    margin: 0;
    padding: 0;
}

.comfort-graph-overlay-legend__item[b-pzs76ui0wt] {
    align-items: center;
    display: flex;
    list-style: none;
}

.comfort-graph-overlay-legend__item--unused[b-pzs76ui0wt] {
    opacity: 0.5;
}

.comfort-graph-overlay-legend__swatch[b-pzs76ui0wt] {
    border: 1px solid transparent;
    display: inline-block;
    flex-shrink: 0;
    height: 20px;
    margin-right: 10px;
    width: 20px;
    border: 1px solid;
}

.comfort-graph-overlay-legend__label[b-pzs76ui0wt] {
    font-size: 11px;
    margin: 0;
    padding: 0;
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/Energy/CombinedEnergyReport.razor.rz.scp.css */
/* CSS for CombinedEnergyReport component */

.chart-container[b-tqi4avfim0] {
    position: relative;
}

.chart-container__ambient-toggle[b-tqi4avfim0] {
    z-index: 1;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 10px;
    padding: 0;
    margin: 0 0 2px 0;
    border-radius: 0.375rem;
}

.small-toggle[b-tqi4avfim0] {
    height: 1rem;
    width: 1.75rem;
}

.text[b-tqi4avfim0] {
    font-size: 11px;
    color: rgb(102, 102, 102);
}

.subtitle[b-tqi4avfim0] {
    margin: 0px;
    padding: 0px;
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/InternalTemperature/IntTempReport.razor.rz.scp.css */
.loader[b-oc7sw5s6cm] {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 20px;
    height: 20px;
    0 -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin-b-oc7sw5s6cm 2s linear infinite;
    position: absolute;
    left: 50%;
    top: 25%
}

.graph-wrapper[b-oc7sw5s6cm] {
    position: relative;
}

.legend-wrapper[b-oc7sw5s6cm] {
    margin-top: 1rem;
}

.int-temp-overlay-legend[b-oc7sw5s6cm] {
    margin-top: 1rem;
}

.int-temp-overlay-legend__items[b-oc7sw5s6cm] {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    gap: 5px;
    margin: 0;
    padding: 0;
}

.int-temp-overlay-legend__item[b-oc7sw5s6cm] {
    align-items: center;
    display: flex;
    list-style: none;
}

.int-temp-overlay-legend__item--unused[b-oc7sw5s6cm] {
    opacity: 0.5;
}

.int-temp-overlay-legend__swatch[b-oc7sw5s6cm] {
    display: inline-block;
    flex-shrink: 0;
    height: 20px;
    margin-right: 10px;
    width: 20px;
    border: 1px solid;
}

.int-temp-overlay-legend__label[b-oc7sw5s6cm] {
    font-size: 11px;
    margin: 0;
    padding: 0;
}

/*Safari  */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin-b-oc7sw5s6cm {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/ReportLayout.razor.rz.scp.css */
/* CSS for ReportLayout component */
.report-size[b-i9j30jidg4] {
    min-height: 500px;
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/ReportSelectorDialog.razor.rz.scp.css */
/* CSS for ReportSelectorDialog component */

/* Sit above the sticky page header (z-index: 20) so the dialog overlays the calling page.
   Gotho.BlazorPdf's stylesheet also targets a global .dialog class (white background, border, padding, font),
   which turns this full-screen wrapper into an opaque sheet hiding the page - reset those here. */
.dialog[b-v7uv75r3td] {
    z-index: 40;
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
    font: inherit;
    color: inherit;
}

/* Lighter than the shared 75% backdrop so the unit page stays visible behind the dialog */
.dialog__backdrop[b-v7uv75r3td] {
    --tw-bg-opacity: 0.4;
}

/* The shared dialog content is as wide as the app shell (32rem), which hides the unit page entirely.
   Keep it compact so the page remains visible around it, like the other message dialogs. */
.dialog__content[b-v7uv75r3td] {
    width: 100%;
    max-width: 25rem;
    padding: 1rem;
}

.report-grid[b-v7uv75r3td] {
    gap: 0.75rem;
}

.report-tile__link[b-v7uv75r3td] {
    padding: 1rem 0.5rem;
    gap: 0.75rem;
}

.dialog-close[b-v7uv75r3td] {
    display: block;
    margin-bottom: 1.25rem;
}

.report-tile[b-v7uv75r3td] {
    background-color: #f9f9fb;
    background-image: linear-gradient(to bottom, #f9f9fb, transparent);
    border-left: 0.8px solid #f3f3f3;
    border-right: 0.8px solid #f3f3f3;
}

.report-tile__label[b-v7uv75r3td] {
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-transform: uppercase;
}

@media (max-width: 640.98px) {
    .report-grid[b-v7uv75r3td] {
        gap: 0.75rem;
    }

    .report-tile__link[b-v7uv75r3td] {
        padding: 0.5rem;
        gap: 0.5rem;
    }
}

@media (max-width: 360px) {
    .report-grid[b-v7uv75r3td] {
        grid-template-columns: 1fr;
    }
}
/* _content/MonitorAndControl.App.Components/Pages/Reports/TrendSummary/TrendSummaryReport.razor.rz.scp.css */
.loader[b-v964g0rs64] {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 20px;
    height: 20px;
    animation: spin 2s linear infinite;
    position: absolute;
    left: 50%;
    top: 25%
}

.comfort-graph-overlay-legend[b-v964g0rs64] {
    margin-top: 1rem;
}

.comfort-graph-overlay-legend__items[b-v964g0rs64] {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    gap: 5px;
    margin: 0;
    padding: 0;
}

.comfort-graph-overlay-legend__item[b-v964g0rs64] {
    align-items: center;
    display: flex;
    list-style: none;
}

.comfort-graph-overlay-legend__item--unused[b-v964g0rs64] {
    opacity: 0.5;
}

.comfort-graph-overlay-legend__swatch[b-v964g0rs64] {
    border: 1px solid transparent;
    display: inline-block;
    flex-shrink: 0;
    height: 20px;
    margin-right: 10px;
    width: 20px;
    border: 1px solid;
}

.comfort-graph-overlay-legend__label[b-v964g0rs64] {
    font-size: 11px;
    margin: 0;
    padding: 0;
}
/* _content/MonitorAndControl.App.Components/Pages/Scenes/EditSceneSteps/SceneIconSelectionDialog.razor.rz.scp.css */
/* Scoped styles for SceneIconSelectionDialog */

/* Clickable elements (icons, close button) */
.clickable[b-8t5u4ryalt] {
    cursor: pointer;
}
/* _content/MonitorAndControl.App.Components/Pages/Scenes/EditSceneSteps/ScenesAdvancedSettingsComponent.razor.rz.scp.css */
/* Scoped styles for ScenesAdvancedSettingsComponent */

.section[b-clb405gr2n] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 25px;
}

.custom-switch[b-clb405gr2n] {
    display: flex;
    flex-direction: column;
}

.header-margin[b-clb405gr2n] {
    margin-bottom: 20px;
}

.section-title[b-clb405gr2n] {
    text-transform: uppercase;
    line-height: 1.5rem;
    --tw-text-opacity: 1;
    color: rgb(32 63 104 / var(--tw-text-opacity));
    text-align: center;
}

.section-wrapper[b-clb405gr2n] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 60px;
    margin-top: 10px;
    padding: 0 20px;
}
/* _content/MonitorAndControl.App.Components/Pages/Unit/Atw/Schedules/AdvancedSettings/ScheduleAdvancedSettingsComponent.razor.rz.scp.css */
.section[b-g9tjv8fsgm] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 25px;
}

.custom-switch[b-g9tjv8fsgm] {
    display: flex;
    flex-direction: column;
}

.header-margin[b-g9tjv8fsgm] {
    margin-bottom: 20px;
}

.section-title[b-g9tjv8fsgm] {
    text-transform: uppercase;
    line-height: 1.5rem;
    --tw-text-opacity: 1;
    color: rgb(32 63 104 / var(--tw-text-opacity));
    text-align: center;
}

.section-wrapper[b-g9tjv8fsgm] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 60px;
    margin-top: 10px;
    padding: 0 20px;
}
/* _content/MonitorAndControl.App.Components/Pages/Unit/Atw/Shared/Controls/AdvancedSettings/AdvancedSettingsComponent.razor.rz.scp.css */
/* Scoped styles for AdvancedSettingsComponent */

.section[b-uykm8ykw2c] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 25px;
}

.custom-switch[b-uykm8ykw2c] {
    display: flex;
    flex-direction: column;
}

.header-margin[b-uykm8ykw2c] {
    margin-bottom: 20px;
}

.section-title[b-uykm8ykw2c] {
    text-transform: uppercase;
    line-height: 1.5rem;
    --tw-text-opacity: 1;
    color: rgb(32 63 104 / var(--tw-text-opacity));
    text-align: center;
}

.section-wrapper[b-uykm8ykw2c] {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 60px;
    margin-top: 10px;
    padding: 0 20px;
}
/* _content/MonitorAndControl.App.Components/Pages/Unit/Shared/EditSystem/EditSystemComponent.razor.rz.scp.css */
/* Scoped styles for EditSystemComponent */

/* Clickable elements (icons, buttons, readonly inputs) */
.clickable[b-udyx1ydf32] {
    cursor: pointer;
}
/* _content/MonitorAndControl.App.Components/Shared/Components/ScreenControls.razor.rz.scp.css */
.screen-controls[b-co6vp2bppk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.screen-controls-actions[b-co6vp2bppk] {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-shrink: 0;
}
/* _content/MonitorAndControl.App.Components/Shared/Components/ScreenControlsHeader.razor.rz.scp.css */
.screen-controls-header[b-yqhvcubwmc] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.screen-controls-header-row[b-yqhvcubwmc] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.screen-controls-header-icon[b-yqhvcubwmc] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--size-touch-target);
    height: var(--size-touch-target);
}

.screen-controls-header-title[b-yqhvcubwmc] {
    overflow-wrap: anywhere;
    font-size: 1.5rem;
    line-height: 2rem;
    text-transform: uppercase;
    color: var(--color-brand);
    align-self: center;
}

.screen-controls-header-subtitle[b-yqhvcubwmc] {
    font-size: 13px;
    line-height: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--color-text-subtitle);
    text-align: center;
}
/* _content/MonitorAndControl.App.Components/Shared/MelPanelLayout.razor.rz.scp.css */
.mel-panel[b-o1jvrdhlng] {
    /* Nested under AppLayout (@layout AppLayout above) so pages using this layout keep the
       standard app shell — hamburger menu, MELCloud logo, .app.bg-mel-light-blue sizing — and
       stay reachable/consistent with the rest of the app. This layout only adds the mel-frame
       "card" + shared mel-header styling for pages that want the Feedback.razor-style look
       inside that shell. */
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    /* Gutter around the frame so it reads as a card inset into AppLayout's background rather
       than spanning edge-to-edge. */
    padding: var(--mel-space-4);
}

.mel-panel__frame[b-o1jvrdhlng] {
    /* mel-frame ships as :host{display:block} — overridden here so it can lay out as a flex
       column filling the remaining page height, same as every other panel/card in this shell. */
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    --mel-frame-bg: var(--mel-colour-white);
    --mel-frame-border-radius: var(--mel-radius-4);
}

.mel-panel__body[b-o1jvrdhlng] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

/* ::deep reaches into @Body — content rendered by the PAGE, not this layout — so every page using
   this layout gets identical mel-header styling from this one place instead of repeating it. */
.mel-panel__body[b-o1jvrdhlng]  mel-header {
    flex: 0 0 auto;
    --mel-header-bg: var(--mel-colour-white);
    /* TODO: no design-system hero/page-title token exists yet (largest tier, --mel-text-h1-font-size,
       is 1.5rem) — same gap flagged in Welcome.razor.css. Reusing that tier here rather than the
       header component's own (much smaller) toolbar-title tokens. */
    --mel-header-title-font-size: var(--mel-font-size-600);
    --mel-header-title-font-weight: var(--mel-font-weight-bold);
}

.mel-panel__body[b-o1jvrdhlng]  .mel-panel-title {
    text-transform: uppercase;
    color: var(--mel-colour-dark-blue);
}

.mel-panel__body[b-o1jvrdhlng]  mel-button {
    display: block;
}