@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,200;6..12,300;6..12,800;6..12,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface');
* {box-sizing: border-box;}

/* All settings for bright and dark colors are in this line. */
body {font-family: 'Nunito Sans', sans-serif;background-color: #fff;transition: background-color 0.0s ease;}
body.light {background-color: #fff;color: #333;}
body.dark {background-color: #0c1324;color: #fff;}
body.dark {background-color: #0c1324;} /* #9b59b6 */
body.dark h1, body.dark .support a {color: #fff;}
body.dark nav, body.dark .nav-item a {color: #fff;}
body.dark nav, body.dark .nav-item:focus a {color: #fff;}
body.dark nav, body.dark .link a {color: #fff;}
body.dark nav, body.dark .logo {color: #fff;}
body.dark nav, body.dark .navbar {background-color: #1e293b;}
body.dark nav, body.dark .bg-putih {background-color: #000000;}
body.dark input, body.dark .text-putih {color: #fff;}
body.dark input, body.dark .text-du {color: #fff;}
p .sdbr-link{color:#000000;}
.sdbr-links{color:#000000;}
body.dark .sdbr-links{color:#ffc007;}
li .sdbr-link{color:#000000;}
body.dark p, body.dark .sdbr-link{color:#ffffff;}

/* Categories */
.Business {background-color: rgba(29,137,205,.1);color: #1d89cd;}
.Gadgets {background-color: rgba(256,161,105,.1);color: #e96e6a;}
.Lifestyle {background-color: rgba(56,161,105,.1);color: #38a169;}
.Marketing {background-color: rgba(246,79,33,.1);color: #f64f21;}
.Politics {background-color: rgba(255,102,82,.1);color: #ff6652;}
.Sport {background-color: rgba(178,146,65,.1);color: #b29241;}
.Tech {background-color: rgba(255,192,7,.1);color: #ffc007;}
.Travel {background-color: rgba(16,202,240,.1);color: #10caf0;}
.Trending {background-color: rgba(111,66,193,.1);color: #6f42c1;}

.bg-putih {background-color: #fff;}
.text-putih {color: #000;}
.text-du {color: #000;}
.form-control::placeholder {color:#333;}
.card {border-style: solid;border-width: 1px;border-color: #dee2e6;}
.cards {border-style: solid;border-width: 1px;border-color: #dee2e6;}
.editor {color:#64748b;}
.editors {color:#000000;}
.sdbr {color:#000000;}
.btn-dsc {background-color: #e9ecef;}
.btn-dsc:hover {background-color: #dee2e6;}
body.dark .btn-dsc {background-color: #0c1324;color:#fff;}
body.dark .btn-dsc:hover {background-color: #000000;color:#fff;}
body.dark .sdbr {color:#ffffff;}
body.dark .editors {color:#ffffff;}
body.dark .card{background-color: #1e293b;color: #fff;border-width: 1px;border-color: #0c1324;color:#cbd5e1;}
body.dark .cards{background-color: #1e293b;color: #fff;border-width: 1px;border-color: #0c1324;color:#cbd5e1;}
.navbar {background-color: #f8f9fa;}
body.dark nav, body.dark .dropdown-menu {background-color: #000000;}
.bg-news a{background-color: #f2f2f2;color:#000;border-width: 1px}
.bg-news a:hover{background-color: #f2f2f2;color:#000;}
body.dark .bg-news a{background-color: #1e293b;color:#fff;}
body.dark .bg-news a:hover{background-color: #1e293b;color:#fff;}
.bg-foot{background-color: #f8f9fa;color:#000;}
body.dark .bg-foot{background-color: #000000;color:#fff;}
p img{width: 100%;border-radius:5px;}
p a{font-weight: bold;color:#000000;}
p a:hover{font-weight: bold;color:#fdc10d;}
body.dark p a{font-weight: bold;color:#fdc10d;}
body.dark p a:hover{font-weight: bold;color:#ffffff;}

/* Sticky Share Button */
.sticky {position: sticky;top: 90px;}

/* Card hover */
.bnr-f {transition: transform 0.3s ease;}
.bnr-f:hover {transform: translateY(-5px);}

/* All settings for Checkbox are in this line. */
.checkbox {
  opacity: 0;
  position: absolute;
}
.checkbox-label {
  background-color: #111;
  width: 50px;
  height: 26px;
  border-radius: 50px;
  position: relative;
  padding: 5px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.fa-moon {color: #f1c40f;}
.fa-sun {color: #f39c12;}
.checkbox-label .ball {
  background-color: #fff;
  width: 22px;
  height: 22px;
  position: absolute;
  left: 2px;
  top: 2px;
  border-radius: 50%;
  transition: transform 0.2s linear;
}
.checkbox:checked + .checkbox-label .ball {
  transform: translateX(24px);
}


/*control button styles*/
.bn-controls button{
  background:#FF0000;
}
/*links hover styles*/
.bn-news ul li a:hover{
  color:#FF0000;
}

/*prefix styles*/
.bn-prefix{
  color:#0000FF;
  font-size:18px;
}


/* Numbering List Post */
#zero {
    list-style-type: none;
    counter-reset: li;
}
#zero li{
    display: flex;
    font-size: 16px;
}
#zero li:before {
    font-family: 'Abril Fatface', serif;
    counter-increment: li;
    content: counter(li, decimal-leading-zero) ". ";
    font-weight: 600;
    padding-right: 0.5em; /* Sesuaikan nilai sesuai kebutuhan Anda */
}
body.dark #zero li {
  display: flex;
  color:#ffc007;
  font-size: 16px;
}

/* Language Selector */
select {
    word-wrap: normal;
    padding: 7px;
    border-radius: 5px;
    border-color: rebeccapurple;
    border-width: 0;
}