/* Este archivo sobrescribe las clases de utilidad de color de MDL para que usen variables CSS */

/* Color Primario: Usado en encabezados, botones principales, etc. */
.mdl-color--primary {
    background-color: var(--mdl-color-primary) !important;
    color: var(--mdl-color-primary-contrast) !important; 
}

/* Color de el ícono del Drawer */
.mdl-layout__header .mdl-layout__drawer-button  {
    color: var(--mdl-color-primary-contrast) !important; 
}

/* Color del selector y su pista */
.mdl-switch.is-checked .mdl-switch__thumb {
    background-color: var(--mdl-color-primary) !important; 
}
.mdl-switch.is-checked .mdl-switch__track {
    background-color: var(--mdl-color-primary) !important; 
    opacity: 0.5 !important;
}

/* Color de los botones */
.mdl-button.mdl-button--colored:not([disabled]) {
    background-color: var(--mdl-color-primary) !important; 
    color: var(--mdl-color-primary-contrast) !important;
}

/* Color de Texto Primario */
.mdl-color-text--primary {
    color: var(--mdl-color-primary) !important;
}

/* Color de Acento (Accent): Usado en toques, hover, switches, etc. */
.mdl-color--accent {
    background-color: var(--mdl-color-accent) !important; 
}

/* Color de Texto de Acento */
.mdl-color-text--accent {
    color: var(--mdl-color-accent) !important;
}

/* Color del Checkbox */
.mdl-checkbox.is-checked .mdl-checkbox__box-outline {
    border-color: var(--mdl-color-primary) !important; 
}
.mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
    background: var(--mdl-color-primary) !important;
}

/* Color del Select */
.mdl-textfield__label:after {
    background-color: var(--mdl-color-primary) !important; 
}