.chrono-layout-box {
  font-family: Phosphor, "Caviar Dreams";
  background-color: $shade10;
  padding-top: 0.7em;
  font-size: 16;
}

.chrono-layout-box:last-child {
  padding-bottom: 1em;
}

.chrono-weather-box {
  padding: 0 2.8em 0 2.8em;
  background-size: 120%;
  background-repeat: no-repeat;
  border-radius: 0.5em;
  background-blend-mode: exclusion;
}

.chrono-weather-glyph {
  font-size: 120;
  padding-top: 0.2em;
}

.chrono-weather-main {
  font-size: 35;
  font-weight: bold;
  font-family: "Caviar Dreams";
}

.chrono-sundial-prefix,
.chrono-sundial-label {
  padding: 0;
  margin: 0;
  font-size: 15;
  font-family: Phosphor, "Caviar Dreams";
  font-weight: 500;
}

.chrono-weather-info-box {
  border-radius: 0.5em;
  opacity: 0.8;
  font-size: 15;
}

.chrono-sundial-prefix,
.chrono-weather-min-icon,
.chrono-weather-pressure-icon,
.chrono-weather-location-icon,
.chrono-weather-max-icon,
.chrono-weather-humid-icon {
  padding-bottom: 0.1em;
  font-size: 20;
}

.chrono-weather-temp-feels {
  padding-top: 1em;
}

.chrono-weather-feels {
  font-size: 17;
}

.chrono-sundial-prefix {
  color: darken($base15, 30%);
}

.chrono-weather-max-icon {
  color: $base11;
}

.chrono-weather-min-icon {
  color: darken($base09, 20%);
}

.chrono-weather-location-icon {
  color: darken($base07, 20%);
}

.chrono-weather-pressure-icon {
  color: lighten($base13, 10%);
}

.chrono-sundial-label,
.chrono-weather-min-label,
.chrono-weather-location-label,
.chrono-weather-pressure-label,
.chrono-weather-max-label {
  font-weight: bold;
}

.chrono-weather-temp {
  font-size: 100;
  font-weight: bold;
}

.chrono-calen-box {
  font-size: 16;
  background-image: linear-gradient(100deg, $shade02, $shade06);
  color: $base05;
  padding: 3em 0 0 0;
  border-radius: 0.5em;
}

.chrono-calen-label {
  font-weight: bold;
  font-family: "Caviar Dreams";
}

.chrono-calen {
  font-family: Dosis;
  font-weight: bold;
  padding: 1.3em 0.5em 0;

  &:selected {
    color: $base15;
    font-weight: bolder;
    border-radius: 50%;
  }

  &:indeterminate {
    color: rgba($shade03, 0.3);
  }
}

.chrono-calen.button {
  color: $shade00;
}

.chrono-calen.highlight {
  color: $base09;
  font-weight: bold;
}

.chrono-time-box {
  background-image: linear-gradient(100deg, $shade02, $shade06);
  border-radius: 0.5em;
  padding: 2.5em 1.5em 2.5em 1.5em;
  color: $base05;
}

.chrono-time-label {
  font-size: 70;
  font-weight: bolder;
  color: $base09;
  font-family: Modum;
}

.chrono-prog {
  background-color: $shade00;
  color: darken($base09, 5%);
}

.chrono-prog label {
  padding: 1em;
  background-color: $shade02;
  color: $base05;
  font-weight: bold;
  font-size: 25;
  font-family: Iosevka;
}

.chrono-prog-minute label {
  padding: 1.55em;
}

.chrono-prog-minute {
  background-color: $shade04;
  color: $base09;
}

.chrono-sep {
  background-color: $shade00;
  padding-left: 0.25em;
  border-radius: 0.5em;
}

.chrono-uptime-label {
  font-size: 18;
  font-family: Modum;
}

.chrono-weather-extra {
  font-family: Phosphor, Dosis;
  background-image: linear-gradient(100deg, $shade02, $shade06);
  border-radius: 0.5em;
  padding: 2em 0 2em 0;
  font-size: 16;
  color: $base05
}

.chrono-weather-extra-header {
  color: $base15;
  font-size: 20;
  font-weight: bold;
}

.chrono-weather-extra-description {
  font-size: 12;
}

.chrono-weather-humid-text,
.chrono-weather-visible-text,
.chrono-weather-wind-text,
.chrono-weather-cloud-text {
  color: $base09;
  font-weight: bold;
}

.chrono-weather-humid-label,
.chrono-weather-visible-label,
.chrono-weather-wind-label,
.chrono-weather-cloud-label {
  color: $base04;
}

.chrono-weather-humid-icon,
.chrono-weather-visible-icon,
.chrono-weather-wind-icon,
.chrono-weather-cloud-icon {
  font-size: 20;
}

.chrono-headers-label {
  color: $base05;
}

.chrono-headers-close {
  color: $base11;
}

.chrono-headers-close:hover {
  color: $base09;
}

.chrono-headers {
  padding: 1em 1.5em 0.5em 1.5em;
  font-size: 25;
}

.chrono-air-box {
  background-image: linear-gradient(100deg, $shade02, $shade06);
  border-radius: 0.5em;
  font-family: Phosphor, Dosis;
  padding: 1.5em;
  padding-bottom: 2em;
}

.chrono-aqi-box {
  padding: 1em;
}

.chrono-aqi-radial label {
  padding: 1em;
  font-size: 40;
  background-color: $shade05;
}

.chrono-aqi-radial {
  background-color: $shade01;
}

.chrono-air-radial-1 {
  color: $base14;
}

.chrono-air-radial-2 {
  color: $base09;
}

.chrono-air-radial-3 {
  color: $base13;
}

.chrono-air-radial-4 {
  color: lighten($base11, 0.5);
}

.chrono-air-radial-5 {
  color: $base11;
}

.chrono-aqi-inner {
  font-size: 20;
  border-radius: 0.3em;
  padding: 2em;
}

.chrono-aqi-inner-1 {
  background-image: linear-gradient(100deg, $shade01, rgba($base14, 0.5));
}

.chrono-aqi-inner-2 {
  background-image: linear-gradient(100deg, $shade01, rgba($base09, 0.5));
}

.chrono-aqi-inner-3 {
  background-image: linear-gradient(100deg, $shade01, rgba($base13, 0.5));
}

.chrono-aqi-inner-4 {
  background-image: linear-gradient(100deg, $shade01, rgba(lighten($base11, 10%), 0.5));
}

.chrono-aqi-inner-5 {
  background-image: linear-gradient(100deg, $shade01, rgba($base11, 0.5));
}

.chrono-air-aqi-label {
  color: $base15;
  font-weight: bold;
}

.chrono-air-aqi-quality {
  font-size: 16;
  color: $base05;
}

.chrono-air-separator {
  background-color: $shade00;
  padding-left: 0.18em;
  font-size: 5;
  border-radius: 0.5em;
}

.chrono-info-label {
  color: $base15;
  font-weight: bold;
  font-size: 20;
}

.chrono-air-co-box,
.chrono-air-o3-box,
.chrono-air-no-box,
.chrono-air-no2-box,
.chrono-air-so2-box,
.chrono-air-pm2_5-box,
.chrono-air-pm10-box,
.chrono-air-nh3-box {
  font-size: 16;
}

.chrono-air-co-label,
.chrono-air-o3-label,
.chrono-air-no-label,
.chrono-air-no2-label,
.chrono-air-so2-label,
.chrono-air-pm2_5-label,
.chrono-air-pm10-label,
.chrono-air-nh3-label {
  color: $base09;
  font-weight: bold;
}

.chrono-air-co-value,
.chrono-air-o3-value,
.chrono-air-no-value,
.chrono-air-no2-value,
.chrono-air-so2-value,
.chrono-air-pm2_5-value,
.chrono-air-pm10-value,
.chrono-air-nh3-value {
  color: $base04;
}

@import "override";

// vim:ft=scss
