// main: style.less

.site-footer {
  width: 100%;
  padding: 60px 0;
  background: @footer_bg;
  background: var(--footer_bg);
  color: @footer_color;
  color: var(--footer_color);
  box-shadow: @shadow;
  box-shadow: var(--shadow);

  .widgets-area {
    width: 90%;
    max-width: 1260px;
    margin: auto;
    display: flex;

    @media screen and (max-width: @tablet) {
      display: block;
      width: 100%;
    }

    .widgets-column {
      flex: 1;
      padding: 0px 20px;
      box-sizing: border-box;

      .widget-title {
        font-weight: 400;
        font-size: 22px;
        //font-family: var(--fjalla);
      }

      ul {
        margin: 0;
        padding: 0;

        li {
          list-style: none;
        }
      }

      .tagcloud {

        a {
          font-size: 16px !important;
          color: @tag_color;
          color: var(--tag_color);
          border: 1px solid @tag_color;
          border: 1px solid var(--tag_color);
          padding: 5px 8px;
          line-height: 38px;
          white-space: nowrap;

          &:hover {
            color: @tag_hover_color;
            color: var(--tag_hover_color);
            border: 1px solid @tag_hover_color;
            border: 1px solid var(--tag_hover_color);
          }
        }
      }

      .widget_search {

        .search-form {
          position: relative;

          .search-field {
            width: 100%;
            border-radius: 30px;
            line-height: 20px;
            padding: 10px 20px;
            border: none;
            outline: none;
            color: @search_widget_color;
            color: var(--search_widget_color);
            background: @search_widget_bg;
            background: var(--search_widget_bg);
            transition: .1s;

            &:focus {
              box-shadow: @shadow;
              box-shadow: var(--shadow);
              transition: .1s;
            }
          }

          svg {
            position: absolute;
            top: 7px;
            right: 15px;
            stroke: @search_widget_color;
            stroke: var(--search_widget_color);
            cursor: pointer;
          }

          .hidden-submit {
            display: none;
          }
        }
      }
    }
  }

  .copyright-area {
    text-align: center;
    font-size: 14px;
    opacity: .6;
  }
}

.scroll-back-to-top-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: @card_bg;
  background: var(--card_bg);
  border-radius: 6px;
  width: 50px;
  height: 50px;
  box-shadow: @shadow;
  box-shadow: var(--shadow);
  transition: .1s;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  visibility: hidden;
  opacity: 0;

  svg {
    stroke: @card_color;
    stroke: var(--card_color);
  }

  &:hover {
    box-shadow: @deeper_shadow;
    box-shadow: var(--deeper_shadow);
    transition: .1s;
  }

  &.visible {
    visibility: visible;
    opacity: 1;
    transition: .3s;
  }
}