/* =========================================================
   Manuel wrapper
   Valgfri klasse til artikler eller tekstblokke
========================================================= */
.hmck-box {
    border: 1px solid #d9dee5;
    border-radius: 0.9rem;
    background: #ffffff;
    padding: 1.1rem 1.2rem;
    margin: 1rem 0;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
}

/* =========================================================
   Formularfelter og knapper
   Giver samme runding som resten af designet.
========================================================= */
.btn,
.form-control,
.form-select,
.inputbox {
    border-radius: 0.9rem !important;
}

/* =========================================================
   Artikel-links
   Mere rolig og moderne link-stil i artikeltekster.
========================================================= */
.com-content-article__body a {
    text-decoration: none;
    border-bottom: 1px solid rgba(13, 110, 253, .35);
}

.com-content-article__body a:hover {
    border-bottom-color: rgba(13, 110, 253, .8);
}

/* =========================================================
   Dropdown- og undermenu-design
========================================================= */
/* Selve dropdown-kortet */
.container-header .dropdown-menu {
    background: #f3f4f6 !important;
    background-color: #f3f4f6 !important;
    border: none;
    border-radius: var(--bs-border-radius);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .08);
}

/* Tving alle indre niveauer i dropdown/submenu */
.container-header .dropdown-menu ul,
.container-header .dropdown-menu li,
.container-header .dropdown-menu .dropdown-item,
.container-header .dropdown-menu .dropdown-toggle,
.container-header .metismenu.mod-menu .mm-collapse,
.container-header .metismenu.mod-menu .mm-collapse > li,
.container-header .metismenu.mod-menu .mm-collapse > li > a,
.container-header .metismenu.mod-menu .mm-collapse > li > button {
    background: #f3f4f6 !important;
    background-color: #f3f4f6 !important;
}

/* Let runding på enkelte dropdown-links */
.container-header .dropdown-menu .dropdown-item {
    border-radius: var(--bs-border-radius-sm);
}

/* Hover-effekt */
.container-header .dropdown-menu .dropdown-item:hover,
.container-header .dropdown-menu .dropdown-toggle:hover,
.container-header .metismenu.mod-menu .mm-collapse > li > a:hover,
.container-header .metismenu.mod-menu .mm-collapse > li > button:hover {
    background: #e5e7eb !important;
    background-color: #e5e7eb !important;
    color: inherit;
}

/* Fokus/aktiv */
.container-header .dropdown-menu .dropdown-item:focus,
.container-header .dropdown-menu .dropdown-item:active,
.container-header .dropdown-menu .dropdown-item.active,
.container-header .dropdown-menu .dropdown-toggle:focus,
.container-header .dropdown-menu .dropdown-toggle:active,
.container-header .metismenu.mod-menu .mm-collapse > li > a:focus,
.container-header .metismenu.mod-menu .mm-collapse > li > button:focus {
    background: #f3f4f6 !important;
    background-color: #f3f4f6 !important;
    color: inherit !important;
    box-shadow: none !important;
}

/* =========================================================
   Mobil-header og mobilmenu
========================================================= */
@media (max-width: 991.98px) {

    header.header.container-header,
    header.header.container-header.full-width {
        /* position: sticky !important; */
        top: 0 !important;
        z-index: 1030 !important;
        padding-top: 0.1rem;
        padding-bottom: 0.1rem;
    }

    .container-header .grid-child {
        padding-top: 0.1rem;
        padding-bottom: 0.1rem;
    }

    .container-header .navbar-brand {
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .container-header .navbar-brand img,
    .container-header .brand-logo img,
    .container-header .logo {
        max-height: 60px;
        width: auto;
    }

    .container-header .container-nav {
        margin-top: -0.6rem;
        padding-top: 0;
    }

    .container-header .navbar-toggler {
        margin-top: 0;
        margin-bottom: 4px;
        padding-top: 0.2rem;
        padding-bottom: 0.2rem;
    }

    .container-header .navbar-nav .nav-link {
        padding: 0.75rem 0;
        font-size: 1.05rem;
    }

    .container-header .navbar-collapse {
        margin-top: 0.6rem;
    }

    .container-header .navbar-nav {
        gap: 0.2rem;
    }

    .container-header .navbar-nav .nav-link:hover {
        background: rgba(0, 0, 0, .04);
        border-radius: var(--bs-border-radius);
        padding-left: 0.5rem;
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    .container-header .container-nav {
        margin-top: -0.7rem;
        padding-top: 0.4rem;
    }

    .container-header .navbar-toggler {
        margin-top: 0.25rem;
        margin-bottom: 0.25rem;
    }

    .container-header .navbar-brand,
    .container-header .navbar-brand img,
    .container-header .brand-logo img,
    .container-header .logo {
        margin-bottom: 0;
    }
}

/* =========================================================
   Runde hjørner på moduler
========================================================= */
.moduletable,
.card,
[class*="moduletable"],
[class*="module"] {
    border-radius: 0.9rem !important;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
}