body, html {
    height: 100%;
    margin: 0;
    margin: 0;
    font-family: Arial, sans-serif;
}

.contenido {
    padding-bottom: 60px; /* espacio para el footer */
}

textarea {
    width: 100%;
    height: 80%;
    box-sizing: border-box;
    padding: 10px;
    font-size: 16px;
    resize: none; /* Opcional: evita que el usuario cambie el tamaño */
}

    /* Barra superior */
.topbar {
      background: #2196F3;
      color: white;
      padding: 15px;
      display: flex;
      align-items: center;
}

.menu-icon {
      font-size: 24px;
      cursor: pointer;
      margin-right: 10px;
}

.sidebar {
      height: 100%;
      width: 250px;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: #212529;
      padding-top: 60px;
      transition: 0.3s;
}

.sidebar a, .sidebar .dropdown-btn {
      padding: 10px 15px;
      text-decoration: none;
      font-size: 18px;
      color: #f8f9fa;
      display: block;
      border: none;
      background: none;
      width: 100%;
      text-align: left;
      cursor: pointer;
      outline: none;
}

.sidebar a:hover, .sidebar .dropdown-btn:hover {
      background-color: #343a40;
}

/* Contenedor de submenú (oculto por defecto) */
.dropdown-container {
      display: none;
      background-color: #2c3136;
      padding-left: 20px;
}

/* Icono de flecha */
.fa-caret-down {
      float: right;
      padding-right: 8px;
}