/* Public site dark overrides — all front_web pages including homepage */
body.front-dark {
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}

body.front-dark .bg-light,
body.front-dark .bg-gray,
body.front-dark section.bg-light {
    background-color: color-mix(in srgb, var(--color-bg) 85%, var(--color-surface)) !important;
}

body.front-dark .bg-white,
body.front-dark .card,
body.front-dark .modal-content,
body.front-dark .dropdown-menu {
    background-color: var(--color-surface) !important;
    color: var(--color-text) !important;
}

body.front-dark .bg-gradient,
body.front-dark header.bg-gradient {
    background-image: linear-gradient(to right, color-mix(in srgb, var(--color-bg) 90%, var(--color-primary)), var(--color-surface)) !important;
    background-color: var(--color-bg) !important;
}

body.front-dark .text-dark,
body.front-dark .text-gray-900,
body.front-dark h1,
body.front-dark h2,
body.front-dark h3,
body.front-dark h4,
body.front-dark h5,
body.front-dark h6 {
    color: var(--color-text) !important;
}

body.front-dark .text-gray,
body.front-dark .text-muted,
body.front-dark p.text-gray,
body.front-dark .fs-14.text-gray,
body.front-dark .fs-16.text-gray,
body.front-dark .fs-18.text-gray {
    color: var(--color-text-muted) !important;
}

body.front-dark a {
    color: var(--color-link);
}

body.front-dark a:hover,
body.front-dark a:focus {
    color: var(--color-primary-hover) !important;
}

body.front-dark .text-gray.primary-link-hover:hover {
    color: var(--color-primary-hover) !important;
}

body.front-dark header {
    background-color: var(--color-bg) !important;
}

body.front-dark header .navbar .navbar-nav .nav-item .nav-link {
    color: var(--color-text) !important;
}

body.front-dark header .navbar .navbar-nav .nav-item .nav-link:hover,
body.front-dark .header-navbar-color:hover {
    color: var(--color-link) !important;
}

body.front-dark header .navbar .navbar-nav .nav-item .submenu,
body.front-dark header .language-dropdown-menu {
    background: var(--color-surface) !important;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.4) !important;
}

body.front-dark header .navbar .navbar-nav .nav-item .submenu .nav-link {
    color: var(--color-text) !important;
}

body.front-dark header .navbar .navbar-nav .nav-item .submenu .nav-link:hover,
body.front-dark header .navbar .navbar-nav .nav-item .submenu .nav-link.active {
    color: var(--color-link) !important;
}

body.front-dark header .language-dropdown-menu .dropdown-item {
    color: var(--color-text) !important;
}

body.front-dark header .language-dropdown-menu .dropdown-item:hover,
body.front-dark header .language-dropdown-menu .dropdown-item:active,
body.front-dark header .language-dropdown-menu .dropdown-item:focus {
    color: var(--color-link) !important;
    background-color: transparent !important;
}

body.front-dark header .language-dropdown-menu .dropdown-item.active {
    color: var(--color-text) !important;
    background-color: color-mix(in srgb, var(--color-primary) 22%, var(--color-surface)) !important;
}

body.front-dark .languageSelection-active {
    background-color: color-mix(in srgb, var(--color-primary) 22%, var(--color-surface)) !important;
    border-radius: 6px;
}

body.front-dark header .navbar .navbar-nav .nav-item.user-menu-item .user-menu-arrow {
    color: var(--color-link) !important;
}

body.front-dark header .navbar-toggler {
    border-color: var(--color-border) !important;
}

body.front-dark header .navbar-toggler .navbar-toggler-icon .icon-bar {
    background-color: var(--color-text) !important;
}

@media (max-width: 1149.98px) {
    body.front-dark header .navbar .navbar-collapse {
        background-color: var(--color-surface) !important;
        border-color: var(--color-border) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
    }

    body.front-dark header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:active,
    body.front-dark header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.06) !important;
    }

}

/* zoom-collapse-nav: compact spacing only on desktop — no drawer/card background */
@media (min-width: 1150px) {
    body.front-dark.zoom-collapse-nav header .navbar .navbar-collapse {
        background-color: transparent !important;
        box-shadow: none !important;
        border: none !important;
    }
}

body.front-dark footer {
    background-color: color-mix(in srgb, var(--color-bg) 92%, #000) !important;
    color: var(--color-text-muted) !important;
}

body.front-dark footer ul li a {
    color: var(--color-text-muted) !important;
}

body.front-dark footer ul li a:hover,
body.front-dark footer ul li a:focus {
    color: var(--color-text) !important;
}

body.front-dark footer .social-icon i,
body.front-dark footer .social-icon a {
    background-color: var(--color-surface) !important;
    color: var(--color-text-muted) !important;
}

body.front-dark footer .social-icon i:hover,
body.front-dark footer .social-icon a:hover {
    background-color: var(--color-primary) !important;
    color: #fff !important;
}

body.front-dark footer .email input {
    background-color: var(--color-surface) !important;
    border: 1px solid var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .form-control,
body.front-dark .form-select,
body.front-dark input.form-control,
body.front-dark textarea.form-control {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .form-control::placeholder,
body.front-dark textarea.form-control::placeholder {
    color: var(--color-text-muted) !important;
}

body.front-dark .form-control:focus,
body.front-dark .form-select:focus {
    background-color: color-mix(in srgb, var(--color-surface) 90%, var(--color-text)) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-text) !important;
}

body.front-dark input.form-control:-webkit-autofill,
body.front-dark input.form-control:-webkit-autofill:hover,
body.front-dark input.form-control:-webkit-autofill:focus,
body.front-dark textarea.form-control:-webkit-autofill,
body.front-dark textarea.form-control:-webkit-autofill:hover,
body.front-dark textarea.form-control:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--color-surface) inset !important;
    box-shadow: 0 0 0 1000px var(--color-surface) inset !important;
    -webkit-text-fill-color: var(--color-text) !important;
    caret-color: var(--color-text);
}

body.front-dark .find-job-section .find-job {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .find-job-section .find-job input {
    background-color: transparent !important;
    color: var(--color-text) !important;
}

body.front-dark .find-job-section .find-job input::placeholder {
    color: var(--color-text-muted) !important;
}

body.front-dark .find-job-section .find-job h3,
body.front-dark .find-job-section .find-job .text-secondary {
    color: var(--color-text) !important;
}

body.front-dark .card,
body.front-dark .blog-card,
body.front-dark .job-card,
body.front-dark .company-card {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .card-text,
body.front-dark .card-title {
    color: var(--color-text) !important;
}

body.front-dark .border,
body.front-dark .border-bottom,
body.front-dark .border-top {
    border-color: var(--color-border) !important;
}

body.front-dark .breadcrumb-item,
body.front-dark .breadcrumb-item a {
    color: var(--color-text-muted) !important;
}

body.front-dark .breadcrumb-item.active {
    color: var(--color-text) !important;
}

/* Primary CTA — no white invert on hover */
body.front-dark .btn-primary,
body.front-dark .btn.btn-primary {
    color: #fff !important;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

body.front-dark .btn-primary:hover,
body.front-dark .btn-primary:focus,
body.front-dark .btn.btn-primary:hover,
body.front-dark .btn.btn-primary:focus {
    color: #fff !important;
    background-color: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
}

/* Outlined buttons — use link accent for contrast on dark backgrounds */
body.front-dark .btn.btn-light-primary,
body.front-dark .btn-light-primary {
    color: var(--color-link) !important;
    border-color: var(--color-link) !important;
    background-color: transparent !important;
}

body.front-dark .btn.btn-light-primary:hover,
body.front-dark .btn.btn-light-primary:focus,
body.front-dark .btn-light-primary:hover,
body.front-dark .btn-light-primary:focus {
    color: var(--color-bg) !important;
    border-color: var(--color-link) !important;
    background-color: var(--color-link) !important;
}

body.front-dark header .navbar .navbar-nav .header-auth-pair-nav .login_btn > a.header-auth-login {
    color: var(--color-primary) !important;
    background-color: transparent !important;
    border: 1px solid var(--color-primary) !important;
}

body.front-dark header .navbar .navbar-nav .header-auth-pair-nav .login_btn > a.header-auth-login:hover,
body.front-dark header .navbar .navbar-nav .header-auth-pair-nav .login_btn > a.header-auth-login:focus {
    color: #fff !important;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

body.front-dark .btn-outline-primary {
    color: var(--color-link) !important;
    border-color: var(--color-link) !important;
    background-color: transparent !important;
}

body.front-dark .btn-outline-primary:hover,
body.front-dark .btn-outline-primary:focus {
    color: var(--color-bg) !important;
    background-color: var(--color-link) !important;
    border-color: var(--color-link) !important;
}

body.front-dark .btn-light,
body.front-dark .btn-outline-secondary {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .pagination .page-link {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .pagination .page-item.active .page-link {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

body.front-dark .modal-header,
body.front-dark .modal-footer {
    border-color: var(--color-border) !important;
}

body.front-dark .modal-title {
    color: var(--color-text) !important;
}

body.front-dark .select2-container--default .select2-selection--single,
body.front-dark .select2-container--default .select2-selection--multiple {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--color-text) !important;
}

body.front-dark .select2-dropdown {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .select2-search--dropdown {
    background-color: var(--color-surface) !important;
    padding: 8px !important;
}

body.front-dark .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--color-surface) !important;
    border: 1px solid var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .select2-container--default .select2-search--dropdown .select2-search__field::placeholder {
    color: var(--color-text-muted) !important;
}

body.front-dark .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    background-color: color-mix(in srgb, var(--color-surface) 90%, var(--color-text)) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-text) !important;
}

body.front-dark .select2-results__option {
    color: var(--color-text) !important;
}

body.front-dark .select2-container--default .select2-results__option[aria-selected=true] {
    background-color: color-mix(in srgb, var(--color-primary) 25%, var(--color-surface)) !important;
    color: var(--color-text) !important;
}

body.front-dark .select2-results__option--highlighted {
    background-color: var(--color-primary) !important;
    color: #fff !important;
}

body.front-dark .select2-results__option--highlighted[aria-selected="true"] {
    color: var(--color-text) !important;
}

body.front-dark .select2-container .select2-search--inline .select2-search__field {
    color: var(--color-text) !important;
    background-color: transparent !important;
}

/* intl-tel-input — phone country dropdown (contact, register, etc.) */
body.front-dark .iti__country-list {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.4) !important;
}

body.front-dark .iti__country {
    color: var(--color-text) !important;
}

body.front-dark .iti__country-name {
    color: var(--color-text) !important;
}

body.front-dark .iti__dial-code {
    color: var(--color-text-muted) !important;
}

body.front-dark .iti__country.iti__highlight,
body.front-dark .iti__country.iti__active {
    background-color: color-mix(in srgb, var(--color-primary) 25%, var(--color-surface)) !important;
}

body.front-dark .iti__country.iti__highlight .iti__country-name,
body.front-dark .iti__country.iti__highlight .iti__dial-code,
body.front-dark .iti__country.iti__active .iti__country-name,
body.front-dark .iti__country.iti__active .iti__dial-code {
    color: var(--color-text) !important;
}

body.front-dark .iti__divider {
    border-bottom-color: var(--color-border) !important;
}

body.front-dark .iti__arrow {
    border-top-color: var(--color-text-muted) !important;
}

body.front-dark .iti__arrow--up {
    border-bottom-color: var(--color-text-muted) !important;
}

body.front-dark .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
body.front-dark .iti--separate-dial-code .iti__selected-flag {
    background-color: color-mix(in srgb, var(--color-border) 40%, var(--color-surface)) !important;
}

body.front-dark .table {
    color: var(--color-text) !important;
}

body.front-dark .table thead th {
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .table td,
body.front-dark .table th {
    border-color: var(--color-border) !important;
}

body.front-dark .register-section,
body.front-dark .login-section,
body.front-dark .auth-card {
    background-color: var(--color-surface) !important;
}

body.front-dark .job-filter-section,
body.front-dark .job-details-section .job-sidebar,
body.front-dark .filter-sidebar {
    background-color: color-mix(in srgb, var(--color-bg) 85%, var(--color-surface)) !important;
}

body.front-dark .badge.bg-light {
    background-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .accordion-item {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .accordion-button {
    background-color: var(--color-surface) !important;
    color: var(--color-text) !important;
}

body.front-dark .accordion-button:not(.collapsed) {
    background-color: color-mix(in srgb, var(--color-surface) 90%, var(--color-text)) !important;
    color: var(--color-link) !important;
}

body.front-dark .alert-light {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .laravel-livewire-tables {
    color: var(--color-text) !important;
}

/* Find Jobs — Platform / Swedish Public tabs */
body.front-dark .find-jobs-tabs .nav-link {
    color: var(--color-text-muted) !important;
    background-color: transparent !important;
}

body.front-dark .find-jobs-tabs .nav-link:hover,
body.front-dark .find-jobs-tabs .nav-link:focus {
    color: var(--color-primary) !important;
}

body.front-dark .find-jobs-tabs .nav-link.active {
    color: var(--color-text) !important;
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) var(--color-border) var(--color-surface) !important;
}

body.front-dark .find-jobs-tabs-content {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .latest-job-section .job-card .job-list-badge,
body.front-dark .Find-Jobs-page .find-jobs-tabs-content .job-list-badge,
body.front-dark .latest-job-section .job-card .text.text-primary,
body.front-dark .featured-job-section .job-card .text.text-primary,
body.front-dark .our-latest-jobs .job-card .text.text-primary {
    background-color: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface)) !important;
    color: var(--color-primary) !important;
}

/* Job details page */
body.front-dark .job-details-page .bg-gradient {
    background-image: linear-gradient(to right, color-mix(in srgb, var(--color-bg) 92%, var(--color-primary)), var(--color-bg)) !important;
    background-color: var(--color-bg) !important;
}

body.front-dark .job-details-page .bg-light,
body.front-dark .job-details-page .job-desc-right,
body.front-dark .job-details-page .company-overview {
    background-color: var(--color-surface) !important;
}

body.front-dark .job-details-section {
    color: var(--color-text) !important;
}

body.front-dark .job-details-section .job-description,
body.front-dark .job-details-section .key-responsibilities,
body.front-dark .job-details-section .skill-experience,
body.front-dark .job-details-section .skill-experience li,
body.front-dark .job-details-section .text-gray,
body.front-dark .job-details-section .job-desc-right .text-gray,
body.front-dark .job-details-section .company-overview .text-gray {
    color: var(--color-text-muted) !important;
}

body.front-dark .job-details-section .text-secondary,
body.front-dark .job-details-section h5.text-secondary,
body.front-dark .job-details-section .job-desc-right .text-secondary,
body.front-dark .job-details-section .company-overview .text-secondary {
    color: var(--color-text) !important;
}

body.front-dark .job-details-section .desc-box svg path {
    fill: var(--color-primary) !important;
}

body.front-dark .job-details-page .btn-dark {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
}

body.front-dark .job-details-page .btn-dark:hover,
body.front-dark .job-details-page .btn-dark:focus {
    background-color: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
    color: #fff !important;
}

body.front-dark .job-details-page .btn-light {
    background-color: var(--color-border) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

body.front-dark .job-details-page .btn-light:hover {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
}

body.front-dark .job-details-related-jobs .card,
body.front-dark .job-details-page .our-latest-jobs .card {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .job-details-related-jobs .text,
body.front-dark .job-details-page .our-latest-jobs .card .text.text-primary {
    background-color: color-mix(in srgb, var(--color-primary) 15%, var(--color-surface)) !important;
    color: var(--color-primary) !important;
}

body.front-dark .job-details-page .hero-img img,
body.front-dark .job-details-page .company-overview .profile img {
    background-color: var(--color-surface);
}

body.front-dark .job-details-page .alert-warning {
    background-color: color-mix(in srgb, var(--color-warning, #ffc107) 15%, var(--color-surface)) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

/* Homepage */
body.front-dark .home-page {
    background-color: var(--color-bg);
    color: var(--color-text);
}

body.front-dark .home-page .popular-job-categories-section .job-categories-card .card {
    border: 1px solid var(--color-border) !important;
}

body.front-dark .home-page .hiring-journey-section .journey-step-card,
body.front-dark .home-page .learning-hiring-section .journey-card,
body.front-dark .home-page .learning-hiring-section .connection-info,
body.front-dark .home-page .contact-section-home .contact-cta-card {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text);
}

body.front-dark .home-page .learning-hiring-section .connection-list li {
    color: var(--color-text-muted) !important;
}

body.front-dark .home-page .karriya-different-section .feature-card {
    background-color: color-mix(in srgb, var(--color-bg) 85%, var(--color-surface)) !important;
    border: 1px solid var(--color-border);
}

body.front-dark .home-page .featured-jobs-section .job-card .card {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

body.front-dark .home-page .testimonial-section .slick-dots li {
    border-color: var(--color-border) !important;
    background: transparent !important;
}

body.front-dark .home-page .testimonial-section li.slick-active {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

body.front-dark .how-it-works-section .work-process .img {
    background-color: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface)) !important;
    box-shadow: 0 5px 10px color-mix(in srgb, var(--color-border) 25%, transparent) !important;
}