.page-wrapper {
  max-width: 100%;
}

fieldset .fieldset__wrapper {
  padding-right: 1rem;
}

fieldset.inline-radio .form-type-boolean,
.form-item-candidate-ranking {
  display: inline-block;
  margin-right: 1.5rem;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.border-top {
  border-top: 1px solid #00A8A0;
}

.border-bottom {
  border-bottom: 1px solid #00A8A0;
}

.border {
  border: 1px solid #00A8A0;
}

.mt-1 {
  margin-top: 1rem;
}

.mt-2 {
  margin-top: 2rem;
}

.mt-3 {
  margin-top: 3rem;
}

.mb-1 {
  margin-bottom: 1rem;
}

.mb-2 {
  margin-bottom: 2rem;
}

.ml-1 {
  margin-left: 1rem;
}

.ml-2 {
  margin-left: 2rem;
}


/* Ensure the main content container has a minimum width */
.main-content__container.container {
  min-width: 100%;

  min-height: 100vh;
  padding-top: 1rem;
}

/* Ensure the main content container has a minimum width */
.main-content__container.container main,
.dashboard-content {
  min-width: 100%;
}

.main-content__container.container .block__content .container,
.main-content__container.container .block__content .container .dashboard-content {
  min-width: 100%;
  /* Adjust this value if needed */
  display: flex;
  flex-wrap: wrap;
}

.table-responsive,
.responsive-enabled {
  width: 100%;
}

.responsive-enabled th,
.responsive-enabled td {
  padding: 0.5rem 1rem;
}

.responsive-enabled td {
  text-align: center;
}

.main-content__container.container .block__content .container.reduced-padding,
.main-content__container.container .block__content .container.reduced-padding .dashboard-content {
  padding: 0 1rem;
}


/* Flex settings for columns based on percentage classes */
.col-20 {
  flex: 0 0 20%;
  max-width: 20%;
  padding: 1rem;
}

.col-25 {
  flex: 0 0 25%;
  max-width: 25%;
  padding: 1rem;
}

.col-33 {
  flex: 0 0 33.333333333333333%;
  max-width: 33.333333333333333%;
  padding: 1rem;
}

.col-33.with-margin {
  flex: 0 0 calc(33.333333333333333% - 2rem);
  margin: 0 1rem;
}

.col-50 {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 1rem;
}

.col-50.with-margin {
  flex: 0 0 calc(50% - 2rem);
  margin: 0 1rem;
}

.col-75 {
  flex: 0 0 75%;
  max-width: 75%;
  padding: 1rem;
}

.col-80 {
  flex: 0 0 80%;
  max-width: 80%;
  padding: 1rem;
}

.col-100 {
  flex: 0 0 100%;
  max-width: 100%;
  padding: 1rem;
}


/* Ensure that the flex items are distributed properly */
.main-content__container.container>[class*='col-'] {
  box-sizing: border-box;
  padding: 1rem;
  float: none;
  /* Optional: Add some padding to columns */
}

.table-responsive th,
.table-responsive td {
  padding: 0.4rem 1rem;
}

/* Green background for success rows */
.row-success {
  background-color: #d4edda;
  /* Light green background */
  transition: background-color 0.3s;
}

/* Darker green on hover */
.row-success:hover {
  background-color: #c3e6cb;
  /* Slightly darker green */
}

/* Red background for error rows */
.row-error {
  background-color: #f8d7da;
  /* Light red background */
  transition: background-color 0.3s;
}

/* Darker red on hover */
.row-error:hover {
  background-color: #f5c6cb;
  /* Slightly darker red */
}

@media screen {
  .print-only {
    display: none;
  }
}

@media print {
  .print-only {
    display: block;
  }

  .site-header__inner__container,
  .no-print {
    display: none;
  }
}

.button {
  box-shadow: inset 0 0 0 1px #58afd1;

  transition: color 0.25s 0.0833333333s;
  position: relative;
  background-color: #00A8A0;
  color: #fff;
}

.button.full-width {
  width: 100%;
  display: block;
  text-align: center;
  line-height: 1rem;
  padding-block: calc((var(--sp3) - var(--line-height-s)) / 2);
  padding: 1rem;
}

.button::before,
.button::after {
  border: 0 solid transparent;
  box-sizing: border-box;
  content: "";
  pointer-events: none;
  position: absolute;
  width: 0;
  height: 0;
  bottom: 0;
  right: 0;
}

.button::before {
  border-bottom-width: 1px;
  border-left-width: 1px;
}

.button::after {
  border-top-width: 1px;
  border-right-width: 1px;
}

.button:hover {
  color: #58afd1;
  background-color: #fff;
}

.button:hover::before,
.button:hover::after {
  border-color: #00A8A0;

  transition: border-color 0s, width 0.25s, height 0.25s;
  width: 100%;
  height: 100%;
}

.button:hover::before {
  transition-delay: 0s, 0s, 0.25s;
}

.button:hover::after {
  transition-delay: 0s, 0.25s, 0s;
}

/* Tooltip */
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* The actual tooltip (popuptext) */
.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
  opacity: 0;
  /* Start with opacity 0 for fade-in effect */
  transition: opacity 0.5s;
  /* Fade-in transition */
}

/* Tooltip arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Show tooltip when .show class is added */
.popup .show {
  visibility: visible;
  opacity: 1;
  /* Show tooltip */
}

/* Add this CSS to your theme or module stylesheet */
.copiable {
  position: relative;
  display: inline-flex;
  cursor: pointer;
}

/* Tooltip text */
.copiable::after {
  content: "Link copied";
  visibility: hidden;
  width: auto;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Show tooltip text when .tooltip-copied class is added */
.copiable.tooltip-copied::after {
  visibility: visible;
  opacity: 1;
}


/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* End Tooltip */

.notification-wrapper {
  border-bottom: 1px solid #00A8A0;
  padding: 0.1rem 1rem;
}

.notification-wrapper a {
  text-decoration: none;
}

.gin-login.path-user .register-button {
  display: none !important;
}

/*Footer*/
.footer.site-footer {
  padding: 0 3rem;
}

.site-footer__inner.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 2rem 3rem;
}

.footer-left,
.footer-right {
  display: flex;
}

.site-footer__inner.container ul {
  list-style-type: none;
}

.site-footer__inner.container ul li {
  padding: 0.5rem 1rem;
  font-size: 1.1rem;
}

.site-footer__inner.container ul li a {
  text-decoration: none;
}


/*Logo*/
@media (min-width: 75rem) {
  .site-branding__inner {
    width: 100%;
    height: auto;
  }

  .site-branding__inner a {
    width: 100%;
    height: 30vh;
  }

  .site-branding__logo img {
    width: 100%;
    height: auto;
    max-height: 100%;
  }
}

/*End Logo*/

/*Compentence unit*/
#edit-competence-units {
  width: 100%;
  text-align: center;
}