.post {
  text-align: justify;
}

.post-title {
  font-size: 2rem;
  text-align: left;
}

.logo__cursor {
  background: orange !important;
}

.social-share {
  position: relative;
  top: 0.2em;
  display: flex;
  justify-content: right;
  width: 100%;
}

.social-share ul {
  margin: 0;
}

.social-share ul li p {
  display: none;
}

.social-share .share-icons li {
  padding: 0 !important;
  padding-bottom: 10px !important;
}

.social-share .share-btn {
  padding: 0.5em 0.25em 0.1em 0.25em;
  width: 3em;
}

.social-share-nav .share-btn h3{
  color: #ffffff;
}

ul.share-icons {
  cursor: default;
  list-style: none;
  padding-left: 0;
  margin-top: 1em;
}

ul.share-icons li {
  display: inline-block;
  padding: 0 1em 0 0;
}

ul.share-icons li:last-child {
  padding-right: 0;
}

ul.share-icons li > * {
  text-decoration: none;
  border: 0;
}

ul.share-icons li > *:before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-transform: none !important;
}

ul.share-icons li > * .label {
  display: none;
}

.share-btn {
  display: inline-block;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
  outline: none;
  text-align: center;
  text-decoration: none;
}

.share-btn:hover {
  color: #ffffff !important;
}

.share-btn:active {
  position: relative;
  top: 2px;
  box-shadow: none;
  color: #e2e2e2;
  outline: none;
}
.share-btn .widget-social__link-icon {
  margin: 0;
  filter: invert(100%) sepia(0%) saturate(7427%) hue-rotate(44deg) brightness(98%) contrast(97%);
}

.share-btn.twitter     { background: #55acee; }
.share-btn.x           { background: #000; }
.share-btn.google-plus { background: #dd4b39; }
.share-btn.facebook    { background: #3B5998; }
.share-btn.linkedin    { background: #4875B4; }
.share-btn.stumbleupon { background: #EB4823; }
.share-btn.pinterest   { background: #BD081C; }
.share-btn.reddit      { background: #ff5700; }
.share-btn.email       { background: #444444; }
.share-btn.whatsapp    { background: #25d366; }
.share-btn.telegram    { background: #27A7E7; }


.share-btn.twitter:hover     { background: #4c9ad6; }
.share-btn.x:hover           { background: #111; }
.share-btn.google-plus:hover { background: #c64333; }
.share-btn.facebook:hover    { background: #2f4779; }
.share-btn.linkedin:hover    { background: #4069a2; }
.share-btn.stumbleupon:hover { background: #d3401f; }
.share-btn.pinterest:hover   { background: #AD0000; }
.share-btn.reddit:hover      { background: #e54e00; }
.share-btn.whatsapp:hover    { background: #14c255; }
.share-btn.telegram:hover    { background: #1696d6; }
.share-btn.email:hover       { background: #363636; }

/* General styles for the comment form */
.comment-form {
  margin-top: 20px;
  padding: 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #f9f9f9;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus,
.comment-form textarea:focus {
  border-color: #66afe9;
  outline: none;
}

.comment-form textarea {
  height: 100px;
  resize: vertical;
}

/* Button container to align buttons */
.button-container {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.comment-form button {
  background-color: #337ab7;
  color: #fff;
  padding: 10px 15px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
}

.comment-form button:hover {
  background-color: #286090;
}

.comment-preview {
  margin-top: 20px;
  padding: 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background-color: #fff;
}

/* Styles for the comments display */
.comments {
  margin-top: 40px;
}

.comment {
  padding: 10px 15px;
  /*border-bottom: 1px solid #eee; THIS MESSES UP CODE COMMENTS TODO: Fix it! */
  margin-bottom: 10px;
}

.comment strong {
  display: block;
  font-weight: bold;
  margin-bottom: 5px;
}

.comment em {
  font-size: 12px;
  color: #666;
}

.comment .reply-link {
  color: #337ab7;
  cursor: pointer;
  text-decoration: underline;
  font-size: 12px;
}

.reply-form {
  margin-top: 10px;
}

.reply-form input[type="text"],
.reply-form input[type="email"],
.reply-form input[type="url"],
.reply-form textarea {
  width: 90%;
  padding: 5px;
  margin-bottom: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

.reply-form textarea {
  height: 80px;
  resize: vertical;
}

.reply-form .button-container {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.reply-form button {
  background-color: #337ab7;
  color: #fff;
  padding: 5px 10px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
}

.reply-form button:hover {
  background-color: #286090;
}

/* Ensure the parent container aligns its content to the right */
.read-more-container {
  text-align: right;
}

/* Default Light Theme */
.post-navigation {
  display: flex;
  justify-content: space-between;
  margin: 20px 0;
}

.nav-button {
  display: inline-block;
  width: 45%;
  padding: 10px;
  text-decoration: none;
  background-color: #f0f0f0;
  color: #333;
  border-radius: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.nav-button:hover {
  background-color: #e0e0e0;
}

.prev-post {
  text-align: left;
}

.next-post {
  text-align: right;
}

/* Dark Theme */
.dark-theme .post-navigation {
  display: flex;
  justify-content: space-between;
  margin: 20px 0;
}

.dark-theme .nav-button {
  display: inline-block;
  width: 45%;
  padding: 10px;
  text-decoration: none;
  background-color: #333;
  color: #f0f0f0;
  border-radius: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.dark-theme .nav-button:hover {
  background-color: #444;
}

.dark-theme .prev-post {
  text-align: left;
}

.dark-theme .next-post {
  text-align: right;
}

.post-cover {
  position: relative;
  overflow: hidden;
}

.cover-video {
  width: 100%;
  height: auto;
  object-fit: cover;
  max-width: 100%;
}

/* Buy Me a Coffee font fallback */
.bmc-btn {
  font-family: "Avenir Book", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Lazy Load Skeleton Animation */
.lazy-image-placeholder {
  background: #e0e0e0;
  animation: lazyPulse 1.5s infinite ease-in-out;
}

.dark-theme .lazy-image-placeholder {
  background: #2a2a2c;
}

@keyframes lazyPulse {
  0% { opacity: 0.6; }
  50% { opacity: 1; }
  100% { opacity: 0.6; }
}