.page.inverted {
    background-color: #161A1B;
    color: #FFFFFF;
}

.page.inverted .header .connect-wallet {
    background-color: #FFFFFF0A;
    color: #FFFFFF;
}

.page.inverted .main-body.subscription .form .btn:hover,
.page.inverted .get-start .btn:hover,
.page.inverted .get-start .btn.primary:hover,
.action-menu-content.inverted-content .btn.primary:hover,
.time-details-content.inverted-content .btn.primary:hover,
.page.inverted .cctp-form .btn.primary:hover {
    background: #FFFFFFDE;
}

.page.inverted .main-body.subscription .form .btn:active,
.page.inverted .get-start .btn:active,
.page.inverted .get-start .btn.primary:active,
.action-menu-content.inverted-content .btn.primary:active,
.time-details-content.inverted-content .btn.primary:active,
.page.inverted .cctp-form .btn.primary:active {
    background: #FFFFFFCC;
}

.page.inverted .main-body.subscription .form .btn:selected,
.page.inverted .get-start .btn:selected,
.page.inverted .get-start .btn.primary:selected,
.action-menu-content.inverted-content .btn.primary:selected,
.time-details-content.inverted-content .btn.primary:selected,
.page.inverted .cctp-form .btn.primary:selected {
    background: #FFFFFFCC;
}

.page.inverted .main-body.subscription .form .btn:focus,
.page.inverted .get-start .btn:focus,
.page.inverted .get-start .btn.primary:focus,
.action-menu-content.inverted-content .btn.primary:focus,
.time-details-content.inverted-content .btn.primary:focus,
.page.inverted .cctp-form .btn.primary:focus {
    background: #FFFFFFEB;
}

.action-menu-content.inverted-content .btn.primary.inverted:hover,
.custom-popup-content.inverted-content .close:hover,
.page.inverted .header .history-button:hover,
.page.inverted .vision .btn.primary.inverted:hover,
.page.inverted .action-menu-content .btn.primary.inverted:hover,
.page.inverted .time-details-content .btn.primary.inverted:hover,
.page.inverted .cctp-form .btn.primary.inverted:hover,
.page.inverted .cctp-form .swap-icon-wrapper:hover,
.page.inverted .cctp-form .details-button:hover,
.page.inverted .header .connect-wallet:hover {
    background: #474B4D;
}

.action-menu-content.inverted-content .btn.primary.inverted:active,
.custom-popup-content.inverted-content .close:active,
.page.inverted .header .history-button:active,
.page.inverted .vision .btn.primary.inverted:active,
.page.inverted .action-menu-content .btn.primary.inverted:active,
.page.inverted .time-details-content .btn.primary.inverted:active,
.page.inverted .cctp-form .btn.primary.inverted:active,
.page.inverted .cctp-form .swap-icon-wrapper:active,
.page.inverted .cctp-form .details-button:active,
.page.inverted .header .connect-wallet:active {
    background: #1E2223;
}

.action-menu-content.inverted-content .btn.primary.inverted:selected,
.custom-popup-content.inverted-content .close:selected,
.page.inverted .header .history-button:selected,
.page.inverted .vision .btn.primary.inverted:selected,
.page.inverted .action-menu-content .btn.primary.inverted:selected,
.page.inverted .time-details-content .btn.primary.inverted:selected,
.page.inverted .cctp-form .btn.primary.inverted:selected,
.page.inverted .cctp-form .swap-icon-wrapper:selected,
.page.inverted .cctp-form .details-button:selected,
.page.inverted .header .connect-wallet:selected {
    background: #1E2223;
}

.action-menu-content.inverted-content .btn.primary.inverted:focus,
.custom-popup-content.inverted-content .close:focus,
.page.inverted .header .history-button:focus,
.page.inverted .vision .btn.primary.inverted:focus,
.page.inverted .action-menu-content .btn.primary.inverted:focus,
.page.inverted .time-details-content .btn.primary.inverted:focus,
.page.inverted .cctp-form .btn.primary.inverted:focus,
.page.inverted .cctp-form .swap-icon-wrapper:focus,
.page.inverted .cctp-form .details-button:focus,
.page.inverted .header .connect-wallet:focus
.action-menu-content.inverted-content .btn.primary.inverted:focus-visible,
.custom-popup-content.inverted-content .close:focus-visible,
.page.inverted .header .history-button:focus-visible,
.page.inverted .vision .btn.primary.inverted:focus-visible,
.page.inverted .action-menu-content .btn.primary.inverted:focus-visible,
.page.inverted .time-details-content .btn.primary.inverted:focus-visible,
.page.inverted .cctp-form .btn.primary.inverted:focus-visible,
.page.inverted .cctp-form .swap-icon-wrapper:focus-visible,
.page.inverted .cctp-form .details-button:focus-visible,
.page.inverted .header .connect-wallet:focus-visible {
    background: #2E3031;
    outline: none;
    border: 2px solid #C0CDFF;
    box-shadow: 0px 0px 6px 2px #D7E0FF,
                0px 1px 2px 0px #0C2A4512;
    box-sizing: border-box;
}

.inverted-content .history .empty-state-wrapper img.empty-state,
.page.inverted .header .wallet,
.page.inverted .networks-wrapper .img,
.page.inverted .landing-background,
.page.inverted .history-icon,
.page.inverted .faq-background,
.page.inverted .cctp-form .swap-icon,
.page.inverted .from-to-container .icon-wrapper img,
.inverted-content .direction .icon-wrapper img,
.page.inverted .cctp-form .gear-button img,
.page.inverted .cctp-form .input-wrapper.error .error-message img,
.page.inverted .cctp-form .common.error img,
.page.inverted .main-body .card img,
.page.inverted .circle-wrapper .img,
.page.inverted .footer-content .logo-wrapper img,
.page.inverted .cctp-form .close .close-icon,
.page.inverted .cctp-form .connect-wallet-button-wrapper .cancel-icon,
.page.inverted .rotating,
.page.inverted .header .logo-image {
    display: none;
}

.inverted-content .history .empty-state-wrapper img.empty-state.inverted,
.page.inverted .networks-wrapper .img.inverted,
.page.inverted .header .wallet.inverted,
.page.inverted .landing-background.inverted,
.page.inverted .history-icon.inverted,
.page.inverted .faq-background.inverted,
.page.inverted .cctp-form .swap-icon.inverted,
.page.inverted .from-to-container .icon-wrapper img.inverted,
.inverted-content .direction .icon-wrapper img.inverted,
.page.inverted .cctp-form .gear-button img.inverted,
.page.inverted .cctp-form .input-wrapper.error .error-message img.inverted,
.page.inverted .cctp-form .common.error img.inverted,
.page.inverted .cctp-form .close .close-icon.inverted,
.page.inverted .main-body .card img.inverted,
.page.inverted .circle-wrapper .img.inverted,
.page.inverted .footer-content .logo-wrapper img.inverted,
.page.inverted .cctp-form .connect-wallet-button-wrapper .cancel-icon-inverted,
.page.inverted .rotating.inverted,
.page.inverted .header .logo-image.inverted {
    display: inline-block;
}


.page.inverted .circle-wrapper {
    background-color: #161A1B;
}

.page.inverted .main-body.get-start .networks-wrapper:before {
    background: radial-gradient(at center, rgba(255, 255, 255, 0), #161A1B);
}

.page.inverted .faq-background.inverted {
    z-index: 1;
}

.inverted-content .settings .row .title {
    color: #FFFFFFEB;
}

.inverted-content .history .row .status {
    color: #FFFFFFEB;
}

.inverted-content .history .row {
    background: #2E3031;
    border: transparent;
    color: #FFFFFFEB;
}

.inverted-content .history .row {
    color: #FFFFFF87;
}

.inverted-content .history .row .status-icon-wrapper {
    color: #FFFFFF87;
}

.inverted-content .history .row .direction .chain-icon {
    border: transparent;
}

.page.inverted .header .logo {
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .input-wrapper.error .error-message {
    background: #CA453A;
    border: 1px solid #F05C4E;
    color: #FFF4F2;
}

.page.inverted .main-body .heading {
    color: #FFFFFFEB;
}

.page.inverted .steps-wrapper .step.active .heading {
    color: #FFFFFFEB;
}

.page.inverted .steps-wrapper .step.active .step-estimated-time {
    color: #FFFFFF87;

}

.page.inverted .main-body {
    color: #FFFFFFDE;
}

.page.inverted .main-body.full.why {
    background: #25282A;
}

.page.inverted .main-body.vision .line {
    border-bottom: 2px solid #FFFFFF12;
}

.page.inverted .main-body.vision .title {
    background-color: #161A1B;
}

.page.inverted .main-body.subscription .card {
    background: #1E2223;
}

.page.inverted .main-body.subscription .success-message {
    color: #FFFFFFEB;
}

.page.inverted .main-body.subscription .form input {
    background: #1E2223;
    border: 1px solid #FFFFFF17;

    color: #FFFFFF73;
    font-size: 16px;
}

.page.inverted .main-body.subscription .card .title,
.page.inverted .main-body.vision .title,
.page.inverted .main-body.why .title,
.page.inverted .main-body.get-start .title,
.page.inverted .main-body .why-cards .card .title,
.page.inverted .main-body.partnership .title {
    color: #FFFFFF;
}

.page.inverted .main-body .why-cards .line .card {
    border-bottom: 1px solid #FFFFFF21;
}

.page.inverted .main-body .why-cards .line + .line .card {
    border-bottom: none;
}

.page.inverted .main-body.subscription .card,
.page.inverted .main-body.vision,
.page.inverted .main-body.get-start,
.page.inverted .main-body .why-cards .card,
.page.inverted .main-body.partnership {
    color: #FFFFFF9E;
}

.page.inverted .main-body.full.partnership {
    background: #161A1B;
}

.page.inverted .main-body.partnership .shield {
    background: radial-gradient(circle, #5111C0 -25%, #161A1B 60%);
}

.page.inverted .footer-wrapper {
    background-color: #373A3C;
}

.page.inverted .footer-content .logo-wrapper .label {
    color: #FFFFFF;
}

.page.inverted .socials-wrapper .socials > a {
    color: #FFFFFFCC;
    background: #FFFFFF0A;

}

.page.inverted .footer-content .links a {
    color: #FFFFFFCC;
}

.page.inverted .header .theme-switcher,
.page.inverted .footer-content .theme-switcher {
    background: #25282A;
    border: 1px solid #FFFFFF17;

}
.page.inverted .footer-content .theme-switcher .switcher,
.page.inverted .header .theme-switcher .switcher {
    padding: 8px 8px;
}

.page.inverted .footer-content .theme-switcher .switcher {
    background-color: transparent;
}

.page.inverted .header .theme-switcher .switcher:not(.active):hover,
.page.inverted .footer-content .theme-switcher .switcher:not(.active):hover {
    background: #FFFFFF0A;
}

.page.inverted .footer-content .theme-switcher .switcher.active,
.page.inverted .header .theme-switcher .switcher.active {
    box-shadow: 0px 1px 0px 0px #FFFFFF80 inset,
                0px -1px 0px 0px #00000033 inset,
                0px 1px 1px 0px #00000033,
                0px 2px 4px 0px #00000033;

    background: linear-gradient(180deg, #FCFCFC 0%, #F0F0F0 100%);

    padding: 8px 9px;
}

.page.inverted .footer-content .theme-switcher .switcher.active {
    display: none;
}

.page.inverted .footer-content .theme-switcher .switcher:not(.inverted) {
    display: inline-block;
}

.page.inverted .footer-content .theme-switcher .switcher.inverted:not(.active) {
    display: none;
}

.page.inverted .footer-content .theme-switcher .switcher.active:not(.inverted) {
    display: inline-block;
}

.page.inverted .header .menu a,
.page.inverted .header .logo {
    color: #FFFFFF;
}

.page.inverted .cctp-form .input-row {
    background: #25282A;
}

.page.inverted .cctp-form .input-row .input-wrapper input {
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .gear-button {
    background: #25282A;
}

.page.inverted .main-body.subscription .form .btn,
.page.inverted .get-start .btn,
.page.inverted .get-start .btn.primary,
.action-menu-content.inverted-content .btn.primary,
.time-details-content.inverted-content .btn.primary,
.page.inverted .cctp-form .btn.primary {
    background: #FFFFFFEB;
    color: #2E3031;
}

.page.inverted .vision .btn.primary.inverted,
.action-menu-content.inverted-content .btn.primary.inverted,
.time-details-content.inverted-content .btn.primary.inverted,
.page.inverted .cctp-form .btn.primary.inverted {
    background: #FFFFFF0A;
    --background: #1E2223;
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .swap-icon-wrapper {
    background: #25282A;
    border: 4px solid #1E2223
}

.page.inverted .cctp-form .chain-selector-wrapper {
    background: #FFFFFF0A;
}

.page.inverted .cctp-form .chain-selector-wrapper .field-name {
    color: #FFFFFFCC;
}

.page.inverted .cctp-form .chain-selector-wrapper .value {
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .chain-selector-wrapper.address-wrapper {
    background: transparent;
}

.page.inverted .cctp-form .input-wrapper .chain-selector-wrapper.address-wrapper {
    color: #FFFFFFDE;
}
.page.inverted .cctp-form .input-wrapper .chain-selector-wrapper.address-wrapper .icon-wrapper {
    border-color: transparent;
}

.page.inverted .cctp-form .notification-block .close,
.page.inverted .cctp-form .notify-me-wrapper .description .close {
    background: #FFFFFF0A;
}

.page.inverted .cctp-form .refuel-wrapper {
    background: #25282A;
}

.page.inverted .cctp-form .refuel-wrapper .content {
    color: #FFFFFF87;
}
.page.inverted .cctp-form .refuel-wrapper .content .title {
    color: #FFFFFFEB;
}

.page.inverted .steps-wrapper .step .explorer-link {
    color: #A9B9FF;
}
.page.inverted .steps-wrapper .step.completed .heading {
    color: #00DB71;
}
.page.inverted .steps-wrapper .step.completed .check {
    display: none;
}

.page.inverted .cctp-form .form-header {
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .input-wrapper {
    background: #25282A;
}

.page.inverted .cctp-form .input-wrapper .balance {
    color: #FFFFFF87;
}

.page.inverted .cctp-form .input-wrapper .balance .amount {
    color: #FFFFFFEB;

}

.page.inverted .cctp-form .input-wrapper input:disabled,
.page.inverted .cctp-form .input-wrapper input {
    color: #FFFFFFEB;
    -webkit-text-fill-color: #FFFFFFEB;
    opacity: 1;
}

.page.inverted .cctp-form .details {
    background: #25282A;
    color: #FFFFFFCC;
}

.page.inverted .cctp-form .details .row .value.red {
    color: #F05C4E;
}

.page.inverted .cctp-form .details .row .value.green {
    color: #00A654;
}

.page.inverted .cctp-form .details .row .value {
    color: #FFFFFFCC;
}

.page.inverted .cctp-form .details-button {
    background: #25282A;
    color: #FFFFFFEB;
}

.page.inverted .steps-wrapper .step.completed .number-wrapper {
    background: #00C565;
}

.page.inverted .steps-wrapper .step.active {
    color: #FFFFFFEB;
}

.page.inverted .steps-wrapper .step {
    color: #FFFFFFB2;
}

.page.inverted .steps-wrapper .step.completed {
    color: #FFFFFF87;
}

.page.inverted .steps-wrapper .step:not(.active) .number-wrapper {
    border: none;
}

.page.inverted .steps-wrapper .step .number {
    background: #25282A;
    border: 1px solid #FFFFFF12;
    color: #FFFFFF87;
}

.page.inverted .steps-wrapper .step.active .number-wrapper,
.page.inverted .steps-wrapper .step.active .number {
    color: #2E3031;
}

.page.inverted .steps-wrapper .step.active .number {
    background: #F4F7FA;
    border: 2px solid #2E3031;
}

.page.inverted .steps-wrapper .step.completed .check.inverted {
    display: inline-block;
}

.page.inverted .cctp-form .connect-wallet-button-wrapper > button {
    background: #FFFFFF0A;
    color: #FFFFFFEB;
}

.page.inverted .cctp-form .notification-block {
    background: #25282A;

    color: #FFFFFFEB;
}

.page.inverted .cctp-form .notify-me-wrapper {
    background: #25282A;

    color: #FFFFFFEB;
}

.page.inverted .cctp-form .notify-me-wrapper .input-wrapper input {
    background: #1E2223;
    color: #FFFFFFEB;
    border: 1px solid #FFFFFF17;
}

.page.inverted .cctp-form .notify-me-wrapper .notify-button {
    background: #FFFFFFEB;
    color: #2E3031;
}

.page.inverted .cctp-form .notify-me-wrapper .input-wrapper input::placeholder {
    color: #FFFFFF73;
    font-weight: normal;
}

.page.inverted .from-to-container {
    background: #25282A;
}

.page.inverted .from-to-container .field-name {
    color: #FFFFFFCC;
}
.page.inverted .from-to-container .value {
    color: #FFFFFFEB;
}


.page.inverted .from-to-container .icon-wrapper {
    background: #161A1B;
}

.page.inverted .cctp-form .input-wrapper .chain-selector-wrapper .icon-wrapper,
.page.inverted .cctp-form .wallet-address-wrapper.input-wrapper .icon-wrapper {
    background: #1E2223;
}

.page.inverted .cctp-form .input-wrapper .chain-selector-wrapper .icon-wrapper img,
.page.inverted .cctp-form .wallet-address-wrapper.input-wrapper .icon-wrapper img:not(.ignore-invertion) {
    display: none;
}

.page.inverted .cctp-form .input-wrapper .chain-selector-wrapper .icon-wrapper img.inverted,
.page.inverted .cctp-form .wallet-address-wrapper.input-wrapper .icon-wrapper img.inverted {
    display: inline-block;
}

.page.inverted .cctp-form {
    background-color: #1E2223;

    box-shadow: 0px 0px 60px 24px #0A0E0E12;
    box-shadow: 0px 40px 100px 0px #0A0E0E1F;
}


.page.inverted .main-body.full {
    background: linear-gradient(180deg, rgba(22, 26, 27, 0) 0%, rgba(22, 26, 27, 0.9) 36.33%, #161A1B 61.98%);

    z-index: 1;
}

.page.inverted .main-body.full.subscription,
.page.inverted .main-body.full.get-start,
.page.inverted .main-body.full.vision {
    background: #161A1B;
}

.page.inverted .cards .card {
    background: #1E2223;
}

.page.inverted .cctp-form .same-wallet-wrapper .chain-icon {
    border: 1px solid #FFFFFF17;
}


.page.inverted .header .history-button {
    --background: #FFFFFF0A;
    background: #1E2223;
}

.page.inverted .cctp-form .wallet-address-wrapper.same-wallet-wrapper {
    color: #FFFFFFEB;
}

.page.inverted .toggle {
    color: #FFFFFFEB;
}

.page.inverted .in-progress-container .in-progress {
    background: #25282A;
}

.page.inverted .in-progress-container .in-progress .chain-icon {
    border: 2px solid #FFFFFF17;
}

.page.inverted .cctp-form .message .message-header {
    color: #FFFFFFEB;
}

.page.inverted .footer-wrapper .disclaimer-wrapper {
    color: #FFFFFF73;
    border-top: 1px solid #FFFFFF17;
}

.page.inverted .footer-wrapper .disclaimer-wrapper a {
    color: #A9B9FF;
}

.time-details-content.inverted-content .description {
    color: #FFFFFF9E;
}

.time-details-content.inverted-content .final-amount {
    background: #25282A;
    color: #FFFFFF87;
}

.time-details-content.inverted-content .final-amount .value .code {
    color: #FFFFFF87;
}

.time-details-content.inverted-content .final-amount .value {
    color: #FFFFFFEB;
}

.time-details-content.inverted-content .direction-wrapper .direction {
    background: #25282A;
}

.time-details-content.inverted-content .description .title {
    color: #FFFFFFEB;
}

.time-details-content.inverted-content .description .chain-icon {
    border: 2px solid #FFFFFF17;
}

.page.inverted .audit-message {
    background-color: #25282A;
}

.page.inverted .audit-message .text {
    color: #FFFFFF9E;
}
