/* Wimmer Community V6.26.1 - Mobilmenu Pro Fix
   Retter den grimme 2-kolonne mobilmenu, stop-per vandret hop og gør profilen mere stabil på mobil. */

/* Sikker base */
html,
body{
  max-width:100%;
  overflow-x:hidden!important;
  -webkit-text-size-adjust:100%;
}
body.wc-menu-locked{
  position:fixed!important;
  overflow:hidden!important;
  touch-action:none!important;
}
.app-shell,
.app-stage,
.layout{
  min-width:0!important;
  max-width:100%!important;
}

/* MOBILMENU: én pæn kolonne i stedet for 2 kolonner */
@media(max-width:980px){
  body.wc-has-brand-bg::before,
  body.wc-has-brand-bg::after{
    position:fixed!important;
    background-attachment:scroll!important;
    transform:none!important;
  }

  .wc-mobile-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    z-index:190!important;
    background:rgba(0,0,0,.62)!important;
    backdrop-filter:blur(7px)!important;
  }

  .wc-mobile-menu-btn{
    display:flex!important;
    position:fixed!important;
    top:18px!important;
    left:18px!important;
    width:46px!important;
    height:46px!important;
    border-radius:17px!important;
    z-index:260!important;
    background:rgba(10,22,34,.92)!important;
    border:1px solid rgba(116,255,224,.18)!important;
    box-shadow:0 16px 45px rgba(0,0,0,.35)!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
  }
  .wc-mobile-menu-btn span{
    width:20px!important;
    height:2px!important;
    border-radius:999px!important;
    background:#dffef8!important;
    display:block!important;
    margin:3px 0!important;
    transition:transform .18s ease, opacity .18s ease!important;
  }
  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(1){
    transform:translateY(8px) rotate(45deg)!important;
  }
  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(2){
    opacity:0!important;
  }
  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(3){
    transform:translateY(-8px) rotate(-45deg)!important;
  }

  .app-sidebar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    bottom:auto!important;
    width:min(92vw,390px)!important;
    max-width:min(92vw,390px)!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    padding:78px 14px 18px!important;
    z-index:230!important;
    transform:translate3d(-104%,0,0)!important;
    transition:transform .20s ease!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    border-right:1px solid rgba(116,255,224,.12)!important;
    border-bottom:0!important;
    background:
      linear-gradient(180deg,rgba(3,12,21,.98),rgba(2,8,15,.97))!important;
    box-shadow:24px 0 80px rgba(0,0,0,.52)!important;
    backdrop-filter:blur(20px)!important;
  }
  body.wc-menu-open .app-sidebar{
    transform:translate3d(0,0,0)!important;
  }

  .side-brand{
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    gap:12px!important;
    align-items:center!important;
    margin:0 0 16px!important;
    padding:0 0 16px!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
  }
  .side-brand .brand-mark{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    border-radius:18px!important;
  }
  .side-brand strong{
    display:block!important;
    font-size:20px!important;
    line-height:1.1!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .side-brand em{
    font-size:13px!important;
    line-height:1.25!important;
    color:#9fb0c5!important;
  }

  .side-menu{
    display:flex!important;
    flex-direction:column!important;
    grid-template-columns:none!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
  }
  .side-menu a{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    display:grid!important;
    grid-template-columns:32px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:12px!important;
    padding:12px 13px!important;
    border-radius:16px!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:16px!important;
    line-height:1.15!important;
    letter-spacing:-.01em!important;
  }
  .side-menu a span{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    display:grid!important;
    place-items:center!important;
    font-size:18px!important;
    color:#9eb2c6!important;
  }
  .side-menu a.active{
    background:linear-gradient(90deg,rgba(36,224,170,.16),rgba(27,181,255,.07))!important;
    box-shadow:inset 0 0 0 1px rgba(36,224,170,.28)!important;
  }
  .side-menu a b{
    margin-left:0!important;
    min-width:24px!important;
    height:24px!important;
  }
  .side-menu hr{
    display:none!important;
  }

  .wc-logout-link{
    margin-top:8px!important;
    color:#ffdce3!important;
    background:rgba(255,95,122,.07)!important;
    border:1px solid rgba(255,95,122,.18)!important;
  }
  .wc-logout-link span{
    color:#ff95a8!important;
  }

  .side-card,
  .system-card{
    width:100%!important;
    margin-top:14px!important;
    margin-bottom:0!important;
    padding:13px!important;
    border-radius:17px!important;
    overflow:hidden!important;
  }

  .app-stage{
    width:100%!important;
    min-width:0!important;
    max-width:100vw!important;
    overflow-x:hidden!important;
  }
  .layout{
    width:100%!important;
    max-width:100vw!important;
    overflow-x:hidden!important;
  }
}

/* Mindre telefoner */
@media(max-width:520px){
  .app-sidebar{
    width:92vw!important;
    max-width:92vw!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .side-menu a{
    font-size:15.5px!important;
    min-height:46px!important;
    padding:11px 12px!important;
    grid-template-columns:30px minmax(0,1fr) auto!important;
  }
  .side-menu a span{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    font-size:17px!important;
  }
}

/* Profil på mobil: stop hop/ryk */
@media(max-width:980px){
  body.wc-page-profile{
    overflow-x:hidden!important;
    overscroll-behavior-x:none!important;
  }
  body.wc-page-profile .layout,
  body.wc-page-profile .wc-profile-pro,
  body.wc-page-profile .profile-hero,
  body.wc-page-profile .wc-profile-pro-layout,
  body.wc-page-profile .wc-profile-main-column,
  body.wc-page-profile .wc-profile-side-column{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }
  body.wc-page-profile .wc-profile-pro{
    contain:layout paint!important;
  }
  body.wc-page-profile .wc-profile-cover{
    background-attachment:scroll!important;
    transform:none!important;
    will-change:auto!important;
  }
  body.wc-page-profile img.avatar,
  body.wc-page-profile .avatar.big{
    flex:0 0 auto!important;
    aspect-ratio:1/1!important;
    object-fit:cover!important;
  }
  body.wc-page-profile .wc-profile-info,
  body.wc-page-profile .wc-profile-info *,
  body.wc-page-profile .wc-profile-meta-row,
  body.wc-page-profile .wc-profile-pro-actions{
    min-width:0!important;
    max-width:100%!important;
  }
  body.wc-page-profile .wc-profile-title-row h1,
  body.wc-page-profile .wc-profile-bio,
  body.wc-page-profile .wc-profile-handle{
    overflow-wrap:anywhere!important;
  }
}

/* Fjern animationer på mobil hvis brugeren/browseren hakker */
@media(max-width:980px) and (prefers-reduced-motion:reduce){
  .app-sidebar,
  .wc-mobile-menu-btn span{
    transition:none!important;
  }
}