/* ============================================
   MODERN UI OVERRIDES FOR MOODLE BOOST THEME
   Saratov State University - Vavilov
   ============================================ */

/* ---- TOP NAVBAR ---- */
.navbar.fixed-top {
    background: linear-gradient(135deg, #1a237e 0%, #283593 50%, #3949ab 100%) !important;
    border-bottom: none !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    padding: 0.4rem 1rem;
    min-height: 56px;
}

/* Hamburger menu button */
.navbar .btn.nav-link[data-action="toggle-drawer"],
.navbar [data-region="drawer-toggle"] .btn {
    background: rgba(255, 255, 255, 0.12) !important;
    border: none !important;
    border-radius: 8px;
    color: #fff !important;
    transition: background 0.2s ease;
}
.navbar .btn.nav-link[data-action="toggle-drawer"]:hover,
.navbar [data-region="drawer-toggle"] .btn:hover {
    background: rgba(255, 255, 255, 0.22) !important;
}
.navbar [data-region="drawer-toggle"] .btn .icon {
    filter: brightness(0) invert(1);
}

/* Site name & logo in navbar */
.navbar .navbar-brand {
    color: #ffffff !important;
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.01em;
}
.navbar .navbar-brand:hover {
    color: rgba(255, 255, 255, 0.9) !important;
}
.navbar .navbar-brand .logo img {
    max-height: 36px;
    border-radius: 4px;
}

/* Custom menu items */
.navbar .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
    font-weight: 500;
    border-radius: 6px;
    padding: 0.4rem 0.75rem !important;
    transition: all 0.2s ease;
}
.navbar .navbar-nav .nav-link:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12);
}

/* Search box in navbar */
.navbar .search-input-wrapper input,
.navbar .simplesearchform input {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
    border-radius: 20px;
    padding: 0.35rem 1rem;
}
.navbar .search-input-wrapper input::placeholder,
.navbar .simplesearchform input::placeholder {
    color: rgba(255, 255, 255, 0.6) !important;
}
.navbar .search-input-wrapper input:focus,
.navbar .simplesearchform input:focus {
    background: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
}
.navbar .simplesearchform .btn {
    color: rgba(255, 255, 255, 0.8) !important;
}
.navbar .simplesearchform .btn .icon {
    filter: brightness(0) invert(1);
}

/* ============================================================
   User dropdown menu — modern restyle
   ============================================================ */

/* Trigger button in navbar */
.navbar .usermenu .userbutton,
.navbar .usermenu .usertext {
    color: #ffffff !important;
}
.navbar .usermenu .userbutton:hover {
    background: rgba(255, 255, 255, 0.12);
    border-radius: 8px;
}

/* Hide unwanted menu items: Оценки, Сообщения, Настройки */
.usermenu .dropdown-menu a[data-title="grades,grades"],
.usermenu .dropdown-menu a[data-title="messages,message"],
.usermenu .dropdown-menu a[data-title="preferences,moodle"] {
    display: none !important;
}

/* Dropdown panel */
.usermenu .dropdown-menu {
    min-width: 240px;
    padding: 10px 0;
    border: none;
    border-radius: 14px;
    box-shadow: 0 8px 32px rgba(55, 48, 107, 0.18), 0 2px 8px rgba(0,0,0,0.08);
    background: #ffffff;
    animation: userMenuFadeIn .2s ease;
    overflow: hidden;
}
@keyframes userMenuFadeIn {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* All dropdown items */
.usermenu .dropdown-menu .dropdown-item {
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 500;
    color: #37306b;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: background .15s, color .15s;
    border-radius: 0;
}
.usermenu .dropdown-menu .dropdown-item:hover,
.usermenu .dropdown-menu .dropdown-item:focus {
    background: linear-gradient(135deg, #ede8ff 0%, #f0f4ff 100%);
    color: #4f46ba;
    text-decoration: none;
}
.usermenu .dropdown-menu .dropdown-item .icon {
    color: #7c71c2;
    font-size: 16px;
    width: 20px;
    text-align: center;
    flex-shrink: 0;
}
.usermenu .dropdown-menu .dropdown-item:hover .icon {
    color: #4f46ba;
}

/* Dividers */
.usermenu .dropdown-menu .dropdown-divider {
    margin: 6px 16px;
    border-color: #eee8ff;
}

/* Logout item — subtle red accent */
.usermenu .dropdown-menu a[data-title="logout,moodle"] {
    color: #c0392b;
}
.usermenu .dropdown-menu a[data-title="logout,moodle"]:hover {
    background: linear-gradient(135deg, #fde8e6 0%, #fff0ee 100%);
    color: #a93226;
}
.usermenu .dropdown-menu a[data-title="logout,moodle"] .icon {
    color: #c0392b;
}

/* Avatar in trigger — subtle ring */
.usermenu .avatars .avatar.current img {
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.5);
    transition: border-color .2s;
}
.usermenu .userbutton:hover .avatars .avatar.current img {
    border-color: #fff;
}

/* Notification / message icons */
.navbar .popover-region .popover-region-toggle {
    color: rgba(255, 255, 255, 0.85) !important;
}
.navbar .popover-region .popover-region-toggle .icon {
    filter: brightness(0) invert(1);
}
.navbar .popover-region .count-container {
    background: #ff5252 !important;
}

/* Language menu */
.navbar .langmenu .dropdown-toggle {
    color: rgba(255, 255, 255, 0.85) !important;
}


/* ---- NAV DRAWER (Left Sidebar) ---- */
[data-region="drawer"] {
    background: #fafbff !important;
    border-right: 1px solid #eef0f8;
    box-shadow: 2px 0 16px rgba(0, 0, 0, 0.04);
}

#nav-drawer .list-group {
    background: transparent;
    padding: 8px 10px;
}

/* --- Item base --- */
#nav-drawer .list-group-item {
    border: none !important;
    border-radius: 12px !important;
    margin: 2px 0;
    padding: 9px 12px;
    font-size: 0.87rem;
    font-weight: 500;
    color: #455a64;
    background: transparent;
    transition: all 0.2s ease;
    position: relative;
}
#nav-drawer .list-group-item .media {
    align-items: center;
}

/* --- Hover --- */
#nav-drawer .list-group-item:hover {
    background: rgba(92, 107, 192, 0.07) !important;
    color: #1a237e;
    transform: translateX(3px);
}

/* --- Active state --- */
#nav-drawer .list-group-item.active {
    background: rgba(57, 73, 171, 0.10) !important;
    color: #1a237e !important;
}
#nav-drawer .list-group-item.active .media-body {
    font-weight: 700 !important;
}
/* Left accent bar */
#nav-drawer .list-group-item.active::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 55%;
    background: linear-gradient(180deg, #3949ab, #5c6bc0);
    border-radius: 0 4px 4px 0;
}

/* --- Icon badge - modern rounded square --- */
#nav-drawer .list-group-item .media-left {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    border-radius: 9px;
    margin-right: 12px;
    transition: all 0.25s ease;
    /* fallback color */
    background: #78909c;
    flex-shrink: 0;
    line-height: 0;
    padding: 0;
    text-align: center;
}

/* Make ALL icons white on colored background + center fix */
#nav-drawer .list-group-item .media-left .icon,
#nav-drawer .list-group-item .media-left img {
    filter: brightness(0) invert(1) !important;
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    vertical-align: middle;
}

/* Icon hover lift */
#nav-drawer .list-group-item:hover .media-left {
    transform: scale(1.1);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
}
/* Cancel row translateX on icon so it doesn't double-move */
#nav-drawer .list-group-item:hover .media-left {
    transform: scale(1.1);
}

/* === Icon color palette — 8 rotating gradient backgrounds === */
#nav-drawer .list-group-item:nth-child(8n+1) .media-left {
    background: linear-gradient(135deg, #5c6bc0, #3949ab);
}
#nav-drawer .list-group-item:nth-child(8n+2) .media-left {
    background: linear-gradient(135deg, #ec407a, #d81b60);
}
#nav-drawer .list-group-item:nth-child(8n+3) .media-left {
    background: linear-gradient(135deg, #ff7043, #f4511e);
}
#nav-drawer .list-group-item:nth-child(8n+4) .media-left {
    background: linear-gradient(135deg, #26a69a, #00897b);
}
#nav-drawer .list-group-item:nth-child(8n+5) .media-left {
    background: linear-gradient(135deg, #42a5f5, #1e88e5);
}
#nav-drawer .list-group-item:nth-child(8n+6) .media-left {
    background: linear-gradient(135deg, #ab47bc, #8e24aa);
}
#nav-drawer .list-group-item:nth-child(8n+7) .media-left {
    background: linear-gradient(135deg, #66bb6a, #43a047);
}
#nav-drawer .list-group-item:nth-child(8n) .media-left {
    background: linear-gradient(135deg, #ffa726, #fb8c00);
}

/* Items without icon - add a subtle dot */
#nav-drawer .list-group-item .media:not(:has(.media-left)) .media-body::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #b0bec5;
    margin-right: 12px;
    flex-shrink: 0;
}

/* Section divider lines in drawer */
#nav-drawer nav.list-group + nav.list-group {
    border-top: 1px solid #eef0f8;
    margin-top: 8px;
    padding-top: 8px;
}

/* Hide "Мои курсы" from sidebar */
#nav-drawer .list-group-item[data-key="mycourses"],
#nav-drawer a[data-key="mycourses"],
#nav-drawer div[data-key="mycourses"] {
    display: none !important;
}

/* Hide "Оценки" (grades) from sidebar */
#nav-drawer .list-group-item[data-key="grades"],
#nav-drawer a[data-key="grades"],
#nav-drawer div[data-key="grades"] {
    display: none !important;
}

/* ---- METOD BREADCRUMB BAR (injected on course pages from Методические материалы) ---- */
.metod-bc-bar {
    margin-bottom: 20px;
    padding: 12px 18px;
    background: #f8f9ff;
    border-radius: 10px;
    border: 1px solid #e8eaf6;
    font-size: 0.95rem;
    line-height: 1.6;
}
.metod-bc-bar a {
    color: #3949ab;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.15s;
}
.metod-bc-bar a:hover {
    color: #1a237e;
    text-decoration: underline;
}
.metod-bc-sep {
    color: #90a4ae;
    margin: 0 8px;
}
.metod-bc-current {
    color: #455a64;
    font-weight: 600;
}


/* ---- FOOTER ---- */
#page-footer {
    background: linear-gradient(135deg, #1a237e 0%, #283593 100%) !important;
    color: rgba(255, 255, 255, 0.85) !important;
    border-top: none;
    padding: 20px 0 !important;
}

/* Modern footer layout */
.modern-footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 8px 0;
}

/* User info in footer */
.footer-user-info {
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.8);
}
.footer-user-info a {
    color: #90caf9 !important;
    text-decoration: none;
    font-weight: 500;
    padding: 2px 6px;
    border-radius: 4px;
    transition: all 0.2s ease;
}
.footer-user-info a:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1);
}

/* Home link in footer */
.footer-home-link {
    font-size: 0.88rem;
}
.footer-home-link a,
.footer-home-link .homelink a,
.footer-home-link .sitelink a {
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none;
    padding: 6px 16px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 20px;
    font-weight: 500;
    transition: all 0.2s ease;
    display: inline-block;
}
.footer-home-link a:hover,
.footer-home-link .homelink a:hover,
.footer-home-link .sitelink a:hover {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.1);
}

/* Hide Moodle logo in sitelink */
.footer-home-link .sitelink img {
    display: none;
}

/* Hide "Сводка хранения данных" (data privacy summary link) */
#page-footer .tool_dataprivacy,
#page-footer a[href*="tool/dataprivacy/summary.php"],
#page-footer a[href*="datasummary"],
.footer-standard-html a[href*="summary.php"] {
    display: none !important;
}

/* General footer links */
#page-footer a {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none;
}
#page-footer a:hover {
    color: #ffffff !important;
}

/* Hide helplink in footer */
#page-footer .helplink {
    display: none;
}

/* Responsive footer */
@media (max-width: 576px) {
    .modern-footer-content {
        flex-direction: column;
        text-align: center;
    }
}


/* ---- GENERAL POLISH ---- */

/* Hide breadcrumbs globally */
.breadcrumb,
#page-navbar,
nav[aria-label="Navigation bar"] {
    display: none !important;
}

/* Breadcrumb area / full header */
#page-header {
    padding-bottom: 0;
}
#page-header .card {
    border: none;
    box-shadow: none;
    border-radius: 10px;
    background: transparent;
}

/* Modern page header styling */
#page-header .card-body {
    padding: 1rem 1rem;
}

/* Page title: unified style with underline accent like dashboard */
#page-header .page-context-header .page-header-headings h1 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a237e;
    letter-spacing: -0.01em;
    padding-bottom: 12px;
    border-bottom: 3px solid #3949ab;
    display: inline-block;
}

/* Cards everywhere */
.card {
    border-radius: 14px;
    border: 1px solid #eef0f8;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}
.card-title h2,
.card-title h5 {
    font-weight: 600;
    color: #1a237e;
}

/* General h2 styling for consistency */
#region-main h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a237e;
}

/* Main content region - modern card look */
#region-main {
    padding: 32px 48px !important;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid #eef0f8;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    margin-bottom: 1rem;
    margin-top: -0.5rem;
}
#region-main > .card {
    border: none;
    box-shadow: none;
    background: transparent;
}
#region-main > .card > .card-body {
    padding: 0;
}
/* When region-main contains direct content (not in a card), wrap it visually */
#region-main > [role="main"] {
    background: transparent;
    border-radius: 14px;
    padding: 0;
}
/* Pages with custom inner cards: remove outer styling from region-main */
body.custom-cards-page #region-main {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 1rem !important;
}
/* Lists inside main content */
#region-main ul.section,
#region-main .course-content {
    padding: 0;
}

/* Blocks in sidebar */
[data-region="blocks-column"] .card {
    border: 1px solid #e8eaf6;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 1rem;
}
[data-region="blocks-column"] .card-body {
    padding: 1rem;
}
[data-region="blocks-column"] .card-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #283593;
}


/* ---- DASHBOARD (my/) PAGE ---- */

/* Hide right sidebar blocks completely on dashboard */
body.pagelayout-mydashboard [data-region="blocks-column"] {
    display: none !important;
}
/* Make main region full width when blocks are hidden */
body.pagelayout-mydashboard #region-main {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}
body.pagelayout-mydashboard #region-main.has-blocks {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}
/* Hide the standard context header on dashboard (we use custom heading) */
body.pagelayout-mydashboard #page-header .page-context-header {
    display: none !important;
}
/* Hide "Настроить эту страницу" button */
body.pagelayout-mydashboard #page-header .singlebutton,
body.pagelayout-mydashboard #page-header [data-action="edit"],
body.pagelayout-mydashboard .page-header-headings .singlebutton,
body.pagelayout-mydashboard .ml-auto .singlebutton {
    display: none !important;
}

/* Custom page header */
.dashboard-page-header {
    margin-bottom: 24px;
}
.dashboard-page-header h2 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a237e;
    margin: 0;
    padding-bottom: 12px;
    border-bottom: 3px solid #3949ab;
    display: inline-block;
}

/* Private files card */
body.pagelayout-mydashboard .dashboard-private-files {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    padding: 28px;
    min-height: 300px;
    margin-bottom: 20px;
}
.dashboard-section-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1a237e;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8eaf6;
}
.dashboard-section-title i {
    color: #3949ab;
}
body.pagelayout-mydashboard .dashboard-private-files a {
    color: #1a237e;
    text-decoration: none;
    transition: color 0.2s;
}
body.pagelayout-mydashboard .dashboard-private-files a:hover {
    color: #3949ab;
}
body.pagelayout-mydashboard .dashboard-private-files .icon {
    width: 22px;
    height: 22px;
}
body.pagelayout-mydashboard .dashboard-private-files ul {
    list-style: none;
    padding-left: 16px;
}
body.pagelayout-mydashboard .dashboard-private-files > ul {
    padding-left: 0;
}
body.pagelayout-mydashboard .dashboard-private-files li {
    padding: 6px 8px;
    border-radius: 8px;
    margin: 2px 0;
    transition: background 0.15s;
}
body.pagelayout-mydashboard .dashboard-private-files li:hover {
    background: #f5f5ff;
}
body.pagelayout-mydashboard .dashboard-private-files li div {
    display: flex;
    align-items: center;
    gap: 8px;
}
body.pagelayout-mydashboard .dashboard-private-files .btn-primary,
body.pagelayout-mydashboard .dashboard-private-files a.btn-primary {
    background: linear-gradient(135deg, #1565c0, #1976d2);
    border: none;
    border-radius: 10px;
    padding: 10px 24px;
    font-weight: 600;
    color: #ffffff !important;
    box-shadow: 0 3px 10px rgba(25, 118, 210, 0.3);
    transition: all 0.25s ease;
}
body.pagelayout-mydashboard .dashboard-private-files .btn-primary:hover,
body.pagelayout-mydashboard .dashboard-private-files a.btn-primary:hover {
    background: linear-gradient(135deg, #0d47a1, #1565c0);
    color: #ffffff !important;
    box-shadow: 0 5px 15px rgba(25, 118, 210, 0.4);
    transform: translateY(-1px);
}

/* Empty files state */
.empty-files-message {
    text-align: center;
    padding: 60px 20px;
    color: #78909c;
}
.empty-files-icon {
    font-size: 3rem;
    margin-bottom: 16px;
    opacity: 0.6;
}
.empty-files-message p {
    font-size: 1.1rem;
}

/* Online users card */
.dashboard-online-users {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    padding: 28px;
    margin-bottom: 20px;
}
.online-users-info {
    font-size: 0.9rem;
    color: #78909c;
    margin-bottom: 16px;
}
.online-users-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.online-user-item {
    display: inline-flex;
    align-items: center;
    background: #f5f5ff;
    border-radius: 20px;
    padding: 4px 12px 4px 4px;
    transition: all 0.2s ease;
}
.online-user-item:hover {
    background: #e8eaf6;
    box-shadow: 0 2px 6px rgba(26, 35, 126, 0.12);
}
.online-user-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #37474f;
    gap: 8px;
}
.online-user-item a:hover {
    color: #1a237e;
}
.online-user-item img {
    border-radius: 50%;
    width: 28px;
    height: 28px;
}
.online-user-name {
    font-size: 0.88rem;
    font-weight: 500;
}


/* Hide language selector everywhere */
.langmenu,
.langbutton,
.lang-menu,
nav .dropdown[data-key="langmenu"] {
    display: none !important;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Hide enrolled course links from sidebar */
#nav-drawer [data-type="20"] {
    display: none !important;
}