/* ============================================================
   ATLEARN — Dashboard & Application Specific Styles
   Extends: atlearn-redesign.css
   ============================================================ */

/* ── Dashboard page body ── */
body.pagelayout-mydashboard,
body.pagelayout-mycourses {
  background: var(--al-bg) !important;
}

/* ── Remove default limitedwidth constraint ── */
body.pagelayout-mydashboard #page.drawers,
body.pagelayout-mydashboard .main-inner {
  max-width: 100% !important;
}

/* ── Primary Navigation (top horizontal nav in Boost) ── */
.primary-navigation .moremenu .nav-link,
[data-region="primary-navigation"] .nav-link {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--al-side-tx2) !important;
  padding: 10px !important;
  border-radius: 10px !important;
  gap: 10px !important;
  transition: background .15s, color .15s !important;
}
.primary-navigation .moremenu .nav-link:hover,
[data-region="primary-navigation"] .nav-link:hover {
  background: rgba(255,255,255,.08) !important;
  color: var(--al-side-tx) !important;
}
.primary-navigation .moremenu .nav-link.active,
[data-region="primary-navigation"] .nav-link.active {
  background: var(--al-pri) !important;
  color: #fff !important;
  font-weight: 700 !important;
}

/* ── Drawer (left sidebar) background ── */
#theme_boost-drawers-courseindex,
.drawers .drawer {
  background: var(--al-side-bg) !important;
  border-right: none !important;
}
#theme_boost-drawers-courseindex .drawerheader,
.drawers .drawer .drawerheader {
  border-bottom: 1px solid var(--al-side-line) !important;
  background: var(--al-side-bg) !important;
}

/* ── Course index items in drawer ── */
.courseindex .courseindex-item,
.courseindex .courseindex-section-title {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  color: var(--al-side-tx2) !important;
}
.courseindex .courseindex-item.active,
.courseindex .courseindex-item:hover {
  color: var(--al-side-tx) !important;
  background: rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
}

/* ── Course Summary Cards (my/courses.php) ── */
.dashboard-card,
[data-region="course-card"],
.frontpage-course-list-enrolled .coursebox {
  border: 1px solid var(--al-line) !important;
  border-radius: 14px !important;
  background: var(--al-surface) !important;
  box-shadow: var(--al-shadow) !important;
  overflow: hidden !important;
  transition: box-shadow .2s, transform .2s !important;
}
.dashboard-card:hover,
[data-region="course-card"]:hover {
  box-shadow: var(--al-shadow2) !important;
  transform: translateY(-2px) !important;
}
.dashboard-card .card-img-top {
  height: 96px !important;
  object-fit: cover !important;
}
.dashboard-card .card-title,
[data-region="course-card"] h3 {
  font-size: 14.5px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--al-tx) !important;
}
.dashboard-card .card-text {
  font-size: 12px !important;
  color: var(--al-tx3) !important;
}

/* Course card progress */
.dashboard-card .progress {
  height: 5px !important;
  border-radius: 99px !important;
  background: var(--al-line2) !important;
}
.dashboard-card .progress-bar {
  background: var(--al-pri) !important;
  border-radius: 99px !important;
}

/* Continue/Manage buttons */
.dashboard-card .btn,
[data-region="course-card"] .btn {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
  font-size: 12.5px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* ── My Courses tab filters ── */
.block_myoverview .nav-tabs,
[data-region="courses-view"] .nav-tabs,
.coursesearch .nav-tabs {
  background: transparent !important;
  border-bottom: 1px solid var(--al-line) !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  padding-bottom: 0 !important;
}
.block_myoverview .nav-tabs .nav-link,
[data-region="courses-view"] .nav-tabs .nav-link {
  border-radius: 9px !important;
  padding: 7px 13px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--al-tx2) !important;
  border: 1px solid var(--al-line) !important;
  background: var(--al-surface) !important;
  white-space: nowrap !important;
  margin-bottom: -1px !important;
}
.block_myoverview .nav-tabs .nav-link.active,
[data-region="courses-view"] .nav-tabs .nav-link.active {
  background: var(--al-pri) !important;
  color: #fff !important;
  border-color: var(--al-pri) !important;
  font-weight: 700 !important;
}

/* ── Block headers ── */
.block .card-header,
.block-header,
.block .header {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--al-tx) !important;
  background: var(--al-surface) !important;
  border-bottom: 1px solid var(--al-line2) !important;
  padding: 16px 18px !important;
}

/* ── Block body ── */
.block .card-body,
.block .content {
  padding: 18px !important;
  background: var(--al-surface) !important;
  color: var(--al-tx2) !important;
  font-size: 13.5px !important;
  line-height: 1.7 !important;
}

/* ── Activity / Topic sections ── */
.course-content .section-summary {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-line) !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  margin-bottom: 12px !important;
}
.course-content ul.section .activity {
  border-bottom: 1px solid var(--al-line2) !important;
  padding: var(--al-rowpad) 0 !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
.course-content ul.section .activity:hover {
  background: var(--al-surface2) !important;
}
.course-content ul.section .activity .activitytitle .instancename {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: var(--al-tx) !important;
}

/* ── Calendar block ── */
.block_calendar_month table.minicalendar {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  border-collapse: collapse !important;
  width: 100% !important;
}
.block_calendar_month table.minicalendar th {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--al-tx3) !important;
  padding: 8px 0 !important;
  text-align: center !important;
}
.block_calendar_month table.minicalendar td {
  text-align: center !important;
  padding: 4px !important;
  font-size: 12px !important;
  color: var(--al-tx2) !important;
}
.block_calendar_month table.minicalendar td.today a {
  background: var(--al-pri) !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  width: 26px !important;
  height: 26px !important;
  align-items: center !important;
  justify-content: center !important;
}
.block_calendar_month table.minicalendar td a {
  color: var(--al-tx) !important;
  font-weight: 600 !important;
}
.block_calendar_month .calendar_event_course,
.block_calendar_month .calendar_event_global {
  border-radius: 4px !important;
  font-size: 10px !important;
  padding: 2px 5px !important;
  font-weight: 700 !important;
  background: var(--al-priw) !important;
  color: var(--al-pri) !important;
}

/* ── User profile / People ── */
.userlist td.cell,
.userlist td {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  color: var(--al-tx2) !important;
  padding: var(--al-rowpad) 8px !important;
  border-top: 1px solid var(--al-line2) !important;
}
.userlist th {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  color: var(--al-tx3) !important;
  background: var(--al-surface2) !important;
  padding: 10px 8px !important;
}

/* ── Participants page ── */
#participants .user-enrolment-status {
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 4px 9px !important;
}
#participants .badge {
  border-radius: 99px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

/* ── Grades ── */
.gradeparent table {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
.gradeparent table .heading {
  background: var(--al-surface2) !important;
  color: var(--al-tx3) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
}
.gradeparent table .cell {
  border-bottom: 1px solid var(--al-line2) !important;
  padding: var(--al-rowpad) 8px !important;
  font-size: 13px !important;
  color: var(--al-tx2) !important;
}

/* ── Forum / Messages ── */
.forumpost,
.post {
  border: 1px solid var(--al-line) !important;
  border-radius: 14px !important;
  background: var(--al-surface) !important;
  padding: 18px !important;
  margin-bottom: 12px !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
.forumpost .header,
.post .header {
  border-bottom: 1px solid var(--al-line2) !important;
  padding-bottom: 12px !important;
  margin-bottom: 14px !important;
  font-weight: 700 !important;
  color: var(--al-tx) !important;
}

/* ── Assignment submission ── */
.generaltable.submission-table td,
.generaltable.submission-table th {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}

/* ── Completion icons ── */
.completion-icon .icon,
.autocompletion .icon {
  color: var(--al-ok) !important;
}

/* ── Breadcrumb ── */
.breadcrumb {
  background: transparent !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  color: var(--al-tx3) !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
.breadcrumb-item a { color: var(--al-pri) !important; }
.breadcrumb-item.active { color: var(--al-tx2) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--al-tx3) !important; }

/* ── Search results ── */
.search-results .result {
  border: 1px solid var(--al-line) !important;
  border-radius: 14px !important;
  background: var(--al-surface) !important;
  padding: 15px 18px !important;
  margin-bottom: 10px !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  transition: background .15s !important;
}
.search-results .result:hover { background: var(--al-surface2) !important; }
.search-results .result .result-title {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: var(--al-tx) !important;
}

/* ── Notification popover ── */
.popover-region-container {
  border: 1px solid var(--al-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--al-shadow2) !important;
  background: var(--al-surface) !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
.popover-region-header-container {
  border-bottom: 1px solid var(--al-line2) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--al-tx) !important;
  padding: 14px 16px !important;
}
.popover-region-container .notification,
.popover-region-container .message {
  border-bottom: 1px solid var(--al-line2) !important;
  padding: 12px 16px !important;
  font-size: 12.5px !important;
  transition: background .1s !important;
}
.popover-region-container .notification:hover,
.popover-region-container .message:hover {
  background: var(--al-surface2) !important;
}
.popover-region-container .notification.unread,
.popover-region-container .message.unread {
  background: var(--al-priw) !important;
  border-left: 3px solid var(--al-pri) !important;
}

/* ── Edit mode switch ── */
.editmode-switch-form .custom-control-label,
#page-header .editmode-switch-form {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--al-tx2) !important;
}

/* ── "Add a block" button ── */
.block_fake .card-body .btn,
[data-key="addblock"] {
  background: var(--al-priw) !important;
  color: var(--al-pri) !important;
  border: none !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
}
[data-key="addblock"]:hover {
  background: var(--al-pri) !important;
  color: #fff !important;
}

/* ── Dashboard welcome / page heading ── */
#page-header,
.page-header-headings {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important;
}
#page-header h1 {
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  color: var(--al-tx) !important;
}

/* ── Right drawer (blocks panel) ── */
#theme_boost-drawers-blocks {
  background: var(--al-surface) !important;
  border-left: 1px solid var(--al-line) !important;
}
#theme_boost-drawers-blocks .drawerheader {
  background: var(--al-surface2) !important;
  border-bottom: 1px solid var(--al-line) !important;
}

/* ── Responsive: mobile sidebar overlay ── */
@media (max-width: 991px) {
  #nav-drawer,
  #theme_boost-drawers-courseindex {
    z-index: 1050 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 100vh !important;
    width: 280px !important;
    max-width: 85vw !important;
    overflow-y: auto !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.3) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.3s ease !important;
  }

  #nav-drawer.closed,
  #nav-drawer[aria-hidden="true"],
  #theme_boost-drawers-courseindex.closed,
  #theme_boost-drawers-courseindex[aria-hidden="true"] {
    transform: translateX(-100%) !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  #nav-drawer:not(.closed),
  #theme_boost-drawers-courseindex:not(.closed) {
    transform: translateX(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}