body {
  background: #0e1113;
}

#sidebar {
  min-width: 270px;
  max-width: 270px;
  background: #000000;
  color: #fff;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  position: fixed;
  height: 100vh;
  left: 0;
  border-right: 1px solid #27282a;
}

#sidebar .h6 {
  color: #fff;
}

#sidebar.active {
  margin-left: -220px;
  background: #00000000;
  border-right: 1px solid #000000 !important;
}

#sidebar.active .custom-menu .btn.btn-primary {
  margin-left: -70px;
  position: absolute;
}

.hidden-community section.feed-section-bg.mt-5 {
  margin-left: 6%;
}

#sidebar.active .custom-menu {
  margin-right: -50px;
}

#sidebar h1 {
  margin-bottom: 20px;
  font-weight: 700;
}

#sidebar h1 .logo {
  color: #fff;
}

#sidebar ul.components {
  padding: 0;
}

#sidebar ul li {
  font-size: 16px;
  padding: 4px 2px;
}

#sidebar ul li.divider {
  border-top: 1px solid #2e2b2b;
}

.side-bar-menu-flash li.active {
  background: #181717;
  border-radius: 8px;
}

#sidebar ul li>ul {
  margin-left: 10px;
}

#sidebar ul li>ul li {
  font-size: 14px;
}

#sidebar ul li a {
  padding: 10px 0;
  display: block;
  color: #666666;
  width: 100%;
  /* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
}

#sidebar ul li a:hover {
  color: #fff;
}

#sidebar ul li.active>a {
  background: transparent;
  color: #fff;
}

@media (max-width: 991.98px) {
  #sidebar {
    margin-left: -270px;
  }

  #sidebar.active {
    margin-left: 0;
  }

  #sidebar .custom-menu {
    margin-right: -60px !important;
    top: 10px !important;
  }
}

#sidebar .custom-menu {
  display: inline-block;
  position: absolute;
  top: 20px;
  right: 0;
  margin-right: -20px;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

@media (prefers-reduced-motion: reduce) {
  #sidebar .custom-menu {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
  }
}

#sidebar .custom-menu .btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

#sidebar .custom-menu .btn.btn-primary {
  background: #000000;
  border-color: #27282a;
}

#sidebar .custom-menu .btn.btn-primary:hover,
#sidebar .custom-menu .btn.btn-primary:focus {
  background: #000000 !important;
  border-color: #000000 !important;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgb(71 73 77 / 50%);
}

#sidebar .custom-menu .btn:active:focus:hover {
  box-shadow: 0 0 0 0.25rem rgb(42 43 45 / 52%);
}

.sidebar-layout-community .middle2-column {
  width: 100%;
}

.sidebar-layout-community #sidebar.active .p-4 {
  visibility: hidden;
}

.sidebar-layout-community section.feed-section-bg {
  margin-left: 290px;
  margin-right: 370px;
  width: 100%;
}

.sidebar-layout-community section.feed-section-bg-w {
  margin-left: 290px;
  width: 100%;
}

/* Base state for smooth transition */
.sidebar-layout-community section.feed-section-bg {
  transition: margin-left 0.3s ease;
  margin-left: 290px;
  /* default when sidebar is open */
}

.sidebar-layout-community section.feed-section-bg-w {
  transition: margin-left 0.3s ease;
  margin-left: 290px;
  /* default when sidebar is open */
}

/* When sidebar is collapsed */
.sidebar-layout-community.hidden-community section.feed-section-bg {
  margin-left: 60px;
}

.sidebar-layout-community.hidden-community section.feed-section-bg-w {
  margin-left: 70px;
}

.side-bar-menu-flash li a img {
    height: 20px;
    border-radius: 50%;
}

.sidebar-layout-community .feed-section-bg .feed-item {
  /* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
  /* border-radius: 15px; */
  /* box-shadow: rgba(149, 157, 165, 0.2) 0px 0px 5px; */
  margin-bottom: 15px !important;
  /* background-color: #131313; */
  background-color: none;
  /* border: 1px solid #2c2c2c; */
  padding-top: 15px;
  width: 100% !important;
  padding: 10px 10px 0px 10px !important;
}

.img-feed-avatar,
.sidebar-layout-community .activity-body,
.sidebar-layout-community .feed-post-time {
  margin-left: 8px;
}

.sidebar-layout-community .feed-section-bg img.feed-post-user-img {
  /* border-radius: 25px; */
}

.sidebar-layout-community .feed-section-bg .user-avatar a img {
  border-radius: 25px;
  height: 80%;
  width: 80%;
  margin-top: 8px;
}

.sidebar-layout-community .feed-section-bg .feed-form-input {
  border: none;
  background: none;
}

.sidebar-layout-community .feed-section-bg textarea {
  /* border-radius: 25px; */
  /* border: 1px solid #131313; */
  /* height: 15px; */
  /* background: #131313; */
  /* font-size: 14px; */
  /* padding-right: 24%; */
  /* padding-left: 20px; */

  border-radius: 25px;
  border: 1px solid #413f3f;
  background: #131313;
  font-size: 14px;
  width: 100%;
  padding-left: 20px;
  color: #fff;
  min-height: 43px;
  padding-top: 10px;
  padding-right: 21%;
}

.sidebar-layout-community .feed-post-btn-wrapper button img {
  height: 15px;
}

.sidebar-layout-community .feed-post-btn-wrapper button {
  margin-top: -81px;

  border-radius: 50% !important;
  padding: 8px 10px !important;
}

.sidebar-layout-community .feed-post-btn-wrapper.text-end.active {
  margin-right: 10px;
  margin-top: 60px;
}

.sidebar-layout-community .feed-post-btn-wrapper button.post-comment-btn,
.sidebar-layout-community .feed-post-btn-wrapper button.btn.btn-primary.btn-sm.feed-comment-btn {
  background: #5143ee !important;
}

.sidebar-layout-community .feed-post-btn-wrapper button.cancel-post-btn,
.sidebar-layout-community .feed-post-btn-wrapper button.btn.btn-secondary.btn-sm.cancel-comment-btn {
  background: #ad2323 !important;
}

.sidebar-layout-community .feed-post-btn-wrapper button.post-comment-btn img {
  margin-top: -1px;
  margin-left: -2px;
}

.sidebar-layout-community .feed-post-btn-wrapper button.cancel-post-btn img {
  margin-top: -4px;
  background: #ad2323 !important;
}

.top-post-upper a img {
  height: 20px;
}

.top-post-upper.text-end {
  top: 10px;
  position: absolute;
  right: 20px;
}

.top-post-upper a {
  font-size: 12px;
  color: #cccccc;
}


.blurr .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(20px);
  transform: scale(1.2);
  /* Optional: zoom for stronger blur effect */
  z-index: 0;
  max-width: unset;
  max-height: unset;
}

/* Clear foreground image */
.blurr .foreground {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: unset;
  max-height: unset;
}

.blurr {
  position: relative;
  /* width: 540px; */
  /* height: 400px; */
  width: 100%;
  height: 475px;
  overflow: hidden;
  margin: 20px 0;
  background: linear-gradient(to right, #111111 0%, #5a5a5a 50%, #111111 100%);
  border-radius: 15px;
  border: 1px solid #5a5a5a73;
  margin-right: 15px;
  /* background: linear-gradient(to right, #a8dadc, #457b9d); */
}

.sidebar-layout-community .feed-media .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(20px);
  transform: scale(1.2);
  /* Optional: zoom for stronger blur effect */
  z-index: 0;
  max-width: unset;
  max-height: unset;
}

/* Clear foreground image */
.sidebar-layout-community .feed-media .foreground {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: unset;
  max-height: unset;
}

.sidebar-layout-community .feed-media {
  position: relative;
  /* width: 540px; */
  /* height: 400px; */
  width: 100%;
  height: 475px;
  overflow: hidden;
  margin: 20px 0;
  background: linear-gradient(to right, #111111 0%, #5a5a5a 50%, #111111 100%);
  border-radius: 15px;
  border: 1px solid #5a5a5a73;
  margin-right: 15px;
  /* background: linear-gradient(to right, #a8dadc, #457b9d); */
}

.recent-post-list {
  background: #000000;
}

.post-header-content {
  display: flex;
  align-items: center;
}

.post-header-content img {
  height: 30px;
  border-radius: 50px;
}

.post-header-content .subreddit {
  /* margin: -8px 0 0 8px; */
  font-size: 12px;
  /* line-height: 20px; */
  margin-left: 10px;
  color: #666666;
}

.group-recent-post {
  width: 360px;
  margin-right: 10px;
  height: 92vh;
  overflow: auto;
  background: #000000;
  /* padding: 5px 7px; */
  /* border: 1px solid #2e2b2b; */
  /* border-radius: 8px; */
  position: fixed;
  right: 0;
  margin: 20px;
  border-radius: 20px;
  padding: 20px 0;
}

.group-recent-post::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #1a1a1a8a;
  /* display: none; */
}

.group-recent-post::-webkit-scrollbar {
  width: 6px;
  background-color: #1a1a1a8a;
  display: none;
}

.group-recent-post::-webkit-scrollbar-thumb {
  background-color: #fff;
  /* border: 2px solid #555555; */
}

.recent-post-list .post {
  margin-bottom: 10px;
  /* padding: 6px 10px; */
  padding: 15px;
  border-bottom: 1px solid #2e2b2b;
}

.recent-post-list .group-feed-media img {
  height: 70px;
  border-radius: 8px;
}

.text-content-post {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 15px;
  color: #666666;
}

.recent-post-list .post:last-child {
  border-bottom: none;
}

.text-content-post {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  /* Show only 3 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative;
}

.text-content-post.expanded {
  -webkit-line-clamp: unset;
}

.read-toggle {
  color: #fff;
  cursor: pointer;
  display: inline-block;
  margin-top: 5px;
}

.group-recent-post h2.create-group-title {
  color: #ffffff;
  font-size: 14px;
}

.has-submenu .submenu-toggle.menu-items {
  display: flex !important;
  justify-content: space-between;
}

ul.submenu.list-unstyled li.group-list {
  color: rgba(255, 255, 255, 0.6);
  margin: 0 5px;
}

ul.submenu.list-unstyled li.group-list a {
  padding: 6px 0 !important;
}

.vote-section.feed-item-points {
  display: flex !important;
  justify-content: space-between;
  width: auto;
  flex-direction: row;
  margin-right: 15px;
  border: 1px solid #666666;
  border-radius: 50px;
  padding: 0px 10px;
  background: #000;
  height: 30px;
}

.vote-section .up.selected img {
  filter: invert(10%) sepia(30%) saturate(320%) hue-rotate(10deg) brightness(109%) contrast(90%);
}

.vote-section .dn.selected img {
  filter: invert(37%) sepia(93%) saturate(7471%) hue-rotate(356deg) brightness(91%) contrast(135%);
}

.vote-section.feed-item-points .pts {
  color: #666666 !important;
}

.sidebar-layout-community .vote-section a img {
  height: 12px;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load {
  border: 1px solid #666666;
  padding: 5px 8px;
  border-radius: 50px;
  background: #000;
  color: #666666 !important;
  height: 30px;
  display: block;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load {
  color: #666666;
}

.count-list span {
  color: #fff;
  font-size: 11px;
  color: #666666;
}

.group_discussion_link,
.group_discussion_link:hover {
  color: #666666;
}

.sidebar-layout-community .feed-section-bg form.feed_comment_form textarea.form-control {
  border: 1px solid #eeeeee6e;
}

.community-textarea {
  overflow: hidden;
  resize: none;
  line-height: 1.5em;
}

.feed-post-time li.only-mobile {
  display: none;
}

@media only screen and (min-width: 300px) and (max-width: 992px) {
  .group-recent-post {
    display: none;
  }

  #sidebar .custom-menu {
    display: none;
  }

  .sidebar-layout-community section.feed-section-bg {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  .sidebar-layout-community section.feed-section-bg-w {
    margin-left: 0;
    margin-right: 0;
    width: 100% !important;
  }

  .upload-community-option span {
    display: none;
  }

  .sidebar-layout-community .feed-section-bg textarea {
    font-size: 11px;
  }

  .vote-section.feed-item-points,
  .sidebar-layout-community .feed-post-time ul li a.comments-load {
    height: 26px;
  }

  .sidebar-layout-community .vote-section a img {
    height: 12px;
  }

.sidebar-layout-community .feed-post-time ul li a.comments-load {
    padding: 2px 15px;
  }
  .community-post-item-image {
    width: 28px !important;
    height: 28px !important;
    max-height: 28px !important;
    min-width: 28px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
  }
  .community-post-item {
    flex-direction: column !important;
    padding: 10px 0 !important;
  }
  .community-post-item > div {
    display: block !important;
    margin-left: 0 !important;
    width: 100% !important;
  }
  .community-post-item > div > a {
    float: left;
    margin-right: 8px;
  }
  .community-post-item-display.community-post-item-display-slider {
    width: 100% !important;
    clear: both;
  }
  .community-post-item-display > p,
  .community-post-item-display.community-post-item-display-slider > p {
    font-size: 14px !important;
    line-height: 28px !important;
    margin: 0 !important;
  }
}

.text-content-post div {
  line-height: 20px;
}

.vote-section.feed-item-points {
  border: 1px solid #2b3236;
  background: #2b3236;
}

.vote-section.feed-item-points .pts {
  color: #fff !important;
  font-weight: bold;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load {
  border: 1px solid #2b3236;
  background: #2b3236;
  color: #fff !important;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load i {
  color: #fff !important;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load {
  color: #fff !important;
  font-weight: bold;
}

.sidebar-layout-community .feed-post-time ul li a.comments-load span {
  color: #fff !important;
  font-weight: bold;
}

.vote-section.feed-item-points a.up img {
  content: url("/front/icon/arrow-white.svg?v1?v1");
  /* Replace with your image URL */
}

/* effect for Downvote icon */
.vote-section.feed-item-points a.dn img {
  content: url("/front/icon/arrow-white.svg?v1?v1");
  /* Replace with your hover image URL */
  transform: rotate(180deg);
}

.logo-color {
  color: #dbe4e8;
}

.h-10 {
  height: 10px;
}

.ml-15 {
  margin-left: 15px;
}

.clear-recent-posts {
  font-size: 12px;
  margin-right: 15px;
  color: #dbe4e7;
  cursor: pointer;
}

.color-666666 {
  color: #666666 !important;
}

.count-list {
  margin-top: 15px;
}

.comment-box {
  display: flex;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #3a3a3a;
  max-width: 100%;
}

.profile-img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 6px;
  margin-right: 10px;
}

.comment {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #2c2c2c;
  border-radius: 6px;
  padding: 10px 15px;
}

.comment-left {
  width: 100%;
}

.comment-left textarea {
  width: 100%;
  min-height: 30px;
  border-radius: 0px !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0px !important;
  border: none;
  border-radius: 4px;
  background-color: #fff;
  font-size: 14px;
  resize: none;
  height: 15px;
  overflow: hidden;
  min-height: 0px !important;
  line-height: 19px;
}

.comment-left textarea:focus {
  outline: none;
}

.comment-left input[type="text"] {
  background: transparent;
  border: none;
  color: #ccc;
  width: 100%;
  font-size: 16px;
  outline: none;
}

.comment-right a {
  color: #aaa;
}

.comment-right {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #aaa;
  font-size: 18px;
}

.comment-right i {
  cursor: pointer;
}

.divider {
  color: #555;
}

.comment-right a {
  display: flex;
  align-items: center;
  color: #aaa;
  text-decoration: none;
  font-size: 14px;
  white-space: nowrap;
}

.comment-right a i {
  margin-right: 6px;
}

.community-post-item {
  padding: 15px;
  border-bottom: 1px solid #2e2b2b;
  padding-bottom: 20px;
}

.community-post-item>div {
  display: flex;
}

.community-post-item>div>div {
  margin-left: 15px;
}

.community-post-item>div>div>p,
.community-post-item>div>div>p>a {
  font-size: 15px;
  color: #bfbfbfff;
  line-height: 19px;
}

.community-post-item>div>div>p>a {
  text-decoration: underline;
}

.community-post-item-image {
  width: 60px;
  max-height: 60px;
  object-fit: fill;
  border-radius: 10px;
}

/* #BFBFBFff */
.community-post-item-display .display-image {
  width: 40px;
  height: 40px;
  object-fit: cover;
}

.community-post-item-display {
  display: flex;
  flex-direction: column;
}

.community-post-item-display>div {
  margin-top: 0px;
  display: flex;
}

.community-post-item-display>div>p,
.community-post-item-display>div>p>a {
  font-size: 15px;
  color: #989898ff;
}

.text-decoration-underline {
  text-decoration: underline;
  color: #555 !important;
  font-size: 12px !important;
}

.community-post-item-display .right-arrow {
  width: 20px;
}

.mt-5-px {
  margin-top: 5px;
}

.custom-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em 0em;
  font-size: 16px;
}

.custom-pagination a,
.custom-pagination .disabled {
  padding: 6px 12px;
  color: #cccccc !important;
  border-radius: 4px;
  text-decoration: none;
}

.custom-pagination .disabled {
  color: #cccccc !important;
  cursor: default;
}

.custom-pagination .separator {
  width: 1px;
  height: 15px;
  background-color: #cccccc !important;
  display: inline-block;
}

.margim-left-140 {
  margin-left: 140px !important;
}

.flex-wrap-wrap {
  flex-wrap: wrap;
}

.main-page-container {
  width: 70% !important;
}

.max-width-90 {
  max-width: 90% !important;
}

@media screen and (min-width: 992px) and (max-width: 1224px) {

  /* CSS for screens between 768px and 1024px */
  .max-width-90 {
    max-width: 70% !important;
  }
}

.custom-container-wrap-remove-width {
  width: unset !important;
}

@media (max-width: 1399px) {
  /* .width-70 {
    width: 70% !important;
  } */
}

.width-70-diff {
  width: 90% !important;
  margin: 0 auto;
}

@media (min-width: 1401px) and (max-width: 1500px) {
  /* Styles for screens between 991px and 1440px */

  .width-70-diff {
    width: 85% !important;
    margin: 0 auto;
  }
}

@media (min-width: 1320px) and (max-width: 1400px) {
  /* Styles for screens between 991px and 1440px */

  .width-70-diff {
    width: 90% !important;
    margin: 0 auto;
  }
}

@media (min-width: 1210px) and (max-width: 1319px) {
  /* Styles for screens between 991px and 1440px */

  .width-70-diff {
    width: 80% !important;
    margin: 0 auto;
  }
}

@media (min-width: 993px) and (max-width: 1209px) {
  /* Styles for screens between 991px and 1440px */

  .width-70-diff {
    width: 70% !important;
    margin: 0 auto;
  }
}

@media (min-width: 991px) and (max-width: 992px) {
  .width-70-diff {
    width: 70% !important;
  }

  .margin-left-275 {
    margin-left: 275px !important;
  }
}

@media (min-width: 1400px) and (max-width:1560px) {
  .common-left-column-upload-images {
    width: calc(100% - 360px);
  }
}

@media (min-width: 991px) and (max-width:1140px) {
  .common-left-column-upload-images {
    width: calc(100% - 260px);
  }

  .common-right-column-upload-images {
    width: 335px;
  }
}

.flex-wrap-1 {
  flex-wrap: wrap;
  gap: 5px;
}

.latest-signup-date {
  border: 1px solid #303030;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  gap: 2em;
  padding: 2em 0em;
}

.latest-signup-date ._date,
.latest-signup-date ._count {
  color: #777;
  font-size: 16px;
}

.container-xxxl {
  max-width: 1520px;
}

.level {
  width: 100%;
  padding: 0.5em;
  background: #1c1c1c;
  color: white;
  border: 1px solid #fef7bf;
  border-radius: 10px;
  text-align: center;
  height: 32px;
}

.feed-box .feed-data {
  padding-top: 0;
}

.feed-box .feed-data {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.feed-box .feed-post-content {
  margin-top: 10px;
}

.feed-post-content {
  font-size: 14px;
}

.rules {
  border: 1px solid #2c2c2c;
  background: #131313;
  padding: 20px;
  font-size: 14px;
  color: #777;
  line-height: 1.5;
}

.rules ul {
  margin: 10px 0;
  padding: 0;
  border: none;
}

.rules a {
  color: inherit;
  text-decoration: underline;
}



@media screen and (min-width: 768px) {
  .only-mobile {
    display: none !important;
  }
  
  .mobile-view {
    display: none;
  }
  

}

.rules-popup {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.rules-popup {
  width: calc(100vw - 20px);
  height: calc(100vh - 120px);
}

.rules-popup {
  background-color: #131313;
  border: 1px solid #2c2c2c;
  border-radius: 20px;
}

.rules-popup .close {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 24px;
  width: 32px;
  height: 32px;
  text-align: center;
  line-height: 32px;
  color: #fff7bf;
  cursor: pointer;
}

.rules-popup .inner {
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}

.rules-popup .inner .rules {
  border: none;
  background-color: transparent;
}

@media (max-width: 768px) {
  .comment-right .labels {
    display: none;
  }
}

.pagination-member nav {
  display: flex;
  justify-content: center;
  padding: 1em;
}

.page-link {
  background: transparent !important;
  border: none;
  color: #909090;
}
.page-link:focus {
  box-shadow:none;
}

.pagination-member .page-item.active {
  background-color: #888888 !important;
  border-radius: 4px;
}


@media (max-width: 395px) {
  .flex-wrap-1 {
    gap: 1px;
  }

  .community-post-item {
    padding: 4px;
  }
 
}

@media screen and (max-width: 768px) {
  .only-desktop {
    display: none !important;
  }
  .middle-section {
    display: flex;
    flex-direction: column-reverse;
  }
  .left-section {
    width: 100% !important;
  }
   .mobile-view {
    display: block;
  }
  .desktop-view {
    display: none;
  }
  
  .right-section {
    width: 100% !important;
  }
}

.mw-1200 {
  max-width: 1200px;
}


.login-new .custom-login-h1 {
  margin-top: 1em;
  color: #B4B4B4;
}

.login-new .custom-login-p {
  font-size: 20px;
  color: #666666;
  margin-bottom: 2em;
}

.text-center {
  text-align: center;
}

.line-height-1_5 {
  line-height: 1.5em;
}

.font-weight-normal {
  font-weight: normal;
}

.border-with-radius {
  border: 1px solid rgb(43, 43, 43);
  border-radius: 10px;
}

.middle-section {
  display: flex;
  gap: 3em;
}

.new-login-form {
  background-color: #000000;

}

.new-login-form-h3 {
  color: #E2E1B6;
  font-size: 22px;
}

.left-section {
  width: 67%;
}

.right-section {
  width: 33%;
}

.new-form-control {
  background-color: #212121 !important;
  color: #fff;
  width: 100%;
  height: 2em;
  border-radius: 0;
  padding: 19px 6px;
  border: 1px solid #444;
  font-size: 14px;
}

/* Override browser autofill */
.new-form-control:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #212121 inset !important;
  -webkit-text-fill-color: #fff !important;
}
.new-form-control::-webkit-input-placeholder { /* Chrome, Safari, Edge */
    color: #4C4C4C;
}
.new-form-control:-ms-input-placeholder { /* IE 10–11 */
    color: #4C4C4C;
}
.new-form-control::placeholder { /* Modern browsers */
    color: #4C4C4C;
}

.square {
  border: none;
  padding: 1em;
}

.submit-btns {
  gap: 1em;
}

.btn-red {
  background: #8b0000;
  color: white;
  font-size: 13px;
}

.btn-outline {
  font-size: 13px;
  border: 1px solid rgb(43, 43, 43);
  background: #000000;
  color: white;
}

.right-upper-section {
  padding: 2em;
  display: flex;
  flex-direction: column;
  gap: 1.5em;
}

.right-lower-section {
  padding: 0 2em;
  display: flex;
  flex-direction: column;
  gap: 1.5em;
}

.p-1 {
  padding: 1rem;
}

.mt-50 {
  margin-top: 0.5rem;
}

.register-btn {
  margin-bottom: 2em;
  width: 50%;
}
.community-post-item:last-child {
    border-bottom: none;
}
.new-form-control:focus {
    outline: none; /* removes the blue glow in most browsers */
    box-shadow: none; /* some frameworks (like Bootstrap) add shadows */
}

/* Loader */
 .loadertwo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  .loadertwo__dot {
    width: 10px;
    height: 10px;
    background: #b7b7b8;
    border-radius: 50%;
    animation: bounce 0.6s ease-in-out infinite;
  }

  .loadertwo__dot:nth-child(2) { animation-delay: 0.1s; }
  .loadertwo__dot:nth-child(3) { animation-delay: 0.2s; }

  @keyframes bounce {
    0%, 80%, 100% { transform: translateY(0);     opacity: 0.6; }
    40%           { transform: translateY(-8px);  opacity: 1;   }
  }

/* ============ EXPOSED PAGE - Reddit-style image cards ============ */
.video-inner-box img,
.video-inner-box video {
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.15);
    transition: border-color 0.15s;
}
.video-inner-box:hover img,
.video-inner-box:hover video {
    border-color: rgba(255,255,255,0.3);
}
.video-items-box {
    border-radius: 8px;
    overflow: hidden;
}

/* Truncate group descriptions to one line on profiles */
.group-box .comment-description {
    display: -webkit-box !important;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-height: 1.5em !important;
    line-height: 1.5 !important;
}

/* Role truncation - single line */
.user-role-value { overflow: hidden !important; white-space: nowrap !important; text-overflow: ellipsis !important; max-width: 220px !important; display: inline-block !important; vertical-align: middle !important; }
.user-role-value br { display: none !important; }

/* Constrain tall images in discussions */
.topic-content-body .blurr {
    max-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.topic-content-body .blurr .foreground {
    max-height: 500px;
    object-fit: contain;
}
.topic-content-body .blurr .background {
    max-height: 500px;
}

/* Mobile fix for topics and kink pages */
@media(max-width:768px){
    .sidebar-layout-community{display:block !important;width:100% !important}
    #sidebar,.custom-menu,.sidebar-overlay{display:none !important}
    .container-fluid,.container-xl{max-width:100% !important;width:100% !important;padding:0 8px !important;overflow:hidden !important;box-sizing:border-box !important}
    .feed-section-bg-w{width:100% !important;padding:0 !important}
    .topics-item-box,.blog-entry-box{max-width:100% !important;overflow:hidden !important;box-sizing:border-box !important;word-wrap:break-word !important}
    .topic-footer-info{flex-wrap:wrap !important;font-size:12px !important}
    .group-discussion-bg{padding:0 !important;overflow:hidden !important}
    .casualencounters-w-wrap{padding:0 !important;overflow:hidden !important}
    .wearmyboobs-banner,.ad-banner,.top-message{display:none !important}
    .menu-group,.icons-menu-group,.footer-menu{display:none !important}
}

/* Profile page full width on mobile */
@media(max-width:768px){
    .sidebar-layout-community-profile .max-width-90{max-width:100% !important;padding:0 !important}
    .sidebar-layout-community-profile .container-xl{padding:0 !important}
    .sidebar-layout-community-profile .ban-wrap{padding:0 !important}
    .sidebar-layout-community-profile .profile-wide{padding:0 !important;border-radius:0 !important}
    .sidebar-layout-community-profile .profile-block{border-radius:0 !important}
}

/* Profile card full-width on mobile */
@media(max-width:768px){
    section.profile-page-bg > .container-xl > .profile-row > .profile-wide{border:none !important;border-radius:0 !important;padding:0 !important}
}

/* ============================================
   SIDEBAR MENU LEGIBILITY (added 2026-05-26)
   Bumps main + submenu items from 14px → 15px
   ============================================ */
a.menu-items,
#sidebar a.menu-items {
  font-size: 15px;
  padding: 7px 5px;
}

#sidebar ul li > ul li {
  font-size: 15px;
}

ul.submenu.list-unstyled li.group-list a {
  font-size: 15px;
  padding: 8px 0 !important;
}

@media screen and (min-width: 768px) {
  a.menu-items {
    font-size: 15px;
  }
}