﻿/* Tabs */

/* Tabs horizontales*/
.TabHeader-custom {
    background-color: transparent;
    border: none;
    color: #211d19;
}

.ActiveTabClass-custom {
    color: #8b5e3c !important;
    font-weight: 600;
    border-bottom: 2px solid #8b5e3c;
}

/*Tabs verticales */
.TabHeader-custom-secondary {
    background-color: transparent;
    border: none;
    color: #211d19;
}

.ActiveTabClass-custom-secondary {
    color: #8b5e3c !important;
    font-weight: 600;
    border-bottom: 2px solid #8b5e3c;
}

.TabHeader-custom-secondary .mud-tab {
    justify-content: flex-start;
}

/* Tipografía */

/* Label deshabilitada */
/*.mud-input-label.mud-disabled {
    color: #757575;
}*/

/* Texto del input deshabilitado */
.mud-input.mud-disabled input,
.mud-input.mud-disabled textarea {
    color: #3b2f25;
}

.colorEditando {
    background-color: #FFF3CD;
}

/* Contenedores */

.mudcontainer-md {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 960px) { /* md en MudBlazor */
    .mudcontainer-md {
        width: 70vw;
        max-width: 70vw;
    }
}

/*Alineado a la derecha para campos numéricos y sus cabeceras en tablas*/
.text-right input {
    text-align: right;
}

.th-right {
    text-align: right;
}

/* toma el color del surface como fondo para que sea como el color de una tabla*/
.mudpaper-text-primary-bg {
    background-color: var(--mud-palette-surface);
    border-radius: 5px;
}

/* Fondo marron usado en los mudpaper */
.mudpaper-marron {
    background-color: #f3e6d3;
    border-radius: 20px;
}

.mudpaper-marron-deactivated {
    border-radius: 20px;
    background-color: #fbf7e6;
}


.mudpaper-scrollable-md {
    min-height: 80vh;
    max-height: 80vh;
    overflow-y: auto;
}

.mudtable-scrollable-md {
    min-height: 63vh;
    max-height: 63vh;
    overflow-y: auto;
}

.mudtable-scrollable-md-noaddbutton {
    min-height: 66vh;
    max-height: 66vh;
    overflow-y: auto;
}

@media (max-width: 600px) {

    .table-mobile-fixed-label .mud-table-cell {
        display: flex;
        align-items: center;
    }

        .table-mobile-fixed-label .mud-table-cell::before {
            width: 110px; /* ancho fijo del label */
            min-width: 110px;
            max-width: 110px;
            font-weight: 500;
            text-align: left;
            white-space: nowrap;
            flex-shrink: 0;
        }

        .table-mobile-fixed-label .mud-table-cell > * {
            flex: 1;
        }
}
