/* RVO/Utrecht-styling voor Select2 multi-select met design tokens */

.select2-container--default .select2-selection--multiple,
.select2-container--default .select2-selection--single {
  border: var(--utrecht-form-control-border-width) solid var(--utrecht-form-control-border-color);
  border-radius: var(--utrecht-form-control-border-radius);
  min-height: 44px;
  padding: 6px 8px;
  background: var(--utrecht-form-control-background-color);
  transition: border-color 0.2s;
  font-size: var(--rvo-font-size-md);
  font-family: var(--rvo-font-sans-serif-font-family);
  color: var(--utrecht-form-control-color);
}

.select2-container--default .select2-selection--multiple:focus,
.select2-container--default .select2-selection--multiple:active,
.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--single:active {
  border-color: var(--utrecht-form-control-focus-border-color);
  box-shadow: 0 0 0 2px var(--utrecht-focus-outline-color);
  outline: none;
}

.select2-selection__choice {
  background: var(--rvo-color-grijs-200);
  color: var(--rvo-color-logoblauw);
  border-radius: var(--rvo-tag-border-radius);
  padding: var(--rvo-tag-padding-block-start) var(--rvo-tag-padding-inline-end)
           var(--rvo-tag-padding-block-end) var(--rvo-tag-padding-inline-start);
  margin: 2px 6px 2px 0;
  font-size: var(--rvo-font-size-sm);
  border: none;
  font-weight: var(--rvo-font-weight-bold);
  font-family: var(--rvo-font-sans-serif-font-family);
  box-shadow: none;
  display: flex;
  align-items: center;
  text-transform: none;
  letter-spacing: 0.01em;
}

.select2-selection__choice__remove {
  color: var(--rvo-color-logoblauw);
  margin-right: 6px;
  font-weight: bold;
  cursor: pointer;
}

.select2-container--default .select2-search--inline .select2-search__field {
  color: var(--utrecht-form-control-placeholder-color);
  font-style: normal;
  font-size: var(--rvo-font-size-md);
  font-family: var(--rvo-font-sans-serif-font-family);
  opacity: 1;
  padding: 0;
  margin: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--utrecht-form-control-focus-border-color);
  color: var(--rvo-color-wit);
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background-color: var(--rvo-color-lichtblauw-150);
  color: var(--utrecht-form-control-color);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--utrecht-form-control-border-color) transparent transparent transparent;
  border-width: 6px 6px 0 6px;
}

/* Zorg dat Select2 multi-select exact even hoog is als Utrecht-select */
.select2-container--default .select2-selection--multiple {
  min-height: 44px;
  height: 44px;
  padding-top: 6px;
  padding-bottom: 6px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

/* Zorg dat de single select (sortering) ook altijd 44px is */
.utrecht-select.utrecht-select--html-select {
  min-height: 44px;
  height: 44px;
  padding-top: 6px;
  padding-bottom: 6px;
  box-sizing: border-box;
  font-size: var(--rvo-font-size-md);
  font-family: var(--rvo-font-sans-serif-font-family);
} 

/* Tekstkleur in Select2 multi-select (geselecteerde waarden en placeholder) */
.select2-container--default .select2-selection--multiple,
.select2-container--default .select2-selection--single {
  color: var(--utrecht-form-control-color) !important;
  font-family: var(--rvo-font-sans-serif-font-family);
}

/* Placeholderkleur in Select2 multi-select */
.select2-container--default .select2-search--inline .select2-search__field::placeholder {
  color: var(--utrecht-form-control-color) !important;
  opacity: 1;
}


/* Unused colleague classes removed - using placement-avatar instead */



/* Custom table enhancements only */
.rvo-table {
  width: 100%;
}

/* Custom table interactivity */
.rvo-table-header {
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.rvo-table-header--active-sort {
  background-color: var(--rvo-color-hemelblauw-150) !important;
  color: var(--rvo-color-hemelblauw-750) !important;
}

.rvo-table-header__sortable-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.rvo--table-header__sorting-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}


/* Table row styling with RVO design system */
.clickable-row {
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.clickable-row:hover,
.rvo-table-row:hover,
.rvo-table-row.clickable-row:hover {
  background-color: var(--rvo-color-hemelblauw-150) !important;
  cursor: pointer;
}




/* Ensure the results container takes full width */
.wies-results {
  width: 100%;
  max-width: none;
}

/* Tab content visibility */
.hidden {
  display: none;
}









/* Sub-menu background styling */
.rvo-tmp-submenu-wrapper .rvo-menubar__background {
  background-color: var(--rvo-color-grijs-200);
}

/* Layout spacing adjustments */
.rvo-tmp-submenu-wrapper {
  margin-bottom: var(--rvo-space-md);
}

/* Compact header styling */
.rvo-alert--padding-sm {
  padding: 0.25rem 1rem;
}

.rvo-alert-text {
  font-size: var(--rvo-font-size-2xs);
  font-family: var(--rvo-font-sans-serif-font-family);
}


.rvo-form {
  margin-bottom: 0;
}

/* Custom select chevron fix */
.rvo-select-wrapper::after {
  background-color: white;
  -webkit-mask-image: url("/static/@nl-rvo/assets/icons/functioneel/delta-omlaag.084072bf41e5.svg");
  mask-image: url("/static/@nl-rvo/assets/icons/functioneel/delta-omlaag.084072bf41e5.svg");
}

/* Page header styling */
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  margin-top: 1rem;
}

.page-header h1 {
  margin: 0;
}

.wies-tag--light-green{
  --utrecht-icon-color: var(--rvo-tag-warning-icon-color);
  --rvo-tag-default-background-color: var(--rvo-color-groen-300);
  --rvo-tag-default-color: var(--rvo-tag-warning-color);
}

.wies-tag--light-yellow{
  --utrecht-icon-color: var(--rvo-tag-warning-icon-color);
  --rvo-tag-default-background-color: var(--rvo-color-donkergeel-300);
  --rvo-tag-default-color: var(--rvo-tag-warning-color);
}

.wies-menu-item--active{
  font-weight: 600;
  text-decoration: underline !important;
}