.catalog-container {
  /* Fondo general */
  background-color: #f9f9f9;
}

.sidebar h2,
.sidebar h3 {
  font-weight: 600;
}

.sidebar .form-check {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sidebar ul li {
  margin-bottom: 6px;
}
.filter-block.collapsed .unstyled.list {
  display: none;
}
.filter-block .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.load-more-btn {
  display: inline-block;
  margin-top: 8px;
  font-size: 14px;
  color: #000;
  text-decoration: underline;
  cursor: pointer;
}

.filter-block h4{
  color: black;
  font-weight: 500;
}

.filter-block h5{
  color: #000000;
  font-weight: 500;
}
.unstyled.list{
  padding-left: 0;
  list-style: none;
  margin-bottom: 0;
}
.filters .filter-block .list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.filter-checkbox label{
  position: relative;
  cursor: pointer;
  color: #7A7F85;
  font-weight: 400;
  font-size: 16px;
  line-height: 130%;
  margin: 0;
}
.filter-checkbox label:before {
    content: "";
    -webkit-appearance: none;
    background: transparent;
    border: 1px solid #16191A;
    border-radius: 3px;
    width: 16px;
    height: 16px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 8px;
    margin-top: -3px;
}
.filter-checkbox input:checked + label:after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    left: 5px;
    width: 5px;
    height: 12px;
    z-index: 10;
    border: solid #16191A;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.filter-checkbox input{
  padding: 0;
  display: none;
  border: 1px solid #16191A;
  cursor: pointer;
}
.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 13px;
  text-align: left;
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  color: #000000;
  text-decoration: none;
}
/**/
.product-list-card{
  margin-bottom: 24px;
  padding: 24px;
  background: #F3F3F7;
  border-radius: 20px;
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.04), 1px 1px 2px 0px rgba(0, 0, 0, 0.04), 4px 3px 4px 0px rgba(0, 0, 0, 0.03), 8px 6px 6px 0px rgba(0, 0, 0, 0.02), 14px 11px 7px 0px rgba(0, 0, 0, 0.01), 22px 17px 8px 0px rgba(0, 0, 0, 0);
}
.image-block img{
  border-radius: 15px;
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.04), 1px 1px 2px 0px rgba(0, 0, 0, 0.04), 4px 3px 4px 0px rgba(0, 0, 0, 0.03), 8px 6px 6px 0px rgba(0, 0, 0, 0.02), 14px 11px 7px 0px rgba(0, 0, 0, 0.01), 22px 17px 8px 0px rgba(0, 0, 0, 0);
  width: 100%;
  object-fit: cover;
}
.content-block{
  height: 100%;
  align-content: center;
}
.content-block h2{
  font-weight: 500;
  font-style: normal;
  font-size: 14px;
  line-height: 120%;
  letter-spacing: -0.27px;
  color: #696969;
  margin: 0;
}
.content-block h3{
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: -0.27px;
}
.content-block h3 a{
  color: black;
  font-size: 16px;
}
.content-block h6{
  font-weight: 500;
  font-size: 13px;
  color: black;
  margin-bottom: .5rem;
  width: 100%;
}
.content-block a{
  color: #002c84;
  font-size: 14px;
}
.dark-gray{
  color: #7A7F85 !important;
  font-weight: 500;
  font-size: 13px;
  margin: 0;

  line-height: 1.4em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
/*FILTROS*/
.btn-outline-dark{
  float: right;
}
.btn-outline-dark:hover {
    color: #ffffff;
    background-color: #002c84;
    border-color: #002c84;
}
.filter-panel-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.4);
  z-index: 999;
  display: none;
}
.filter-panel {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  max-width: 400px;
  height: 100vh;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  z-index: 1000;
  box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1);
  transition: right 0.3s ease-in-out;
}
.filter-panel.active {
  right: 0;
}
.filter-panel-header {
  padding: 16px;
  border-bottom: 1px solid #ddd;
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.filter-panel-header h5 {
  font-size: 18px;
  color: #000000;
  margin: 0;
}
.filter-panel-header .close {
  font-size: 24px;
  background: none;
  border: none;
  cursor: pointer;
}
.filter-panel-body {
  padding: 16px;
  overflow-y: auto;
  flex-grow: 1;
}
.filter-panel-footer {
  padding: 16px;
  border-top: 1px solid #ddd;
  background-color: #fff;
  flex-shrink: 0;
  text-align: right;
}
.filter-block {
  margin-bottom: 24px;
}
.filter-block .title h5 {
  font-size: 16px;
  margin-bottom: 8px;
}
.filter-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
}
.filter-checkbox input[type="checkbox"] {
  transform: scale(1.2);
}
.dark-gray {
  color: #666;
  font-size: 14px;
  margin-left: 8px;
  display: inline-block;
}
.mb-16 {
  margin-bottom: 16px;
}
.mb-32 {
  margin-bottom: 32px;
}
.load-more-btn {
  display: block;
  margin-top: 10px;
  color: #007BFF;
  text-decoration: none;
  font-size: 14px;
}
.filter-panel-footer button {
  background: #002c84;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 50px;
  cursor: pointer;
  width: 100%;
  transition: background 0.3s ease;
}
.filter-panel-footer button:hover {
  opacity: 0.9;
}
.unstyled.list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#btnCargarMas{
  width: 100%;
}
/**/
@media (max-width: 992px) {
  .sidebar-container {
    display: none;
  }
}
@media (max-width: 768px) {
  .product-list-card {
    padding: 16px;
  }

  .content-block h3 {
    font-size: 18px;
  }

  .content-block h2,
  .content-block h6 {
    font-size: 12px;
  }

  .content-block a {
    font-size: 13px;
  }

  .image-block img {
    max-width: 100px;
    height: auto;
  }

  .filter-block .title h5 {
    font-size: 16px;
  }

  .sidebar .form-control {
    font-size: 14px;
  }

  .filter-checkbox label {
    font-size: 14px;
  }
}

@media (max-width: 576px) {
  .product-list-card .row {
    flex-wrap: nowrap;
  }

  .image-block {
    margin-bottom: 0;
  }

  .image-block img {
    width: 100%;
    height: auto;
  }

  .content-block {
    flex: 1;
    padding-left: 10px;
  }
  .sidebar {
    overflow-x: auto;
    max-width: 100%;
  }
}
