/**
 * Components: Block
 *
 * An individual block displayed on the details page.
 */

.block-controller-block {

  background: var(--bc-white);
  border: 1px solid var(--bc-gray);
  border-radius: 0.15rem;
  box-shadow: var(--bc-gray) 0 1px;
  margin-block: 2rem;


  /*
   * Heading.
   */

  &-heading {
    border-block-end: 1px solid var(--bc-gray);
    padding-block: 0.5rem;
    padding-inline: 1rem;
    position: relative;

    // Heading text.
    legend,
    h2 {
      font-size: var(--bc-font-size-h2);
      font-weight: normal;
      margin-block: 0.2rem;
    }
  }


  /*
   * Block of options.
   */

  &-options {
    padding-block: 2rem;
    padding-inline: 1rem;

    p {
      margin-block-end: 1.5rem;
      margin-block-start: 0;
    }

    // Label for an individual block.
    label {
      cursor: default;
      display: block;
      font-size: var(--bc-font-size-p-smaller);
      margin-block-end: 1.2rem;
    }

    // Counter text for blocks that exist at least once on the site.
    .count {
      display: inline-block;
      font-size: var(--bc-font-size-p-smaller);
      margin-inline-start: 0.5rem;

      a {
        color: var(--bc-red);

        &:focus,
        &:hover {
          text-decoration: none;
        }
      }
    }
  }

}