/* SMS Direkt – mobilnavigering */
/* Desktop över 1100px påverkas inte */

.mobile-menu-toggle,
.mobile-menu {
    display: none;
}

@media (max-width: 1100px) {

    .mobile-menu-toggle {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        width: 44px;
        height: 44px;
        padding: 10px;
        margin-left: auto;
        border: 0;
        border-radius: 8px;
        background: transparent;
        cursor: pointer;
    }

    .mobile-menu-toggle span {
        display: block;
        width: 24px;
        height: 2px;
        background: #071d35;
        border-radius: 2px;
    }

    .mobile-menu:not([hidden]) {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 12px 24px 24px;
        background: #fff;
        border-top: 1px solid #dbe3eb;
        box-shadow: 0 12px 24px rgba(7, 29, 53, .12);
    }

    .mobile-menu a {
        display: block;
        padding: 14px 8px;
        color: #071d35;
        font-size: 16px;
        font-weight: 600;
        border-bottom: 1px solid #edf1f5;
    }

    .mobile-menu a:last-child {
        margin-top: 12px;
        text-align: center;
        color: #fff;
        background: #0067ff;
        border-radius: 8px;
        border-bottom: 0;
    }

    .nav-inner {
        gap: 12px;
    }
}

@media (max-width: 680px) {
    .mobile-menu-toggle {
        order: 3;
        margin-left: 0;
    }

    .nav-actions {
        margin-left: auto;
    }
}

/* Desktop: mobilnavigeringen ska aldrig visas */
@media (min-width: 1101px) {
    #mobile-menu-toggle,
    #mobile-menu {
        display: none !important;
    }
}

/* Mobil: låt den öppnade menyn använda hela tillgängliga bredden */
@media (max-width: 1100px) {
    #mobile-menu:not([hidden]) {
        display: flex;
        width: 100%;
    }
}

/* Kompaktare mobilmeny */
@media (max-width:1100px) {
  #mobile-menu:not([hidden]) {
    align-items:stretch;
    flex:none;
    gap:0;
    padding:8px 20px 16px;
  }
  #mobile-menu a {
    text-align:left;
    padding:11px 8px;
    font-size:15px;
    margin:0;
  }
  #mobile-menu a:last-child {
    margin-top:0;
    background:transparent;
    color:#071d35;
    border-radius:0;
    border-bottom:0;
  }
}