.tundra {
  .dijitInputContainer input,
  .dijitTextBox {
    border-radius: 5px !important;
    padding-right: 0px;
    margin: 0.2em;
    margin-left: 0;
    border: 2px solid var(--smarties-purple-400);
    &.dijitTextBoxFocused {
      border-color: var(--smarties-purple);
    }

    .dijitButtonNode {
      border-radius: 0 4px 4px 0 !important;
    }

    .dijitInputInner,
    .dijitPlaceHolder {
      margin-block: 4px;
      padding-left: 4px !important;
    }
    .dijitValidationIcon {
      width: 24px;
      background-position: 0 4px;
    }
  }

  .dijitError {
    background-color: #ffdfdf;
  }

  .dijitComboBox .dijitButtonNode {
    padding: 0.4em;
  }

  .dijitReset .dijitInputInner {
    margin: 0;
  }

  .dijitButtonText {
    padding: 0.2em 0.3em;
  }

  /* Dialogs */
  .dijitDialog {
    border-radius: 10px;
    border: 2px solid var(--smarties-purple-400);
    &.dijitDialogFocused {
      border-color: var(--smarties-purple-600);
    }
    .dijitDialogCloseIcon {
      background-position: 0 4px;
    }
  }

  .dijitDialogTitleBar {
    background: linear-gradient(to bottom, #ffffff, var(--smarties-purple-100));
  }

  /* Buttons */
  .dijitButton {
    border-radius: 5px;
    &.dijitDisabled {
      opacity: 0.5;
      .dijitButtonNode {
        background: #ccc;
        &:hover {
          background: #ccc;
          cursor: not-allowed;
        }
      }
    }
    .dijitButtonNode {
      border: none;
      border-radius: 100px;
      padding-inline: 1rem;
      padding-block: 0.4rem;
      background: var(--smarties-purple);
      color: #fff;
      font-weight: bold;
      &:hover {
        background: var(--smarties-purple-800);
      }
      &:active {
        background: var(--smarties-purple-800);
      }
    }
  }

  /* Checkboxes */
  .dijitCheckBox {
    border-radius: 2px;
    border: 2px solid var(--smarties-purple-400);
    background-position: -17px; /* instead of -16px, since we're changing the border from 2px to 1px */
    &.dijitCheckBoxChecked {
      border-color: var(--smarties-purple);
      background-position: -1px; /* it's a sprite! */
    }
  }
  .dijitProgressBar {
    border-radius: 100px;
    border: none;
    &.dijitProgressBarEmpty {
      &:not(.dijitProgressBarIndeterminate) {
        background-color: var(--smarties-purple-100);
        background-image: none;
      }
    }
    &:not(.dijitProgressBarIndeterminate) {
      .dijitProgressBarTile {
        background-color: var(--smarties-purple-700);
        background-image: none;
      }
    }
  }
}

textarea {
  border-radius: 5px;
  border: 2px solid var(--smarties-purple-400);
  &:focus {
    border-color: var(--smarties-purple);
  }
}

.cloudflare-video-upload-widget {
  /* Style the initial upload dropzone */
  [data-dojo-attach-point='uploadContainer'] {
    border-radius: 1rem;
    transition:
      background-color 0.2s ease,
      border-color 0.2s ease; /* Smooth transition */
    /* Keep existing styles like border, padding, text-align from inline */
  }

  /* Style for drag-over state */
  .drag-over {
    background-color: var(--smarties-purple-100);
    border-color: var(--smarties-purple) !important; /* Use important to override inline style if needed */
  }

  /* Style the container holding the video player iframe */
  [data-dojo-attach-point='playerEmbedContainer'] {
    border-radius: 1rem;
    overflow: hidden; /* Ensure iframe respects the border-radius */
    /* Keep existing styles like position, padding-top from inline */
  }
}