/* header changes */
.app-header-container {
    background-color: #121212 !important;
    border-bottom-color: #121212 !important;

    .separator-custom-line {
        border-right: 1px solid #a5a5a5 !important;
    }

    .brand-name {
        color: #a5a5a5 !important;
    }

    .ticket-support {
        color: #a5a5a5 !important;
    }

    .ticket-support:hover {
        color: #ffffff !important;
    }

    .active-tab {
        color: #a5a5a5 !important;

        .item-indicator {
            border-bottom: 2px solid #a5a5a5 !important;
        }
    }

    .active-tab:hover {
        color: #ffffff !important;

        .item-indicator {
            border-bottom: 2px solid #ffffff !important;
        }
    }

    .language-container {
        .bd-icon-globe {
            color: #a5a5a5 !important;
        }

        .language-content {
            color: #a5a5a5 !important;
        }

        .bd-icon-arrowdown {
            color: #a5a5a5 !important;
        }
    }

    .search-ticket {
        .e-input-group-icon {
            color: #a5a5a5 !important;
        }
    }

    /* create ticket button */
    .create-new-ticket {
        .e-btn {
            background: #121212 !important;
            border-color: #a5a5a5 !important;
            color: #a5a5a5 !important;
            border: solid 2px !important;
        }

        .link {
            color: #a5a5a5 !important;
        }
    }

    .create-new-ticket:hover {
        .e-btn {
            background: #121212 !important;
            border-color: #ffffff !important;
            color: #ffffff !important;
            border-width: 2px !important;
        }

        .link {
            color: #ffffff !important;
        }
    }

    /* profile button */
    .custom-img {
        background-color: #121212 !important;
        border-color: #a5a5a5 !important;
        border-width: 2px !important;
    }

    .profile-name-text {
        color: #a5a5a5 !important;
    }

    .profile-img-container:hover {
        background: #121212 !important;

        .custom-img {
            background-color: #121212 !important;
            border-color: #ffffff !important;
            border-width: 2px !important;
        }

        .profile-name-text {
            color: #ffffff !important;
        }
    }
}

@media (min-width: 1400px) {
    .app-header-container .header {
        margin: 0 0 !important;
        max-width: 95% !important;
    }
}

@media (min-width: 1400px) {
    .article-detail-container {
        max-width: 95% !important;
    }
}

@media (min-width: 1300px) {
    .article-list-container {
        max-width: 95% !important;
    }
#category_container{
position: relative;
}
}

@media (min-width: 1360px) {
    html body #kb-listpage {
        margin: 0 auto !important;
        max-width: 95% !important;
    }
}
/* Custom blocks container */
#customBlockContainer {
  display: flex;
  flex-wrap: wrap; /* Allow blocks to wrap on smaller screens */
  justify-content: space-between; /* Evenly distribute the blocks */
  gap: 20px; /* Space between the blocks */
  margin: 0;
  padding: 20px;
  width: 100% !important;
transform: translateY(-80%);
}
.custom-block-list{
width: inherit;
padding-left: 150px;
padding-right: 150px;
}

/* Individual block styling */
.custom-block-item {
  display: flex;
  flex-direction: column; /* Stack the image and title vertically */
  align-items: center; /* Center the content */
  justify-content: center;
  width: 100%;
  max-width: 30%
  margin-bottom: 20px; /* Space between blocks */
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 8px; /* Rounded corners */
  background-color: white; /* White background */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Light shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.custom-block-item:hover {
  transform: translateY(-10px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

/* Block image styling */
.custom-block-image {
  margin-top: 16px;
  margin-bottom: 8px;
  height: 30px; /* Set the image height to 30px */
  width: auto; /* Keep the aspect ratio */
  object-fit: contain; /* Prevent image distortion */
}

/* Title styling */
.custom-block-title {
  font-size: 18px;
  color: black;
  text-align: center;
  font-weight: bold; /* Bold the titles */
  margin-top: 8px; /* Space between image and text */
}

/* Mobile screen styles */
@media (max-width: 812px) {
  #customBlockContainer {
    flex-direction: column;
    align-items: center; /* Center blocks */
transform: translateY(-25%);
  }

  .custom-block-item {
    max-width: 100%; /* Full width on mobile */
    margin-bottom: 16px; /* Adjust margin for better spacing */
  }
}

/* Optional: Hover effect for blocks */
.custom-block-card:hover {
  background-color: #f0f0f0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); 
}
.custom-block-card{
    width: inherit;
}

#no-category-found-container{
 display:none;
}
#brand-separator{
 display:none;
}