/* === Static-clone overrides === */

/* Sidebar expands as overlay on hover (original Angular behavior) — handled in clone.js via .active class */

/* Exam show-more pagination */
.exams-table .body-list.exam-hidden { display: none !important; }
.exams-table .show-more { cursor: pointer; }
.exams-table .show-more.is-done { display: none !important; }

/* ===== Mobile burger + slide-in menu ===== */
.mob-burger { display: none; }
.mob-backdrop { display: none; }

@media (max-width: 820px) {
  /* Original hides the whole sidebar wrapper on mobile — force it back */
  .sidebar-parent-block { display: block !important; }

  /* Burger button */
  .mob-burger {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    position: fixed;
    top: 12px; left: 12px;
    width: 46px; height: 46px;
    padding: 11px;
    border: none; border-radius: 12px;
    background: #1d3b5a;
    box-shadow: 0 4px 12px rgba(0,0,0,.3);
    z-index: 100001;
    cursor: pointer;
  }
  .mob-burger span {
    display: block; height: 3px; width: 100%;
    background: #fff; border-radius: 2px;
    transition: transform .25s, opacity .2s;
  }
  html.mobmenu .mob-burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  html.mobmenu .mob-burger span:nth-child(2) { opacity: 0; }
  html.mobmenu .mob-burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

  /* Backdrop */
  html.mobmenu .mob-backdrop {
    display: block !important;
    position: fixed; inset: 0;
    background: rgba(15,30,50,.55);
    z-index: 99998;
  }

  /* Sidebar as a left slide-in drawer */
  .sidebar-parent-block nav.sidebar,
  nav.sidebar {
    position: fixed !important;
    top: 0 !important; left: 0 !important;
    height: 100vh !important;
    width: 290px !important; max-width: 86vw !important;
    min-width: 0 !important;
    transform: translateX(-100%) !important;
    transition: transform .28s ease !important;
    z-index: 100000 !important;
    overflow-y: auto !important;
    background: #1d3b5a url('/assets/images/sidebar-bg.jpg') center/cover no-repeat !important;
    box-shadow: 6px 0 24px rgba(0,0,0,.35);
  }
  html.mobmenu nav.sidebar { transform: translateX(0) !important; }

  /* Dark veil over the bg image for legibility */
  nav.sidebar .sidebar-content {
    position: relative; min-height: 100%;
    background: linear-gradient(180deg, rgba(20,40,70,.78), rgba(20,40,70,.88)) !important;
  }

  /* Menu items: full labels, comfortable tap targets */
  nav.sidebar ul.sidebar-nav { margin: 8px 0 24px !important; }
  nav.sidebar ul.sidebar-nav li { line-height: normal !important; }
  nav.sidebar ul.sidebar-nav li a {
    display: flex !important; align-items: center !important;
    padding: 15px 16px 15px 54px !important;
    font-size: 16px !important; color: #cdd8e4 !important;
    position: relative; white-space: nowrap;
  }
  nav.sidebar ul.sidebar-nav li a.active { color: #fff !important; }
  nav.sidebar ul.sidebar-nav li .side-text {
    display: inline !important;
    overflow: hidden; text-overflow: ellipsis; max-width: 175px;
  }
  nav.sidebar ul.sidebar-nav li .close-hover { display: none !important; }
  nav.sidebar ul.sidebar-nav li a::before {
    left: 20px !important; top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important; width: 22px !important; height: 22px !important;
  }
  nav.sidebar ul.sidebar-nav li .badge-counter {
    position: static !important; margin-left: auto !important;
    box-shadow: none !important; flex: 0 0 auto;
  }
  /* Header inside the drawer */
  nav.sidebar .sidebar-header { padding: 22px 0 10px !important; }
  nav.sidebar .sidebar-header .arrow-navigation { display: none !important; }
  nav.sidebar .sidebar-header .mystat-img { display: block !important; margin: 0 auto; width: 130px; }
}