/* =========================================================
   responsive.css
   Breakpoints for tablets / mobile - sidebar collapses to
   an off-canvas drawer below 992px.
   ========================================================= */

@media (max-width: 991.98px){
  .sidebar{
    transform:translateX(-100%);
    box-shadow:0 0 30px rgba(0,0,0,.3);
  }
  .sidebar.open{transform:translateX(0);}
  .sidebar-overlay.show{display:block;}
  .main-content{margin-left:0;}
  .menu-toggle-btn{display:inline-flex;align-items:center;justify-content:center;}
  .topnavbar-search{max-width:none;}
  .btn-quick-add{display:none !important;}
}

@media (max-width: 767.98px){
  .page-body{padding:16px;}
  .login-side{display:none;}
  .login-form-side{padding:32px 24px;}
  .stat-value{font-size:20px;}
  .topnavbar{padding:0 14px;gap:10px;}
  .app-footer{flex-direction:column;text-align:center;}
  .page-header h1{font-size:19px;}
}

@media (max-width: 575.98px){
  .topnavbar-search{display:none;}
  .kanban-col{margin-bottom:14px;}
}