/* Copyright 2014 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

input[type="date" i],
input[type="datetime-local" i],
input[type="month" i],
input[type="time" i],
input[type="week" i] {
    align-items: center;
    display: -webkit-inline-flex;
    font-family: monospace;
    overflow: hidden;
    padding: 0;
    padding-inline-start: 1px;
    cursor: default;
}

input::-webkit-datetime-edit {
    flex: 1;
    min-width: 0;
    -webkit-user-modify: read-only !important;
    display: inline-block;
    overflow: hidden;
}

input::-webkit-datetime-edit-fields-wrapper {
    -webkit-user-modify: read-only !important;
    display: inline-block;
    padding: 1px 0;
    white-space: pre;
}

/* If you update padding, border, or margin in the following ruleset, update
   DateTimeFieldElement::maximumWidth too. */
input::-webkit-datetime-edit-ampm-field,
input::-webkit-datetime-edit-day-field,
input::-webkit-datetime-edit-hour-field,
input::-webkit-datetime-edit-millisecond-field,
input::-webkit-datetime-edit-minute-field,
input::-webkit-datetime-edit-month-field,
input::-webkit-datetime-edit-second-field,
input::-webkit-datetime-edit-week-field,
input::-webkit-datetime-edit-year-field {
    -webkit-user-modify: read-only !important;
    border: none;
    display: inline;
    font: inherit !important;
    padding: 1px;
}

/* Remove focus ring from fields and use highlight color */
input::-webkit-datetime-edit-ampm-field:focus,
input::-webkit-datetime-edit-day-field:focus,
input::-webkit-datetime-edit-hour-field:focus,
input::-webkit-datetime-edit-millisecond-field:focus,
input::-webkit-datetime-edit-minute-field:focus,
input::-webkit-datetime-edit-month-field:focus,
input::-webkit-datetime-edit-second-field:focus,
input::-webkit-datetime-edit-week-field:focus,
input::-webkit-datetime-edit-year-field:focus {
    background-color: highlight;
    color: highlighttext;
    outline: none;
}

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;
}

/* If you update padding, border, or margin in the following ruleset, update
   DateTimeEditElement::customStyelForRenderer too. */
input::-webkit-datetime-edit-text {
    -webkit-user-modify: read-only !important;
    display: inline;
    font: inherit !important;
}

input[type="date" i]::-webkit-inner-spin-button,
input[type="datetime" i]::-webkit-inner-spin-button,
input[type="datetime-local" i]::-webkit-inner-spin-button,
input[type="month" i]::-webkit-inner-spin-button,
input[type="time" i]::-webkit-inner-spin-button,
input[type="week" i]::-webkit-inner-spin-button {
    /* FIXME: Remove height. */
    height: 1.5em;
    margin-inline-start: 2px;
}