#dashboard-box {
  transition: margin 0.25s cubic-bezier(0.5, 0.25, 0, 1);
  background-color: var(--shadow);
  border-radius: 25px;
  padding: 6px;
  margin-bottom: 65px;
}

#inner {
  margin: 3px;
}

.tile {
  margin: 0 6px;
  min-height: 60px;
  min-width: 140px;
  border-radius: 20px;
}
.tile.mini {
  min-height: 46px;
  min-width: 46px;
  border-radius: 100%;
}
.tile.on {
  background-color: var(--primary);
}
.tile.off {
  background-color: var(--surface-bright);
}
.tile.on .desc-label,
.tile.on .tile-label,
.tile.on .tile-icon {
  color: var(--shadow);
  transition: all;
}
.tile.off .desc-label,
.tile.off .tile-label,
.tile.off .tile-icon {
  color: var(--foreground);
  transition: all;
}

.tile-icon {
  font-size: 18px;
  margin: 10px;
}
.tile-icon.mini {
  font-size: 20px;
  transition: font-size 0.25s cubic-bezier(0.5, 0.25, 0, 1);
}
.tile-icon.maxi {
  font-size: 16px;
  transition: font-size 0.25s cubic-bezier(0.5, 0.25, 0, 1);
}

.tile-menu {
  margin: -999px;
}
.tile-menu.expand {
  margin: 0px;
  transition: margin 0.15s cubic-bezier(0.5, 0.25, 0, 1);
}
.tile-menu.contract {
  margin: -200px;
  transition: margin 0.25s cubic-bezier(0.5, 0.25, 0, 1);
}

#bluetooth-header,
#network-header {
  border: 2px solid var(--surface);
  padding: 4px;
  border-radius: 12px;
}

#bluetooth-device,
#wifi-ap-slot {
  border: 2px solid var(--surface);
  border-radius: 12px;
  padding: 4px;
}

#bluetooth-scan,
#bluetooth-back,
#network-refresh,
#network-back {
  background-color: var(--surface);
  border-radius: 8px;
  padding: 4px;
}

#bluetooth-back-label,
#network-back-label {
  font-size: 20px;
}

#bluetooth-scan:hover,
#bluetooth-back:hover,
#network-refresh:hover,
#network-back:hover {
  background-color: var(--surface-bright);
}

#bluetooth-scan label,
#bluetooth-toggle label,
#wifi-connect-button label {
  font-weight: bold;
}

#bluetooth-text,
#bluetooth-section {
  font-weight: bold;
}

#bluetooth-section {
  background-color: var(--surface);
  border-radius: 12px;
  padding: 8px;
}

#bluetooth-connection {
  font-size: 20px;
}

#bluetooth-connect,
#wifi-connect-button {
  font-weight: bold;
  background-color: var(--surface);
  border-radius: 8px;
  padding: 8px;
}

#wifi-connect-button.connected {
  background-color: var(--green);
}

#wifi-connect-button.connected label {
  color: var(--shadow);
}

#bluetooth-connect.connected {
  background-color: var(--blue);
}

#bluetooth-connect.connected label {
  color: var(--shadow);
}

#bluetooth-connect:hover {
  background-color: var(--surface-bright);
}

#bluetooth-paired,
#bluetooth-available {
  background-color: var(--surface);
  border-radius: 20px;
  padding: 4px;
}

#bt-sep {
  /*padding: 1px;*/
  border-radius: 16px;
  /*background-color: var(--surface);*/
  /*margin: 0 16px;*/
}

#bluetooth-scan-label,
#network-refresh-label {
  font-size: 20px;
  color: var(--primary);
}

#bluetooth-scan.scanning {
  animation: blink 0.5s ease infinite;
}

#bluetooth-scan-label.scanning {
  animation: blink 0.5s ease infinite;
}

@keyframes blink {
  0% {
    background-color: var(--blue);
    color: var(--shadow);
  }
  50% {
    background-color: var(--shadow);
    color: var(--blue);
  }
  100% {
    background-color: var(--blue);
    color: var(--shadow);
  }
}