@shopify/polaris/dist/esnext/components/DatePicker/DatePicker.css

Shopify’s product component library

.Polaris-DatePicker_1h7yp{ position:relative; }

.Polaris-DatePicker__MonthLayout_1rxud{ display:flex; flex-wrap:wrap; margin-top:-1.6rem; margin-left:-1.6rem; }

.Polaris-DatePicker__MonthContainer_wvj6b{ flex:1 1 23rem; margin-top:1.6rem; margin-left:1.6rem; max-width:calc(100% - 1.6rem); min-width:23rem; }

.Polaris-DatePicker__Month_2yc3r{ width:100%; table-layout:fixed; border-collapse:collapse; border:none; border-spacing:0; }

.Polaris-DatePicker__Month--current_jfkq6{ font-weight:700; }

.Polaris-DatePicker__DayCell_1ufrd{ width:14.28571%; background:transparent; margin:0; padding:0; border:0.1rem solid var(--p-border-subdued, #dfe3e8); border-radius:0; }

.Polaris-DatePicker__DayCell--inRange_bdklc{ border:0.1rem solid #9ca6de; }

.Polaris-DatePicker__DayCell--selected_1h34h{ border:0.1rem solid #5c6ac4; }

.Polaris-DatePicker__Day_37600{ display:block; height:100%; width:100%; margin:0; padding:0.8rem; background:transparent; border:none; border-radius:0; outline:none; font-size:1.2rem; text-align:center; cursor:pointer; }

.Polaris-DatePicker__Day_37600:hover{ background:#dfe3e8; }

.Polaris-DatePicker__Day_37600:focus{ box-shadow:inset 0 0 0 2px #5c6ac4; }

.Polaris-DatePicker__Day--today_dau3w{ font-weight:700; }

.Polaris-DatePicker__Day--inRange_8tlk9{ background:#b3bcf5; }

.Polaris-DatePicker__Day--inRange_8tlk9:hover{ background:#9ca8f2; }

@media screen and (-ms-high-contrast: active){ .Polaris-DatePicker__Day--inRange_8tlk9{ background:highlight; } }

.Polaris-DatePicker__Day--selected_11sb5{ background:#5c6ac4; color:white; }

.Polaris-DatePicker__Day--selected_11sb5:hover{ background:#4959bd; }

.Polaris-DatePicker__Day--selected_11sb5:focus{ box-shadow:inset 0 0 0 2px #202e78; }

@media screen and (-ms-high-contrast: active){ .Polaris-DatePicker__Day--selected_11sb5{ background:highlight; } }

.Polaris-DatePicker__Day--disabled_l152e{ background-color:#f9fafb; color:#c4cdd5; cursor:default; }

.Polaris-DatePicker__Day--disabled_l152e:hover{ background-color:#f9fafb; }

.Polaris-DatePicker__Day--disabled_l152e:focus{ box-shadow:none; }

.Polaris-DatePicker__EmptyDayCell_1g9oi{ width:14.28571%; margin:0; padding:0; border:0.1rem solid var(--p-border-subdued, #dfe3e8); }

.Polaris-DatePicker__Weekday_igvyt{ padding:0.8rem; background:transparent; font-size:1.2rem; font-weight:400; color:#637381; text-align:center; }

.Polaris-DatePicker__Weekday--current_1nb2b{ font-weight:700; color:black; }

.Polaris-DatePicker__Header_z4uwg{ position:absolute; top:1.6rem; display:flex; justify-content:space-between; width:100%; }

.Polaris-DatePicker__Title_2qj8j{ flex:1 1 auto; margin-top:0.2rem; padding-bottom:0.4rem; text-align:center; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__DayCell_1ufrd{ border:none; border-radius:var(--p-border-radius-base); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__DayCell--selected_1h34h{ border:none; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__DayCell--inRange_bdklc{ border-radius:0; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600{ box-shadow:none; border:0; border-radius:var(--p-border-radius-base); color:var(--p-text); position:relative; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:hover{ background:var(--p-interactive-hovered); color:var(--p-text-on-interactive); }

@media (-ms-high-contrast: active){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:hover{ outline:1px solid windowText; } }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600::after{ content:var(--p-non-null-content, none); position:absolute; z-index:1; top:-0.1rem; right:-0.1rem; bottom:-0.1rem; left:-0.1rem; display:block; pointer-events:none; box-shadow:0 0 0 -0.1rem var(--p-focused); transition:box-shadow 100ms var(--p-ease); border-radius:calc(var(--p-border-radius-base) + 0.1rem); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:focus:not(:active){ box-shadow:none; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:focus:not(:active)::after{ box-shadow:0 0 0 0.2rem var(--p-focused); }

@media (-ms-high-contrast: active){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:focus:not(:active)::after{ outline:1px solid windowText; } }

@media (-ms-high-contrast: active){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day_37600:focus:not(:active)::after{ box-shadow:none; } }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--selected_11sb5{ background:var(--p-interactive); color:var(--p-text-on-interactive); }

@media (-ms-high-contrast: active){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--selected_11sb5{ -ms-high-contrast-adjust:none; background-color:Highlight; color:HighlightText; }
  .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--selected_11sb5:hover{ background-color:HighlightText; color:Highlight; outline:2px solid Highlight; } }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--inRange_8tlk9{ border-radius:0; background:var(--p-surface-selected); }

@media (-ms-high-contrast: active){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--inRange_8tlk9{ -ms-high-contrast-adjust:none; background-color:Highlight; color:HighlightText; }
  .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--inRange_8tlk9:hover{ background-color:HighlightText; color:Highlight; outline:2px solid Highlight; } }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--firstInRange_sp8p9{ border-radius:var(--p-border-radius-base); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--firstInRange_sp8p9.Polaris-DatePicker__Day--hasRange_742b2, .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--firstInRange_sp8p9.Polaris-DatePicker__Day--hoverRight_1549s{ border-radius:3rem 0 0 3rem; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--firstInRange_sp8p9.Polaris-DatePicker__Day--hasRange_742b2::after, .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--firstInRange_sp8p9.Polaris-DatePicker__Day--hoverRight_1549s::after{ border-radius:3rem 0 0 3rem; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--lastInRange_1jdh1{ border-radius:0 3rem 3rem 0; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--lastInRange_1jdh1::after{ border-radius:0 3rem 3rem 0; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Week_yj63l{ margin-bottom:0.2rem; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Week_yj63l > .Polaris-DatePicker__Day--inRange_8tlk9:first-child:not(.Polaris-DatePicker__Day--firstInRange_sp8p9):not(.Polaris-DatePicker__Day--lastInRange_1jdh1){ border-radius:var(--p-border-radius-base) 0 0 var(--p-border-radius-base); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Week_yj63l > .Polaris-DatePicker__Day--inRange_8tlk9:last-child:not(.Polaris-DatePicker__Day--firstInRange_sp8p9):not(.Polaris-DatePicker__Day--lastInRange_1jdh1){ border-radius:0 var(--p-border-radius-base) var(--p-border-radius-base) 0; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__DayCell_1ufrd, .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__EmptyDayCell_1g9oi{ border:none; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--disabled_l152e{ background-color:transparent; color:var(--p-text-disabled); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--disabled_l152e:hover{ background-color:transparent; color:var(--p-text-disabled); }

@media (-ms-high-contrast){ .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--disabled_l152e{ -ms-high-contrast-adjust:none; color:grayText; }
  .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--disabled_l152e:hover{ color:grayText; outline:none; } }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--disabled_l152e:focus::after{ content:none; }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Weekday_igvyt{ color:var(--p-text-subdued); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Weekday--current_1nb2b{ color:var(--p-text); }

.Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--inRange_8tlk9::after, .Polaris-DatePicker--newDesignLanguage_1rik8 .Polaris-DatePicker__Day--inRange_8tlk9:not(:hover) + .Polaris-DatePicker__Day_37600::after{ border-radius:0 3rem 3rem 0; }