@if (!!cipher()) {
  @if (cardIsExpired()) {
    <bit-callout type="info" [title]="'cardExpiredTitle' | i18n">
      {{ "cardExpiredMessage" | i18n }}
    </bit-callout>
  }

  @if (!removeAtRiskCallout()) {
    @if (!hasLoginUri() && hadPendingChangePasswordTask()) {
      <bit-callout type="warning" [title]="'missingWebsite' | i18n">
        {{ "changeAtRiskPasswordAndAddWebsite" | i18n }}
      </bit-callout>
    }

    @if (showChangePasswordLink()) {
      <bit-callout type="warning" [title]="''">
        @if (changePasswordLink()) {
          <a
            bitLink
            [href]="changePasswordLink()"
            appStopClick
            (click)="launchChangePassword()"
            linkType="secondary"
            endIcon="bwi-external-link"
          >
            {{ "changeAtRiskPassword" | i18n }}
          </a>
        } @else {
          {{ "changeAtRiskPassword" | i18n }}
        }
      </bit-callout>
    }
  }

  <!-- HELPER TEXT -->
  @if (cipher()?.isDeleted && !cipher()?.edit) {
    <p class="tw-text-muted" bitTypography="helper">
      {{ "noEditPermissions" | i18n }}
    </p>
  }

  <!-- ITEM DETAILS -->
  <app-item-details-v2
    [cipher]="cipher()"
    [organization]="organization()"
    [collections]="resolvedCollections()"
    [folder]="folder()"
    [hideOwner]="isAdminConsole()"
  >
    <ng-content select="[slot=button]"></ng-content>
  </app-item-details-v2>

  <!-- LOGIN CREDENTIALS -->
  @if (hasLogin()) {
    <app-login-credentials-view
      [cipher]="cipher()"
      [activeUserId]="activeUserId$ | async"
      [showChangePasswordLink]="showChangePasswordLink()"
      [changePasswordLink]="changePasswordLink()"
      (handleChangePassword)="launchChangePassword()"
    ></app-login-credentials-view>
  }

  <!-- AUTOFILL OPTIONS -->
  @if (hasAutofill()) {
    <app-autofill-options-view [loginUris]="cipher()!.login.uris" [cipherId]="cipher()!.id">
    </app-autofill-options-view>
  }

  <!-- CARD DETAILS -->
  @if (hasCard()) {
    <app-card-details-view [cipher]="cipher()"></app-card-details-view>
  }

  <!-- IDENTITY SECTIONS -->
  @if (cipher()?.identity) {
    <app-view-identity-sections [cipher]="cipher()"> </app-view-identity-sections>
  }

  <!-- SshKEY SECTIONS -->
  @if (hasSshKey()) {
    <app-sshkey-view [sshKey]="cipher()!.sshKey"></app-sshkey-view>
  }

  <!-- BANK ACCOUNT SECTIONS -->
  @if (hasBankAccount()) {
    <app-bank-account-view
      [bankAccount]="cipher()!.bankAccount"
      [cipher]="cipher()!"
    ></app-bank-account-view>
  }

  <!-- DRIVER'S LICENSE SECTIONS -->
  @if (hasDriversLicense()) {
    <app-drivers-license-view
      [driversLicense]="cipher()!.driversLicense"
      [cipher]="cipher()!"
    ></app-drivers-license-view>
  }

  <!-- PASSPORT SECTIONS -->
  @if (hasPassport()) {
    <app-passport-view [passport]="cipher()!.passport" [cipher]="cipher()!"></app-passport-view>
  }

  <!-- ADDITIONAL OPTIONS -->
  @if (cipher()?.notes) {
    <app-additional-options [notes]="cipher()!.notes"> </app-additional-options>
  }

  <!-- CUSTOM FIELDS -->
  @if (cipher()?.hasFields) {
    <app-custom-fields-v2 [cipher]="cipher()"> </app-custom-fields-v2>
  }

  <!-- ATTACHMENTS SECTION -->
  @if (cipher()?.hasAttachments) {
    <app-attachments-v2-view
      [emergencyAccessId]="emergencyAccessId()"
      [cipher]="cipher()"
      [admin]="isAdminConsole()"
    >
    </app-attachments-v2-view>
  }

  <!-- ITEM HISTORY SECTION -->
  <app-item-history-v2 [cipher]="cipher()"> </app-item-history-v2>
}