/* By Bang Mega Menu - VERSION 1.3.3 */
.bbm { position: relative; width: 100%; }
.bbm ul { list-style: none; margin: 0; padding: 0; }
.bbm a { text-decoration: none; }
.bbm .bbm-burger { display: none; }

/* ---- Topbjaelke (desktop) ---- */
.bbm .bbm-top {
    display: flex;
    justify-content: var(--bbm-align, center);
    align-items: center;
    flex-wrap: wrap;
    gap: var(--bbm-gap, 6px);
}
.bbm .bbm-toplink-wrap { display: inline-flex; align-items: center; }
.bbm .bbm-toplink {
    font-family: 'ClanOT-Book', sans-serif;
    font-size: var(--bbm-top-size, 16px);
    font-weight: var(--bbm-top-weight, 800);
    line-height: 1.25;
    color: var(--bbm-top-color, #333) !important;
    text-transform: uppercase;
    padding: 13px var(--bbm-top-pad-x, 20px);
    display: inline-block;
    transition: color .2s ease;
}
.bbm .bbm-item:hover > .bbm-toplink-wrap .bbm-toplink,
.bbm .bbm-toplink:focus { color: var(--bbm-top-hover, #00948b) !important; }

/* Caret: udfyldt trekant */
.bbm .bbm-caret {
    background: none; border: 0; cursor: pointer; padding: 0;
    width: 14px; height: 14px; position: relative; margin-left: 2px;
}
.bbm .bbm-caret::after {
    content: ""; display: block; width: 0; height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid var(--bbm-top-hover, #00948b);
    transition: transform .2s ease;
    margin: 0 auto;
}
.bbm:not(.bbm-mob) .bbm-item:hover > .bbm-toplink-wrap .bbm-caret::after { transform: rotate(180deg); }

/* ---- Mega-panel (desktop) ---- */
.bbm .bbm-panel {
    position: absolute;
    top: calc(100% + var(--bbm-panel-top, 0px));
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    background: var(--bbm-panel-bg, #fff);
    box-shadow: 0 14px 24px rgba(0,0,0,.08);
    border-top: 1px solid #eee;
    opacity: 0;
    visibility: hidden;
    transition: opacity .18s ease;
    z-index: 999;
}
.bbm:not(.bbm-mob) .bbm-item:hover > .bbm-panel,
.bbm:not(.bbm-mob) .bbm-item:focus-within > .bbm-panel { opacity: 1; visibility: visible; }
.bbm:not(.bbm-mob) .bbm-panel::before {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 100%;
    height: var(--bbm-panel-top, 0px);
}
.bbm .bbm-cols {
    display: flex;
    justify-content: var(--bbm-cols-align, center);
    gap: 60px;
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--bbm-panel-pad-top, 45px) 40px 55px calc(40px + var(--bbm-cols-offset, 0px));
    align-items: flex-start;
}
.bbm .bbm-col { width: var(--bbm-col-width, 220px); flex: 0 0 var(--bbm-col-width, 220px); min-width: 0; }
.bbm .bbm-col-head { display: flex; align-items: center; }
.bbm .bbm-col-title {
    font-family: 'ClanOT-Book', sans-serif;
    font-size: var(--bbm-head-size, 20px);
    font-weight: 800;
    line-height: 1.2;
    color: var(--bbm-head-color, #333) !important;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 14px;
    transition: color .2s ease;
}
.bbm .bbm-col-title:hover { color: var(--bbm-head-hover, #00948b) !important; }
.bbm .bbm-caret-sub { display: none; }
.bbm .bbm-links li { margin: 0 0 8px; }
.bbm .bbm-links a {
    font-family: 'Roboto', sans-serif;
    font-size: var(--bbm-link-size, 14px);
    font-weight: 400;
    line-height: 1.5;
    color: var(--bbm-link-color, #00948b) !important;
    text-transform: uppercase;
    transition: color .2s ease;
}
.bbm .bbm-links a:hover { color: var(--bbm-link-hover, #333) !important; }

/* ==================== MOBIL / TABLET (styres af breakpoint-indstillingen via JS) ==================== */

.bbm.bbm-mob .bbm-burger {
    display: block;
    background: var(--bbm-top-hover, #00948b);
    border: 0;
    border-radius: 4px;
    padding: 11px 10px;
    cursor: pointer;
    margin-left: auto;
}
.bbm.bbm-mob .bbm-burger span {
    display: block; width: 22px; height: 2px; background: #fff;
    margin: 4px 0; transition: transform .25s ease, opacity .25s ease;
}
.bbm.bbm-mob .bbm-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.bbm.bbm-mob .bbm-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.bbm.bbm-mob .bbm-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.bbm.bbm-mob .bbm-top {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: #fff;
    position: absolute;
    top: calc(100% + var(--bbm-mob-top, 0px));
    left: 0;
    right: auto;
    width: 100vw;
    z-index: 999;
    box-shadow: 0 14px 24px rgba(0,0,0,.12);
    padding: 6px 0 22px;
    max-height: calc(100vh - 90px - var(--bbm-mob-top, 0px));
    overflow-y: auto;
}
.bbm.bbm-mob .bbm-top.bbm-open { display: flex; }

/* Punkter: venstrestillet, normal case, pil taet paa teksten - som dit design */
.bbm.bbm-mob .bbm-item { border: 0; }
.bbm.bbm-mob .bbm-toplink-wrap { display: flex; justify-content: flex-start; align-items: center; }
.bbm.bbm-mob .bbm-toplink {
    flex: 0 1 auto;
    font-size: 17px;
    font-weight: 500;
    text-transform: none;
    padding: 15px 6px 15px 24px;
}
.bbm.bbm-mob .bbm-caret { width: 34px; height: 34px; margin-left: 0; }
.bbm.bbm-mob .bbm-caret[aria-expanded="true"]::after { transform: rotate(180deg); }

/* Panel -> accordion */
.bbm.bbm-mob .bbm-panel {
    position: static;
    transform: none !important;
    left: auto !important;
    width: auto;
    box-shadow: none;
    border-top: 0;
    opacity: 1;
    visibility: visible;
    display: none;
    background: #fff;
}
.bbm.bbm-mob .bbm-panel.bbm-open { display: block; }

.bbm.bbm-mob .bbm-cols { display: block; padding: 0 !important; max-width: none; }
.bbm.bbm-mob .bbm-col { width: auto; flex: none; border: 0; }
.bbm.bbm-mob .bbm-col-head { display: flex; justify-content: flex-start; align-items: center; }
.bbm.bbm-mob .bbm-col-title {
    font-size: 16px;
    text-transform: none;
    margin: 0;
    padding: 10px 6px 10px 44px;
}
.bbm.bbm-mob .bbm-caret-sub { display: block; }
.bbm.bbm-mob .bbm-links { display: none; padding: 2px 24px 10px 60px; }
.bbm.bbm-mob .bbm-links.bbm-open { display: block; }
.bbm.bbm-mob .bbm-links li { margin: 0; }
.bbm.bbm-mob .bbm-links a { display: block; padding: 8px 0; text-transform: none; }
