/*UAT theme */
:root {
    --theme-color: #3a3a3a;
    --theme-color-dark: #2a2a2a;
    --theme-bg-color: #b8b6b6;
    --theme-secondary: #e5e5e5;

    --theme-gradient: linear-gradient(
        135deg,
        var(--theme-color),
        var(--theme-color-dark)
    );


}
.mainLogo{
	filter: brightness(0) invert(1);
}
/*UAT end*/

/* Live 
:root {
    --theme-color: #6b0f1a !important; 
    --theme-color-dark: #520b13 !important;
    --theme-bg-color: #faf5f3 !important;
    --theme-secondary: #fff1f1 !important;

    --theme-gradient: linear-gradient(
        135deg,
        var(--theme-color),
        var(--theme-color-dark) 
    ) !important;
}
.home-brand{
    .mainLogo{
        filter: brightness(0) invert(1);
    }
}
  Livie end */


/* Authentication */

.auth-container {
    background: var(--theme-bg-color) !important;
}

.welcome-section {
    background: var(--theme-color) !important;
}

#corporateTypeGroup {
    background-color: var(--theme-secondary) !important;
}

#register,
#continue_register {
    background: var(--theme-color) !important;
    color: #fff !important;
}

/* Homepage */

.home-header {
    background: var(--theme-gradient) !important;
}

.homepage-container,
.home-hero {
    background: var(--theme-bg-color) !important;
}

.home-nav-link,
.home-brand-text,
.dark-mode-toggle,
.home-logo {
    color: #fff !important;
}

.home-nav-link.active,
.home-nav-link:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #fff !important;
}

.home-hero {
    .home-company,
    .home-title {
        color: var(--theme-color) !important;
    }

    .home-subtitle {
        color: #5f5f5f !important;
    }
}

/* Feature Cards */

.home-feature {
    background-color: #ffffff !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.08) !important;

    .home-feature-icon {
        color: var(--theme-color);
        background: var(--theme-secondary);
    }

    h3 {
        color: var(--theme-color) !important;
    }

    p {
        color: #5f5f5f !important;
    }
}

/* Steps */

.step-item {
    text-align: center !important;
    padding: 24px !important;
    background: #ffffff !important;
    border-radius: 6px !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.08) !important;
}

.step-item .step-number {
    background: var(--theme-color) !important;
    color: #fff !important;
}

.step-item .step-title {
    color: var(--theme-color) !important;
}

.step-item .step-description {
    color: #5f5f5f !important;
}

.step {
    background: var(--theme-bg-color) !important;
}

.registration-container,
.registration-container .progress-container {
    background: var(--theme-bg-color) !important;
}

.step-title-section {
    h2 {
        color: var(--theme-color) !important;
    }

    p {
        color: #5f5f5f !important;
    }
}

.step.active .step-number,
.step.completed .step-number {
    background: var(--theme-color) !important;
    color: #fff !important;
}

.step.active .step-label,
.step.completed .step-label {
    color: var(--theme-color) !important;
}

/* Progress */

.progress-percentage {
    color: var(--theme-color) !important;
}

.progress-fill {
    background: var(--theme-gradient) !important;
}

/* Registration Header */

.registration-container .registration-header {
    background: var(--theme-gradient) !important;
}

.header-content {
    .company-logo {
        .logo-icon {
            color: #fff !important;
        }

        .company-info {
            h1 {
                color: #fff !important;
            }

            p {
                color: #d5d5d5 !important;
            }
        }
    }

    .user-info {
        .user-email,
        #logoutBtn {
            color: #fff !important;
        }
    }
}

/* Buttons */

.nextBtn {
    background: var(--theme-color) !important;
    color: #fff !important;
    border-color: var(--theme-color) !important;
}

.nextBtn:hover {
    background: var(--theme-color-dark) !important;
}

.prevBtn {
    background: var(--theme-secondary) !important;
    color: var(--theme-color) !important;
    border-color: var(--theme-secondary) !important;
}

/* Icons */

.field-icon {
    color: var(--theme-color) !important;
}