:root.dark-mode-enabled {

    --dark-main: #181a1b;
    --light-main: #CBD5E1;
    --box-shadow-color: #64748B;
    --black-attenuated: rgba(0, 0, 0, 0.05);
    --white-attenuated: rgba(255, 255, 255, 0.9);
    --primary: #2563EB !important;
    --primarybis: #1c55d4 !important;
    --accent: #2563EB !important;
    --accenthover: #1c55d4 !important;

    /** Common **/
    .hero h1 {
        color: var(--white-attenuated) !important;
    }
    .subtitle {
        color: var(--white-attenuated) !important;
    }
    h1, h2, h3, h4, h5, h6 {
        color: var(--light-main) !important;
    }
    .search-bar {
        background-color: var(--dark-main) !important;
        box-shadow: var(--black-attenuated) 0px 2px 4px !important;
    }
    .section-title {
        color: var(--white-attenuated) !important;
    }

    /** Login **/
    .login-page, .login-container {
        background-color: var(--dark-main) !important;
    }
    .login-container {
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .login-container h1 {
        color: var(--white-attenuated) !important;
    }
    .login-container p, .login-container .form-group label, .login-container .checkbox-text {
        color: var(--light-main) !important;
    }
    .login-container .login-icon {
        background-color: var(--accent);
        color: var(--dark-main) !important;
    }
    .login-container .input-icon input {
        border-color: var(--white-attenuated) !important;
        background-color: var(--dark-main) !important;
    }
    .login-container .input-icon svg {
        color: var(--white-attenuated) !important;
    }

    /* Home */
    .discount, .other-deals {
        color: var(--light-main) !important;
    }
    .feature h3 {
        color: var(--white-attenuated) !important;
    }
    .best-deals, .feature {
        background-color: var(--dark-main) !important;
    }
    .why-choose-us {
        background-color: var(--dark-main) !important;
    }
    .why-choose-description, .feature p {
        color: var(--light-main) !important;
    }
    .feature {
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .feature-icon.verified,
    .feature-icon.community,
    .feature-icon.updates,
    .feature-icon.savings {
        color: var(--dark-main);
    }

    .feature-icon.verified {
        background-color: var(--success);
    }
    .feature-icon.community {
        background-color: var(--accent);
    }
    .feature-icon.updates {
        background-color: var(--warning);
    }
    .feature-icon.savings {
        background-color: var(--info);
    }
    .benefits .benefit {
        background-color: var(--light-main);
    }
    .benefits .benefit,
    .benefit svg {
        color: var(--dark-main);
    }
    .call-to-action h2 {
        color: var(--white-attenuated) !important;
    }
    .deal-card, p-carousel .p-carousel-viewport {
        background-color: var(--dark-main) !important;
    }
    .deal-card {
        box-shadow: 0 0px 2px var(--box-shadow-color);
    }

    /** Stores **/
    .stores-grid, .store-card {
        background-color: var(--dark-main) !important;
    }
    .store-card {
        box-shadow: 0 0px 2px #64748B;
    }
    .store-logo {
        border-radius: 9px;
    }
    .store-logo img {
        background: var(--light-main) !important;
        border-radius: 9px;
        padding: 5px;
        height: 60px;
    }
    .deal-count {
        color: var(--light-main) !important;
    }
    /** Stores Details **/
    .stores-details-page,
    .deal-card,
    .terms-sections,
    .card {
        background-color: var(--dark-main);
    }
    .deal-card, .terms-sections, .card {
        box-shadow: 0 0px 3px var(--box-shadow-color);
    }
    .store-introduction,
    .deal-card .deal-description,
    .deal-card .deal-expiry,
    .deal-card .feedback-actions,
    .terms-section p,
    .terms-section li,
    .info-label {
        color: var(--light-main) !important;
    }
    .deal-card .deal-brand,
    .deal-card .deal-title,
    .terms-section-title,
    .terms-sections h4,
    .card-title,
    .info-value {
        color: var(--white-attenuated) !important;
    }
    .deal-card .logo_container .logo_card {
        background-color: var(--light-main) !important;
    }
    /** Deals Details **/
    app-deal-detail > .container {
        background-color: var(--dark-main) !important;
    }
    app-deal-detail .deal-text,
    app-deal-detail .content {
        color: var(--light-main) !important;
    }
    app-deal-detail .logo img {
        background-color: var(--light-main) !important;
    }
    /** Deals Thank you page **/
    app-thank-you > .container {
        background-color: var(--dark-main) !important;
    }
    app-thank-you .deal-text,
    app-thank-you .content {
        color: var(--light-main) !important;
    }
    app-thank-you .logo img {
        background-color: var(--light-main) !important;
    }
    /** Deals choose link popup **/
    app-deal-choose-link {
        background-color: rgba(0, 0, 0, 0.92);
    }
    app-deal-choose-link .title {
        color: var(--white-attenuated);
        border-bottom: 1px solid var(--light-main);
    }
    app-deal-choose-link .deal-choose-link {
        background-color: transparent;
        color: var(--light-main);
    }

    /** Blog extract on Home **/
    .blog-section {
        background-color: var(--dark-main) !important;
    }
    .blog-description {
        color: var(--light-main) !important;
    }
    /** Blog Card **/
    .blog-card {
        background-color: var(--dark-main) !important;
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .blog-card .blog-title {
        color: var(--white-attenuated) !important;
    }
    .blog-card .blog-excerpt,
    .blog-card .read-time {
        color: var(--light-main) !important;
    }
    .blog-card .blog-footer {
        border-top: 1px solid #334155 !important;
    }
    .blog-card .placeholder-image {
        background-color: #1E293B !important;
    }

    /** Blog Page **/
    .blog-page {
        background-color: var(--dark-main) !important;
    }
    .pagination-number:not(.active) {
        background-color: var(--white-attenuated) !important;
        color: 1px solid var(--primary) !important;
        border: 1px solid var(--primary) !important;
    }
    .pagination-btn {
        background-color: transparent !important;
        border-color: transparent !important;
    }
    .pagination-btn svg {
        color: var(--white-attenuated) !important;
    }

    /** Blog Detail **/
    .blog-detail-page {
        background-color: var(--dark-main) !important;
    }
    .blog-detail-page .blog-content {
        background-color: transparent !important;
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .blog-content .article-intro,
    .blog-content .article-body,
    .blog-content .article-conclusion * {
        color: var(--light-main) !important;
    }
    .blog-content .article-intro,
    .blog-content .article-conclusion {
        border-color: #2a364a !important;
    }
    .sidebar-card {
        background-color: var(--dark-main) !important;
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }

    /** Breadcrumb **/
    .breadcrumb-nav {
        background-color: var(--dark-main) !important;
        border-bottom: 1px solid #2a364a !important;
    }

    .breadcrumb-nav .breadcrumb-link, .breadcrumb-nav .breadcrumb-separator {
        color: var(--white-attenuated) !important;
    }

    .breadcrumb-nav .breadcrumb-text {
        color: var(--light-main) !important;
    }

    /** Trends **/
    .product-wrapper, .trends-details-page, .trends-grid, .trend-card, .product-card {
        background: var(--dark-main);
    }
    .trend-card, .product-card {
        box-shadow: 0 0px 2px var(--box-shadow-color);
    }
    .terms-sections .subtitle,
    .product-card__title,
    .product-card__details__desktop__price,
    .product-card__details__desktop__price__sales,
    .product-card__details__mobile__price,
    .product-card__details__mobile__price__sales {
        color: var(--light-main) !important;
    }
    .product-header__left__img-container {
        background-color: inherit;
    }
    .product-card__details__mobile__actions__buy i {
        background-color: var(--accent);
        color: white;
    }

    /** About us **/
    .features, .mission, .how-it-works,
    .mission > .container > .mission-content,
    .how-it-works > .container > .steps > .step {
        background: var(--dark-main) !important;
    }
    .mission > .container > .mission-content,
    .how-it-works > .container > .steps > .step {
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .how-it-works > .container > .steps > .step > .step-content p,
    .mission > .container > .mission-content p,
    .features > .container > .features-grid > .feature p {
        color: var(--light-main) !important;
    }

    /** Privacy policy & Terms **/
    .terms-content {
        background: var(--dark-main) !important;
    }

    /** About us **/
    .features, .mission, .how-it-works,
    .mission > .container > .mission-content,
    .how-it-works > .container > .steps > .step {
        background: var(--dark-main) !important;
    }
    .mission > .container > .mission-content,
    .how-it-works > .container > .steps > .step {
        box-shadow: 0 0px 2px var(--box-shadow-color) !important;
    }
    .how-it-works > .container > .steps > .step > .step-content p,
    .mission > .container > .mission-content p,
    .features > .container > .features-grid > .feature p {
        color: var(--light-main) !important;
    }

    /** Privacy policy & Terms **/
    .terms-content {
        background: var(--dark-main) !important;
    }
}