html, body {
    font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

a, .btn-link {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
.TimerfullscreenDiv {
    width: 100%;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0;
    position: absolute;
}

.Timercenter {
    position: absolute;
    width: 100px;
    height: 50px;
    top: 50%;
    left: 50%;
    margin-top: -25px;
    margin-left: -50px;
}

ul[role=tablist] {
    flex-wrap: wrap;
}

.mud-icon-button-color-inherit:hover {
    color: white !important;
}

.mud-nav-link:hover {
    color: rgba(0, 0, 0, 0.698) !important;
    font-variant:normal;
}

.mud-nav-link:active {
    color: rgba(0, 0, 0, 0.698) !important;
}

.mud-button-text.mud-button-text-primary:hover, .mud-button-text.mud-button-text-primary:focus-visible {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.rz-dialog-wrapper {
    z-index: 10001 !important;
}

.mud-picker-calendar-container {
    display: contents !important;
}

.mud-picker-calendar {
    display: flow-root !important;
}

.mud-picker-calendar-header-day{
    display: none !important;
}

.mud-nav-link .mud-nav-link-expand-icon.mud-transform {
    fill: rgb(97, 97, 97) !important;
}

/* Telerik Checkbox - cor principal do software quando selecionada */
.k-checkbox:checked {
    background-color: #B57F59 !important;
    border-color: #B57F59 !important;
}

.k-checkbox:checked:focus {
    box-shadow: 0 0 0 2px rgba(181, 127, 89, 0.3) !important;
}

.k-checkbox:indeterminate {
    background-color: #B57F59 !important;
    border-color: #B57F59 !important;
}

/* Radzen Numeric - cor principal do software nas setas */
.rz-spinner .rz-spinner-button,
.rz-numeric .rz-spinner-button,
.rz-numeric-spinner .rz-spinner-button,
button.rz-spinner-button,
.rz-spinner-button.rz-button,
.rz-spinner-button {
    background-color: #B57F59 !important;
    border-color: #B57F59 !important;
    background: #B57F59 !important;
}

.rz-spinner .rz-spinner-button:hover,
.rz-numeric .rz-spinner-button:hover,
.rz-spinner-button:hover {
    background-color: #9a6a4a !important;
    border-color: #9a6a4a !important;
    background: #9a6a4a !important;
}

.rz-spinner .rz-spinner-button:active,
.rz-numeric .rz-spinner-button:active,
.rz-spinner-button:active {
    background-color: #8a5a3a !important;
    border-color: #8a5a3a !important;
    background: #8a5a3a !important;
}

/* ============================================
   Mobile (portado do marvin_blazor, 2026-09)
   ============================================ */

/* Diálogos MudBlazor em dispositivos móveis: largura total, sem transform, scroll interno.
   Esta regra neutraliza os "min-width: 850px" inline dos MudDialog sem tocar nas páginas. */
@media (max-width: 800px) {
    .mud-dialog-container {
        align-items: flex-start !important;
        padding: 10px 5px !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    .mud-dialog {
        max-width: calc(100vw - 10px) !important;
        width: calc(100vw - 10px) !important;
        min-width: 0 !important;
        max-height: calc(100vh - 40px) !important;
        margin: 0 auto !important;
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        box-sizing: border-box !important;
    }

    .mud-dialog-content {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Apenas diálogos que contêm uma grelha Telerik ficam com altura aumentada */
    .mud-dialog:has(.k-grid) {
        height: 85vh !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .mud-dialog:has(.k-grid) .mud-dialog-content {
        overflow-y: auto !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }

    .mud-dialog:has(.k-grid) .k-grid {
        height: 100% !important;
    }

    /* Prevenir zoom automático em campos de formulário no iOS (só em ecrãs pequenos,
       para não alterar o tamanho de letra no desktop — divergência consciente do marvin). */
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="number"],
    textarea,
    select {
        font-size: 16px !important;
    }

    /* Blocos de filtros grandes demais para duplicar em ramo mobile (padrão P4 do marvin,
       aqui centralizado em vez de um <style> por página). Marcar o contentor com
       class="mobile-form": as labels com largura fixa passam a bloco e os campos a 100%. */
    .mobile-form label[style*="width"],
    .mobile-form label[style*="text-align"] {
        width: auto !important;
        text-align: left !important;
        display: block !important;
        font-size: 0.85rem;
    }

    .mobile-form label[style*="margin-left"] {
        margin-left: 0 !important;
    }

    .mobile-form div[style*="flex-basis"] {
        flex-basis: 100% !important;
        padding-right: 0 !important;
    }

    .mobile-form .rz-textbox,
    .mobile-form .rz-textarea,
    .mobile-form .rz-dropdown,
    .mobile-form .rz-spinner,
    .mobile-form .e-input-group,
    .mobile-form .e-control-wrapper,
    .mobile-form .k-numerictextbox,
    .mobile-form .k-datepicker,
    .mobile-form .k-textbox,
    .mobile-form .k-dropdownlist {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* A regra dos 16px acima alarga o texto dos inputs: um datepicker declarado com
       120-130px (largura pensada para os 14px do desktop) passa a truncar a data.
       Garantir sempre espaço para "dd/mm/aaaa" mais o ícone do calendário. */
    .e-date-wrapper,
    .e-datetime-wrapper,
    .k-datepicker,
    .k-datetimepicker {
        min-width: 145px;
    }

    /* Listas de rádios com largura fixa: passam a quebrar linha */
    .mobile-form .rz-radiobutton-list {
        width: auto !important;
        max-width: 100% !important;
        display: flex;
        flex-wrap: wrap;
        gap: 2px 10px;
    }
}

/* Diálogos em telemóvel: as colunas Bootstrap sem breakpoint (col-3, col-8, ...) ficam
   estreitas demais dentro de um diálogo com a largura do ecrã. Passam a ocupar a linha
   toda — equivale ao col-6/col-12 que o marvin escreveu página a página nos diálogos. */
@media (max-width: 600px) {
    .mud-dialog .row > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Garantir que os elementos interativos respondam rapidamente ao toque */
* {
    -webkit-tap-highlight-color: transparent;
}

/* ============================================
   Safari-specific fixes for MudDialog
   ============================================ */

@supports (-webkit-hyphens: none) or (-webkit-touch-callout: none) {
    .mud-dialog .mud-dialog-content {
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 0;
    }

    .mud-dialog.mud-dialog-absolute-position {
        -webkit-transform: translate(-50%, -50%) !important;
        -ms-transform: translate(-50%, -50%) !important;
        transform: translate(-50%, -50%) !important;
    }

    .mud-dialog-container {
        -webkit-box-flex: 1;
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    .mud-dialog-container > .mud-dialog {
        position: relative !important;
        margin: 0 auto !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        -webkit-transform: none !important;
        -ms-transform: none !important;
        transform: none !important;
    }
}

@supports (-webkit-hyphens: none) or (-webkit-touch-callout: none) {
    .mud-dialog-container {
        display: -webkit-box !important;
        display: -webkit-flex !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-pack: center !important;
        -webkit-justify-content: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
        -webkit-box-align: center !important;
        -webkit-align-items: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
        min-height: 100vh !important;
        -webkit-box-sizing: border-box !important;
        box-sizing: border-box !important;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    .mud-dialog {
        position: relative !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        margin: auto !important;
        -webkit-transform: none !important;
        -ms-transform: none !important;
        transform: none !important;
        -webkit-flex: 0 0 auto !important;
        -ms-flex: 0 0 auto !important;
        flex: 0 0 auto !important;
        min-width: 0 !important;
    }

    .mud-dialog.mud-dialog-absolute-position {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        -webkit-transform: translate(-50%, -50%) !important;
        -ms-transform: translate(-50%, -50%) !important;
        transform: translate(-50%, -50%) !important;
    }
}

@supports (-webkit-hyphens: none) or (-webkit-touch-callout: none) {
    @media screen and (min-width: 801px) {
        .mud-dialog {
            position: relative !important;
            top: 0 !important;
            left: 0 !important;
            margin: 0 auto !important;
        }
    }
}