:root {
    --xol-green: #2e9238;
    --xol-lightgreen: #c2fcd3;
    --xol-brightgreen: #C4FFCB;
    --xol-lightblue: #C9FBFF;
    --xol-lightgray: #F5F5F5;
    --xol-gray: #ECECEC;
    --xol-darkgray: #CCC;
    --xol-black: #111;
    --xol-red: #DC3230;
    --xol-darkred: #721C24;
    --xol-fail: #F8D7DA;
    --xol-success: #2e9238;
}

/* reusable color classes */
.xol-color-gray { color: var(--xol-gray); }
.xol-color-green { color: var(--xol-green); }
.xol-color-red { color: var(--xol-red); }
.xol-color-fail { color: var(--xol-fail); }
.xol-color-success { color: var(--xol-success); }
.xol-background-green { background: var(--xol-green); }
.xol-background-red { background: var(--xol-red); }


.loader {display: none;}
.xol-dom-module {
	transition: background 800ms ease;
	background: var(--xol-lightblue);
	background: rgba(201,251,255, .5);
}
.xol-dom-module:hover { background: var(--xol-lightblue) }

.xol-domsearch input[type=text],
.xol-domsearch #xol_domains_domaininput {
	height: 48px;
	padding-left: 15px;
	font-size: 16px;
	border: 1px solid var(--xol-darkgray);
	border-radius: 0;
}
.xol-domsearch button { height: 48px; }
.xol-domsearch #xol_domains_domaininput:focus { border-color: var(--xol-black); }

.xol-domain-result {
	margin-top: .5em;
}
.xol-domsearch .alert {
	margin: 1em 0 0;
}

.xol-domain-result.result-fail {
	color: red;
}
.xol-domain-result.result-success {
	color: green;
}
body .col-dom-ext {
	border-collapse: collapse;
	display: flex;
	flex-basis: 120px;
	height: 80px;
	background: white;
	border: 1px solid var(--xol-gray);
}
.col-dom-ext > div {
	text-align: center;
	margin: auto;
}

.xol-domain-results-ajax {
  display: block;
}

.help-block {
    clear: both;
    display: block;
    width: 100%;
    background: var(--xol-fail);
    color: var(--xol-darkred);
    border: 1px solid var(--xol-fail);
    margin: 20px 0;
    padding: 10px 20px;
    font-weight: bold;
}
.xol-domain-avail {
    margin-bottom: 10px;
}
.xol-domain-avail.xol-domain-available > div {
    background: #D4EDDA;
    padding: 10px;
    border-bottom: 1px solid #99c4a3;
}
.xol-domain-avail.xol-domain-unavailable > form {
    background: #F8D7DA;
    padding: 10px;
}
#domain-transfer-input {
    padding: 0;
    flex: 1;
    justify-content: flex-end;
}
#domain-transfer-input input {
    width: 98%;
    border-radius: 0;
}
#domain-transfer-toggle {
    border-radius: 0;
}
#domain-transfer-toggle:hover,
#domain-transfer-toggle:focus {
    border-radius: 0;
}
.fqdn-available {
    transform: translateY(3px);
    display: inline-block;
}

#xol-domains-order-form .row {
    max-width: 100%;
}
#xol-domains-order-form input {
    border-radius: 0;
    padding: 5px 10px;
    box-sizing: content-box;
    border-color: #ccc;
}
#xol-domains-order-form input:hover,
#xol-domains-order-form .form-select select:hover {
    border-color: var(--xol-green);
    box-shadow: 0 0 5px rgba(150,150,150,.25);
}
#xol-domains-order-form input::placeholder {
    color: var(--xol-darkgray);
    transition: color 300ms ease;
}
#xol-domains-order-form input:hover::placeholder {
    color: var(--xol-green);
}
#xol-domains-order-form input:focus,
#xol-domains-order-form .form-select select:focus {
    border-color: var(--xol-black);
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 0 5px rgba(150,150,150,.5);
}
#xol-domains-order-form input:focus::placeholder {
    color: var(--xol-black);
}
#xol-domains-order-form .btn.btn-submit {
    padding: 16px 32px;
}

#xol-domains-order-form .col-form-label {
    align-self: center;
}
#xol-domains-order-form .form-select select {
    background-color: var(--xol-lightgray);
    border: 1px solid var(--xol-gray);
    width: 100%;
    padding: 5px 10px;
    border: 1px solid var(--xol-gray);
}

/* Mollie Payment Form */
.xol-mollie-payment-form input[type=text],
.xol-mollie-payment-form input[type=email],
.xol-mollie-payment-form input[type=number] {
    padding: 0;
    border: none;
    background: #fff;
    margin-bottom: 1em;
    pointer-events: none;
    font-weight: bold;
}
.xol-mollie-payment-form ul {
    margin-top: -20px !important;
    padding-left: 0;
}
.xol-mollie-payment-form #form_1058_field_2 label {
    font-weight: bold;
}
.xol-mollie-payment-form input[type=number]::-webkit-outer-spin-button,
.xol-mollie-payment-form input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.xol-mollie-payment-form input[type=number] {
  -moz-appearance: textfield;
}

.xol-mollie-payment-form .mollie-forms-required,
.xol-mollie-payment-form #rfmp_open_amount_1058 > label > span,
.xol-mollie-payment-form #form_1058_field_2 label > input[type=radio] {
    display: none;
}

/* cart */
.row-cart-total {
    border-top: 1px solid var(--xol-green);
}
.row-bottom {
    color: var(--gray);
}

.xol-mollie-payment-success {
    background: #D4EDDA;
    padding: 10px;
    border-bottom: 1px solid #99c4a3;
    text-align: center !important;
}
.xol-mollie-payment-fail {
    background: #F8D7DA;
    padding: 10px;
    border-bottom: 1px solid red;
    text-align: center !important;
}

/* Woocommerce product meta */
.xol-domain-name-field {
    margin-bottom: 1em;
}

@media screen and (min-width: 1025px) {
    .xol-domain-selection {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}