.system_info-intel_form {
  background: var(--alt-bg);
  margin-bottom: 0.5rem;

  > form {
    > input[type=radio] {
      display: none;
    }

    label {
      display: block;
      font-weight: bold;
      width: 100%;
    }

    input[type=text], input[type=number], input[type=url], textarea {
      width: 100%;
      background: var(--bg);
      color: var(--font);
      border: none;
      outline: none;
      padding: 0.25rem;

      &:focus {
        border: none;
        outline: none;
      }
    }

    select {
      width: 100%;
      border: none;
      outline: none;
      background: var(--bg);
      color: var(--font);
      padding: 0.25rem;
    }

    .structure_name, .drifter_type, .link_text, .link_url {
      flex-grow: 1;
    }
  }

  label.tab {
    padding: 0.25rem 0.5rem;
    font-weight: bold;
    display: flex;
    gap: 0.25rem;
    align-items: center;
    background: var(--bg);
    cursor: pointer;

    .icon {
      width: 1.25rem;
      height: 1.25rem;
    }
  }

  .pane {
    display: none;
    padding: 0.5rem;
    gap: 0.5rem;
  }

  .flares {
    display: flex;
    gap: 0.5rem;
    padding: 0 0.5rem 0.5rem;

    input[type='radio'] {
      display: none;

      &:checked ~ span {
        color: var(--bg);
      }
    }

    label:first-child {
      width: auto;
      padding: 0.25rem 0.5rem;
    }

    label:not(:first-child) {
      cursor: pointer;
    }

    span {
      display: inline-block;
      padding: 0.25rem 0.5rem;
      text-align: center;
      width: 100%;
    }

    #flare-no:checked ~ span {
      background: var(--font);
    }

    #flare-danger:checked ~ span {
      background: var(--flare-danger);
    }

    #flare-caution:checked ~ span {
      background: var(--flare-caution);
    }

    #flare-bounty:checked ~ span {
      background: var(--flare-bounty);
    }

    #flare-target:checked ~ span {
      background: var(--flare-target);
    }
  }

  .intel_types {
    display: flex;
  }

  .body {
    textarea {
      resize: none;
      width: 100%;
    }
  }

  .actions {
    display: flex;
    gap: 1rem;
    padding: 0.5rem 0.5rem;
    justify-content: space-between;

    a:link, a:visited {
      background: var(--font);
      color: var(--bg);
      padding: 0.25rem 1rem;
    }

    input[type='submit'] {
      appearance: none;
      padding: 0.25rem 1rem;
      font-family: inherit;
      font-size: inherit;
      font-weight: 700;
      line-height: inherit;
      background: var(--info);
      border: none;
      cursor: pointer;
    }
  }

  #intel-note:checked {
    & ~ .intel_types .tab[for='intel-note'] { background: var(--alt-bg); }
    & ~ .body { display: flex; }
  }

  #intel-dscan:checked {
    & ~ .intel_types .tab[for='intel-dscan'] { background: var(--alt-bg); }
    & ~ .body { display: flex; }
  }

  #intel-structure:checked {
    & ~ .intel_types .tab[for='intel-structure'] { background: var(--alt-bg); }
    & ~ .structure { display: flex; }
  }

  #intel-drifter:checked {
    & ~ .intel_types .tab[for='intel-drifter'] { background: var(--alt-bg); }
    & ~ .drifter { display: flex; }
  }

  #intel-link:checked {
    & ~ .intel_types .tab[for='intel-link'] { background: var(--alt-bg); }
    & ~ .link { display: flex; }
  }
}
