/*
 * AIOR — product-cart domain page fallback styles (F53b).
 *
 * These styles previously lived inline at the top of
 * `templates/orderforms/standard_cart/configureproductdomain.tpl`.
 * Migrated here so WHMCS upgrades can't wipe them — the cart hook
 * (`includes/hooks/aior_product_cart_handoff.php`) injects this file
 * with a mtime cache-bust when the customer is on the
 * configureproductdomain step.
 *
 * Scope:
 *   - #DomainSearchResults / #spotlightTlds visibility overrides
 *   - .spotlight-tld .aior-result-* row layout
 *   - .aior-primary-card hero card for the typed domain
 *
 * Uses the same CSS variables as the rest of the AIOR theme
 * (--accent, --ok, --crit, --bg-soft, --fg, --fg-muted, --line) with
 * dark-mode-safe fallback hex values inline so this file works even
 * when the parent theme hasn't loaded variables yet.
 */

/* Force-show containers that WHMCS's default JS hides until the user
   triggers a search. Our handoff JS unhides them BEFORE the user types,
   so the spotlight pills + primary card slot are visible from page load. */
#DomainSearchResults.aior-visible { display: block !important; }
#spotlightTlds.aior-visible       { display: block !important; }

/* Spotlight TLD row — one per pill, populated per checkDomain response. */
.spotlight-tld .aior-result-line {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 6px 0;
    flex-direction: column;
}
.spotlight-tld .aior-result-price {
    font-weight: 700;
    color: var(--accent, #1d9bf0);
    font-size: 14px;
}
.spotlight-tld .aior-result-btn {
    background: var(--accent, #1d9bf0);
    color: #fff;
    border: 0;
    padding: 6px 14px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
}
.spotlight-tld .aior-result-btn:hover {
    background: color-mix(in srgb, var(--accent, #1d9bf0) 88%, #000);
}
.spotlight-tld .aior-result-btn.is-added {
    background: var(--ok, #16a34a);
}
.spotlight-tld .aior-result-taken {
    color: var(--fg-muted, #94a3b8);
    font-size: 12px;
    padding: 4px 0;
}

/* Hero card for the customer's exact typed domain. */
.aior-primary-card {
    padding: 18px 20px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-soft, #11141a) 50%, transparent);
    margin: 16px 0;
    text-align: center;
    border: 1px solid var(--line, #1f242d);
}
.aior-primary-card.is-available { border-color: var(--ok, #16a34a); }
.aior-primary-card.is-taken     { border-color: var(--crit, #dc2626); }
.aior-primary-card h3 {
    margin: 0 0 10px;
    font-size: 17px;
    color: var(--fg, #e2e8f0);
    font-weight: 700;
}
.aior-primary-card .price {
    font-size: 24px;
    font-weight: 800;
    color: var(--accent, #1d9bf0);
    margin-bottom: 6px;
}
.aior-primary-card .add-btn {
    background: var(--accent, #1d9bf0);
    color: #fff;
    border: 0;
    padding: 12px 28px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 700;
    margin-top: 10px;
    font-size: 14px;
}
.aior-primary-card .add-btn:hover {
    background: color-mix(in srgb, var(--accent, #1d9bf0) 88%, #000);
}
.aior-primary-card .add-btn.is-added { background: var(--ok, #16a34a); }
.aior-primary-card .add-btn:disabled { opacity: .7; cursor: wait; }