@import 'mixins/list';
@import 'variables/gutters';

.periodisk-redovisning-form {
  max-width: var(--digi--typography--text--max-width);

  &__confirmation,
  &__warning,
  &__form {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: $digi--layout--gutter--l;
  }

  &__footer {
    display: flex;
    flex-direction: column;
    gap: var(--digi--layout--gutter);
  }

  &__cta-wrapper {
    display: flex;
    gap: var(--digi--layout--gutter);
  }

  &__activities {
    display: flex;
    flex-direction: column;
    gap: var(--digi--layout--gutter--xs);
  }

  &__radio-buttons {
    &--invalid {
      ::ng-deep .digi-ng-form-radiobutton__input {
        border-color: var(--digi--ui--color--border--error);
        background-color: var(--digi--ui--color--background--error);
        box-shadow: 0 0 0 var(--digi--ui--border--width) var(--digi--ui--color--border--error);
      }
    }
  }

  &__no-activities-has-been-conducted-checkbox,
  &__activity,
  &__activity-group {
    display: flex;
    flex-direction: column;
    gap: var(--digi--layout--gutter--s);
  }

  &__activity-hours {
    ::ng-deep .digi-form-input__content {
      max-width: 10rem;
    }
  }

  &__no-activities-has-been-conducted-checkbox {
    margin-bottom: $digi--layout--gutter--l;
  }

  &__activity-details {
    display: flex;
    flex-direction: column;
    gap: var(--digi--layout--gutter);
    margin-left: 1.875rem;
    margin-bottom: var(--digi--layout--gutter--s);
  }

  &__activity-item {
    display: flex;
    align-items: center;
    gap: var(--digi--layout--gutter--s);
  }

  &__activity-check {
    color: var(--digi--ui--color--border--success);
  }
}
