@import '~@capillarytech/cap-ui-library/styles/_variables';

.ant-select-dropdown .ant-select-dropdown-menu .ant-select-dropdown-menu-item{
  font-family: 'Roboto', Arial, sans-serif !important;
}

.cap-whatsapp-creatives {
  .whatsapp-heading-spacing {
    margin-top: $CAP_SPACE_16;
  }

  .whatsapp-dynamic-url-selection-container {
    margin-bottom: $CAP_SPACE_08;
    margin-top: $CAP_SPACE_32;
    .whatsapp-dynamic-url-selection-heading {
      margin-bottom: $CAP_SPACE_08;
    }
  }

  .whatsapp-render-heading {
    margin-top: $CAP_SPACE_16;
    margin-bottom: $CAP_SPACE_06;
  }

  .whatsapp-template-name-desc {
    margin-bottom: $CAP_SPACE_06;
  }

  .whatsapp-unsubscribe-checkbox {
    .ant-checkbox-inner {
      height: $CAP_SPACE_16;
      width: $CAP_SPACE_16;
    }
  }

  .whatsapp-create-unsubscribe-checkbox {
    margin: $CAP_SPACE_08 0px $CAP_SPACE_08 16px;
  }

  .whatsapp-edit-unsubscribe-checkbox {
    margin: $CAP_SPACE_08 0px;
  }

  .whatsapp-render-unsubscribe-text {
    color: $FONT_COLOR_02;
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
    margin-left: -8px;
  }

  .whatsapp-render-message-length {
    text-align: right;
  }

  .whatsapp-create-template-message-input {
    background-color: $CAP_G10;
    padding-top: $CAP_SPACE_16;
  }

  .whatsapp-create-template-message-input-wrapper {
    position: relative;
  }

  .whatsapp-template-message-error {
    margin-left: $CAP_SPACE_16;
    margin-right: $CAP_SPACE_16;
  }

  .whatsapp-scroll-div {
    margin-bottom: 250px;
  }

  .whatsapp-edit-alert-margin {
    margin-top: 46px;
  }

  .whatsapp-edit-template-message-input {
    background-color: $CAP_G10;
    padding: 0 $CAP_SPACE_16;
  }

  .whatsapp-edit-template-message-heading {
    margin-top: $CAP_SPACE_16;
    margin-bottom: $CAP_SPACE_08;
    overflow: hidden;
    text-overflow: ellipsis;
    color: $FONT_COLOR_04;
  }

  .whatsapp-footer-edit-container {
    background-color: $CAP_G10;
    margin: $CAP_SPACE_08 0;
    padding: $CAP_SPACE_12;
    .whatsapp-footer-edit-text {
      overflow: hidden;
      text-overflow: ellipsis;
      color: $FONT_COLOR_04;
    }
  }

  .whatsapp-create-mode-heading {
    margin-top: $CAP_SPACE_16;
    margin-bottom: $CAP_SPACE_06;
    display: flex;
    text-align: center;
  }

  .whatsapp-edit-disabled {
    cursor: not-allowed;
    opacity: 0.5;
    overflow-wrap: anywhere;
  }

  #whatsapp-create-template-message-input {
    margin-left: $CAP_SPACE_16;
    margin-right: $CAP_SPACE_16;
    width: 95%;
  }

  #select-whatsapp-category {
    padding-right: 0.357rem;
  }

  #select-whatsapp-media {
    padding-left: 0.357rem;
  }

  #select-whatsapp-category,
  #select-whatsapp-media,
  #select-whatsapp-language {
    width: 100%;
  }

  .whatsapp-btn-radio-group {
    display: grid;
  }

  .whatsapp-button-none {
    display: inline-grid;
    margin-top: $CAP_SPACE_16;
  }

  .whatsapp-button-cta {
    display: inline-grid;
    margin-top: $CAP_SPACE_24;
  }

  .whatsapp-button-quick-reply {
    display: inline-grid;
    margin-top: $CAP_SPACE_24;
    margin-bottom: 0.75rem;
  }

  .whatsapp-optional-label {
    margin-left: 8px;
    color: $FONT_COLOR_03;
    font-weight: normal;
    font-size: $CAP_SPACE_12;
  }

  .whatsapp-media-radio>label.ant-radio-wrapper {
    margin-right: 50px;
  }

  .cap-custom-image-upload {
    .dragger-button.re-upload {
      top: -9.4375rem;
      position: relative;
      left: 31.8125rem;
      color: $FONT_COLOR_05;
    }
  }
  .cap-custom-video-upload {
    padding-top: $CAP_SPACE_20;
    .dragger-button.re-upload {
      top: -10.9375rem;
      position: relative;
      left: 32.8125rem;
      color: $FONT_COLOR_05;
    }
  }
  .cap-custom-document-upload {
    .dragger-button.re-upload {
      top: -9.375rem;
      position: relative;
      left: 32.8125rem;
      color: $FONT_COLOR_05;
    }
  }
  
  .whatsapp-optional-label1 {
    margin-left: $CAP_SPACE_04;
    color: $FONT_COLOR_03;
    font-weight: normal;
    font-size: $CAP_SPACE_12;
  }

  .whatsapp-create-template-header-input {
    margin-bottom: $CAP_SPACE_20;
  }


  .whatsapp-text-field_spacing {
    margin-left: $CAP_SPACE_04;
  }

  .whatsapp-render-url-preview-text {
    color: $CAP_G01;
    font-size: $FONT_SIZE_M;
    font-weight: $FONT_WEIGHT_MEDIUM;
  }
  .whatsapp-extra-security-footer {
    margin-bottom: 1rem;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    padding-left: $CAP_SPACE_16;
    gap: $CAP_SPACE_08;

    .whatsapp-extra-security-footer-note {
      font-size: small;
      margin-top: $CAP_SPACE_04;
      display: inline-flex;
      padding-left: $CAP_SPACE_12;
      border-radius: $CAP_SPACE_04 0px 0px 0px;
      background: #D4E1FC;
      align-items: center;
      justify-content: space-between;

      .add-btn {
        display: flex;
        background-color: inherit;
        align-items: center;
      }
    }

    .whatsapp-extra-security-footer-input {
      display: inline-flex;
      align-items: center;
      gap: $CAP_SPACE_04;
    }
  }

}
.whatsapp-tooltip-header{
  color: $CAP_G10;
}

.carousel-media-selection {
  display: flex;
  align-items: center;
  .carousel-media-selection-heading {
    margin-right: $CAP_SPACE_20;
  }
}

.whatsapp-carousel-tab { 
  .ant-tabs-extra-content {
    padding: 0;
    line-height: normal;
    .add-carousel-content-button {
      padding: 0.642rem 0px;
      margin: 0;
    }
    .cap-divider-v2{
      height: 1.5rem;
      margin-bottom: 0.499rem;
    }
  }
}

.whatsapp-carousel-card {
  .ant-card-head {
    border-bottom: none;
  }
  .ant-card-body {
    padding-top: 0px;
  }
  .ant-card-head-wrapper {
    .ant-card-extra {
      .cap-button-v2 {
        padding: 0px;
      }
    }
  }
}

.whatsapp-carousel-message-heading {
  margin-top: $CAP_SPACE_24;
}
.template-status-font{
  font-weight: 500;
}

.template-status-margin{
  margin: $CAP_SPACE_04 0 $CAP_SPACE_04;
}
