:root[data-custom-theme-active="true"] .btn-primary,
:root[data-custom-theme-active="true"] .btn-accent,
:root[data-custom-theme-active="true"] .badge-primary,
:root[data-custom-theme-active="true"] .badge-accent {
    background-color: var(--dynamic-primary-color);
    color: var(--dynamic-primary-text-color);
    border-color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .navbar .menu a.active,
:root[data-custom-theme-active="true"] .navbar .menu a.menu-active {
    background-color: color-mix(in srgb, var(--dynamic-accent-color) 30%, white);
    color: color-mix(in srgb, var(--dynamic-accent-color) 35%, black);
}

:root[data-custom-theme-active="true"] aside .menu a.menu-active,
:root[data-custom-theme-active="true"] #openesg-sidebar .menu a.active,
:root[data-custom-theme-active="true"] #openesg-sidebar .menu a.menu-active {
    background-color: color-mix(in srgb, var(--dynamic-primary-text-color) 20%, transparent);
    color: var(--dynamic-primary-text-color);
    font-weight: 700;
}

:root[data-custom-theme-active="true"] .btn-primary svg path,
:root[data-custom-theme-active="true"] .btn-primary svg circle,
:root[data-custom-theme-active="true"] .btn-primary svg rect,
:root[data-custom-theme-active="true"] .btn-primary svg line,
:root[data-custom-theme-active="true"] .btn-primary svg polyline,
:root[data-custom-theme-active="true"] .btn-accent svg path,
:root[data-custom-theme-active="true"] .btn-accent svg circle,
:root[data-custom-theme-active="true"] .btn-accent svg rect,
:root[data-custom-theme-active="true"] .btn-accent svg line,
:root[data-custom-theme-active="true"] .btn-accent svg polyline {
    stroke: var(--dynamic-primary-text-color);
}

:root[data-custom-theme-active="true"] .topbar-nav {
    border-top-color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .tooltip-error::before {
    background-color: var(--color-error);
    color: var(--color-error-content);
}

:root[data-custom-theme-active="true"] .tooltip-error::after {
    border-color: var(--color-error) transparent transparent transparent;
}

:root[data-custom-theme-active="true"] .tooltip-success::before {
    background-color: var(--color-success);
    color: var(--color-success-content);
}

:root[data-custom-theme-active="true"] .tooltip-success::after {
    border-color: var(--color-success) transparent transparent transparent;
}

:root[data-custom-theme-active="true"] .footer {
    background-color: var(--dynamic-accent-color);
    color: var(--dynamic-accent-text-color);
}

:root[data-custom-theme-active="true"] .footer .footer-title,
:root[data-custom-theme-active="true"] .footer a:hover {
    color: var(--dynamic-accent-text-color);
}

:root[data-custom-theme-active="true"] .footer a {
    color: color-mix(in srgb, var(--dynamic-accent-text-color) 80%, transparent);
}

:root[data-custom-theme-active="true"] .topbar-center {
    background-color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item {
    color: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item svg {
    color: color-mix(in srgb, var(--dynamic-accent-color) 85%, transparent);
}

:root[data-custom-theme-active="true"] .topbar-nav-item svg path,
:root[data-custom-theme-active="true"] .topbar-nav-item svg circle,
:root[data-custom-theme-active="true"] .topbar-nav-item svg rect,
:root[data-custom-theme-active="true"] .topbar-nav-item svg line,
:root[data-custom-theme-active="true"] .topbar-nav-item svg polyline {
    stroke: color-mix(in srgb, var(--dynamic-accent-color) 85%, transparent);
}

:root[data-custom-theme-active="true"] .topbar-nav-item:hover {
    background-color: color-mix(in srgb, var(--dynamic-accent-color) 20%, transparent);
    color: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg {
    color: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg path,
:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg circle,
:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg rect,
:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg line,
:root[data-custom-theme-active="true"] .topbar-nav-item:hover svg polyline {
    stroke: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active {
    background-color: var(--dynamic-accent-color);
    color: var(--dynamic-accent-text-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg {
    color: var(--dynamic-accent-text-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg path,
:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg circle,
:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg rect,
:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg line,
:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active svg polyline {
    stroke: var(--dynamic-accent-text-color);
}

:root[data-custom-theme-active="true"] .topbar-badge {
    background-color: color-mix(in srgb, var(--dynamic-accent-color) 25%, transparent);
    color: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .topbar-nav-item.topbar-active .topbar-badge {
    background-color: var(--dynamic-accent-text-color);
    color: var(--dynamic-accent-color);
}

:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active {
    color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg {
    color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg path,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg circle,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg rect,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg line,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.active svg polyline,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg path,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg circle,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg rect,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg line,
:root[data-custom-theme-active="true"] .tab-nav-underline .tab-item.tab-active svg polyline {
    stroke: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .mobile-menu-item.menu-active,
:root[data-custom-theme-active="true"] .mobile-menu-subitem.menu-active {
    color: var(--dynamic-primary-color);
    background-color: color-mix(in srgb, var(--dynamic-accent-color) 15%, white);
}

:root[data-custom-theme-active="true"] .mobile-menu-item.menu-active svg,
:root[data-custom-theme-active="true"] .mobile-menu-subitem.menu-active svg {
    color: var(--dynamic-primary-color);
}

:root[data-custom-theme-active="true"] .navbar .menu.menu-horizontal > li > a.active,
:root[data-custom-theme-active="true"] .navbar .menu.menu-horizontal > li > a.menu-active,
:root[data-custom-theme-active="true"] .navbar .menu-horizontal > li > a.active,
:root[data-custom-theme-active="true"] .navbar .menu-horizontal > li > a.menu-active,
:root[data-custom-theme-active="true"] .navbar .menu > li > a.active,
:root[data-custom-theme-active="true"] .navbar .menu > li > a.menu-active,
:root[data-custom-theme-active="true"] .navbar .dropdown > a.active {
    background-color: color-mix(in srgb, var(--dynamic-accent-color) 10%, white) !important;
    color: var(--dynamic-primary-color) !important;
}

:root[data-custom-theme-active="true"] .navbar .menu.menu-horizontal > li > a.active svg,
:root[data-custom-theme-active="true"] .navbar .menu.menu-horizontal > li > a.menu-active svg,
:root[data-custom-theme-active="true"] .navbar .menu > li > a.active svg,
:root[data-custom-theme-active="true"] .navbar .menu > li > a.menu-active svg {
    color: var(--dynamic-primary-color) !important;
}

:root[data-custom-theme-active="true"] .stat-card-link:hover .stat-value,
:root[data-custom-theme-active="true"] .steps .step-primary,
:root[data-custom-theme-active="true"] .loading,
:root[data-custom-theme-active="true"] .loading-primary,
:root[data-custom-theme-active="true"] .radio:checked,
:root[data-custom-theme-active="true"] .text-accent {
    color: var(--dynamic-primary-color) !important;
}

:root[data-custom-theme-active="true"] .clickable-row:hover,
:root[data-custom-theme-active="true"] tr.hover\:bg-secondary:hover {
    background-color: color-mix(in srgb, var(--dynamic-secondary-color) 20%, white) !important;
    color: var(--dynamic-background-text-color) !important;
}

:root[data-custom-theme-active="true"] .join .join-item.btn:not(:checked):not(.btn-disabled):not(.btn-ghost):hover {
    border-color: var(--dynamic-primary-color) !important;
    color: var(--dynamic-primary-color) !important;
    background-color: color-mix(in srgb, var(--dynamic-primary-color) 5%, transparent) !important;
}

:root[data-custom-theme-active="true"] .join .join-item.btn:checked,
:root[data-custom-theme-active="true"] .checkbox:checked,
:root[data-custom-theme-active="true"] .toggle:checked {
    background-color: var(--dynamic-primary-color) !important;
    border-color: var(--dynamic-primary-color) !important;
    color: var(--dynamic-primary-text-color) !important;
}

:root[data-custom-theme-active="true"] .flatpickr-months .flatpickr-month,
:root[data-custom-theme-active="true"] .flatpickr-weekdays,
:root[data-custom-theme-active="true"] span.flatpickr-weekday,
:root[data-custom-theme-active="true"] .flatpickr-current-month .flatpickr-monthDropdown-months,
:root[data-custom-theme-active="true"] .flatpickr-day.selected,
:root[data-custom-theme-active="true"] .flatpickr-day.startRange,
:root[data-custom-theme-active="true"] .flatpickr-day.endRange,
:root[data-custom-theme-active="true"] .flatpickr-day.selected:hover,
:root[data-custom-theme-active="true"] .flatpickr-day.startRange:hover,
:root[data-custom-theme-active="true"] .flatpickr-day.endRange:hover,
:root[data-custom-theme-active="true"] .flatpickr-day.selected:focus,
:root[data-custom-theme-active="true"] .flatpickr-day.startRange:focus,
:root[data-custom-theme-active="true"] .flatpickr-day.endRange:focus,
:root[data-custom-theme-active="true"] .flatpickr-day.today:hover,
:root[data-custom-theme-active="true"] .flatpickr-day.today:focus {
    background: var(--dynamic-primary-color) !important;
    border-color: var(--dynamic-primary-color) !important;
    color: var(--dynamic-primary-text-color) !important;
}

:root[data-custom-theme-active="true"] .flatpickr-current-month input.cur-year,
:root[data-custom-theme-active="true"] .flatpickr-months .flatpickr-prev-month,
:root[data-custom-theme-active="true"] .flatpickr-months .flatpickr-next-month {
    color: var(--dynamic-primary-text-color) !important;
    fill: var(--dynamic-primary-text-color) !important;
}

:root[data-custom-theme-active="true"] .flatpickr-current-month .numInputWrapper span.arrowUp:after {
    border-bottom-color: var(--dynamic-primary-text-color) !important;
}

:root[data-custom-theme-active="true"] .flatpickr-current-month .numInputWrapper span.arrowDown:after {
    border-top-color: var(--dynamic-primary-text-color) !important;
}

:root[data-custom-theme-active="true"] .flatpickr-day.today {
    border-color: var(--dynamic-primary-color) !important;
}

:root[data-custom-theme-active="true"] .btn-input-addon {
    background-color: color-mix(in srgb, var(--dynamic-primary-color) 12%, white) !important;
    color: var(--dynamic-primary-color) !important;
    border-color: color-mix(in srgb, var(--dynamic-primary-color) 25%, white) !important;
}

:root[data-report-theme-active="true"] .report-progress-card {
    background-color: var(--dynamic-report-primary-color) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-primary-color) 80%, black) !important;
    color: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] #remaining_fields .text-gray-600,
:root[data-report-theme-active="true"] #remaining_fields .text-sm {
    color: color-mix(in srgb, var(--dynamic-report-primary-text-color) 85%, transparent) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .bg-primary,
:root[data-report-theme-active="true"] .report-progress-card .btn-primary {
    background-color: var(--dynamic-report-accent-color) !important;
    border-color: var(--dynamic-report-accent-color) !important;
    color: var(--dynamic-report-accent-text-color) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .progress-segmented progress::-webkit-progress-bar {
    background-color: color-mix(in srgb, var(--dynamic-report-primary-text-color) 40%, transparent) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .progress-segmented::after {
    display: none !important;
}

:root[data-report-theme-active="true"] .report-progress-card .drawer-side,
:root[data-report-theme-active="true"] .report-progress-card .drawer-side .text-base-content {
    color: var(--color-base-content) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .btn-ghost {
    color: var(--dynamic-report-primary-text-color) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-primary-text-color) 35%, transparent) !important;
    background-color: color-mix(in srgb, var(--dynamic-report-primary-text-color) 10%, transparent) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .btn-ghost:hover {
    background-color: color-mix(in srgb, var(--dynamic-report-primary-text-color) 20%, transparent) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .btn-primary:hover:not(.btn-disabled):not(:disabled) {
    background-color: color-mix(in srgb, var(--dynamic-report-accent-color) 85%, black) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-accent-color) 85%, black) !important;
}

:root[data-report-theme-active="true"] .report-progress-card .btn-primary svg path,
:root[data-report-theme-active="true"] .report-progress-card .btn-primary svg circle,
:root[data-report-theme-active="true"] .report-progress-card .btn-primary svg rect,
:root[data-report-theme-active="true"] .report-progress-card .btn-primary svg line,
:root[data-report-theme-active="true"] .report-progress-card .btn-primary svg polyline {
    stroke: var(--dynamic-report-accent-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item {
    background-color: color-mix(in srgb, var(--dynamic-report-secondary-color) 30%, white) !important;
    color: var(--dynamic-report-secondary-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item.active,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active {
    background-color: var(--dynamic-report-primary-color) !important;
    color: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item.active svg,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg,
:root[data-report-theme-active="true"] .btn-report-primary svg,
:root[data-report-theme-active="true"] .btn-report-primary svg path,
:root[data-report-theme-active="true"] .btn-report-primary svg circle,
:root[data-report-theme-active="true"] .btn-report-primary svg rect,
:root[data-report-theme-active="true"] .btn-report-primary svg line,
:root[data-report-theme-active="true"] .btn-report-primary svg polyline {
    color: var(--dynamic-report-primary-text-color) !important;
    stroke: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item.active svg path,
:root[data-report-theme-active="true"] #tabs .tab-item.active svg circle,
:root[data-report-theme-active="true"] #tabs .tab-item.active svg rect,
:root[data-report-theme-active="true"] #tabs .tab-item.active svg line,
:root[data-report-theme-active="true"] #tabs .tab-item.active svg polyline,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg path,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg circle,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg rect,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg line,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active svg polyline {
    stroke: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item.active .badge,
:root[data-report-theme-active="true"] #tabs .tab-item.active .badge-error,
:root[data-report-theme-active="true"] #tabs .tab-item.active .badge-success,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge-error,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge-success {
    background-color: var(--dynamic-report-primary-text-color) !important;
    color: var(--dynamic-report-primary-color) !important;
    border-color: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] #tabs .tab-item.active .badge svg path,
:root[data-report-theme-active="true"] #tabs .tab-item.active .badge svg circle,
:root[data-report-theme-active="true"] #tabs .tab-item.active .badge svg line,
:root[data-report-theme-active="true"] #tabs .tab-item.active .badge svg polyline,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge svg path,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge svg circle,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge svg line,
:root[data-report-theme-active="true"] #tabs .tab-item.tab-active .badge svg polyline {
    stroke: var(--dynamic-report-primary-color) !important;
}

:root[data-report-theme-active="true"] .btn-report-primary {
    background-color: var(--dynamic-report-primary-color) !important;
    border-color: var(--dynamic-report-primary-color) !important;
    color: var(--dynamic-report-primary-text-color) !important;
}

:root[data-report-theme-active="true"] .btn-report-primary:hover:not(.btn-disabled):not(:disabled) {
    background-color: color-mix(in srgb, var(--dynamic-report-primary-color) 85%, black) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-primary-color) 85%, black) !important;
}

:root[data-report-theme-active="true"] .btn-report-action {
    background-color: color-mix(in srgb, var(--dynamic-report-secondary-color) 25%, white) !important;
    border-color: var(--dynamic-report-secondary-color) !important;
    color: var(--dynamic-report-secondary-text-color) !important;
}

:root[data-report-theme-active="true"] .btn-report-action:hover:not(.btn-disabled):not(:disabled) {
    background-color: color-mix(in srgb, var(--dynamic-report-secondary-color) 45%, white) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-secondary-color) 80%, black) !important;
}

:root[data-report-theme-active="true"] .btn-report-action svg,
:root[data-report-theme-active="true"] .btn-report-action svg path,
:root[data-report-theme-active="true"] .btn-report-action svg rect,
:root[data-report-theme-active="true"] .btn-report-action svg line,
:root[data-report-theme-active="true"] .btn-report-action svg polyline {
    color: var(--dynamic-report-secondary-text-color) !important;
    stroke: var(--dynamic-report-secondary-text-color) !important;
}

:root[data-report-theme-active="true"] .btn-report-ai {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dynamic-report-primary-color) 14%, white),
        color-mix(in srgb, var(--dynamic-report-accent-color) 18%, white)
    ) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-primary-color) 42%, var(--dynamic-report-accent-color)) !important;
    color: var(--dynamic-report-background-text-color) !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--dynamic-report-accent-color) 18%, transparent) !important;
}

:root[data-report-theme-active="true"] .btn-report-ai:hover:not(.btn-disabled):not(:disabled) {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dynamic-report-primary-color) 18%, white),
        color-mix(in srgb, var(--dynamic-report-accent-color) 26%, white)
    ) !important;
    border-color: color-mix(in srgb, var(--dynamic-report-primary-color) 55%, var(--dynamic-report-accent-color)) !important;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--dynamic-report-accent-color) 24%, transparent) !important;
}

:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon {
    background: linear-gradient(135deg, var(--dynamic-report-primary-color), var(--dynamic-report-accent-color)) !important;
    color: var(--dynamic-report-accent-text-color) !important;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--dynamic-report-primary-color) 24%, transparent) !important;
}

:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg,
:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg path,
:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg circle,
:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg rect,
:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg line,
:root[data-report-theme-active="true"] .btn-report-ai .btn-report-ai__icon svg polyline {
    color: var(--dynamic-report-accent-text-color) !important;
    stroke: var(--dynamic-report-accent-text-color) !important;
}

:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--color-slate-700) !important;
}

:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action:hover {
    background-color: var(--color-base-200) !important;
    color: var(--color-base-content) !important;
}

:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action svg,
:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action svg path,
:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action svg rect,
:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action svg line,
:root[data-report-theme-active="true"] .report-actions-dropdown .dropdown-content .btn-report-action svg polyline {
    color: var(--color-slate-700) !important;
    stroke: var(--color-slate-700) !important;
}

.report-protocol-cover-logo {
    margin-left: -80px;
    margin-right: -80px;
}
