/*
Theme Name: Cvirtualstaging
Version: 1.0.1
Text Domain: cvirtualstaging
*/

/* Custom CSS Overrides to Match Original HTML Template */

/* Fix Logo Size - Match Original Template (139px x 40px) */
.ot-main-logo img {
  max-width: 139px !important;
  height: auto !important;
  width: auto !important;
}

/* Ensure Header is Fully Transparent */
.header-transparent {
  background-color: transparent !important;
  background: transparent !important;
}

/* Ensure header stays transparent even on scroll */
.ot-header-area {
  background-color: transparent !important;
}
/* Sidebar Icon Fixes: Explicitly size icons and colorize white SVGs */
.service-widget-list ul li a .service-widget-list-icon img {
  width: 30px;
  height: auto;
  /* Transformation: White -> Black -> Theme Orange (#FF8800 approx) */
  filter: brightness(0) saturate(100%) invert(53%) sepia(63%) saturate(3020%)
    hue-rotate(360deg) brightness(102%) contrast(105%);
  transition: all 0.3s ease-out;
}

/* Active State: Match Hover Style */
.service-widget-list ul li a.active {
  color: var(--ot-white-color) !important;
  background: var(--ot-theme-color) !important;
  border-color: var(--ot-theme-color) !important;
}

/* Hover & Active State for Icons: Make them White */
.service-widget-list ul li a:hover .service-widget-list-icon img,
.service-widget-list ul li a.active .service-widget-list-icon img {
  filter: brightness(0) saturate(100%) invert(1) !important;
}

.ot-blog-details-area .blog-details-wrapp .row > [class*="col-xl-"] {
  min-width: 0;
}
.ot-blog-details-area .postbox-details-wrapper img {
  max-width: 100%;
  height: auto;
}
.ot-blog-details-area .postbox-details-wrapper iframe,
.ot-blog-details-area .postbox-details-wrapper video {
  max-width: 100%;
}
@media (min-width: 992px) {
  .ot-blog-details-area .blog-details-wrapp .row > .col-xl-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .ot-blog-details-area .blog-details-wrapp .row > .col-xl-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
}

.postbox-details-comments .comment-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.postbox-details-comments .comment-list > .comment {
  margin-bottom: 0;
  padding: 0;
}
.postbox-details-comments .comment-body {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  padding: 24px 28px;
  margin-bottom: 16px;
  background: #fff;
  border: 1px solid #e8e9ed;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.postbox-details-comments .cvs-comment-avatar {
  flex: 0 0 56px;
}
.postbox-details-comments .cvs-comment-avatar img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: block;
}
.postbox-details-comments .cvs-comment-main {
  flex: 1 1 auto;
  min-width: 0;
}
.postbox-details-comments .cvs-comment-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.postbox-details-comments .cvs-comment-author {
  font-weight: 600;
  font-size: 16px;
  color: var(--ot-title-color);
}
.postbox-details-comments .cvs-comment-author a {
  color: inherit;
}
.postbox-details-comments .cvs-comment-meta {
  font-size: 13px;
  color: #6b7280;
  white-space: nowrap;
}
.postbox-details-comments .cvs-comment-meta a {
  color: #6b7280;
}
.postbox-details-comments .comment-content,
.postbox-details-comments .comment-body > p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ot-body-color);
}
.postbox-details-comments .comment-content p,
.postbox-details-comments .comment-body > p {
  margin-bottom: 0;
}
.postbox-details-comments .comment-content {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.postbox-details-comments .comment-awaiting-moderation {
  font-size: 13px;
  color: var(--ot-theme-color);
  font-style: italic;
  margin-bottom: 8px;
  display: block;
}
.postbox-details-comments .reply {
  margin-top: 12px;
}
.postbox-details-comments .reply a {
  font-size: 14px;
  font-weight: 500;
  color: var(--ot-theme-color);
}
.postbox-details-comments .reply a:hover {
  text-decoration: underline;
}
/* Comment form – nền form rõ hơn */
.postbox-details-form {
  background: #f8f9fc !important;
  border: 1px solid #e8e9ed;
}
.postbox-details-form .postbox-details-input input,
.postbox-details-form .postbox-details-input textarea {
  border: 1px solid #e0e1e9;
}
.postbox-details-form .postbox-details-input input:focus,
.postbox-details-form .postbox-details-input textarea:focus {
  border-color: var(--ot-theme-color);
  outline: none;
}
