@import "@picocss/pico/scss/variables";
@import "@picocss/pico/scss/themes/default";
@import "@picocss/pico/scss/layout/container";
@import "@picocss/pico/scss/layout/grid";
@import "@picocss/pico/scss/content/form";
@import "@picocss/pico/scss/components/card";
@import "@picocss/pico/scss/utilities/loading";

h1,
h2,
h3,
h4,
h5,
h6 {
  --font-weight: 500;
}

.settings_page_fuzion #wpcontent {
  padding: 0;
}

.ai-wrap {
  @import "@picocss/pico/scss/content/typography";
  @import "@picocss/pico/scss/content/button";
  @import "@picocss/pico/scss/content/table";
  @import "@picocss/pico/scss/utilities/tooltip";

  .notice {
    padding: 10px 0 10px 20px;

    & > p {
      margin: 0;
      font-size: 15px;
    }

    // Ajax notice.
    &#ai-ajax-notice {
      display: none;
      small { display: block; }
    }
  }

  .ai-header {
    background: #fff;
    padding: 0 20px;
    height: 60px;
    border-bottom: 1px solid #ebebeb;
    box-shadow: 0 0 6px -2px rgba(0,0,0,0.1);
    top: 32px;
    left: 160px;
    z-index: 100;
    right: 0;

    h1 {
      line-height: 60px;
    }
  }

  & > .container {
    margin-top: 50px;

    // Top notice on account page.
    & > .notice { margin: 0; }
  }

  article {
    padding: 3rem;

    & > p {
      font-size: 16px;
    }

    hgroup h2 {
      margin-bottom: 15px;
    }

    form,
    button[type=submit],
    & > p:last-of-type {
      margin-bottom: 0;
    }

    /**
     * Form errors.
     */
    small.form-error {
      display: block;
      font-size: 15px;
      margin: -10px 0 var(--spacing);
      color: #DC3232;
    }

    /**
     * Overwrite notice styles.
     */
    .notice {
      margin: 0 0 20px;
    }

    .ai-active-sub-notice {
      background-color: #00a32a;
      border-radius: var(--border-radius);
      border: 0;
      p { color: #fff; }
    }

    .ai-buttons {
      display: flex;
      justify-content: space-between;
    }

    .ai-stats-update {
      text-align: center;
      font-size: 14px;
    }
  }
}

