:root {
  --wn-border-color: var(--wn-border-color);
  --wn-bg-color:var(--wn-border-color);
}

/* ul {
  & li {
    list-style: none;
    background-image: url(https://www.aemps.gob.es/assets/icons/listas/li-00.svg);
    background-size: 10px;
    background-repeat: no-repeat;
    background-position-y: 6px;
    padding-left: 20px;
  }
} */

.aemps-aviso__01,
.aemps-aviso__02,
.aemps-aviso__03 {
  padding: 1rem 2rem;
  margin: 1rem 0;
  ul {
    & li {
      list-style: none;
      background-image: url(https://www.aemps.gob.es/assets/icons/listas/li-00.svg);
      background-size: 10px;
      background-repeat: no-repeat;
      background-position-y: 6px;
      padding-left: 20px;

      & ul li {
        background-image: url(https://www.aemps.gob.es/assets/icons/listas/li-03.svg);
      }
    }
  }
}

.aemps-aviso__01 {
  outline: solid 1px var(--tertiary-color);
  border-radius: 8px;

  & li,p {
    font-weight: var(--p-bold);
  }
}

/* Aviso antiguo para notas informativas */
.aemps-aviso__02 {
  background-color: var(--lightest-tertiary);
  outline: solid 1px var(--lighter-tertiary);

  & li, p {
    font-weight: var(--p-bold);
    list-style: none;
    background-image: url(https://www.aemps.gob.es/assets/icons/listas/li-nota.svg);
    background-size: 10px;
    background-repeat: no-repeat;
    background-position-y: 6px;
    padding-left: 20px;
  }
}

.aemps-aviso__03 {
  outline: solid 1px var(--lightest-secondary);
  border-radius: 8px;
  background-color: var(--lightest-bg);

  & li, p {
    font-weight: var(--p-bold);
  }
}

.aemps-aviso__errata,
.aemps-aviso__destacado {
  padding: 1rem;
  outline: solid 1px var(--lightest-secondary);
  background-color: var(--lightest-bg);
  border-radius: 8px;
  margin: 1rem 0;
}
.errata,
.destacado {
  display: flex;
  align-items: center;
}
.errata .img-errata,
.destacado .img-destacado {
  width: 80px;
  max-width: 80px;
  margin-right: 20px;
}
.errata p,
.destacado p {
  font-size: var(--p-size);
  line-height: var(--p-line-height);
  font-weight: var(--p-bold);
}

.aemps-aviso__01 ol.lista-ordenada, 
.aemps-aviso__02 ol.lista-ordenada,
.aemps-aviso__03 ol.lista-ordenada {
  padding-inline-start: 1rem;
}

.aemps-aviso__03:has(.info-title) {
  margin-top: 2rem;
}
.info-title {
  display: flex;
  align-items: center;
  border-bottom: 1px dashed var(--lighter-secondary);
  padding-bottom: 0.75rem;
  margin-bottom: 1rem;
}
.info-title img {
  width: 44px;
  margin-right: 1rem;
}
.info-title p {
  color: var(--h3-color); 
  font-size: var(--h4-size);
  line-height: var(--h4-line-height);
  font-weight: 700;
}
.notifica-title img {
  /*height: 1.8rem;*/
  height: 4rem;
}
.notifica-title {
  margin: 2rem 0 .4rem;
}
.notifica-box {
  padding: 1rem 2rem;
  margin: 0 0 1rem;
  background-color: var(--lightest-tertiary);
  border-radius: 8px;
  outline: solid 1px var(--lighter-tertiary);
  outline-offset: -1px;
}

/* Destacados duales */ 

.aemps-aviso-dual_container {
  display: flex;
  gap: 1.5rem;

  & 
  div.aemps-aviso__01,
  div.aemps-aviso__02, 
  div.aemps-aviso__03 {
    width: 100%;
    min-width: 300px;
  }
}

/* Cuando hay dos destacados duales, uno encima del otro */

@media only screen and (min-width: 768px) {
  .aemps-aviso-dual_container + .aemps-aviso-dual_container {
    & :first-child {
    margin-top: .5rem;
    }
    
    & 
    div.aemps-aviso__01,
    div.aemps-aviso__02, 
    div.aemps-aviso__03 {
      margin: .5rem 0 1rem 0; /* Corrección visual. La clase original es margin: 1rem 0; */
    }
  }
}

@media only screen and (max-width: 768px) {
  .errata,
  .destacado {
    display: inline;
    text-align: center;
    & p {
      text-align: left;
    }
  }
  .aemps-aviso-dual_container {
    display: inline; /* Los destacados duales se acomodan uno encima del otro */
  }
}

