/* main.mobile.css
   wird nur geladen, wenn screen-width <= 768px
*/

body {
  font-size: 16px;
}

/* Titel im Header etwas größer */
header strong {
  font-size: 1.2em;
}

/* Menü über die volle Breite, fingerfreundlich */
#user-menu {
  /* width: 40%;*/
}

/* Button-Text rechtsbündig */
#user-menu button {
  width: 100%;
  text-align: right;      /* vorher left */
  font-size: 1.1em;
  padding: 12px 12px;
}

/* Dropdown-Container optional auch rechts ausrichten */
#user-menu-content {
  text-align: right;
}

/* Links im Dropdown rechtsbündig */
#user-menu-content a {
  font-size: 1.0rem;
  padding: 12px 12px;
  text-align: right;      /* neu */
}


/* v0.5.34: kompakte PsySim-Hülle am Mobiltelefon */
header{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  grid-template-areas:
    "title user language"
    "nav nav nav";
  gap:8px;
  align-items:center;
  padding:8px 10px;
}
header .app-title{grid-area:title;min-width:0}
header .app-title strong{display:block;overflow:hidden;font-size:1rem;text-overflow:ellipsis;white-space:nowrap}
.header-nav{grid-area:nav;display:flex;width:100%;margin:0;gap:6px;overflow-x:auto;padding:2px 0 4px;scrollbar-width:thin}
.header-nav .home-link{flex:0 0 auto;min-height:40px;display:inline-flex;align-items:center;padding:6px 12px;font-size:.9rem}
#user-menu{grid-area:user}
#user-menu button{width:auto;min-height:42px;padding:8px 10px;text-align:center;font-size:.9rem}
#user-menu-content{position:fixed;top:58px;right:8px;left:8px;max-height:70vh;overflow:auto;text-align:left}
#user-menu-content a{text-align:left}
#lang-switcher{grid-area:language}
#lang-select{min-height:42px;padding:6px}
footer{display:none}
#app-container{min-height:calc(100dvh - 112px)}
#userpanel{width:calc(100vw - 16px);min-width:0;max-width:none;max-height:82dvh;padding:14px}
