@import '../variables';
@import '../components/buttons';

.ltag__wikipedia--container {
  border: 1px solid var(--form-border);
  box-shadow: var(--shadow-smooth);
  border-radius: var(--radius-auto);
  margin: 1.1em auto 1.3em;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial,
    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  overflow: hidden;
  padding-top: 1rem;

  .ltag__wikipedia--header {
    font-weight: var(--fw-normal);
    font-size: var(--fs-xl);
    line-height: var(--lh-base);
    margin: 0em 0 0.5em;
    padding: 0 var(--su-5);

    > a {
      color: var(--link-branded-color);
    }

    .ltag__wikipedia--logo {
      width: 1.15em;
      max-width: 1.1em;
      display: inline-block;
      left: 0;
      margin: 0 var(--su-2) 0 0;
      vertical-align: middle;
      filter: invert(0);
      filter: var(--theme-social-icon-invert, invert(0));
    }
  }

  .ltag__wikipedia--extract {
    font-weight: var(--fw-normal);
    margin: 0;
    margin-left: 0.15em;
    font-size: var(--fs-s);
    line-height: var(--lh-base);
    padding: 0 var(--su-5);
  }

  .ltag__wikipedia--btn--container {
    padding: 1rem;
    z-index: var(--z-elevate);
    text-align: center;
    position: relative;
    box-shadow: 0px 0px 60px 42px #fff;
    box-shadow: 0px 0px 60px 42px var(--theme-container-background, #fff);
  }

  .ltag__wikipedia--btn {
    @extend .crayons-btn;
    @extend .crayons-btn--secondary;

    > a,
    > a:hover {
      color: var(--button-secondary-color);
    }
  }
}
