/*
Datoden WordPress 1.10.225 — 2026-10-03 | Logga in: Ny här? behåller ramen (i bakgrundens färg), bara färgerna byts – inget flyttar sig.
Datoden WordPress 1.10.224 — 2026-10-03 | Logga in: Ny här? som tidigare; när Logga in lyser upp smälter rutan in och Skapa konto blir som den otända Logga in-knappen.
Datoden WordPress 1.10.155 — 2026-10-02 | Logga in/Registrera: knappen blir blå när fälten är ifyllda (sub-datoden.css:s grå .datoden-button skrivs över).
Datoden WordPress 1.10.152 — 2026-10-02 | Logga in-menyn: .datoden-login-menu-closebar (bara stängknappen), ingen rubrikrad.
Datoden WordPress v21 — 2026-09-28 | Gamla spacing-regler för Företagsnamn (v17–v19) borttagna; spacing hanteras i registration-spacing.css.
Datoden WordPress v19 — 2026-09-28 | Exakt verifierad spacing för Företagsnamn och hjälptext.
Datoden WordPress v18 — 2026-09-28 | Stabilt mellanrum runt Företagsnamn och hjälptext.
Datoden WordPress v17 — 2026-09-28 | Justerad luft runt Företagsnamn i registreringen.
*/
@import url("https://datoden.se/konto/assets/css/portal.css?v=208");
.datoden-portal-icons{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.datoden-portal-header-host{position:relative;z-index:10000;min-height:42px;width:100%;font:13px/1.4 system-ui,sans-serif}
.datoden-portal-header-host .datoden-brand,.datoden-portal-header-host .datoden-appswitch{flex:0 0 auto}
.datoden-portal-header-host .datoden-appswitch-btn{white-space:nowrap}
.datoden-portal-header-host .datoden-accountmenu{min-width:0}
@media(max-width:650px){.datoden-portal-header-host .datoden-accountmenu{flex:0 1 auto}.datoden-portal-header-host .datoden-account-btn{max-width:100%!important}}
#datodenPortalHeader[hidden]{display:none!important}
.datoden-portal-authenticated .datoden-wp-login-item{display:none!important}
.datoden-wp-login-item>a{cursor:pointer}
.datoden-portal-main{padding:24px 0 48px;min-height:60vh;background:radial-gradient(ellipse at 50% 10%,rgb(57 83 164 / 7%),transparent 65%)}
body.admin-bar .datoden-account-overlay{padding-top:102px!important}
@media(max-width:782px){body.admin-bar .datoden-account-overlay{padding-top:116px!important}}
@media(max-width:480px){.datoden-portal-main{padding:8px 0 24px}}

/* The dropdown changes placement only; inputs, button, close icon and disclosure use central components. */
.datoden-auth-card.datoden-login-menu{position:fixed;inset:auto;top:var(--datoden-login-top,50px);left:var(--datoden-login-left,8px);z-index:2147483500;width:var(--datoden-login-width,min(400px,calc(100vw - 16px)));max-width:calc(100vw - 16px);max-height:var(--datoden-login-height,calc(100dvh - 64px));margin:0;padding:24px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;transform-origin:top right;animation:datoden-login-expand 160ms ease-out}
.datoden-login-menu[hidden]{display:none!important}
/* 1.10.152: ingen rubrikrad "Datoden-konto" – bara stängknappen uppe till höger, innehållet börjar högst upp */.datoden-login-menu-closebar{height:0;margin:0;padding:0}.datoden-auth-card.datoden-login-menu .datoden-login-title{padding-right:44px;margin-top:-5px}
.datoden-auth-card .datoden-login-title{margin:0 0 8px;font-size:23px;line-height:1.3;letter-spacing:normal}

.datoden-login-trigger:focus-visible{outline:2px solid var(--datoden-brand-blue,var(--datoden-accent,#3953a4));outline-offset:-3px}
.datoden-login-menu form[aria-busy=true]{cursor:progress}
.datoden-login-noscript{padding:12px 20px;text-align:center}
@keyframes datoden-login-expand{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:480px){.datoden-auth-card.datoden-login-menu{padding:20px}}
@media(prefers-reduced-motion:reduce){.datoden-auth-card.datoden-login-menu{animation:none}}

/* Guest controls inherit the site's ordinary menu link colours and typography. */
.datoden-portal-authenticated .datoden-demo-menu-item{display:none!important}
.datoden-demo-menu{position:relative}
.datoden-demo-menu>a,.datoden-wp-login-item>a{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.datoden-menu-chevron{display:block;width:14px;height:14px;flex:0 0 14px;fill:none;stroke:currentColor;transition:transform 180ms ease;pointer-events:none}
:is([data-datoden-demo-trigger],[data-datoden-login-trigger])[aria-expanded="true"]>.datoden-menu-chevron{transform:rotate(180deg)}
.datoden-demo-menu .datoden-demo-choices{position:absolute;right:0;top:calc(100% + 8px);display:flex;flex-direction:column;gap:0;min-width:200px;z-index:30;list-style:none;margin:0;border:1px solid var(--color-border,#c8cdd2);background:var(--color-surface,#fff)}
.datoden-demo-menu .datoden-demo-choices[hidden]{display:none!important}
.datoden-demo-choices li{width:100%}
.datoden-demo-choices a{white-space:nowrap}
@media(max-width:700px){.datoden-demo-menu .datoden-demo-choices{position:static;box-shadow:none;margin-top:8px}}
@media(prefers-reduced-motion:reduce){.datoden-menu-chevron{transition:none}}

/* Account links: ordinary text actions, not another filled button variant. */
.datoden-auth-links{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:18px}
.datoden-auth-links a,.datoden-auth-card .datoden-auth-text-action{font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.datoden-auth-card .datoden-auth-text-action{display:inline;width:auto;height:auto;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.datoden-auth-links a:hover,.datoden-auth-card .datoden-auth-text-action:hover{color:var(--datoden-bar-link,var(--datoden-brand-blue,var(--datoden-accent,#3953a4)));background:none}
.datoden-auth-links a:focus-visible,.datoden-auth-card .datoden-auth-text-action:focus-visible{outline:2px solid var(--datoden-brand-blue,var(--datoden-accent,#3953a4));outline-offset:4px}
.datoden-auth-links .datoden-auth-help{margin:0}
.datoden-auth-card .datoden-auth-hint{display:block;margin:-6px 0 14px;color:var(--datoden-bar-muted,#62645f);font-size:13px;line-height:1.4}

.datoden-auth-card [hidden]{display:none!important}

/* v37: animerad laddningsikon bredvid text som berättar vad som pågår, t.ex. "Öppnar inloggningen…". */
.datoden-loading-inline{display:flex;align-items:center;gap:10px}
.datoden-loading-inline::before{content:"";flex:0 0 16px;width:16px;height:16px;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;opacity:.75;animation:datoden-spin .8s linear infinite}
@keyframes datoden-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.datoden-loading-inline::before{animation-duration:2.4s}}

/* v44 — Rullgardin och inloggningsruta i samma formspråk som webbplatsen och apparna */
.datoden-demo-menu .datoden-demo-choices{border-radius:16px;padding:8px;border-color:var(--datoden-bar-border,#dfe3ee);box-shadow:0 18px 44px rgba(30,45,100,.18)}
.datoden-demo-choices a{display:block;border-radius:10px;padding:10px 12px;font-weight:650;text-decoration:none}
.datoden-demo-choices a:hover,.datoden-demo-choices a:focus-visible{background:var(--datoden-bar-hover,var(--datoden-accent-tint,#eef0f8));color:var(--datoden-accent,#3953a4)}
.datoden-auth-card.datoden-login-menu{border-radius:22px;border-color:var(--datoden-bar-border,#dfe3ee);box-shadow:0 30px 80px rgba(30,45,100,.28)}
.datoden-login-menu-closebar .datoden-account-close{border-radius:50%;width:36px;height:36px}
/* 1.10.155: knappen blir blå när alla obligatoriska fält har något ifyllt (portal.js sätter du-btn--primary). Samma färger som Skapa konto. */
/* I ljust läge sätter lagret datoden-light-buttons (sub-datoden.css) grå knappar med !important; lagret datoden-ui deklareras först och vinner därför. */
@layer datoden-ui{
html body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary{background:var(--datoden-accent,#3953a4)!important;border-color:var(--datoden-accent,#3953a4)!important;color:var(--datoden-on-accent,#fff)!important}
html body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary:hover,html body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary:focus-visible{background:var(--datoden-accent-dark,#2f4690)!important;border-color:var(--datoden-accent-dark,#2f4690)!important}
html[data-theme="dark"] body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary,html.datoden-theme-dark body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary{background:var(--datoden-accent-light,#7d95e8)!important;border-color:var(--datoden-accent-light,#7d95e8)!important;color:#0f1420!important}
html[data-theme="dark"] body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary:hover,html.datoden-theme-dark body .datoden-auth-card [data-datoden-login-form] button[type=submit].du-btn--primary:hover{background:var(--datoden-accent-light,#93a8ef)!important;border-color:var(--datoden-accent-light,#93a8ef)!important}
}

/* 1.10.253: i mobilappen (sidan i appskalet) sitter inloggningsrutan fast i nederkant som appens andra ark, med mörk bakgrund bakom */
@keyframes ddp-login-sheet-up{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
html.ddp-inshell .datoden-auth-card.datoden-login-menu{top:auto!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;max-width:560px!important;margin:0 auto!important;max-height:calc(100dvh - 24px)!important;border-radius:22px 22px 0 0!important;box-shadow:0 -10px 40px rgba(0,0,0,.25),0 0 0 100vmax rgba(10,14,30,.45)!important;transform-origin:bottom center!important;animation:ddp-login-sheet-up .2s ease-out!important}
@media (prefers-reduced-motion:reduce){html.ddp-inshell .datoden-auth-card.datoden-login-menu{animation:none!important}}
/* 1.10.254: inloggningsrutan i mobilappen med samma utseende som appens ark (Mer): grepp, rundade övre hörn, knappen Stäng nederst */
html.ddp-inshell .datoden-auth-card.datoden-login-menu{box-sizing:border-box!important;scrollbar-gutter:auto!important;padding:10px 16px 14px!important;border:0!important;background:var(--du-card,#fff)!important;color:var(--du-ink,#141824)!important}
html.ddp-inshell .datoden-login-menu .datoden-login-menu-closebar{display:none!important}
html.ddp-inshell .datoden-login-menu .ddp-sheet-grip{display:block;width:40px;height:5px;margin:2px auto 10px;border-radius:3px;background:var(--du-line,#dfe3ee)}
html.ddp-inshell .datoden-login-menu .ddp-sheet-close{display:block;width:100%;margin-top:12px;padding:13px;border:0;border-radius:14px;background:var(--du-soft,#eef0f8);color:inherit;font:700 16px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;cursor:pointer}
.datoden-login-menu .ddp-sheet-grip,.datoden-login-menu .ddp-sheet-close{display:none}
html.ddp-inshell .datoden-login-menu .ddp-sheet-grip,html.ddp-inshell .datoden-login-menu .ddp-sheet-close{display:block}
/* 1.10.259: Håll mig inloggad och Logga in med passkey */
.datoden-auth-card .datoden-remember,.datoden-remember{display:flex!important;align-items:center;gap:10px;margin:2px 0 14px;font-weight:500;cursor:pointer;user-select:none}
.datoden-auth-card .datoden-remember input[type=checkbox],.datoden-remember input[type=checkbox]{display:inline-block!important;flex:none;width:18px!important;height:18px!important;min-height:0!important;margin:0!important;padding:0!important;border-radius:4px!important;accent-color:var(--datoden-accent,#3953a4);background:none;box-shadow:none}
.datoden-passkey{margin:14px 0 4px}
.datoden-passkey[hidden]{display:none!important}
.datoden-passkey-or{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:13px;color:color-mix(in srgb,currentColor 60%,transparent)}
.datoden-passkey-or::before,.datoden-passkey-or::after{content:"";flex:1;height:1px;background:currentColor;opacity:.25}
.datoden-auth-card .datoden-passkey-btn,.datoden-passkey-btn{display:flex!important;align-items:center;justify-content:center;gap:9px;width:100%;background:transparent!important;color:inherit!important;border:1px solid var(--datoden-bar-border,#c8cdd2)!important;box-shadow:none!important}
.datoden-auth-card .datoden-passkey-btn:hover,.datoden-passkey-btn:hover{background:color-mix(in srgb,currentColor 7%,transparent)!important}
.datoden-passkey-btn svg{width:20px;height:20px;flex:none}
/* 1.10.276: Fortsätt med Google, Microsoft, Apple, Facebook och GitHub */
.datoden-social{display:grid;gap:10px;margin:2px 0 16px;container-type:inline-size}
.datoden-social-btn{display:flex!important;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;height:46px;min-height:0;margin:0!important;padding:0 14px!important;border-radius:12px;border:1px solid var(--datoden-bar-border,#c8cdd2);background:transparent;color:inherit!important;font-weight:700;font-size:15px;line-height:1.2;text-decoration:none!important;transition:background .15s,border-color .15s}
.datoden-social-btn:hover{background:color-mix(in srgb,currentColor 7%,transparent)}
.datoden-social-btn:focus-visible{outline:2px solid var(--datoden-accent,#3953a4);outline-offset:2px}
.datoden-social-btn img{width:22px;height:22px;flex:none;object-fit:contain}
.datoden-social-btn.is-busy{opacity:.6;pointer-events:none;cursor:progress}
.datoden-social-row{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:8px}
.datoden-social-row .datoden-social-btn{font-size:13.5px;gap:7px;padding:0 6px!important}
.datoden-social-or{display:flex;align-items:center;gap:12px;margin:6px 0 0;font-size:13px;color:color-mix(in srgb,currentColor 60%,transparent)}
.datoden-social-or::before,.datoden-social-or::after{content:"";flex:1;height:1px;background:currentColor;opacity:.25}
.datoden-social-who{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,currentColor 6%,transparent);font-weight:600;word-break:break-all}
.datoden-social-who img{width:18px;height:18px;flex:none}
.datoden-social-terms{align-items:flex-start!important;margin-top:10px}
.datoden-social-terms a{color:inherit;text-decoration:underline}
/* 1.10.282: kompakt rad, "Senast använd", Skapa konto längst ner */
.datoden-social-btn{position:relative}
.datoden-social-btn.is-last{border-color:color-mix(in srgb,var(--datoden-brand-blue,var(--datoden-accent,#3953a4)) 60%,transparent);background:color-mix(in srgb,var(--datoden-brand-blue,var(--datoden-accent,#3953a4)) 8%,transparent)}
.datoden-social-last{position:absolute;top:-8px;left:50%;transform:translateX(-50%);padding:1px 7px;border-radius:999px;background:var(--datoden-brand-blue,var(--datoden-accent,#3953a4));color:#fff;font-size:10.5px;font-weight:700;line-height:15px;white-space:nowrap;pointer-events:none}
.datoden-register-link{display:flex;align-items:center;justify-content:center;gap:6px;margin:16px 0 0;padding:12px 10px 2px;border-top:1px solid color-mix(in srgb,currentColor 14%,transparent);color:inherit!important;text-decoration:none!important;font-size:14px}
.datoden-register-link span{opacity:.75}
.datoden-register-link strong{color:var(--datoden-brand-blue,var(--datoden-accent,#3953a4))}
html.datoden-theme-dark .datoden-register-link strong,html[data-theme="dark"] .datoden-register-link strong{color:var(--du-accent,#9cacdf)}
.datoden-register-link svg{width:16px;height:16px;flex:none;color:var(--datoden-brand-blue,var(--datoden-accent,#3953a4))}
.datoden-register-link:hover strong{text-decoration:underline}
/* 1.10.283: ikon med liten text under ("Fortsätt med" + leverantör), alla bredder */
.datoden-social-row:not(.is-one) .datoden-social-btn{flex-direction:column;gap:5px;height:auto;min-height:70px;padding:10px 4px 8px!important}
.datoden-social-row:not(.is-one) .datoden-social-btn img{width:24px;height:24px}
.datoden-social-label{display:flex;flex-direction:column;align-items:center;line-height:1.15;text-align:center;font-size:12.5px;font-weight:700}
.datoden-social-label small{font-size:10.5px;font-weight:500;opacity:.7}
.datoden-social-row.is-one .datoden-social-label{flex-direction:row;gap:.3em;font-size:15px}
.datoden-social-row.is-one .datoden-social-label small{font-size:inherit;font-weight:inherit;opacity:1}