.NAME-currency-switcher {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: fit-content;
}

    .NAME-currency-switcher select {
        width: fit-content;
        margin: 0;
    }

.NAME-domain-availability-form {
    display: flex;
    flex-wrap: wrap;
    max-height: 40px;
    margin: 0;
    padding: 0;
    width: 100%;
}

.NAME-domain-availability-form.loading {
    pointer-events: none;
}

    .NAME-domain-availability-top-row {
        display: flex;
        width: 100%;
    }

        .NAME-domain-availability .availability.available {
            color: #4caf50;
        }

        .NAME-domain-availability .availability.taken {
            color: #f44336;
        }

        .NAME-domain-availability input[type="text"] {
            margin-bottom: 0;
            width: 100%;
        }

        .NAME-domain-availability .live-search-results {
            display: none; /* This will be overridden by JavaScript when needed */
            position: relative;
            z-index: 999;
            background: #fff;
            border: 1px solid #ccc;
            max-height: 300px; /* Adjust as needed */
            overflow-y: auto;
            width: 100%;
        }
        
        .NAME-domain-availability .live-search-results.show {
            display: block;
        }

        @media screen and (min-width: 768px){
            .NAME-domain-availability input[type="text"] {
                width: 75%;
            }
            .NAME-domain-availability .live-search-results {
                width: 75%;
            }
        }
            
            .NAME-domain-availability .live-search-results ul {
                list-style: none;
                padding: 0;
                margin: 0;
            }

                .NAME-domain-availability .live-search-results ul li {
                    margin: 0;
                    padding: 0.1em 0.3em 0em 0.3em;
                    cursor: pointer;
                    display: flex;
                    gap: 0.5rem;
                    justify-content: space-between;
                    align-items: center;
                    font-size: 1rem;
                }

                .NAME-domain-availability .live-search-results ul li.available {
                    background: #e9ffe9;
                }

                .NAME-domain-availability .live-search-results ul li.taken {
                    background: #fff9e2;
                }

                    .NAME-domain-availability .live-search-results ul li .domain .tld {
                        font-weight: bold;
                        color: #4a4a4a;
                    }

                    .NAME-domain-availability .live-search-results ul li:hover {
                        font-weight: bold;
                    }

                    .NAME-domain-availability .live-search-results ul li span {
                        display: block;
                    }

                    .NAME-domain-availability .live-search-results ul li.error-message {
                        background-color: #fff0f0;
                        border: 1px solid #ffcccb;
                        padding: 10px;
                        border-radius: 4px;
                    }
                    
                    .NAME-domain-availability .live-search-results ul li.error-message .domain {
                        font-weight: bold;
                        color: #d32f2f;
                    }
                    
                    .NAME-domain-availability .live-search-results ul li.error-message .availability.error {
                        color: #d32f2f;
                    }

                    .NAME-domain-availability span.price {
                        text-align: right;
                        flex-grow: 100;
                        white-space: nowrap;
                    }

                    .NAME-domain-availability span.availability {
                        flex-grow: 1;
                    }

                    .NAME-domain-availability .availability.taken {
                        color: #793502;
                    }

                    .NAME-domain-availability .availability.available {
                        color: rgb(0, 99, 0);
                    }

                    .NAME-domain-availability .availability.loading {
                        border: 2px solid #ddd; /* Light grey */
                        border-top: 2px solid #3498db; /* Blue */
                        border-left: 2px solid #3498db; /* Blue */
                        border-radius: 50%;
                        width: 0.8rem;
                        height: 0.8rem;
                        animation: spin 1s linear infinite;
                        flex-grow: unset;
                    }
                                        
                    @keyframes spin {
                        0% { transform: rotate(0deg); }
                        100% { transform: rotate(360deg); }
                    }

        .NAME-domain-availability-form select {
            width: 15%;
            min-width: 5rem;
            margin-bottom: 0;
        }

        .NAME-domain-availability input[type="submit"] {
            width: 10%;
            margin: 0;
            text-align: center;
            min-width: 2.2rem;
        }
    
    .NAME-domain-availability-bottom-row {
        height: 0px;
        width: 100%;
    }

.NAME-signup {
    border: 1px solid #8f0000;
    padding: 1em;
}

    .NAME-signup-progress {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1em;
        font-size: 14px;
    }

    .NAME-signup-step {
        cursor: pointer;
    }

    .NAME-signup-step.active {
        font-weight: bold;
    }

    .NAME-signup-step.completed {
        opacity: 0.5;
    }

    .NAME-signup form {
        margin-bottom: 0;
    }

        .NAME-signup .section {
            display: none;
        }

        .NAME-signup .section.active {
            display: block;
        }

            .NAME-signup .section h2 {
                margin-top: 0;
            }

            .NAME-signup .section > div {
                margin-bottom: 2em;
            }

            .NAME-signup .list {
                border: 1px solid #eee;
            }

            .NAME-signup .list-entry {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                align-items: center;
                border-bottom: 1px solid #eee;
            }

            .list-entry .domain,
            .list-entry .price {
                padding: 5px;
            }

            .list-entry .domain-action.available {
                color: green;
            }

            .list-entry .domain-action.taken {
                color: red;
            }

            .NAME-signup .list-entry:last-child {
                border-bottom: none;
            }

            .NAME-signup .list-entry .remove {
                padding: 5px;
                justify-self: end;
                text-decoration: underline;
                cursor: pointer;
            }

            .NAME-signup .section:first-of-type .previous,
            .NAME-signup .section:last-of-type .next {
                pointer-events: none;
                color: #ccc;
                background-color: #f2f2f2;
                border-color: #ccc;
            }
            
            .NAME-signup .section .buttons {
                display: flex;
                justify-content: center;
                gap: 2em;
                margin-bottom: 0;
            }
            
            label.required::after {
                content: " *";
                color: red;
            }

            .NAME-signup label, .NAME-signup input, .NAME-signup select {
                display: block;
            }

.NAME-error-message {
    background-color: #ffebee;
    color: #c62828;
    padding: 10px;
    margin-top: 10px;
    border-radius: 4px;
    display: none;
}

.whois-details, #show-whois-details {
    margin-top: 20px;
}

.whois-section {
    margin-bottom: 20px;
}

.whois-fields, .account-owner-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.whois-copy-select {
    margin-bottom: 10px;
}

.NAME-hosting-plans {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.NAME-hosting-plans .tabs {
    display: flex;
    overflow-x: auto;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #ddd;
}

.NAME-hosting-plans .tab-button {
    flex: 0 0 auto;
    padding: 5px 10px;
    font-size: 0.9em;
    color: #333;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-bottom: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-bottom: 0;
}

.NAME-hosting-plans .tab-button.active {
    border-color: #0e7c00;
    background-color: #f5fff4;
}

.NAME-hosting-plans .tab-button:hover {
    background-color: #ddd;
}

.NAME-hosting-plans .tab-content {
    display: none;
    overflow-x: auto;
    width: 100%;
    box-sizing: border-box;
    scroll-snap-type: x mandatory;
}

.NAME-hosting-plans .tab-content.active {
    display: flex;
}

.NAME-hosting-plan {
    flex: 0 0 100%;
    margin-right: 1em;
    box-sizing: border-box;
    padding: 1em;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #f9f9f9;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    scroll-snap-align: start;
}

.NAME-hosting-plan.selected {
    border-color: #0e7c00;
    background-color: #f5fff4;
}

.NAME-hosting-plan h2 {
    margin-top: 0;
    color: #333;
}

.NAME-hosting-plan .billing-cycles {
    margin-top: 1em;
    font-size: 0.9em;
}

.NAME-hosting-plan .select-button {
    display: block;
    width: 100%;
    color: #fff;
    background-color: #0e7c00;
    text-align: center;
}

.NAME-hosting-plan .select-button:hover {
    background-color: #0c6a00;
}

/* For tablets: */
@media screen and (min-width: 768px) {
    .NAME-hosting-plan {
        flex: 0 0 calc(50% - 1em); /* Show 2 plans at a time */
    }
}

/* For desktop: */
@media screen and (min-width: 1024px) {
    .NAME-hosting-plan {
        flex: 0 0 calc(33.33% - 1em); /* Show 3 plans at a time */
    }
}

#NAME-order-form .tos {
    margin-bottom: 1rem;
}

    #NAME-order-form .tos input[type="checkbox"] {
        display: inline-block;
        vertical-align: top;
        margin-top: 0.3rem; /* Adjust this value to align with text if needed */
    }

    #NAME-order-form .tos label {
        display: inline-block;
        width: calc(100% - 2rem); /* Subtracting space for checkbox + gap */
        vertical-align: top;
    }

    #NAME-order-form .tos .info {
        display: block;
        width: 100%;
        margin-top: 0.5rem;
    }

    #NAME-order-form #terms-content:not(:empty) {
        background-color: #fafafa;
        padding: 1rem;
        max-height: 50vh;
        overflow-y: auto;
        box-shadow: 1px 1px 4px 1px #939393 inset;
    }

.promo-container {
    display: flex;
    flex-wrap: wrap;
}

label.promo, .promo-message {
    width: 100%;
}

.promo-message.error {
    color: #dc2626;
    margin-top: 0.5rem;   /* 8px spacing from input */
    padding: 0.5rem 0.75rem;
    background-color: #fef2f2;
    border-left: 3px solid #dc2626;
  }
  
  .promo-message.success {
    color: #15803d;
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background-color: #f0fdf4;
    border-left: 3px solid #15803d;
  }

.loader-spinner {
    width: 32px;
    height: 32px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}