UserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.75 Safari/537.36

Example URL:

Steps to reproduce the problem:
HTML:

    <input type=date value=1970-01-01>

    <input type=date value=1970-01-01 min=1970-01-01 max=1970-02-01>

CSS:

    input::-webkit-datetime-edit-year-field
    {
        color: green;
    }

    input::-webkit-datetime-edit-year-field[disabled]
    {
        color: red;
    }

Demo on CodePen:
http://codepen.io/marek-saji/pen/LNrwxo?editors=1100

What is the expected behavior?
Year in the first input is green and in the second one — red.

What went wrong?
Both years are green.

Does it occur on multiple sites: N/A

Is it a problem with a plugin? N/A 

Did this work before? N/A 

Does this work in other browsers? N/A 

Chrome version: 50.0.2661.75  Channel: stable
OS Version: Ubuntu 15.10
Flash Version: Shockwave Flash 21.0 r0

In devtools (after enabling “Show user agent shadow DOM”) one can see that user agent styles disabled fields as follows:

input::-webkit-datetime-edit-year-field[disabled], input::-webkit-datetime-edit-month-field[disabled], input::-webkit-datetime-edit-week-field[disabled], input::-webkit-datetime-edit-day-field[disabled], input::-webkit-datetime-edit-ampm-field[disabled], input::-webkit-datetime-edit-hour-field[disabled], input::-webkit-datetime-edit-millisecond-field[disabled], input::-webkit-datetime-edit-minute-field[disabled], input::-webkit-datetime-edit-second-field[disabled] {
    color: graytext;
}

but using the same selector does not work.