/* Registro de dominios — rediseño sobre themetags_cart con la paleta del tema kohost (variables.css) */

.d21-dom {
    --d21-card: #ffffff;
    --d21-soft: #f4f7ff;
    --d21-line: var(--border-color);
    --d21-ok: #1a8f4c;
    --d21-ok-bg: #e9f8ef;
    --d21-bad: #c93636;
    --d21-bad-bg: #fdecec;
    --d21-shadow: 0 1px 2px rgba(9, 26, 122, .04), 0 8px 24px rgba(9, 26, 122, .06);
}
[data-bs-theme="dark"] .d21-dom {
    --d21-card: #1e293b;
    --d21-soft: #0f172a;
    --d21-line: #334155;
    --d21-ok: #5fd08c;
    --d21-ok-bg: rgba(95, 208, 140, .12);
    --d21-bad: #f08585;
    --d21-bad-bg: rgba(240, 133, 133, .12);
    --d21-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

/* ---------- Buscador ---------- */

.d21-dom .d21-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 28px;
    padding: 40px 36px 34px;
    border-radius: calc(var(--custom-radius) * 1.5);
    background:
        radial-gradient(520px 260px at 100% 0, rgba(47, 217, 239, .28), transparent 70%),
        linear-gradient(135deg, var(--primary-darker) 0%, var(--primary-dark) 55%, var(--primary) 100%);
    color: #fff;
}
.d21-dom .d21-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    font-family: var(--font-family-monospace);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.d21-dom .d21-title {
    margin: 14px 0 6px;
    font-family: var(--font-family-monospace);
    font-size: 34px;
    line-height: 1.15;
    font-weight: 700;
    color: #fff;
}
.d21-dom .d21-sub {
    max-width: 620px;
    margin: 0 0 22px;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(255, 255, 255, .85);
}
.d21-dom .d21-search {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 720px;
    padding: 8px 8px 8px 18px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(4, 12, 66, .35);
}
.d21-dom .d21-search:focus-within {
    box-shadow: 0 14px 34px rgba(4, 12, 66, .35), 0 0 0 3px rgba(47, 217, 239, .55);
}
.d21-dom .d21-search-icon {
    flex: 0 0 auto;
    color: #8a93a6;
    font-size: 16px;
}
.d21-dom .d21-search .form-control {
    flex: 1 1 auto;
    min-width: 0;
    height: 48px;
    padding: 0 6px;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 17px;
    color: #1d1d1f !important;
}
.d21-dom .d21-search .form-control::placeholder {
    color: #8a93a6;
}
.d21-dom .d21-search .btn {
    flex: 0 0 auto;
    height: 48px;
    padding: 0 26px;
    border-radius: 10px;
    font-family: var(--font-family-monospace);
    font-size: 15px;
    font-weight: 500;
}
.d21-dom .captcha-container {
    max-width: 720px;
    margin-top: 16px;
}
.d21-dom .d21-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}
.d21-dom .d21-chips li {
    padding: 5px 12px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    font-size: 13px;
    color: rgba(255, 255, 255, .85);
}
.d21-dom .d21-chips strong {
    margin-right: 4px;
    font-family: var(--font-family-monospace);
    color: #fff;
}

/* ---------- Resultado principal ---------- */

#order-standard_cart.d21-dom .domain-checker-result-headline {
    margin: 0 0 22px;
    padding: 26px 24px;
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-card);
    box-shadow: var(--d21-shadow);
    font-size: 16px;
    text-align: center;
}
#order-standard_cart.d21-dom .domain-lookup-primary-loader {
    margin: 0;
    font-size: 16px;
    color: var(--body-color);
}
#order-standard_cart.d21-dom #primaryLookupResult > p {
    margin: 0;
}
#order-standard_cart.d21-dom .domain-checker-available,
#order-standard_cart.d21-dom .domain-checker-unavailable,
#order-standard_cart.d21-dom .domain-checker-invalid {
    font-size: 18px;
    line-height: 1.5;
}
#order-standard_cart.d21-dom .domain-checker-available {
    color: var(--d21-ok);
}
#order-standard_cart.d21-dom .domain-checker-unavailable,
#order-standard_cart.d21-dom .domain-checker-invalid {
    color: var(--d21-bad);
}
#order-standard_cart.d21-dom .domain-checker-available::before,
#order-standard_cart.d21-dom .domain-unavailable::before,
#order-standard_cart.d21-dom .domain-tld-unavailable::before,
#order-standard_cart.d21-dom .domain-invalid::before,
#order-standard_cart.d21-dom .domain-error:not(:empty)::before {
    display: block;
    width: 52px;
    height: 52px;
    margin: 0 auto 12px;
    border-radius: 50%;
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 22px;
    line-height: 52px;
}
#order-standard_cart.d21-dom .domain-checker-available::before {
    content: "\f00c";
    background: var(--d21-ok-bg);
}
#order-standard_cart.d21-dom .domain-unavailable::before,
#order-standard_cart.d21-dom .domain-tld-unavailable::before,
#order-standard_cart.d21-dom .domain-invalid::before,
#order-standard_cart.d21-dom .domain-error:not(:empty)::before {
    content: "\f00d";
    background: var(--d21-bad-bg);
}
#order-standard_cart.d21-dom .domain-checker-result-headline strong {
    font-family: var(--font-family-monospace);
    word-break: break-all;
}
#order-standard_cart.d21-dom .domain-length-restrictions {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    opacity: .85;
}
#order-standard_cart.d21-dom #primaryLookupResult > p.domain-price {
    margin-top: 16px;
}
#order-standard_cart.d21-dom .domain-price .price {
    display: inline-block;
    margin-right: 14px;
    vertical-align: middle;
    font-family: var(--font-family-monospace);
    font-size: 26px;
    font-weight: 700;
    color: var(--heading-color);
}
#order-standard_cart.d21-dom .domain-price .btn {
    padding: 11px 24px;
    vertical-align: middle;
    font-family: var(--font-family-monospace);
    font-weight: 500;
}
#order-standard_cart.d21-dom .domain-contact-support {
    margin-top: 14px;
}

/* ---------- Extensiones destacadas en resultados ---------- */

.d21-dom .spotlight-tlds {
    margin: 0 0 22px;
    padding: 0;
    background: transparent;
}
.d21-dom .spotlight-tlds-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 14px;
    margin: 0;
}
.d21-dom .spotlight-tld-container {
    float: none;
    width: auto !important;
    min-width: 0 !important;
    padding: 0;
}
.d21-dom .spotlight-tld {
    height: auto;
    min-height: 132px;
    padding: 18px 12px 14px;
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-card);
    box-shadow: var(--d21-shadow);
    font-family: var(--font-family-monospace);
    font-size: 18px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .spotlight-tld span.available.price {
    padding: 6px 0 8px;
    font-size: 15px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .spotlight-tld .btn:not(.domain-contact-support) {
    width: auto;
    padding: 6px 16px;
    border-radius: 8px;
    font-size: 13px;
}
.d21-dom .spotlight-tld .invalid,
.d21-dom .spotlight-tld .unavailable {
    margin: 18px 0 0;
    background-color: var(--d21-soft);
    border-color: var(--d21-line);
    color: var(--gray);
}
.d21-dom .spotlight-tld .domain-contact-support {
    margin: 14px 0 0;
}
.d21-dom .spotlight-tld .domain-lookup-spotlight-loader {
    line-height: 60px;
    color: var(--primary);
}
.d21-dom .spotlight-tld-new,
.d21-dom .spotlight-tld-hot,
.d21-dom .spotlight-tld-sale {
    font-family: var(--font-family-sans-serif);
    font-size: 9px;
    line-height: 18px;
}

/* ---------- Sugerencias ---------- */

.d21-dom .suggested-domains {
    margin-bottom: 26px;
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-card);
    box-shadow: var(--d21-shadow);
    overflow: hidden;
}
.d21-dom .suggested-domains .card-header,
.d21-dom .suggested-domains .panel-heading {
    padding: 14px 20px;
    border: 0;
    border-bottom: 1px solid var(--d21-line);
    background: var(--d21-soft);
    font-family: var(--font-family-monospace);
    font-size: 15px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .suggested-domains .domain-lookup-suggestions-loader {
    background: transparent;
    color: var(--body-color);
}
.d21-dom .suggested-domains .list-group-item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
    padding: 12px 20px;
    border: 0;
    border-bottom: 1px solid var(--d21-line);
    border-radius: 0;
    background: transparent;
    font-size: 15px;
    text-align: left;
    color: var(--heading-color);
}
.d21-dom .suggested-domains .list-group-item.w-hidden {
    display: none;
}
.d21-dom .suggested-domains .list-group-item:hover {
    background: var(--d21-soft);
}
.d21-dom .suggested-domains .extension {
    margin-left: -10px;
    color: var(--primary);
}
[data-bs-theme="dark"] .d21-dom .suggested-domains .extension {
    color: #8ea2ff;
}
.d21-dom .suggested-domains .promo .sales-group-hot {
    background: #f9615a;
    color: #fff;
}
.d21-dom .suggested-domains .promo .sales-group-new {
    background: #2ad588;
    color: #0b3d25;
}
.d21-dom .suggested-domains .promo .sales-group-sale {
    background: #f7d458;
    color: #4a3b00;
}
.d21-dom .suggested-domains .promo span {
    padding: 2px 8px;
    text-transform: uppercase;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
}
.d21-dom .suggested-domains .actions {
    display: flex;
    align-items: center;
    gap: 14px;
    float: none;
    margin-left: auto;
}
.d21-dom .suggested-domains .price {
    display: inline;
    padding: 0;
    font-family: var(--font-family-monospace);
    font-size: 15px;
    font-weight: 600;
}
.d21-dom .suggested-domains .btn:not(.domain-contact-support) {
    width: auto;
    padding: 6px 16px;
    border-radius: 8px;
    border-color: var(--primary);
    background-color: var(--primary);
    font-size: 13px;
    line-height: 1.5;
}
.d21-dom .suggested-domains .more-suggestions {
    padding: 12px;
    border: 0;
    background: transparent;
}
.d21-dom .domain-suggestions-warning {
    padding: 12px 20px;
    font-size: 12px;
}
.d21-dom .domain-suggestions-warning p {
    margin: 0;
}

/* ---------- Extensiones destacadas ---------- */

.d21-dom .d21-featured {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 34px;
}
.d21-dom .d21-featured-tld {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-card);
    box-shadow: var(--d21-shadow);
}
.d21-dom .d21-featured-logo {
    flex: 0 1 120px;
    height: 46px;
    display: flex;
    align-items: center;
}
.d21-dom .d21-featured-logo img {
    max-width: 100%;
    max-height: 100%;
}
[data-bs-theme="dark"] .d21-dom .d21-featured-tld {
    background: #f8fafc;
}
.d21-dom .d21-featured-price {
    font-size: 13px;
    white-space: nowrap;
    color: #5b6472;
}
.d21-dom .d21-featured-price strong {
    font-family: var(--font-family-monospace);
    font-size: 20px;
    font-weight: 700;
    color: #1d1d1f;
}

/* ---------- Tabla de precios ---------- */

.d21-dom .d21-h2 {
    margin: 0 0 14px;
    font-family: var(--font-family-monospace);
    font-size: 22px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .tld-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}
.d21-dom .d21-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--d21-line);
    border-radius: 999px;
    background: var(--d21-card);
    font-size: 13px;
    line-height: 1.3;
    color: var(--body-color);
    text-decoration: none;
    transition: background .15s, color .15s, border-color .15s;
}
.d21-dom .d21-pill span {
    padding: 0 6px;
    border-radius: 999px;
    background: var(--d21-soft);
    font-size: 11px;
    font-weight: 600;
    color: var(--gray);
}
.d21-dom .d21-pill:hover {
    border-color: var(--primary);
    color: var(--primary);
}
.d21-dom .d21-pill.badge-success {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}
.d21-dom .d21-pill.badge-success span {
    background: rgba(255, 255, 255, .2);
    color: #fff;
}
.d21-dom .d21-tld-table {
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-card);
    box-shadow: var(--d21-shadow);
    overflow: hidden;
}
.d21-dom .d21-tld-head,
.d21-dom .domain-pricing .tld-row {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr));
    align-items: center;
    gap: 8px;
    padding: 9px 22px;
}
.d21-dom .d21-tld-head {
    background: var(--d21-soft);
    border-bottom: 1px solid var(--d21-line);
    font-family: var(--font-family-monospace);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--gray);
}
[data-bs-theme="dark"] .d21-dom .d21-tld-head {
    color: var(--body-color);
}
.d21-dom .d21-tld-head div:not(:first-child),
.d21-dom .d21-tld-price {
    text-align: right;
}
.d21-dom .domain-pricing .tld-row {
    border-bottom: 1px solid var(--d21-line);
}
.d21-dom .domain-pricing .tld-row.highlighted {
    background: transparent;
}
.d21-dom .domain-pricing .tld-row:hover {
    background: var(--d21-soft);
}
.d21-dom .domain-pricing .tld-row.no-tlds {
    display: none;
    padding: 28px 22px;
    border-bottom: 0;
    text-align: center;
    color: var(--body-color);
}
.d21-dom .d21-tld-name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
}
.d21-dom .d21-tld-name strong {
    font-family: var(--font-family-monospace);
    font-size: 16px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .tld-sale-group {
    line-height: 1.5;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.d21-dom .d21-amount {
    display: block;
    font-family: var(--font-family-monospace);
    font-size: 15px;
    font-weight: 500;
    color: var(--heading-color);
}
.d21-dom .d21-amount.d21-free {
    color: var(--d21-ok);
}
.d21-dom .d21-tld-price {
    line-height: 1.3;
}
.d21-dom .d21-short {
    display: none;
}
.d21-dom .d21-tld-price small {
    display: block;
    font-size: 12px;
    color: var(--gray);
    text-transform: lowercase;
}
[data-bs-theme="dark"] .d21-dom .d21-tld-price small {
    color: var(--body-color);
}

/* ---------- Bloques finales ---------- */

.d21-dom .d21-promos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
    margin-top: 30px;
}
.d21-dom .d21-promo {
    display: flex;
    gap: 16px;
    padding: 22px;
    border: 1px solid var(--d21-line);
    border-radius: var(--custom-radius);
    background: var(--d21-soft);
}
.d21-dom .d21-promo-icon {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--primary);
    color: #fff;
    font-size: 18px;
}
.d21-dom .d21-promo-body {
    min-width: 0;
}
.d21-dom .d21-promo h3 {
    margin: 0 0 4px;
    font-family: var(--font-family-monospace);
    font-size: 17px;
    font-weight: 600;
    color: var(--heading-color);
}
.d21-dom .d21-promo p {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--body-color);
}
.d21-dom .d21-promo small {
    display: block;
    margin-top: 10px;
    font-size: 12px;
    color: var(--gray);
}
[data-bs-theme="dark"] .d21-dom .d21-promo small {
    color: var(--body-color);
}

/* ---------- Móvil ---------- */

@media (max-width: 575px) {
    .d21-dom .d21-hero {
        padding: 28px 18px 24px;
    }
    .d21-dom .d21-title {
        font-size: 26px;
    }
    .d21-dom .d21-search {
        flex-wrap: wrap;
        padding: 8px;
    }
    .d21-dom .d21-search-icon {
        margin-left: 10px;
    }
    .d21-dom .d21-search .form-control {
        flex: 1 1 0;
        font-size: 16px;
    }
    .d21-dom .d21-search .btn {
        flex: 1 1 100%;
    }
    #order-standard_cart.d21-dom .domain-price .price {
        display: block;
        margin: 0 0 10px;
    }
    .d21-dom .suggested-domains .actions {
        width: 100%;
        justify-content: space-between;
    }
    .d21-dom .suggested-domains .list-group-item .btn {
        width: auto;
    }
    .d21-dom .d21-tld-head,
    .d21-dom .domain-pricing .tld-row {
        padding: 10px 12px;
        gap: 4px;
    }
    .d21-dom .d21-tld-head {
        font-size: 10px;
        letter-spacing: 0;
    }
    .d21-dom .d21-long {
        display: none;
    }
    .d21-dom .d21-short {
        display: inline;
    }
    .d21-dom .d21-tld-name strong {
        font-size: 14px;
    }
    .d21-dom .d21-amount {
        font-size: 13px;
    }
    .d21-dom .d21-tld-price small {
        font-size: 11px;
    }
}