:root {
    --dashboard-primary: #25AAE1;
    --bs-primary: #25AAE1;
    --bs-primary-rgb: 37, 170, 225;
    --dashboard-bg: #ffffff;
    --dashboard-fg: #000000;
    --dashboard-muted: rgba(0, 0, 0, 0.58);
    --dashboard-line: rgba(0, 0, 0, 0.14);
    --dashboard-line-strong: #000000;
    --dashboard-surface: #ffffff;
    --dashboard-surface-alt: #f4f4f4;
    --dashboard-shadow: 12px 12px 0 rgba(0, 0, 0, 0.05);
    --dashboard-radius-lg: 28px;
    --dashboard-radius-md: 20px;
    --dashboard-radius-sm: 14px;
}

html,
body {
    background: var(--dashboard-bg) !important;
    color: var(--dashboard-fg) !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

body {
    letter-spacing: 0.02em;
}

a,
a:hover {
    color: var(--dashboard-fg);
}

.wrapper {
    background: var(--dashboard-bg);
}

.topbar {
    height: 88px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom: 1px solid var(--dashboard-line-strong) !important;
    box-shadow: none !important;
    backdrop-filter: blur(16px);
}

.topbar .navbar {
    height: 88px !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
}

.topbar-logo-header {
    height: auto !important;
    padding: 0 !important;
    border-right: 0 !important;
}

.dashboard-brand-shell {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    color: var(--dashboard-fg);
}

.dashboard-brand-shell:hover {
    color: var(--dashboard-fg);
}

.dashboard-brand-copy {
    display: grid;
    gap: 0.2rem;
    line-height: 1;
}

.dashboard-brand-label {
    font-size: 0.68rem;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--dashboard-muted);
}

.dashboard-brand-copy strong {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.logo-icon {
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 18px;
    padding: 0.35rem;
    background: var(--dashboard-surface);
}

.dashboard-topline {
    align-items: center;
    justify-content: center;
    padding: 0.9rem 1.1rem;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--dashboard-fg);
}

.mobile-toggle-menu {
    width: 48px;
    height: 48px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 16px;
    color: var(--dashboard-fg) !important;
    background: var(--dashboard-surface);
}

.user-box > a {
    padding: 0.7rem 1rem !important;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 22px;
    background: var(--dashboard-surface);
}

.user-img {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    border: 1px solid var(--dashboard-line-strong);
    object-fit: cover;
    filter: grayscale(100%);
}

.user-name {
    color: var(--dashboard-fg);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.designattion {
    color: var(--dashboard-muted) !important;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.topbar .navbar .dropdown-menu,
.dropdown-menu {
    padding: 0.55rem;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 20px;
    background: var(--dashboard-surface);
    box-shadow: var(--dashboard-shadow);
}

.topbar .navbar .dropdown-menu::after,
.topbar .navbar .dropdown-large .dropdown-menu::after,
.dropdown-menu::after {
    display: none !important;
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    color: var(--dashboard-fg);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item:active {
    background: var(--dashboard-primary);
    color: var(--dashboard-bg);
}

.dropdown-divider {
    border-color: var(--dashboard-line);
}

.primary-menu {
    position: fixed;
    top: 88px;
    left: 0;
    right: 0;
    z-index: 9;
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid var(--dashboard-line-strong);
}

.primary-menu .navbar {
    padding: 1rem 1.25rem !important;
}

.primary-menu .offcanvas {
    background: var(--dashboard-surface);
}

.dashboard-main-offcanvas {
    width: 100%;
}

.primary-menu .offcanvas-header {
    padding: 1.25rem 1.5rem;
    border-color: var(--dashboard-line) !important;
}

.primary-menu .offcanvas-body {
    padding: 0 !important;
}

.dashboard-main-nav {
    width: 100%;
    gap: 0.7rem;
    row-gap: 0.7rem;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-left: 0;
    margin: 0;
}

.primary-menu .navbar .navbar-nav .nav-item {
    display: flex;
    align-items: center;
    width: auto !important;
}

.primary-menu .navbar .navbar-nav a.nav-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid var(--dashboard-line-strong) !important;
    border-bottom: 1px solid var(--dashboard-line-strong) !important;
    border-radius: 999px !important;
    padding: 0.9rem 1.1rem !important;
    margin: 0 !important;
    min-height: 54px;
    color: var(--dashboard-fg) !important;
    background: var(--dashboard-surface) !important;
    font-size: 0.92rem !important;
    font-weight: 600;
    gap: 0.7rem;
    white-space: nowrap;
}

.primary-menu .navbar .navbar-nav a.nav-link:hover,
.primary-menu .navbar .navbar-nav a.nav-link:focus,
.primary-menu .navbar .navbar-nav a.nav-link:active,
.primary-menu .navbar .navbar-nav a.nav-link.active {
    color: var(--dashboard-bg) !important;
    background: var(--dashboard-primary) !important;
}

.primary-menu .navbar .navbar-nav a .parent-icon {
    font-size: 1.05rem;
}

.primary-menu .navbar .navbar-nav .dropdown-menu {
    padding: 0.65rem !important;
    margin-top: 0.65rem !important;
}

.primary-menu .navbar .navbar-nav .dropdown-menu.show {
    display: block !important;
}

.primary-menu .navbar .navbar-nav .dropdown-menu .dropdown-item {
    font-size: 0.9rem !important;
    border-radius: 14px !important;
}

.primary-menu .navbar .navbar-nav .show > a.nav-link,
.primary-menu .navbar .navbar-nav a.nav-link.show {
    color: var(--dashboard-bg) !important;
    background: var(--dashboard-primary) !important;
}

.dropy-icon {
    transition: transform 0.2s ease;
}

.primary-menu .navbar .navbar-nav .show > a .dropy-icon,
.primary-menu .navbar .navbar-nav a.show .dropy-icon {
    transform: rotate(180deg);
}

.page-wrapper {
    margin-top: 188px !important;
    margin-bottom: 96px !important;
    margin-left: 0 !important;
}

.page-content {
    padding: 2rem 1.25rem !important;
}

.page-footer {
    background: rgba(255, 255, 255, 0.96) !important;
    border-top: 1px solid var(--dashboard-line-strong) !important;
    padding: 1rem 1.25rem !important;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.68rem !important;
    color: var(--dashboard-muted);
}

.page-breadcrumb {
    margin-bottom: 1.5rem !important;
}

.page-breadcrumb .breadcrumb-title {
    color: var(--dashboard-fg) !important;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    border-right: 1px solid var(--dashboard-line-strong) !important;
}

.breadcrumb-item,
.breadcrumb-item a {
    color: var(--dashboard-muted) !important;
}

.page-section-intro {
    overflow: hidden;
}

.page-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.85rem;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 999px;
    background: var(--dashboard-primary);
    color: var(--dashboard-bg);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.page-section-title {
    margin: 1rem 0 0.6rem;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 0.98;
    letter-spacing: -0.06em;
}

.page-section-copy {
    max-width: 720px;
    margin-bottom: 0;
    color: var(--dashboard-muted);
    font-size: 1rem;
}

.page-section-note {
    margin-top: 1.25rem;
    color: var(--dashboard-muted);
    font-size: 0.9rem;
}

.page-section-metric {
    padding: 1rem 1.1rem;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: var(--dashboard-radius-md);
    background: var(--dashboard-surface-alt);
}

.page-section-metric span {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--dashboard-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.page-section-metric strong {
    font-size: 1.7rem;
    line-height: 1;
}

.card,
.modal-content {
    background: var(--dashboard-surface) !important;
    border: 1px solid var(--dashboard-line-strong) !important;
    border-radius: var(--dashboard-radius-lg) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.card .card-body,
.modal-content .modal-body {
    padding: 1.5rem;
}

.btn {
    border-radius: 999px !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    padding: 0.8rem 1.2rem !important;
    box-shadow: none !important;
}

.btn-primary,
.btn-success,
.btn-danger,
.swal2-confirm {
    background: var(--dashboard-primary) !important;
    border-color: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus,
.btn-danger:hover,
.btn-danger:focus,
.swal2-confirm:hover,
.swal2-confirm:focus {
    background: var(--dashboard-surface-alt) !important;
    color: var(--dashboard-fg) !important;
}

.btn-light,
.btn-white,
.btn-outline-light,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-primary,
.btn-outline-danger,
.swal2-cancel {
    background: var(--dashboard-surface) !important;
    border-color: var(--dashboard-line-strong) !important;
    color: var(--dashboard-fg) !important;
}

.btn-light:hover,
.btn-white:hover,
.btn-outline-light:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-primary:hover,
.btn-outline-danger:hover,
.swal2-cancel:hover,
.btn-light:focus,
.btn-white:focus,
.btn-outline-light:focus,
.btn-outline-secondary:focus,
.btn-outline-success:focus,
.btn-outline-primary:focus,
.btn-outline-danger:focus,
.swal2-cancel:focus {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.form-control,
.form-select,
.form-control:disabled,
.form-control[readonly] {
    min-height: 52px;
    border: 1px solid var(--dashboard-line-strong) !important;
    border-radius: 18px !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
    box-shadow: none !important;
}

.form-control::placeholder {
    color: var(--dashboard-muted);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--dashboard-line-strong) !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.06) !important;
}

.input-group-text {
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 18px;
    background: var(--dashboard-surface-alt);
    color: var(--dashboard-fg);
}

.table {
    color: var(--dashboard-fg);
}

.table > :not(caption) > * > * {
    background: var(--dashboard-surface) !important;
    border-bottom: 1px solid var(--dashboard-line) !important;
    color: var(--dashboard-fg) !important;
}

.table thead th {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border: 1px solid var(--dashboard-line-strong) !important;
    border-radius: 14px !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
}

.badge {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
    border-radius: 999px !important;
    padding: 0.45rem 0.8rem !important;
    font-weight: 600;
}

.text-muted,
.text-secondary,
.sort-current {
    color: var(--dashboard-muted) !important;
}

.text-success,
.text-danger,
.text-primary {
    color: var(--dashboard-primary) !important;
}

.text-dark,
.text-black {
    color: var(--dashboard-fg) !important;
}

.bg-primary,
.bg-success,
.bg-danger,
.bg-dark {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.bg-info,
.bg-warning {
    background: var(--dashboard-surface-alt) !important;
    color: var(--dashboard-fg) !important;
}

.bg-light,
.bg-white {
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
}

.border-primary,
.border-success,
.border-danger {
    border-color: var(--dashboard-primary) !important;
}

.formation-media,
.formation-media-empty {
    background: var(--dashboard-surface-alt) !important;
}

.dashboard-hero {
    position: relative !important;
    overflow: hidden !important;
    background: var(--dashboard-surface-alt) !important;
    border: 1px solid var(--dashboard-line-strong) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.dashboard-hero::after {
    background: rgba(0, 0, 0, 0.06) !important;
}

.dashboard-eyebrow,
.dashboard-topline {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
    border: 1px solid var(--dashboard-primary) !important;
}

.dashboard-title,
.dashboard-description,
.dashboard-stat,
.dashboard-stat-label,
.dashboard-stat small {
    color: var(--dashboard-fg) !important;
}

.dashboard-stat {
    background: var(--dashboard-surface) !important;
    border: 1px solid var(--dashboard-line-strong) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.dashboard-filter-chip {
    border-color: var(--dashboard-line-strong) !important;
    color: var(--dashboard-fg) !important;
    background: var(--dashboard-surface) !important;
}

.dashboard-filter-chip:hover,
.dashboard-filter-chip.is-active {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.catalog-card,
.formation-card,
.presentation-preview,
.formation-detail-media,
.formation-detail-empty {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.catalog-media,
.catalog-media-empty,
.formation-detail-media,
.formation-detail-empty,
.presentation-preview {
    background: var(--dashboard-surface-alt) !important;
}

.catalog-card .swiper-pagination-bullet,
.formation-card .swiper-pagination-bullet {
    background: rgba(0, 0, 0, 0.26) !important;
}

.catalog-card .swiper-pagination-bullet-active,
.formation-card .swiper-pagination-bullet-active {
    background: var(--dashboard-primary) !important;
}

.formation-detail-thumb {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
}

.formation-detail-thumb:hover,
.formation-detail-thumb.is-active {
    border-color: var(--dashboard-line-strong) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.formation-detail-meta-item {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface-alt) !important;
}

.formation-detail-meta-item i,
.formation-detail-meta-item small,
.secure-reader-meta-item span,
.secure-reader-file small {
    color: var(--dashboard-muted) !important;
}

.presentation-preview-link {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
    box-shadow: none !important;
}

.presentation-preview .swiper-pagination-bullet {
    background: rgba(0, 0, 0, 0.22) !important;
}

.presentation-preview .swiper-pagination-bullet-active {
    background: var(--dashboard-primary) !important;
}

.nav-tabs.nav-primary,
.nav-tabs {
    border-bottom-color: var(--dashboard-line-strong) !important;
}

.nav-tabs .nav-link {
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    color: var(--dashboard-muted) !important;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link.active {
    border-color: var(--dashboard-primary) !important;
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.secure-reader-kicker {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.secure-reader-sidebar,
.secure-reader-stage {
    top: 136px !important;
}

.secure-reader-meta-item,
.secure-reader-file,
.secure-reader-warning,
.secure-reader-loading,
.secure-reader-error,
.secure-reader-empty {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
}

.secure-reader-file:hover,
.secure-reader-file.is-active {
    border-color: var(--dashboard-line-strong) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.secure-reader-file-index {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.secure-reader-surface {
    background: var(--dashboard-surface) !important;
    border: 1px solid var(--dashboard-line-strong) !important;
    box-shadow: var(--dashboard-shadow) !important;
}

.secure-player-shell {
    background: var(--dashboard-surface) !important;
}

.secure-reader-title,
.secure-reader-stage-header h2,
.secure-reader-stage-header p,
.secure-reader-warning,
.secure-reader-loading,
.secure-reader-empty,
.secure-reader-error {
    color: var(--dashboard-fg) !important;
}

.secure-pdf-toolbar {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
    border: 1px solid var(--dashboard-primary) !important;
}

.secure-pdf-stage {
    background: var(--dashboard-surface-alt) !important;
    border: 1px solid var(--dashboard-line-strong) !important;
}

.secure-pdf-canvas,
.secure-video-wrapper .plyr {
    border: 1px solid var(--dashboard-line-strong) !important;
}

.secure-video-wrapper .plyr {
    --plyr-color-main: var(--dashboard-primary) !important;
}

.accordion-item,
.accordion-button,
.accordion-button:not(.collapsed) {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
    box-shadow: none !important;
}

.accordion-button::after {
    filter: grayscale(100%) contrast(1000%);
}

.filepond--root,
.filepond--panel-root,
.ql-toolbar.ql-snow,
.ql-container.ql-snow,
.air-datepicker,
.flatpickr-calendar {
    border-color: var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
    background: var(--dashboard-primary) !important;
    border-color: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.profile-shell .rounded-circle {
    border: 1px solid var(--dashboard-line-strong) !important;
    background: var(--dashboard-surface-alt) !important;
    filter: grayscale(100%);
}

.radius-10 {
    border-radius: var(--dashboard-radius-md) !important;
}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_paginate {
    color: var(--dashboard-muted) !important;
}

.dataTables_wrapper .paginate_button {
    border: 1px solid var(--dashboard-line-strong) !important;
    border-radius: 999px !important;
    background: var(--dashboard-surface) !important;
    color: var(--dashboard-fg) !important;
}

.dataTables_wrapper .paginate_button.current,
.dataTables_wrapper .paginate_button:hover {
    background: var(--dashboard-primary) !important;
    color: var(--dashboard-bg) !important;
}

.offcanvas,
.offcanvas-header,
.offcanvas-body {
    background: var(--dashboard-surface) !important;
}

.overlay.toggle-icon {
    background: rgba(0, 0, 0, 0.45);
}

@media (max-width: 991.98px) {
    .mobile-toggle-menu {
        display: inline-flex !important;
    }

    .topbar {
        height: 84px !important;
    }

    .topbar .navbar {
        height: 84px !important;
    }

    .primary-menu {
        top: 84px;
    }

    .primary-menu .navbar {
        padding: 0 !important;
    }

    .primary-menu .offcanvas-body {
        padding: 1.25rem 1.5rem !important;
    }

    .page-wrapper {
        margin-top: 150px !important;
    }

    .dashboard-main-nav {
        flex-direction: column;
        align-items: stretch !important;
        row-gap: 0.85rem;
    }

    .primary-menu .offcanvas .dropdown-menu {
        position: static !important;
        width: 100% !important;
        margin-top: 0.65rem !important;
        box-shadow: none !important;
    }

    .secure-reader-sidebar,
    .secure-reader-stage {
        top: 0 !important;
    }
}

@media (min-width: 992px) {
    .mobile-toggle-menu {
        display: none !important;
    }

    .primary-menu .navbar,
    .primary-menu .offcanvas,
    .primary-menu .offcanvas-body,
    .primary-menu .navbar .navbar-nav {
        overflow: visible !important;
    }

    .primary-menu .navbar .navbar-nav .dropdown .dropdown-menu,
    .primary-menu .navbar .navbar-nav .dropend .dropdown-menu {
        display: none !important;
    }

    .primary-menu .navbar .navbar-nav .dropdown:hover > .dropdown-menu,
    .primary-menu .navbar .navbar-nav .dropend:hover > .dropdown-menu {
        display: none !important;
    }

    .primary-menu .navbar .navbar-nav .dropdown .dropdown-menu.show,
    .primary-menu .navbar .navbar-nav .dropend .dropdown-menu.show {
        display: block !important;
    }

    .dashboard-main-nav {
        align-items: center !important;
    }
}

@media (max-width: 767.98px) {
    .page-content {
        padding: 1.15rem 0.75rem !important;
    }

    .card .card-body,
    .modal-content .modal-body {
        padding: 1.1rem;
    }

    .page-footer {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
        letter-spacing: 0.16em;
    }
}