[data-component-id="tec_prepa:article"] {
  .content-article {
    padding: 16px;

    & .article-content-cols {
      display: flex;
      flex-direction: column;
      gap: 16px;

      .ckeditor {
        p, h2, h3, h4, h5, h6 {
          color: #030219;

          em, strong, span {
            color: #030219;
          }
        }

        ul, ol {
          li {
            color: #030219;
          }
        }
      }

      .author{
        margin-top: 16px !important;
        border-radius: 24px;
        background: var(--Base-Verde-Claro, #CFE253);
        display: grid;
        padding: 16px;
        gap: 16px;

        * + * {
          margin-top: 0;
        }

        & .image{
          & img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            overflow: hidden;
            margin: 0;
            padding: 0;
            object-fit: cover;
          }
        }

        & .content{
          & p{
            color: var(--Base-Midnight, #030219);
            font-family: "DM Sans";
            font-size: 12px;
            font-style: normal;
            font-weight: 400;
            line-height: 18px; /* 150% */
          }

          & .block-social{
            display: grid;
            gap: 8px;

            & .content-social{
              display: flex;
              flex-direction: row;
              gap: 16px;
              margin-top: 0;

              & a {
                display: flex;
                margin-top: 0;
                width: 48px;
                height: 48px;
                justify-content: center;
                align-items: center;

                & svg {
                  width: 38px;
                  height: 38px;

                  & path {
                    fill: #030219;
                  }
                }
              }
            }
          }

          * + * {
            margin-top: 4px;
          }
        }
      }

      & .addtoany-block-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 16px;
      }
    }
  }
}

@media screen and (min-width: 768px) {
  [data-component-id="tec_prepa:article"] {
    .content-article {
      & .article-content-cols {
        flex-wrap: wrap;
        flex-direction: row;

        > .ckeditor {
          order: 1;
          width: calc(100% - 228px - 16px);
        }

        .sidebar-right {
          order: 2;
          width: 228px;
        }

        .like-dislike-block {
          order: 3;
          width: 100%;
        }
      }
    }
  }
}

@media screen and (min-width: 1024px) {
  [data-component-id="tec_prepa:article"] {
    .content-article {
      padding: 32px 64px;
    }
  }
}

@media screen and (min-width: 1280px) {
  [data-component-id="tec_prepa:article"] {
    .content-article {
      padding: 48px 96px;

      & .article-content-cols {
        gap: 48px;

        & .addtoany-block-wrapper {
          gap: 32px;
        }

        .ckeditor {
          width: calc(100% - 328px - 48px);
        }

        .author{
          margin-top: 32px !important;
          grid-template-columns: 50px 1fr;
          padding: 32px;
        }

        .sidebar-right {
          width: 328px;
        }
      }
    }
  }
}
