body {
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings: "wdth" 100;
}

.navbar-brand {
  font-family: "Passion One", sans-serif;
  font-weight: 700;
  font-style: normal;
}

/* Custom styles for rating widget */
#rating-widget {
  position: fixed;
  bottom: 16px;
  right: 16px;
  width: 250px;
  padding: 16px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  z-index: 1000;
  text-align: center;
  font-family: Arial, sans-serif;
}

#rating-widget p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.5;
  font-weight: bold;
  color: #212121;
}

#stars {
  display: flex;
  justify-content: center;
  gap: 5px;
  margin-bottom: 10px;
}

#stars span {
  font-size: 24px;
  cursor: pointer;
  color: #ddd;
}

#stars span:hover,
#stars span.active {
  color: #f0a500;
}

#rating-feedback {
  font-size: 12px;
  color: #212121;
}

/* YouTube-brand red button */
.btn-optblog-primary {
  background-color: #25ac61;
  border-color: #25ac61;
  color: #ffffff;
}

.btn-optblog-primary:hover,
.btn-optblog-primary:focus {
  background-color: #25ac61;
  /* a slightly darker red on hover */
  border-color: #25ac61;
  color: #ffffff;
}

/* nudge the arrow icon down a touch */
.btn-optblog-primary .bi-arrow-right {
  position: relative;
  top: 0.08em;
  line-height: 1;
}

.brand-name {
  position: relative;
  top: 3px;
}

/* 1) Common button styles (mimics .btn and .btn-sm) */
.social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.5rem;
  margin: 4px;
  /* ~btn-sm */
  font-size: 0.875rem;
  /* ~14px */
  font-weight: 500;
  line-height: 1.5;
  border: none;
  border-radius: 0.25rem;
  /* 4px */
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
}

.social-btn:hover {
  opacity: 0.85;
}

/* 2) Platform‐specific colors */
.social-btn--reddit {
  background-color: #ff4500;
  /* Reddit orange */
  color: #ffffff;
}

.social-btn--telegram {
  background-color: #0088cc;
  /* Telegram blue */
  color: #ffffff;
}

.social-btn--whatsapp {
  background-color: #25d366;
  /* WhatsApp green */
  color: #ffffff;
}

.social-btn--tumblr {
  background-color: #35465c;
  /* Tumblr dark blue */
  color: #ffffff;
}

.social-btn--hackernews {
  background-color: #ff6600;
  /* Hacker News orange */
  color: #000000;
}

.social-btn--facebook {
  background-color: #1877f2;
  /* Facebook blue */
  color: #ffffff;
}

.social-btn--twitter {
  background-color: #1da1f2;
  /* X (Twitter) blue */
  color: #ffffff;
}

.social-btn--pinterest {
  background-color: #e60023;
  /* Pinterest red */
  color: #ffffff;
}

.social-btn--linkedin {
  background-color: #0077b5;
  /* LinkedIn blue */
  color: #ffffff;
}

/* 3) Icon spacing (for buttons with <i> inside) */
.social-btn i {
  margin-right: 0.25rem;
  font-size: 1rem;
}

.IN-widget
  > span
  > button.IN-e146f606-483d-4824-a598-79a778fddfb4-1G9ISYhSF8XoOmdcl0yKDu {
  font-size: 16px !important;
  height: 30px !important;
  padding: 1px 16px !important;
  line-height: 24px !important;
  margin: 8px 8px 0px 8px;
  position: relative;
  top: -2px;
}

iframe {
  position: relative;
  top: 10px;
}

#facebookShareBtn {
  position: relative;
  top: -5px;
}

#pinterestShareBtn {
  position: relative;
  top: 0px;
}