/* CODSHIPX AI CRM R59-R2-R4
   Quick Codi attachment composer layout repair.
   Isolated to the R53 composer only. */

#cx-r53-form.cx-r53-compose {
  grid-template-columns: 44px 44px minmax(0, 1fr) 44px !important;
  grid-template-rows: auto !important;
  align-items: end !important;
  gap: 8px !important;
}

#cx-r53-form #cx-r56-voice-btn {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: end !important;
}

#cx-r53-form #cx-r59-asset-btn {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;

  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;

  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;

  padding: 0 !important;
  margin: 0 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 14px !important;
  border: 1px solid rgba(68, 216, 124, .34) !important;
  background: rgba(20, 82, 48, .34) !important;
  color: #67e99a !important;

  font-size: 24px !important;
  font-weight: 500 !important;
  line-height: 1 !important;

  flex: 0 0 44px !important;
  overflow: hidden !important;
}

#cx-r53-form #cx-r59-asset-btn:hover,
#cx-r53-form #cx-r59-asset-btn:focus-visible {
  background: rgba(25, 105, 59, .48) !important;
  border-color: rgba(103, 233, 154, .58) !important;
}

#cx-r53-form #cx-r59-asset-input {
  display: none !important;
}

#cx-r53-form #cx-r53-input {
  grid-column: 3 !important;
  grid-row: 1 !important;

  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;

  align-self: stretch !important;
}

#cx-r53-form #cx-r53-send {
  grid-column: 4 !important;
  grid-row: 1 !important;
  align-self: end !important;
}

@media (max-width: 520px) {
  #cx-r53-form.cx-r53-compose {
    grid-template-columns: 40px 40px minmax(0, 1fr) 40px !important;
    gap: 6px !important;
  }

  #cx-r53-form #cx-r59-asset-btn {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;

    flex-basis: 40px !important;
    border-radius: 12px !important;
    font-size: 22px !important;
  }
}
