/* ============================================================
   UIPT — Panel Mobile Responsive (Student + Franchise + Exam)
   ============================================================ */

/* 1) Side overflow band karo */
html, body { max-width:100%; overflow-x:hidden; }
* { -webkit-tap-highlight-color: transparent; }
img, .card, .container, .container-fluid { max-width:100%; }

/* 2) Tables mobile par andar scroll ho (side se bahar na jaayein) */
@media (max-width: 820px){
  .table-responsive { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .card table, #content table, table.table, table.dataTable {
    display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch;
  }
  table th, table td { white-space:nowrap; }
}

/* 3) Mobile padding */
@media (max-width: 600px){
  .card-body, .container, .container-fluid { padding-left:12px !important; padding-right:12px !important; }
  h1,.h1{ font-size:1.5rem; } h2,.h2{ font-size:1.3rem; }
  .btn{ white-space:normal; }
}

/* ============================================================
   ATTRACTIVE MOBILE MENU (shared hamburger drawer)
   JS adds: .uiptm-bar, .uiptm-overlay, .uiptm-drawer
   ============================================================ */
.uiptm-bar{
  display:none; position:sticky; top:0; z-index:1200;
  align-items:center; gap:12px; padding:10px 14px;
  background:linear-gradient(135deg,#15294d,#2563eb);
  color:#fff; box-shadow:0 3px 12px rgba(15,30,60,.22);
}
.uiptm-burger{
  width:42px;height:42px;border:none;border-radius:11px;
  background:rgba(255,255,255,.16); color:#fff; font-size:20px; cursor:pointer;
  display:flex;align-items:center;justify-content:center; flex:0 0 auto;
}
.uiptm-burger:active{ transform:scale(.93); }
.uiptm-bar .uiptm-title{ font-weight:800; letter-spacing:.4px; font-size:1.02rem; }
.uiptm-bar .uiptm-spacer{ flex:1; }

.uiptm-overlay{
  display:none; position:fixed; inset:0; background:rgba(2,8,23,.5);
  z-index:1300; opacity:0; transition:opacity .25s;
}
.uiptm-overlay.show{ display:block; opacity:1; }

.uiptm-drawer{
  position:fixed; top:0; left:0; height:100%; width:82%; max-width:320px;
  background:#0f1e3a; color:#e7eefc; z-index:1400;
  transform:translateX(-105%); transition:transform .28s ease;
  overflow-y:auto; box-shadow:6px 0 28px rgba(0,0,0,.35); -webkit-overflow-scrolling:touch;
}
.uiptm-drawer.show{ transform:translateX(0); }
.uiptm-drawer .uiptm-head{
  background:linear-gradient(135deg,#15294d,#2563eb);
  padding:20px 18px; display:flex; align-items:center; gap:12px;
}
.uiptm-drawer .uiptm-head .logo{
  width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;font-weight:900;color:#fff;font-size:14px;flex:0 0 auto;
}
.uiptm-drawer .uiptm-head .nm{ font-weight:800;color:#fff;font-size:1rem;line-height:1.2; }
.uiptm-drawer .uiptm-head .sub{ font-size:.72rem;color:rgba(255,255,255,.8); }
.uiptm-links{ padding:10px 10px 34px; }
.uiptm-links a{
  display:flex; align-items:center; gap:11px;
  color:#cdd9f0; text-decoration:none; font-size:.95rem; font-weight:600;
  padding:12px 14px; border-radius:11px; margin:3px 0;
}
.uiptm-links a:active, .uiptm-links a:hover{ background:rgba(37,99,235,.28); color:#fff; }
.uiptm-links a.is-logout{ color:#fecaca; }
.uiptm-links .grp{
  font-size:.68rem; text-transform:uppercase; letter-spacing:1px;
  color:#7c8db3; padding:14px 14px 4px; font-weight:700;
}

@media (max-width: 992px){
  .uiptm-bar{ display:flex; }
}

/* ============================================================
   Mobile par original sidebar HIDE karo (overflow ka asli kaaran)
   -> sirf apna attractive drawer dikhega. JS links pehle padh leta hai.
   ============================================================ */
@media (max-width: 992px){
  /* student (sb-admin-2) */
  #accordionSidebar, .sidebar.sidebar-dark{ display:none !important; }
  #content-wrapper{ margin-left:0 !important; width:100% !important; }
  #sidebarToggleTop{ display:none !important; }
  /* franchise (fms dashboard) */
  #sidebar{ display:none !important; }
  #page-wrapper{ margin-left:0 !important; width:100% !important; }
  /* generic */
  .left-sidebar, #left-panel, .main-menu{ display:none !important; }
  body{ padding-left:0 !important; }
}

/* exam admin custom-menu -> mobile par wrap + center (cut na ho), container full width */
@media (max-width: 992px){
  .custom-menu{ flex-wrap:wrap !important; justify-content:center !important; }
  .custom-menu .nav-link{ padding:9px 12px !important; font-size:13px !important; }
  .header .container{ width:100% !important; max-width:100% !important; padding-left:10px !important; padding-right:10px !important; }
  .container{ width:100% !important; max-width:100% !important; }
}