/* mobile.css
   Mobile-first overrides. Base styles in style.css, desktop overrides in desktop.css.
*/

@media (max-width: 900px) {
  #tab-control{padding-bottom:12px}
  .employee-dashboard.active-dash{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-areas:
      "sidebar"
      "content" !important;
    gap:14px !important;
    padding:16px !important;
    height:auto;
    min-height:calc(100dvh - var(--nav-h));
    overflow:visible;
  }
  .emp-content{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0;width:100%}
  .editor-panel{min-height:100%}
  .ctrl-header{margin-bottom:12px}
  .ctrl-grid-4,.ctrl-grid-2{gap:12px}
}