.strip-br br {
  display: none;
}

.log-ind-metoder {
  display: flex;
}


@font-face {
  font-family: Karla Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/designsystem/media/karla-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

.heading_active {
  font-weight: bold;
}

@font-face {
  font-family: Karla Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/designsystem/media/karla-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: Rubik Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url("/designsystem/media/rubik-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF
}

@font-face {
  font-family: Rubik Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url("/designsystem/media/rubik-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
}

/* ---------------- */

:root {
  --primary-font: "Karla Variable", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --heading-font: "Rubik Variable", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --loenmodtager-primary-color: rgba(167, 26, 0, 1);
  --virksomhed-primary-color: rgba(56, 5, 92, 1);
  --fagforening-primary-color: rgba(2, 63, 44, 1);
  --default-primary-color: var(--loenmodtager-primary-color);
  --primary-color: var(--default-primary-color);
}

.loenmodtager-segment {
  --primary-color: var(--loenmodtager-primary-color);
}

.virksomhed-segment {
  --primary-color: var(--virksomhed-primary-color);
}


.fagforening-segment {
  --primary-color: var(--fagforening-primary-color);
}

.field {
  column-gap: 0.5rem;
}

::deep > .label {
  font-weight: bold;
  flex: 1 1 100%;
  order: -6;
}

::deep > .hint {
  opacity: 75%;
  flex: 1 1 100%;
  order: -4;
  zoom: 90%;
}

::deep > .help {
  flex: 1 0 max-content;
  order: -2;
  height: 1.5rem;
}


/*
 "*"-selector (alle elementer) er en virkelig dårlig (og "dyr") selector, men er eneste måde jeg lige kan komme på at omgå at Blazor
 injector css, på lidt random elementer, med overstyring af css variable. Så vi er nød til at tvinge dem tilbage til
 hvad vi ønsker på alle elementer, da vi ikke ved hvor det sker.
 */
body, body * {
  --info: #D1E7DC;
  --body-font: var(--primary-font);
  --type-ramp-base-font-size: 1rem;
  --type-ramp-base-line-height: 1.5rem;
  --fill-color: rgba(246, 241, 233, 1);
  --accent-base-color: var(--primary-color);
  /* --accent-base-color: rgba(0, 120, 212, 1); */

  --neutral-fill-layer-rest: var(--fill-color);
  --accent-fill-rest: color-mix(in srgb, var(--accent-base-color), black 5%);
  --accent-fill-hover: color-mix(in srgb, var(--accent-fill-rest), white 5%);
  --accent-fill-active: color-mix(in srgb, var(--accent-fill-rest), white 10%);
  --accent-fill-focus: var(--accent-fill-rest);
  --accent-foreground-rest: color-mix(in srgb, var(--accent-base-color), black 40%);
  --accent-foreground-hover: color-mix(in srgb, var(--accent-foreground-rest), black 20%);
  --accent-foreground-active: color-mix(in srgb, var(--accent-foreground-rest), white 20%);
  --accent-foreground-focus: var(--accent-foreground-rest);
  --accent-stroke-control-rest-primary: var(--accent-base-color);
  --accent-stroke-control-rest-secondary: color-mix(in srgb, var(--accent-stroke-control-rest-primary), black 30%);
  --accent-stroke-control-rest: linear-gradient(var(--accent-stroke-control-rest-primary) 90%, var(--accent-stroke-control-rest-secondary) 100%);
  --accent-stroke-control-hover-primary: color-mix(in srgb, var(--accent-stroke-control-rest-primary), white 5%);
  --accent-stroke-control-hover-secondary: color-mix(in srgb, var(--accent-stroke-control-hover-primary), black 30%);
  --accent-stroke-control-hover: linear-gradient(var(--accent-stroke-control-hover-primary) 90%, var(--accent-stroke-control-hover-secondary) 100%);
  --accent-stroke-control-active: color-mix(in srgb, var(--accent-stroke-control-rest-primary), white 10%);
  --accent-stroke-control-focus: var(--accent-stroke-control-rest);
}


body {
  font-family: var(--body-font);
  font-size: var(--type-ramp-base-font-size);
  line-height: var(--type-ramp-base-line-height);
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--heading-font);
}
  /* ----- */

  h1:focus {
    outline: none;
  }

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid #e50000;
}

/* fluent button text wrap. Grimt hack :( */
fluent-button::part(control) {
  text-wrap: wrap;
}

fluent-button {
  height: unset !important;
  min-height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
}

Anmod om betaling af deltagergebyr til udbyder

.validation-message {
  color: var(--error);
  font-size: var(--type-ramp-minus-1-font-size);
  display: flex;
  align-items: center;
  column-gap: 4px;
}

.validation-summary {
  color: var(--error);
  font-size: var(--type-ramp-base-font-size);
}

  .validation-summary ul {
    list-style-type: none;
    margin-left: 0;
    padding-left: 0;
  }

  .validation-summary li {
    display: flex;
    align-items: center;
    column-gap: 8px;
  }

.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI26My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA9NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI6My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}

  .blazor-error-boundary::after {
    content: "An error has occurred."
  }

.darker-border-checkbox.form-check-input {
  border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}


.treeview-wordwrap {
  max-height: calc(var(--type-ramp-base-line-height) * 25);
  overflow: scroll;
}

/* Responsive bredde for TreeView - 800px på store skærme, 100% på små */
.treeview-responsive {
  width: 100%;
  width: 800px;
}

/* På små skærme (mindre end 900px) skal træet fylde hele bredden */
@media (max-width: 899px) {
  .treeview-responsive {
    width: 100%;
  }
}

.zebra-tiny-table tbody tr:nth-child(odd) td {
  background-color: rgb(241, 242, 244);
}

.zebra-tiny-table * td {
  padding-top: 0;
  padding-bottom: 0;
}

.zebra-tiny-table thead tr th {
  background-color: rgb(226, 227, 229);
}

.zebra-tiny-table thead fluent-button::part(control) {
  background-color: rgb(226, 227, 229);
}

.zebra-tiny-table * td {
  vertical-align: middle;
  align-content: center !important;
}

  .zebra-tiny-table * td div {
    line-height: var(--type-ramp-plus-3-line-height);
  }

.zebra-tiny-table-action-stack {
  padding-bottom: 10px;
  padding-top: 10px;
}

.round-corners * div {
  border-radius: 5px !important;
  border-color: darkgray !important;
  background: rgba(0,0,0,0) !important;
}

.fondit-label {
  margin-bottom: 8px;
}

.fondit-panel {
  border: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-rest);
  border-radius: calc(var(--control-corner-radius) * 1px);
  padding: 0.5rem 0.5rem;
  margin-top: 10px;
}

  .fondit-panel .with-margins {
    margin-left: 0.5rem;
    margin-right: 0.51rem;
  }

.inner-card {
  background-color: rgba(238, 233, 225, 0.9);
}

.nav-active div {
  background-color: darkgray !important;
}

fluent-card {
  margin: 10px 3px 3px 5px;
}

/* Wrap long selections */
fluent-select:: part(control) {
  height: auto;
  min-height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
}

:root {
  --accordion-background: #f2eadc;
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-primary-text-emphasis: rgb(5.2, 44, 101.2);
  --bs-secondary-text-emphasis: rgb(43.2, 46.8, 50);
  --bs-success-text-emphasis: rgb(10, 54, 33.6);
  --bs-info-text-emphasis: rgb(5.2, 80.8, 96);
  --bs-warning-text-emphasis: rgb(102, 77.2, 2.8);
  --bs-danger-text-emphasis: rgb(88, 21.2, 27.6);
  --bs-light-text-emphasis: #495057;
  --bs-dark-text-emphasis: #495057;
  --bs-primary-bg-subtle: rgb(206.6, 226, 254.6);
  --bs-secondary-bg-subtle: rgb(225.6, 227.4, 229);
  --bs-success-bg-subtle: rgb(209, 231, 220.8);
  --bs-info-bg-subtle: rgb(206.6, 244.4, 252);
  --bs-warning-bg-subtle: rgb(255, 242.6, 205.4);
  --bs-danger-bg-subtle: rgb(248, 214.6, 217.8);
  --bs-light-bg-subtle: rgb(251.5, 252, 252.5);
  --bs-dark-bg-subtle: #ced4da;
  --bs-primary-border-subtle: rgb(158.2, 197, 254.2);
  --bs-secondary-border-subtle: rgb(196.2, 199.8, 203);
  --bs-success-border-subtle: rgb(163, 207, 186.6);
  --bs-info-border-subtle: rgb(158.2, 233.8, 249);
  --bs-warning-border-subtle: rgb(255, 230.2, 155.8);
  --bs-danger-border-subtle: rgb(241, 174.2, 180.6);
  --bs-light-border-subtle: #e9ecef;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: "Karla Variable", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(33, 37, 41, .75);
  --bs-secondary-color-rgb: 33, 37, 41;
  --bs-secondary-bg: #e9ecef;
  --bs-secondary-bg-rgb: 233, 236, 239;
  --bs-tertiary-color: rgba(33, 37, 41, .5);
  --bs-tertiary-color-rgb: 33, 37, 41;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #0d6efd;
  --bs-link-color-rgb: 13, 110, 253;
  --bs-link-decoration: underline;
  --bs-link-hover-color: rgb(10.4, 88, 202.4);
  --bs-link-hover-color-rgb: 10, 88, 202;
  --bs-code-color: #d63384;
  --bs-highlight-color: #212529;
  --bs-highlight-bg: rgb(255, 242.6, 205.4);
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, .175);
  --bs-border-radius: .375rem;
  --bs-border-radius-sm: .25rem;
  --bs-border-radius-lg: .5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
  --bs-box-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, .175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, .075);
  --bs-focus-ring-width: .25rem;
  --bs-focus-ring-opacity: .25;
  --bs-focus-ring-color: rgba(13, 110, 253, .25);
  --bs-form-valid-color: #198754;
  --bs-form-valid-border-color: #198754;
  --bs-form-invalid-color: #dc3545;
  --bs-form-invalid-border-color: #dc3545;
}

/* Responsive bredde og centrering for site-wrapper */
.site-wrapper {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

/* Extra Small - xs: < 600px (Small to large phone) */
@media (max-width: 599px) {
  .site-wrapper {
    padding: 0 0.5rem;
  }
}

/* Small - sm: < 960px (Small to medium tablet) */
@media (max-width: 959px) {
  .site-wrapper {
    max-width: 100%;
    padding: 0 0.75rem;
  }
}

/* Medium - md: < 1280px (Large tablet to laptop) */
@media (max-width: 1279px) {
  .site-wrapper {
    max-width: 100%;
  }
}

/* Large - over 1280px (Desktop) */
@media (min-width: 1280px) {
  .site-wrapper {
    max-width: 1280px;
  }
}

/* Print-optimering for nyhjemmeside */
@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact !important;
  }

  .main-layout-navmenu {
    display: none
  }

  body {
    font-size: 12pt;
    line-height: 1.4;
    background: white !important;
    color: black !important;
  }

  /* Undgå sidebrud i vigtige elementer */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    color: black !important;
  }

  /* Bedre mellemrum mellem sektioner */
  .site-wrapper {
    margin: 0 !important;
    padding: 0 !important;
  }
}