/* seletor de tema · dia/noite animado, tal qual o BO.IA */
.thm{position:relative;display:inline-block;width:37px;height:16.5px;flex-shrink:0;cursor:pointer;
  -webkit-tap-highlight-color:transparent}
.thm input{position:absolute;opacity:0;width:0;height:0}
.thm .slider{
  position:absolute;top:0;left:0;width:60px;height:26.7px;transform:scale(.6222);transform-origin:top left;
  background-color:#000;border:1px solid rgb(58,58,58);border-radius:22px;
  transition:.4s;overflow:hidden;z-index:2;box-sizing:border-box;
}
.thm .slider::before{
  position:absolute;content:"";height:20px;width:20px;left:2.7px;bottom:2.7px;
  background-color:#fff;transition:1s;border-radius:50%;overflow:hidden;z-index:3;
}
.thm .moons-hole{position:absolute;inset:0;opacity:1;transition:1s;z-index:4}
.thm .moons-hole i{position:absolute;border-radius:50%;background-color:rgb(85,85,85)}
.thm .moons-hole i:nth-child(1){height:3.3px;width:3.3px;top:16.7px;left:13.3px}
.thm .moons-hole i:nth-child(2){height:6.7px;width:6.7px;top:10px;left:4.7px}
.thm .moons-hole i:nth-child(3){height:2.7px;width:2.7px;top:7.3px;left:14px}
.thm .stars{position:absolute;right:4px;top:0;bottom:0;transition:1s;transform:translateY(0);z-index:1}
.thm .star{position:absolute;fill:#fff;animation:starTwinkle 2s infinite;opacity:1}
.thm .star:nth-child(1){top:3.3px;right:19.3px;width:13.3px;animation-delay:.3s}
.thm .star:nth-child(2){top:12px;right:6px;width:10px}
.thm .star:nth-child(3){top:3.3px;right:10px;width:6.7px;animation-delay:.6s}
.thm .star:nth-child(4){top:17.3px;right:18.7px;width:8px;animation-delay:.9s}
.thm .star:nth-child(5){top:1.3px;right:33.3px;width:5.3px;animation-delay:1.2s}
@keyframes starTwinkle{0%{transform:scale(1)}40%{transform:scale(1.2)}80%{transform:scale(.8)}100%{transform:scale(1)}}
.thm .clouds,.thm .black-clouds{position:absolute;left:4px;top:0;bottom:0;width:13.3px;
  transition:1s;transform:translateX(-36.7px)}
.thm .black-clouds{opacity:0;z-index:0}
.thm .clouds i,.thm .black-clouds i{position:absolute;width:13.3px;height:13.3px;border-radius:50%;
  animation:cloudMove 6s infinite}
.thm .black-clouds i{background-color:#555;opacity:.6;animation-delay:1s}
.thm .black-clouds i:nth-child(1){top:.7px;right:2px}
.thm .black-clouds i:nth-child(2){top:10px;left:6px}
.thm .black-clouds i:nth-child(3){top:13.3px;left:18px}
.thm .clouds i{background-color:#fff;z-index:1}
.thm .clouds i:nth-child(1){top:0;height:14px;width:14px;right:9.3px}
.thm .clouds i:nth-child(2){top:9.3px;right:4px;height:16.7px;width:16.7px}
.thm .clouds i:nth-child(3){top:18.7px;left:2.7px;height:15.3px;width:15.3px}
.thm .clouds i:nth-child(4){top:17.3px;left:13.3px}
.thm .clouds i:nth-child(5){top:20px;left:20px}
.thm .clouds i:nth-child(6){top:18px;left:30.7px}
.thm .clouds i:nth-child(7){top:20.7px;left:38.7px}
@keyframes cloudMove{0%{transform:translateX(-21.3px)}40%{transform:translateX(-24px)}
  80%{transform:translateX(-18.7px)}100%{transform:translateX(-21.3px)}}
.thm input:not(:checked) + .slider{background-color:#62cff0}
.thm input:not(:checked) + .slider::before{transform:translateX(34.7px);background-color:orange}
.thm input:not(:checked) + .slider .moons-hole{transform:translateX(34.7px);opacity:0}
.thm input:not(:checked) + .slider .stars{transform:translateY(-21.3px);opacity:0}
.thm input:not(:checked) + .slider .clouds,
.thm input:not(:checked) + .slider .black-clouds{transform:translateX(21.3px);opacity:1}
