@import "../../../../style/mixin";

@include export-module('co-transaction-container-choice-dialog-layout') {
  .co-transaction-container-choice-dialog {
    .co-dialog:not(.is-mobile) .co-dialog-wrapper {
      width: 620px;

      .dialog-header-caption {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
      }

      .transport-dialog-contents {
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-bottom: 45px;

        .button-div {
          display: flex;
          flex-direction: row;
          justify-content: end;
          padding-right: 30px;

          .new-container-button {
            height: 30px;
            width: 120px;
            border: 1px solid $tp-color-action;
            border-radius: 10px;
            background-color: white;
            color: $tp-color-action;
            font-size: larger;

            co-icon {
              svg {
                fill: $tp-color-action;
              }
              & [fill] { // for own icons
                fill: $tp-color-action;
              }
            }
          }
        }

        .transport-dialog-contents-paragraph {
          display: flex;
          flex-direction: row;
          gap: 30px;

          .transport-dialog-contents-column {
            display: flex;
            flex-direction: column;
            gap: 5px;
            min-width: 250px;

            .column-title {
              min-height: 25px;
              padding: 5px;
            }

            .currency-section {
              display: flex;
              flex-direction: row;
              gap: 5px;
              max-width: 250px;

              .currency-field {
                max-width: 122px;
              }
            }
          }
        }
      }
    }
  }
}