O lista categoria não está abrindo fiz tudo, mas não abre. | HTML e CSS: responsividade com mobile-first

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"/>
<link rel="stylesheet" href="css/vars.css">
<link rel="stylesheet" href="css/style.css">

        <input type="checkbox" id="menu" class="container_botao">
        <label for="menu">
         <span class="cabecalho_menu-hamburguer container_imagem"></span>
      </label>
      <ul class="lista-menu">
        <li class="lista_menu-categoria">Categorias</li>
         <li class="lista_menu-titulo">
            <a href="#" class="lista_menu-link">Programacao </a>
         </li>
         <li class="lista_menu-titulo">
            <a href="#" class="lista_menu-link">Front-end </a>
         </li>
         <li class="lista_menu-titulo">
            <a href="#" class="lista_menu-link">Infraestrutura </a>
         </li>
         <li class="lista_menu-titulo">
            <a href="#" class="lista_menu-link">Business </a>
         </li>
         <li class="lista_menu-titulo">
            <a href="#" class="lista_menu-link">Design & ux </a>
         </li>

      </ul>
        <img src="img/Logo.svg" alt="Logo da alura books" class="container_imagem">
        <h1 class="container_titulo"><b class="container_titulo-negrito">Alura</b>Books</h1>
    </div>

   <ul class="opcoes">
    <input type="checkbox" id="opção_menu" class="opcao_botao">
    <label for="opção_item">
        <li class="opcoes_item">Categorias</li>
  </label>
  <ul class="lista-menu">
    
     <li class="lista_menu-titulo">
        <a href="#" class="lista_menu-link">Programacao </a>
     </li>
     <li class="lista_menu-titulo">
        <a href="#" class="lista_menu-link">Front-end </a>
     </li>
     <li class="lista_menu-titulo">
        <a href="#" class="lista_menu-link">Infraestrutura </a>
     </li>
     <li class="lista_menu-titulo">
        <a href="#" class="lista_menu-link">Business </a>
     </li>
     <li class="lista_menu-titulo">
        <a href="#" class="lista_menu-link">Design & ux </a>
     </li>

  </ul>

        <li class="opcoes_item"><a href="#" class="opcao_link">Favoritos</a></li>
        <li class="opcoes_item"><a href="#" class="opcao_link">Minha estante</a></li>
    </ul>

CSS

.opcao_botao:checked~.lista-menu{
    display: block;
    width: auto;
}

.opcao_botao{
    display: none;
}