a {
    color: var(--orange-smile);
}

body, .content-header {
    background-color: var(--background-color);
}

.content-header-title {
    color: var(--title-color);
}

.user-name {
    font-weight: 600;
}

.logo-custom {
    font-size: 24px;
}

.logo-custom .icon {
    inline-size: auto;
}

.logo-custom .icon i {
    border: 1px solid #EAEAEA;
    padding: 6px;
    border-radius: 50%;
}

.content-top {
    background-color: var(--white);
}

.content-top.ea-search-disabled {
    display: none;
}

.content-top .fa, .content-top svg {
    color: var(--icon-color)
}

.content-top .icon {
    color: var(--icon-bg-color);
    border-radius: 50% / 50%;
}


.menu {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 21px;
    font-weight: bold;
}

.main-header #header-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.user-menu-wrapper .user-avatar {
    background: #F5F7FA;
    block-size: 28px;
    border-radius: 14px;
    max-inline-size: 28px;
}


.sidebar {
    background-color: var(--sidebar-bg);
    color: var(--sidebar-menu-color);
}

#main-menu .menu .menu-item {
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.10);
    width: 90%;
    transition: all 0.5s ease;
}

#main-menu .menu .menu-item:hover {
    background: var(--sidebar-menu-active-item-bg);
}

#main-menu .menu .menu-item:hover:not(.expanded) a,
#main-menu .menu .menu-item:hover:not(.expanded) .menu-icon {
    color: var(--sidebar-menu-active-item-color);
}

#main-menu .menu .menu-item-contents {
    padding: 12px 5px;
}

.main-header #header-logo .logo img {
    height: 120px;
}


/* Restore Bootstrap default accordion buttons (chevrons up/down) */
.form-group.field-collection .form-collection-item-collapse-marker {
    display: none;
}

.form-group.field-collection .accordion-header {
    padding-inline-start: 10px;
}

.form-group.field-collection .accordion-button {
    font-weight: bolder;
}

.form-group.field-collection .accordion-button:after {
    display: block;
}

.accordion {
    box-shadow: none !important;
}

.form-group.field-collection .accordion-item {
    margin-bottom: 4px;
    box-shadow: inset 0 0 0 1px var(--form-input-border-color)
}

.form-group.field-collection .accordion-item h2.accordion-header {
    background-color: var(--gray-300);
    box-shadow: inset 0 0 0 1px var(--form-input-border-color);
}

.form-group.field-collection .accordion-item h2.accordion-header:has(button.collapsed) {
    background-color: var(--gray-300);
}

.form-group.field-collection .accordion-item h2.accordion-header:has(button.collapsed):hover {
    background-color: var(--gray-100);
}

/* tablist */
.form-tabs-tablist .nav-tabs .nav-link.active, .form-tabs-tablist .nav-tabs .nav-link.active .tab-nav-item-icon {
    color: var(--orange-smile);
}

.form-tabs-tablist .nav-tabs .nav-link, .form-tabs-tablist .nav-tabs .nav-link .tab-nav-item-icon, .form-tabs-tablist .nav-tabs a:hover {
    color: var(--blue-smile);
}

.form-tabs-tablist .nav-tabs .nav-link.active::after {
    background: var(--orange-smile);
}

/* Overwrite Bootstrap default button styles */
.btn-primary {
    background-color: var(--orange-smile);
    --button-bg: var(--orange-smile);
}

.btn-primary:not(:disabled):not(.disabled):not(.btn-link):not(.btn-danger):active, .btn-primary:not(:disabled):not(.disabled):not(.btn-link):not(.btn-danger):active:focus, .btn-primary:not(:disabled):not(.disabled):not(.btn-link):not(.btn-danger):focus, .btn-primary:not(:disabled):not(.disabled):not(.btn-link):not(.btn-danger):hover {
    background-color: var(--gray-700);
    --button-hover-bg: var(--gray-700);
    --button-active-bg: var(--gray-700);
}

.btn-primary:disabled {
    background-color: var(--orange-smile);
}

.btn-secondary {
    background-color: transparent;
    --button-bg: transparent;
    color: var(--blue-smile);
}

.btn-secondary:hover, .btn-secondary:not(:disabled):not(.disabled):not(.btn-link):not(.btn-danger):hover {
    background-color: transparent;
    color: var(--bs-heading-color);
    --button-hover-bg: transparent;
    --button-active-bg: transparent;
}

/* Sidebar compact */
body.ea-sidebar-width-compact .sidebar .main-header #header-logo .logo img {
    height: 100px;
}

body.ea-sidebar-width-compact .wrapper {
    grid-template-columns: 120px auto;
}

body.ea-sidebar-width-compact .sidebar .main-header .navbar {
    padding-inline-start: 0;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item {
    border-radius: 15px;
    width: 45px;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item:hover .menu-item-contents {
    background: var(--orange-smile);
    color: var(--white);
    border-radius: 15px;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item .menu-item-contents {
    padding: 11px 0 12px 2px;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item:hover i {
    color: var(--white) !important;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item:hover {
    background: var(--orange-smile);
    box-shadow: inherit;
}

body.ea-sidebar-width-compact #main-menu .menu .menu-item:hover .menu-item-label {
    display: none;
}

@media (min-width: 992px) {
    .content-top.ea-search-disabled {
        display: flex;
    }

    .content-top .sidebar-toggler {
        display: block;
    }

    .content-top .redmine-link-container {
        display: block;
    }
}

.icon-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    block-size: 28px;
    max-inline-size: 28px;
    padding: 2px;
}

.icon-circle svg {
    width: 100%;
    height: 100%;
}

.slug .input-group-text {
    font-size: 14px;
}

.table-bu {
    border-bottom-width: unset;
}

.table-bu thead tr:first-child th {
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0;
    font-weight: 600;
    color: rgba(5, 0, 78, 1);
}

.table-bu thead tr th {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0;
    font-weight: 400;
    color: rgba(43, 50, 56, 1);
}

.bu-sales {
    display: inline-block;
    width: 114px;
    height: 26px;
    border-radius: 8px;
    color: rgba(48, 99, 255, 1);
    background-color: rgba(240, 249, 255, 1);
    border: 1px rgba(48, 99, 255, 1) solid;
}

.card-status {
    border-radius: 16px;
}

.card-status ul li {
    border: 0;
}

.card-status ul li a {
    border: 0;
    color: rgba(43, 50, 56, 1);
}

.card-header-status {
    border: 0;
}

.card-header-status-title {
    width: 261px;
    height: 38px;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 30px;
    line-height: 38px;
    color: rgba(21, 29, 72, 1);
}

.card-in-progress,
.card-in-progress .card-header-status,
.card-in-progress ul li {
    background-color: rgba(254, 247, 255, 1);
}

.card-to-retake,
.card-to-retake .card-header-status,
.card-to-retake ul li {
    background-color: rgba(255, 249, 247, 1);
}

.card-validated,
.card-validated .card-header-status,
.card-validated ul li {
    background-color: rgba(235, 255, 238, 1);
}

.card-waiting-for-validation,
.card-waiting-for-validation .card-header-status,
.card-waiting-for-validation ul li {
    background-color: rgba(246, 248, 255, 1);
}

.card-assigned,
.card-assigned .card-header-status,
.card-assigned ul li {
    background-color: rgba(246, 248, 255, 1);
}
.row-card-status {
    margin-left: 8%;
}

#badges-title {
    width: 121px;
    height: 32px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 32px;
    letter-spacing: 0;
    color: rgba(5, 0, 78, 1);
    margin-left: 17%;
}

.badge-container {
    position: relative;
}

.badge-container img {
    width: 72px;
    height: 85px;
}

.badge-container .badge-text {
    position: absolute;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-style: italic;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    color: rgba(48, 99, 255, 1);
    display: none;
    white-space: nowrap;
}

.badge-container img:hover {
    border-radius: 15px;
    border: 1.5px rgba(48, 99, 255, 1) solid;
}

.badges-row {
    margin-left: 15%;
}

.row-card-status .col-2 {
    width: 33%;
}

.google-chart g text {
    font-family: 'Poppins', sans-serif !important;
}

.courses-to-validate {
    border-radius: 16px;
    background-color: #EBFFEE;
    padding: 36px;
}

.courses-to-validate td {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #2B3238;
}

.progress-score-table .progress {
    height: 4px;
    border-radius: 8px;
}

.progress-score-table {
    border-collapse: separate;
    border-spacing: 0 12px; /* espace vertical entre les lignes */
}

.progress-score-table tbody tr {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.progress-score-table td,
.progress-score-table th {
    padding: 12px 8px;
}

.courses-in-progress {
    padding: 10px;
    border-radius: 16px;
    background-color: #26357333;
}

.courses-in-progress h5 {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0;
    color: #151D48;
}

.courses-in-progress span {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0;
    color: #343A40;
}

.courses-in-progress ul {
    list-style-type: none;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0;
    color: #343A40;
}