.pf1.sheet.action {
  min-width: 520px;
  min-height: 520px;

  form {
    > header {
      img.profile {
        border: 1px solid black;
        flex: 0 0 80px;
        width: 80px;
        height: 80px;
        object-fit: contain;
      }
    }

    .primary-body {
      > .tab {
        overflow: hidden auto;

        input[type="text"],
        select {
          border: 1px solid var(--pf1-tan);
          background: var(--pf1-bg-dark-0);
        }
      }
    }

    input.max-ability {
      flex: 0 3em;
    }

    // Conditionals
    .conditionals {
      list-style: none;
      margin: 0;
      padding: 0;
      display: block;

      .change,
      .context-note {
        flex: 0 0 100%;
        padding: 1px;
        input {
          flex: 3;
          border: 1px solid var(--pf1-tan);
          background: var(--pf1-bg-dark-0);
          height: 24px;
        }
        input[type="text"]:invalid {
          border: var(--pf1-invalid-input-border);
          background: url(icons/misc/hazard-sign.svg) no-repeat 95% 50% var(--pf1-bg-dark-0);
          background-size: contain;
        }
        select {
          background: var(--pf1-bg-dark-0);
        }
        select:invalid {
          border: var(--pf1-invalid-input-border);
          background: url(icons/misc/hazard-sign.svg) no-repeat 75% 50% var(--pf1-bg-dark-0);
          background-size: contain;
        }
        input[type="text"]:not(:first-child),
        select:not(:first-child),
        span:not(:first-child),
        button:not(:first-child) {
          margin-left: 5px;
        }

        button.edit-change-contents {
          height: 24px;
          line-height: 24px;
        }

        .change-priority {
          flex: 0 0 24px;
        }
        .change-operator {
          flex: 0 0 24px;
        }
        .change-target,
        .context-note-target {
          border: 1px solid var(--pf1-tan);
          background: var(--pf1-bg-dark-0);
          white-space: nowrap;
          overflow: hidden;
          height: 24px;
          line-height: 24px;
          border-radius: 4px;
          text-align: center;
          cursor: pointer;
          font-size: var(--font-size-12);

          &:hover {
            box-shadow: 0 0 8px var(--pf1-red);
          }

          &.invalid {
            border: var(--pf1-invalid-input-border);
            background: url(icons/misc/hazard-sign.svg) no-repeat 95% 50% var(--pf1-bg-dark-0);
          }
        }
        .conditional-default {
          flex: 0 0 18px;
        }
        .conditional-modifier {
          display: flex;
        }
      }
    }

    .conditionals {
      .conditional,
      .conditional-modifier {
        padding: 1px;

        select {
          max-width: max-content;
          min-width: 80px;
          flex: 1;
          border: 1px solid var(--pf1-tan);
          background: var(--pf1-bg-dark-0);
        }
        select:not(:first-child) {
          margin-left: 5px;
        }
        select:invalid {
          border: var(--pf1-invalid-input-border);
          background: url(icons/misc/hazard-sign.svg) no-repeat 80% 50% var(--pf1-bg-dark-0);
        }
        input[type="text"] {
          height: 24px;
          border: 1px solid var(--pf1-tan);
          background: var(--pf1-bg-dark-0);
        }
        input[type="text"]:invalid {
          border: var(--pf1-invalid-input-border);
          background: url(icons/misc/hazard-sign.svg) no-repeat 100% 50% var(--pf1-bg-dark-0);
        }
        input[type="text"]:not(:first-child) {
          margin-left: 5px;
        }
        input[class*="conditional-name"]:not(:first-child) {
          margin-left: 0;
        }
        .conditional-name,
        .conditional-formula {
          min-width: 140px;
        }
        .conditional-damage-type {
          min-width: 90px;
          max-width: 200px;
        }
        .form-group {
          padding-left: 30px;
        }
      }
    }

    h4.damage-header,
    h4.attack-header,
    h4.conditional-header {
      margin: 0;
      padding: 0;
      font-weight: bold;
      line-height: 24px;
      color: var(--pf1-olive);
      border: unset;
    }
    h4.attack-header {
      margin-left: 4px;
    }

    .delete-damage,
    .crit-damage-control,
    .delete-attack,
    .delete-note,
    .delete-conditional,
    .delete-conditional-modifier {
      width: 18px;
      flex: 0 0 18px;
      line-height: 24px;
      text-align: right;
      color: var(--pf1-tan);
    }

    .add-attack,
    .add-damage,
    .add-note,
    .add-conditional,
    .add-conditional-modifier {
      flex: 0 0 auto;
      line-height: 24px;
      color: var(--pf1-tan);
      margin-left: 2px;
    }

    .damage-parts,
    .attack-parts {
      list-style: none;
      margin: 0;
      padding: 0;

      .damage-part,
      .attack-part {
        flex: 0 0 100%;
        padding: 2px;

        input {
          flex: 3;
        }
        input:not(:first-child) {
          margin-left: 5px;
        }
        select {
          margin-left: 5px;
          flex: 1;
        }
      }
    }

    hr {
      margin: 0 0.5em;
    }

    select {
      &[name="ability.damageMult"] {
        flex: 0 6em;
      }

      &[name="save.type"] {
        flex: 0 8em;
      }
    }
  }
}