/* =========================================================================
   HostTSP brand override for the WHMCS "standard_cart" order form.
   Auto-loaded by common.tpl via {assetExists file="custom.css"} — it loads
   AFTER all.min.css, so these rules win without editing the minified file.
   Brand colours taken from the HostTSP site (emerald-600 #059669).
   Everything is scoped to #order-standard_cart so nothing else is affected.
   To revert: delete this file.
   ========================================================================= */

:root {
    --tsp-primary:        #059669; /* emerald-600  — primary CTA            */
    --tsp-primary-dark:   #047857; /* emerald-700  — hover                  */
    --tsp-primary-darker: #065f46; /* emerald-800  — active                 */
    --tsp-tint-1:         #ecfdf5; /* emerald-50   — soft backgrounds       */
    --tsp-tint-2:         #d1fae5; /* emerald-100  — borders                */
    --tsp-ring:   rgba(5, 150, 105, .25);
}

/* ---- Primary buttons: Search, Add to Cart, Transfer, Contact ----------- */
#order-standard_cart .btn-primary {
    background-color: var(--tsp-primary) !important;
    border-color:     var(--tsp-primary) !important;
}
#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-primary:focus {
    background-color: var(--tsp-primary-dark) !important;
    border-color:     var(--tsp-primary-dark) !important;
    box-shadow: 0 0 0 .2rem var(--tsp-ring) !important;
}
#order-standard_cart .btn-primary:active,
#order-standard_cart .btn-primary.active {
    background-color: var(--tsp-primary-darker) !important;
    border-color:     var(--tsp-primary-darker) !important;
}

/* Add-to-cart buttons (suggestions/spotlight ones lack .btn-primary) */
#order-standard_cart .btn-add-to-cart {
    background-color: var(--tsp-primary) !important;
    border-color:     var(--tsp-primary) !important;
    color: #fff !important;
}
#order-standard_cart .btn-add-to-cart:hover {
    background-color: var(--tsp-primary-dark) !important;
    border-color:     var(--tsp-primary-dark) !important;
}

/* Rounded pills to match the HostTSP site's button style */
#order-standard_cart .btn { border-radius: 9999px; }

/* Keep primary-button text readable on the green fill */
#order-standard_cart .btn-primary { color: #fff !important; }

/* ---- Checkout / success buttons (Order Summary CTA) -------------------- */
/* The cart's "Checkout" button is .btn-success — the theme left its text the
   same green as the fill, so the label + arrow were invisible. Force emerald
   fill with white text. */
#order-standard_cart .btn-success,
#order-standard_cart .btn-checkout {
    background-color: var(--tsp-primary) !important;
    border-color:     var(--tsp-primary) !important;
    color: #fff !important;
}
#order-standard_cart .btn-success:hover,
#order-standard_cart .btn-success:focus,
#order-standard_cart .btn-checkout:hover,
#order-standard_cart .btn-checkout:focus {
    background-color: var(--tsp-primary-dark) !important;
    border-color:     var(--tsp-primary-dark) !important;
    color: #fff !important;
    box-shadow: 0 0 0 .2rem var(--tsp-ring) !important;
}
#order-standard_cart .btn-success:active,
#order-standard_cart .btn-success.active,
#order-standard_cart .btn-checkout:active {
    background-color: var(--tsp-primary-darker) !important;
    border-color:     var(--tsp-primary-darker) !important;
    color: #fff !important;
}
/* Keep the label + arrow icon white even if the theme colours children */
#order-standard_cart .btn-success,
#order-standard_cart .btn-checkout,
#order-standard_cart .btn-success i,
#order-standard_cart .btn-checkout i { color: #fff !important; }

/* Brand the "Explore packages now" promo button green instead of yellow */
#order-standard_cart .domain-promo-box .btn-warning {
    background-color: var(--tsp-primary) !important;
    border-color:     var(--tsp-primary) !important;
    color: #fff !important;
}
#order-standard_cart .domain-promo-box .btn-warning:hover {
    background-color: var(--tsp-primary-dark) !important;
    border-color:     var(--tsp-primary-dark) !important;
}

/* ---- Domain search box ------------------------------------------------- */
/* Outer container ships with a YELLOW gradient — the source of the yellow
   corners peeking behind the search box. Neutralise it. */
#order-standard_cart .domain-checker-container {
    background: transparent !important;
    border-radius: 16px !important;
}
#order-standard_cart .domain-checker-bg {
    background: linear-gradient(135deg, var(--tsp-tint-1) 0%, #f0fdf4 100%) !important;
    border: 1px solid var(--tsp-tint-2) !important;
    border-radius: 16px !important;
    padding: 28px 16px !important;
    background-image: none !important; /* drop the theme's globe.png */
}

/* Readable search input text + placeholder */
#order-standard_cart #inputDomain { color: #0f172a !important; }
#order-standard_cart #inputDomain::placeholder { color: #94a3b8 !important; opacity: 1; }
#order-standard_cart .input-group-box .form-control {
    border-radius: 9999px 0 0 9999px !important;
    border-color: #a7f3d0 !important;
}
#order-standard_cart .input-group-box .btn {
    border-radius: 0 9999px 9999px 0 !important;
}
#order-standard_cart .input-group-box .form-control:focus {
    border-color: var(--tsp-primary) !important;
    box-shadow: 0 0 0 .2rem var(--tsp-ring) !important;
}

/* ---- Availability result text ------------------------------------------ */
#order-standard_cart .domain-checker-available,
#order-standard_cart .domain-available { color: var(--tsp-primary-dark) !important; }
#order-standard_cart .domain-checker-available strong { color: var(--tsp-primary) !important; }

/* ---- Sidebar: active menu item ----------------------------------------- */
/* Lighter emerald highlight (not a heavy solid block) so the active item
   reads cleanly and never looks like an empty green bar. */
#order-standard_cart .cart-sidebar .list-group-item.active,
#order-standard_cart .list-group-item.active {
    background-color: var(--tsp-tint-1) !important;   /* emerald-50  */
    border-color:     var(--tsp-tint-2) !important;   /* emerald-100 */
    border-left:      3px solid var(--tsp-primary) !important;
    color:            var(--tsp-primary-dark) !important;
    font-weight:      600;
}
#order-standard_cart .list-group-item.active i { color: var(--tsp-primary) !important; }

/* ---- "Register Domain" heading accent ---------------------------------- */
#order-standard_cart .header-lined h1 {
    border-bottom: 3px solid var(--tsp-primary) !important;
    padding-bottom: 12px;
    display: inline-block;
}

/* ---- TLD category filter badges ---------------------------------------- */
#order-standard_cart .tld-filters .badge {
    cursor: pointer;
    padding: .4em .8em;
    font-weight: 600;
    margin-right: 4px;
}
/* Active (selected) category — solid emerald, white text */
#order-standard_cart .tld-filters .badge.badge-success,
#order-standard_cart .tld-filters .badge-success {
    background-color: var(--tsp-primary) !important;
    color: #fff !important;
}
/* Inactive category — soft emerald-tint chip with readable dark-emerald text
   (the theme left these a faint green-on-green that was hard to read). */
#order-standard_cart .tld-filters .badge.badge-secondary,
#order-standard_cart .tld-filters .badge-secondary {
    background-color: var(--tsp-tint-1) !important;
    color: var(--tsp-primary-dark) !important;
    border: 1px solid var(--tsp-tint-2) !important;
}
#order-standard_cart .tld-filters .badge.badge-secondary:hover,
#order-standard_cart .tld-filters .badge-secondary:hover {
    background-color: var(--tsp-tint-2) !important;
}

/* ---- TLD pricing table -------------------------------------------------- */
/* The theme paints each header COLUMN its own light-grey (#efefef/#f5f5f5)
   with a blue bottom border, which covered our emerald header and left the
   white "Domain / New Price / Transfer / Renewal" labels invisible. Force
   every header cell emerald with white text and an emerald underline. */
#order-standard_cart .tld-pricing-header,
#order-standard_cart .tld-pricing-header div {
    background-color: var(--tsp-primary) !important;
    color: #fff !important;
    border-bottom-color: var(--tsp-primary-darker) !important;
}
#order-standard_cart .tld-pricing-header {
    border-radius: 10px 10px 0 0;
    overflow: hidden;
}
#order-standard_cart .tld-row.highlighted { background-color: #f0fdf4 !important; }

/* ---- Featured TLDs + links --------------------------------------------- */
#order-standard_cart .featured-tld .price {
    color: var(--tsp-primary-dark) !important;
    font-weight: 700;
}
#order-standard_cart a       { color: var(--tsp-primary); }
#order-standard_cart a:hover { color: var(--tsp-primary-dark); }

/* ---- Promo boxes (Add Hosting / Transfer) ------------------------------ */
#order-standard_cart .domain-promo-box {
    border: 1px solid var(--tsp-tint-2);
    border-radius: 14px;
    padding: 24px;
    background: #fff;
}
#order-standard_cart .domain-promo-box .text-primary { color: var(--tsp-primary) !important; }
#order-standard_cart .domain-promo-box .fa-globe,
#order-standard_cart .domain-promo-box .fa-server   { color: var(--tsp-primary); }
/* Recolour the amber "Choose from a range of web hosting packages" subtitle
   to emerald so it matches the green subtitle on the Transfer box. */
#order-standard_cart .domain-promo-box .text-warning,
#order-standard_cart .domain-promo-box p.text-warning { color: var(--tsp-primary-dark) !important; }
