@dnb/eufemia/components/anchor/style/dnb-anchor--isolated.min.css

DNB Eufemia Design System UI Library

.eufemia-scope--11_0_0 button.dnb-anchor{-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;line-height:calc(var(--line-height-basis) + .125rem)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor{--anchor-underline-thickness:0.0938rem;--anchor-color:var(--anchor-color--default);--anchor-icon-color:var(--anchor-icon-color--default);--anchor-color--default:var(--token-color-text-action);--anchor-color--hover:var(--token-color-text-action-hover);--anchor-color--active:var(--token-color-text-action-pressed);--anchor-icon-color--default:var(--token-color-icon-action);--anchor-icon-color--hover:var(--token-color-icon-action-hover);--anchor-icon-color--active:var(--token-color-icon-action-pressed);--anchor-bg--hover:var(--token-color-background-action-hover-subtle);--anchor-bg--active:var(--token-color-background-action-pressed-subtle);--anchor-icon-gutter:0.25em;--anchor-icon-separator:"\2060";--anchor-icon-position:translateY(-0.175em);border-radius:.25em;display:inline;font-size:var(--font-size-basis);padding:.05575em 0;-webkit-text-decoration:underline;text-decoration:underline;text-decoration-color:currentcolor;text-decoration-thickness:var(--anchor-underline-thickness);text-underline-offset:.25em}.eufemia-scope--11_0_0 sub :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 sup :where(:not(.dnb-anchor--no-style)).dnb-anchor{padding:0 .025em}.eufemia-scope--11_0_0 .dnb-h--basis :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--large :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--medium :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--small :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--x-large :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--x-small :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--xx-large :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-lead :where(:not(.dnb-anchor--no-style)).dnb-anchor,.eufemia-scope--11_0_0 .dnb-p :where(:not(.dnb-anchor--no-style)).dnb-anchor{font-size:inherit}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor{color:var(--anchor-color)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:focus-visible{--anchor-color:var(--token-color-text-action-focus);--anchor-icon-color:var(--token-color-icon-action-focus);--focus-ring-width:0.25rem;transition:none}.eufemia-scope--11_0_0 .dnb-section :where(:not(.dnb-anchor--no-style)).dnb-anchor:focus-visible.dnb-anchor,.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:focus-visible{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:focus-visible{--border-color:var(--token-color-stroke-action-focus);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color),inset 100vw 100vw 0 0 var(--token-color-background-action-focus-subtle),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--token-color-background-action-focus-subtle),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--token-color-background-action-focus-subtle);outline:none}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)){--anchor-color:var(--anchor-color--hover);--anchor-icon-color:var(--anchor-icon-color--hover);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--hover),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--hover),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--hover)}.eufemia-scope--11_0_0 .dnb-section :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)).dnb-anchor,.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)){-webkit-text-decoration:none;text-decoration:none}@supports not (selector(*:where(*))){.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:not(.dnb-anchor--no-hover){--anchor-color:var(--anchor-color--hover);--anchor-icon-color:var(--anchor-icon-color--hover);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--hover),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--hover),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--hover)}.eufemia-scope--11_0_0 .dnb-section :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:not(.dnb-anchor--no-hover).dnb-anchor,.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:hover:not(.dnb-anchor--no-hover){-webkit-text-decoration:none;text-decoration:none}}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:active{--anchor-color:var(--anchor-color--active);--anchor-icon-color:var(--anchor-icon-color--active);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--active),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--active),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--active)}.eufemia-scope--11_0_0 .dnb-section :where(:not(.dnb-anchor--no-style)).dnb-anchor:active.dnb-anchor,.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor:active{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor{transition:box-shadow .2s ease-in-out,color .2s ease-in-out,background .2s ease-in-out}.eufemia-scope--11_0_0 [data-visual-test-wrapper] :where(:not(.dnb-anchor--no-style)).dnb-anchor{transition:none}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor .dnb-icon{color:var(--anchor-icon-color);display:inline;vertical-align:middle;white-space:nowrap}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor .dnb-icon svg{font-size:.5em;height:1em;pointer-events:none;transform:scale(2) var(--anchor-icon-position);vertical-align:baseline;width:2em}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor--no-icon .dnb-icon{display:none}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor--icon-left .dnb-icon:first-child:after{content:var(--anchor-icon-separator)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor--icon-left .dnb-icon:first-child svg{margin-right:calc(var(--anchor-icon-gutter)*2)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor--icon-right .dnb-icon:last-child:before{content:var(--anchor-icon-separator)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor--icon-right .dnb-icon:last-child svg{margin-left:calc(var(--anchor-icon-gutter)*2)}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor .dnb-icon--default{font-size:.8888888889em}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor.dnb-anchor--surface-dark{--anchor-color--default:var(--token-color-text-action-ondark);--anchor-color--hover:var(--token-color-text-action-ondark);--anchor-color--active:var(--token-color-text-action-ondark);--anchor-icon-color--default:var(--token-color-icon-action-ondark);--anchor-icon-color--hover:var(--token-color-icon-action-hover-ondark);--anchor-icon-color--active:var(--token-color-icon-action-ondark);--anchor-bg--hover:var(
    --token-color-background-action-hover-subtle-ondark
  );--anchor-bg--active:var(
    --token-color-background-action-pressed-subtle-ondark
  )}.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor.dnb-anchor--disabled,.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor[aria-disabled=true],.eufemia-scope--11_0_0 :where(:not(.dnb-anchor--no-style)).dnb-anchor[disabled]{--anchor-color:var(--token-color-text-action-disabled);--anchor-icon-color:var(--token-color-icon-action-disabled)}@supports not (selector(*:where(*))){.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor{--anchor-underline-thickness:0.0938rem;--anchor-color:var(--anchor-color--default);--anchor-icon-color:var(--anchor-icon-color--default);--anchor-color--default:var(--token-color-text-action);--anchor-color--hover:var(--token-color-text-action-hover);--anchor-color--active:var(--token-color-text-action-pressed);--anchor-icon-color--default:var(--token-color-icon-action);--anchor-icon-color--hover:var(--token-color-icon-action-hover);--anchor-icon-color--active:var(--token-color-icon-action-pressed);--anchor-bg--hover:var(--token-color-background-action-hover-subtle);--anchor-bg--active:var(--token-color-background-action-pressed-subtle);--anchor-icon-gutter:0.25em;--anchor-icon-separator:"\2060";--anchor-icon-position:translateY(-0.175em);border-radius:.25em;display:inline;font-size:var(--font-size-basis);padding:.05575em 0;-webkit-text-decoration:underline;text-decoration:underline;text-decoration-color:currentcolor;text-decoration-thickness:var(--anchor-underline-thickness);text-underline-offset:.25em}.eufemia-scope--11_0_0 sub :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 sup :not(.dnb-anchor--no-style).dnb-anchor{padding:0 .025em}.eufemia-scope--11_0_0 .dnb-h--basis :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--large :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--medium :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--small :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--x-large :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--x-small :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-h--xx-large :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-lead :not(.dnb-anchor--no-style).dnb-anchor,.eufemia-scope--11_0_0 .dnb-p :not(.dnb-anchor--no-style).dnb-anchor{font-size:inherit}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor{color:var(--anchor-color)}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:focus-visible{--anchor-color:var(--token-color-text-action-focus);--anchor-icon-color:var(--token-color-icon-action-focus);--focus-ring-width:0.25rem;transition:none}.eufemia-scope--11_0_0 .dnb-section :not(.dnb-anchor--no-style).dnb-anchor:focus-visible.dnb-anchor,.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:focus-visible{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:focus-visible{--border-color:var(--token-color-stroke-action-focus);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color),inset 100vw 100vw 0 0 var(--token-color-background-action-focus-subtle),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--token-color-background-action-focus-subtle),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--token-color-background-action-focus-subtle);outline:none}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)){--anchor-color:var(--anchor-color--hover);--anchor-icon-color:var(--anchor-icon-color--hover);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--hover),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--hover),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--hover)}.eufemia-scope--11_0_0 .dnb-section :not(.dnb-anchor--no-style).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)).dnb-anchor,.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:hover:where(:not(.dnb-anchor--no-hover)){-webkit-text-decoration:none;text-decoration:none}@supports not (selector(*:where(*))){.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:hover:not(.dnb-anchor--no-hover){--anchor-color:var(--anchor-color--hover);--anchor-icon-color:var(--anchor-icon-color--hover);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--hover),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--hover),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--hover)}.eufemia-scope--11_0_0 .dnb-section :not(.dnb-anchor--no-style).dnb-anchor:hover:not(.dnb-anchor--no-hover).dnb-anchor,.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:hover:not(.dnb-anchor--no-hover){-webkit-text-decoration:none;text-decoration:none}}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:active{--anchor-color:var(--anchor-color--active);--anchor-icon-color:var(--anchor-icon-color--active);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--active),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--active),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--active)}.eufemia-scope--11_0_0 .dnb-section :not(.dnb-anchor--no-style).dnb-anchor:active.dnb-anchor,.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor:active{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor{transition:box-shadow .2s ease-in-out,color .2s ease-in-out,background .2s ease-in-out}.eufemia-scope--11_0_0 [data-visual-test-wrapper] :not(.dnb-anchor--no-style).dnb-anchor{transition:none}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor .dnb-icon{color:var(--anchor-icon-color);display:inline;vertical-align:middle;white-space:nowrap}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor .dnb-icon svg{font-size:.5em;height:1em;pointer-events:none;transform:scale(2) var(--anchor-icon-position);vertical-align:baseline;width:2em}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor--no-icon .dnb-icon{display:none}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor--icon-left .dnb-icon:first-child:after{content:var(--anchor-icon-separator)}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor--icon-left .dnb-icon:first-child svg{margin-right:calc(var(--anchor-icon-gutter)*2)}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor--icon-right .dnb-icon:last-child:before{content:var(--anchor-icon-separator)}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor--icon-right .dnb-icon:last-child svg{margin-left:calc(var(--anchor-icon-gutter)*2)}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor .dnb-icon--default{font-size:.8888888889em}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor.dnb-anchor--surface-dark{--anchor-color--default:var(--token-color-text-action-ondark);--anchor-color--hover:var(--token-color-text-action-ondark);--anchor-color--active:var(--token-color-text-action-ondark);--anchor-icon-color--default:var(--token-color-icon-action-ondark);--anchor-icon-color--hover:var(--token-color-icon-action-hover-ondark);--anchor-icon-color--active:var(--token-color-icon-action-ondark);--anchor-bg--hover:var(
      --token-color-background-action-hover-subtle-ondark
    );--anchor-bg--active:var(
      --token-color-background-action-pressed-subtle-ondark
    )}.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor.dnb-anchor--disabled,.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor[aria-disabled=true],.eufemia-scope--11_0_0 :not(.dnb-anchor--no-style).dnb-anchor[disabled]{--anchor-color:var(--token-color-text-action-disabled);--anchor-icon-color:var(--token-color-icon-action-disabled)}}.eufemia-scope--11_0_0 .dnb-anchor--hover{--anchor-color:var(--anchor-color--hover);--anchor-icon-color:var(--anchor-icon-color--hover);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--hover),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--hover),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--hover)}.eufemia-scope--11_0_0 .dnb-anchor--hover,.eufemia-scope--11_0_0 .dnb-section .dnb-anchor--hover.dnb-anchor{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 .dnb-anchor--active{--anchor-color:var(--anchor-color--active);--anchor-icon-color:var(--anchor-icon-color--active);box-shadow:inset 100vw 100vw 0 0 var(--anchor-bg--active),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--anchor-bg--active),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--anchor-bg--active)}.eufemia-scope--11_0_0 .dnb-anchor--active,.eufemia-scope--11_0_0 .dnb-section .dnb-anchor--active.dnb-anchor{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 .dnb-anchor--focus{--anchor-color:var(--token-color-text-action-focus);--anchor-icon-color:var(--token-color-icon-action-focus);--focus-ring-width:0.25rem;transition:none}.eufemia-scope--11_0_0 .dnb-anchor--focus,.eufemia-scope--11_0_0 .dnb-section .dnb-anchor--focus.dnb-anchor{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 .dnb-anchor--focus{--border-color:var(--token-color-stroke-action-focus);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color),inset 100vw 100vw 0 0 var(--token-color-background-action-focus-subtle),calc(var(--anchor-background-gutter-left, .125rem)*-1) 0 0 0 var(--token-color-background-action-focus-subtle),var(--anchor-background-gutter-right,.125rem) 0 0 0 var(--token-color-background-action-focus-subtle);outline:none}.eufemia-scope--11_0_0 .dnb-anchor--no-underline,.eufemia-scope--11_0_0 .dnb-section .dnb-anchor--no-underline.dnb-anchor{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 .dnb-anchor--no-radius,.eufemia-scope--11_0_0 .dnb-anchor--no-radius:active,.eufemia-scope--11_0_0 .dnb-anchor--no-radius:focus-visible,.eufemia-scope--11_0_0 .dnb-anchor--no-radius:hover{border-radius:0}.eufemia-scope--11_0_0 .dnb-anchor--no-animation,.eufemia-scope--11_0_0 a.dnb-button{transition:none}.eufemia-scope--11_0_0 .dnb-anchor.dnb-skeleton,.eufemia-scope--11_0_0 .dnb-skeleton>.dnb-anchor{-webkit-text-decoration:none;text-decoration:none}.eufemia-scope--11_0_0 .dnb-anchor.dnb-skeleton .dnb-icon,.eufemia-scope--11_0_0 .dnb-skeleton>.dnb-anchor .dnb-icon{filter:grayscale(100%) opacity(.3)}