@include export-module('cc-transaction-invoice-check-order-tile-layout') {
  .co-transaction-invoice-check-order-tile {


    .column {
      display: flex;
      flex-direction: row;
      gap: 10px;
      justify-content: space-between;
    }
    .row {
      display: flex;
      flex-direction: row;
      width: 100%;
      gap: 1em;
      .center {
        padding-left: 3em;
        gap: 2em;
      }
    }
    .grid-wrapper {
      width: 100%;
      max-height: 600px;
      overflow: auto;
    }
    .transaction-tile-wrapper {
      width: 40%;
      height: 160px;
      padding: 7.5px 10px;
      box-shadow: 0 2px 4px 0 #0000005c;
      border-left: 4px solid #45b8bf;
      border-radius: 5px;
      display: flex;
      flex-direction: column;
      .tile {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .tile-header {
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          gap: 0.5em;
        }
        .tile-upper-right{
          display: flex;
          flex-direction: column;
          gap: 5px;
        }
        .tile-footer {
          align-items: center;
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          gap: 0.5em;
          .tile-bottom-left {
            display: flex;
            align-items: center;
            gap: 10px;
            .co-icon {
              width: 22px;
              height: 22px;
            }
          }
        }

        .header {
          display: flex;
          flex-direction: row;
          align-items: center;
          span {
            min-width: 6em;
          }

        }
      }
    }
  }
}
