/*!
 * TeamCloud Modern Order Form — catalogue & configuration styles (tc-cart.css)
 * Requires tc-core.css (design tokens + components), loaded by common.tpl.
 */

/* ---------- Order form shell ---------- */
#order-teamcloudmodern { --tc-cart-sidebar-w: 250px; --tc-cart-summary-w: 360px; color: var(--tc-text-primary); font-family: var(--tc-font); }
#order-teamcloudmodern .tc-cart__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 8px 0 24px; }
#order-teamcloudmodern .tc-cart__title { font-size: clamp(1.45rem, 1.2rem + .8vw, 1.9rem); font-weight: 600; margin: .25rem 0 0; }
#order-teamcloudmodern .tc-cart__subtitle { color: var(--tc-text-secondary); margin: .35rem 0 0; max-width: 720px; }

/* Two-column layout: categories sidebar + body */
#order-teamcloudmodern .tc-cart__layout { display: grid; grid-template-columns: var(--tc-cart-sidebar-w) minmax(0, 1fr); gap: 24px; align-items: start; }
#order-teamcloudmodern .tc-cart__layout--full { grid-template-columns: minmax(0, 1fr); }
#order-teamcloudmodern .tc-cart__sidebar { position: sticky; top: calc(var(--tc-header-h, 72px) + 12px); min-width: 0; }
#order-teamcloudmodern .tc-cart__body { min-width: 0; }
@media (max-width: 991.98px) {
    #order-teamcloudmodern .tc-cart__layout { grid-template-columns: minmax(0, 1fr); }
    #order-teamcloudmodern .tc-cart__sidebar { display: none; }
}

/* Body + sticky order summary (configure product, view cart, checkout) */
#order-teamcloudmodern .tc-cart__split { display: grid; grid-template-columns: minmax(0, 1fr) var(--tc-cart-summary-w); gap: 24px; align-items: start; }
#order-teamcloudmodern .tc-cart__summary { position: sticky; top: calc(var(--tc-header-h, 72px) + 12px); min-width: 0; }
@media (max-width: 1199.98px) {
    #order-teamcloudmodern .tc-cart__split { grid-template-columns: minmax(0, 1fr); }
    #order-teamcloudmodern .tc-cart__summary { position: static; }
}

/* Order summary floating card (#orderSummary / .order-summary are JS hooks) */
#order-teamcloudmodern .order-summary, #order-teamcloudmodern .tc-order-summary {
    background: var(--tc-surface); border-radius: var(--tc-radius-xl); box-shadow: var(--tc-shadow-lg); padding: 24px; color: var(--tc-text-primary);
}
[data-theme="dark"] #order-teamcloudmodern .order-summary { border: 1px solid var(--tc-divider); }
#order-teamcloudmodern .order-summary h2, #order-teamcloudmodern .tc-order-summary__title { font-size: 1.05rem; font-weight: 600; margin: 0 0 16px; }
#order-teamcloudmodern .summary-container { font-size: .9rem; }
#order-teamcloudmodern .summary-container .clearfix { display: flex; justify-content: space-between; gap: 12px; padding: .35rem 0; }
#order-teamcloudmodern .summary-container .clearfix::before, #order-teamcloudmodern .summary-container .clearfix::after { display: none; }
#order-teamcloudmodern .summary-container .float-left, #order-teamcloudmodern .summary-container .pull-left { float: none !important; color: var(--tc-text-secondary); }
#order-teamcloudmodern .summary-container .float-right, #order-teamcloudmodern .summary-container .pull-right { float: none !important; font-weight: 500; text-align: right; }
#order-teamcloudmodern .summary-totals { border-top: 1px solid var(--tc-divider); margin-top: 10px; padding-top: 10px; }
#order-teamcloudmodern .total-due-today { border-top: 1px solid var(--tc-divider); margin-top: 12px; padding-top: 14px; text-align: right; }
#order-teamcloudmodern .total-due-today .amt { display: block; font-size: 1.8rem; font-weight: 600; letter-spacing: -.02em; }
#order-teamcloudmodern .total-due-today span:not(.amt) { color: var(--tc-text-secondary); font-size: .85rem; }
#order-teamcloudmodern .order-summary { position: relative; }
#order-teamcloudmodern .order-summary .loader { text-align: center; padding: 12px; color: var(--tc-text-secondary); }
#order-teamcloudmodern #orderSummary .order-summary .loader { position: absolute; top: 20px; right: 20px; padding: 0; color: var(--tc-primary-text); }

/* Shared section card */
#order-teamcloudmodern .tc-section { background: var(--tc-surface); border-radius: var(--tc-radius-lg); box-shadow: var(--tc-shadow-md); padding: 24px; margin-bottom: 24px; }
[data-theme="dark"] #order-teamcloudmodern .tc-section { border: 1px solid var(--tc-divider); }
#order-teamcloudmodern .tc-section__title, #order-teamcloudmodern .sub-heading { display: flex; align-items: center; gap: .6rem; font-size: 1.02rem; font-weight: 600; margin: 0 0 18px; border: 0; text-align: left; }
#order-teamcloudmodern .sub-heading span { background: none; padding: 0; color: var(--tc-text-primary); font-size: 1.02rem; font-weight: 600; }
#order-teamcloudmodern .tc-section__title i { color: var(--tc-primary-text); }
#order-teamcloudmodern .field-help-text, #order-teamcloudmodern .text-muted { color: var(--tc-text-secondary) !important; }

/* Mobile categories (sidebar-categories-collapsed) */
#order-teamcloudmodern .sidebar-collapsed { display: none; margin-bottom: 16px; }
@media (max-width: 991.98px) { #order-teamcloudmodern .sidebar-collapsed { display: block; } }

/* =====================================================================
   Catalogue & product configuration (products, configureproduct,
   configureproductdomain, domainoptions, addons, sidebars, promos)
   ===================================================================== */

/* ---------- Small outlined pills ---------- */
#order-teamcloudmodern .tc-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .22rem .7rem; border: 1px solid var(--tc-outline); border-radius: var(--tc-radius-pill); background: var(--tc-surface); color: var(--tc-text-secondary); font-size: .74rem; font-weight: 500; line-height: 1.3; white-space: nowrap; }
#order-teamcloudmodern .tc-pill--primary { border-color: var(--tc-primary); color: var(--tc-primary-text); background: var(--tc-primary-light); }
#order-teamcloudmodern .tc-pill--success { border-color: var(--tc-success); color: var(--tc-success); background: var(--tc-success-light); }
#order-teamcloudmodern .truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- Category navigation (sidebar-categories) ---------- */
#order-teamcloudmodern .tc-catnav { border-radius: var(--tc-radius-lg); overflow: hidden; }
#order-teamcloudmodern .tc-catnav__head { background: transparent; border: 0; padding: 18px 20px 6px; }
#order-teamcloudmodern .tc-catnav__title { display: flex; align-items: center; gap: .55rem; margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-catnav__title .panel-minimise { cursor: pointer; font-size: .8rem; transition: transform var(--tc-transition); }
#order-teamcloudmodern .tc-catnav__title .panel-minimise.minimised { transform: rotate(180deg); }
#order-teamcloudmodern .tc-catnav .list-group { padding: 6px 10px 12px; gap: 2px; }
#order-teamcloudmodern .tc-catnav .list-group-item { display: flex; align-items: center; gap: .6rem; border: 0; border-radius: var(--tc-radius-pill); padding: .55rem .9rem; font-size: .9rem; color: var(--tc-text-primary); background: transparent; }
#order-teamcloudmodern .tc-catnav .list-group-item i { width: 1.1em; text-align: center; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-catnav .list-group-item-action:hover { background: var(--tc-hover); }
#order-teamcloudmodern .tc-catnav .list-group-item.active { background: var(--tc-primary-light); color: var(--tc-primary-text); font-weight: 500; }
#order-teamcloudmodern .tc-catnav .list-group-item.active i { color: var(--tc-primary-text); }
#order-teamcloudmodern .tc-catnav .badge { margin-left: auto; }
#order-teamcloudmodern .tc-catnav .card-body { padding: 8px 20px 16px; font-size: .88rem; }
#order-teamcloudmodern .tc-catnav .card-footer { background: transparent; border-top: 1px solid var(--tc-divider); padding: 12px 20px; font-size: .88rem; }

/* Mobile / compact category bar (sidebar-categories-collapsed + selector) */
#order-teamcloudmodern .tc-catbar { gap: 12px; align-items: stretch; flex-wrap: wrap; }
@media (max-width: 991.98px) { #order-teamcloudmodern .tc-catbar.sidebar-collapsed { display: flex; } }
#order-teamcloudmodern.tc-cart--nosidebar .tc-catbar.sidebar-collapsed { display: flex; }
#order-teamcloudmodern .tc-catbar__panel { flex: 1 1 260px; margin: 0; display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: var(--tc-radius-lg); box-shadow: var(--tc-shadow-sm); }
#order-teamcloudmodern .tc-catbar__panel .tc-catselect__head { background: transparent; border: 0; padding: 0; flex: none; }
#order-teamcloudmodern .tc-catbar__panel .tc-catselect__title { margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--tc-text-secondary); white-space: nowrap; }
#order-teamcloudmodern .tc-catbar__panel .tc-catselect__body { padding: 0; flex: 1 1 auto; min-width: 0; }
#order-teamcloudmodern .tc-catbar__panel .card-footer { display: none; }
#order-teamcloudmodern .tc-catbar__currency { float: none !important; display: flex; align-items: center; }
#order-teamcloudmodern .tc-catbar__currency select { min-width: 120px; }
#order-teamcloudmodern .tc-catnav--select .tc-catselect__head { background: transparent; border: 0; padding: 16px 20px 0; }
#order-teamcloudmodern .tc-catnav--select .tc-catselect__title { margin: 0; font-size: .8rem; font-weight: 600; color: var(--tc-text-secondary); }

/* ---------- Product catalogue (products.tpl, addons.tpl) ---------- */
#order-teamcloudmodern .tc-products { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; align-items: stretch; }
#order-teamcloudmodern .tc-product {
    position: relative; display: flex; flex-direction: column; min-width: 0; padding: 26px 24px 24px;
    background: var(--tc-surface); border: 1.5px solid transparent; border-radius: var(--tc-radius-xl); box-shadow: var(--tc-shadow-md);
    transition: box-shadow var(--tc-transition), transform var(--tc-transition), border-color var(--tc-transition);
}
#order-teamcloudmodern .tc-product:hover { box-shadow: var(--tc-shadow-lg); transform: translateY(-2px); }
[data-theme="dark"] #order-teamcloudmodern .tc-product { border-color: var(--tc-divider); }
#order-teamcloudmodern .tc-product--featured, [data-theme="dark"] #order-teamcloudmodern .tc-product--featured { border-color: var(--tc-primary); box-shadow: var(--tc-shadow-lg); }
@supports (grid-template-rows: subgrid) {
    /* Align name / price / features / button rows across cards for easy comparison */
    #order-teamcloudmodern .tc-products > .tc-product { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
    #order-teamcloudmodern .tc-products > .tc-product > .tc-product__form { display: contents; }
}
#order-teamcloudmodern .tc-product__head { padding-bottom: 14px; }
#order-teamcloudmodern .tc-product__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; min-height: 0; }
#order-teamcloudmodern .tc-product__badges:empty { display: none; }
#order-teamcloudmodern .tc-product__name { margin: 0; font-size: 1.15rem; font-weight: 600; line-height: 1.3; color: var(--tc-text-primary); word-break: break-word; }
#order-teamcloudmodern .tc-product__tagline { margin: .35rem 0 0; color: var(--tc-text-secondary); font-size: .88rem; }
#order-teamcloudmodern .tc-product__pricing { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 16px 0; border-top: 1px solid var(--tc-divider); border-bottom: 1px solid var(--tc-divider); }
#order-teamcloudmodern .tc-product__from { font-size: .74rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-product__pricing .price { font-size: 1.75rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; color: var(--tc-text-primary); word-break: break-word; }
#order-teamcloudmodern .tc-product--featured .tc-product__pricing .price { color: var(--tc-primary-text); }
#order-teamcloudmodern .tc-product__cycle { font-size: .86rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-product__setup { font-size: .78rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-product__save { margin-top: 8px; }
#order-teamcloudmodern .tc-product__desc { padding: 16px 0 20px; font-size: .9rem; color: var(--tc-text-secondary); min-width: 0; }
#order-teamcloudmodern .tc-product__desc p { margin: 0 0 12px; }
#order-teamcloudmodern .tc-product__desc p:last-child { margin-bottom: 0; }
#order-teamcloudmodern .tc-product__desc img { max-width: 100%; height: auto; }
#order-teamcloudmodern .tc-product__features { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
#order-teamcloudmodern .tc-product__features li { display: flex; gap: .6rem; align-items: baseline; color: var(--tc-text-primary); }
#order-teamcloudmodern .tc-product__features li > i { color: var(--tc-primary-text); flex: none; }
#order-teamcloudmodern .tc-product__features .feature-value { font-weight: 600; }
#order-teamcloudmodern .tc-product__label { font-size: .8rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-product__foot { margin-top: auto; align-self: end; }
#order-teamcloudmodern .tc-product__foot .btn { border-radius: var(--tc-radius-pill); }

/* ---------- Configure product ---------- */
#order-teamcloudmodern .tc-cart__main { min-width: 0; }
#order-teamcloudmodern .tc-config-product { display: flex; gap: 18px; align-items: flex-start; }
#order-teamcloudmodern .tc-config-product__text { min-width: 0; flex: 1; }
#order-teamcloudmodern .tc-config-product__title { margin: 0 0 4px; font-size: 1.25rem; font-weight: 600; color: var(--tc-text-primary); }
#order-teamcloudmodern .tc-config-product__desc { color: var(--tc-text-secondary); font-size: .92rem; }
#order-teamcloudmodern .tc-config-product__desc p:last-child { margin-bottom: 0; }
#order-teamcloudmodern .tc-section__hint { display: block; margin-top: 2px; font-size: .78rem; font-weight: 400; font-style: italic; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-section .sub-heading.tc-section__title i { color: var(--tc-primary-text); }

/* Billing cycle cards (progressively replace the native select) */
#order-teamcloudmodern .tc-cycle--cards .tc-cycle__native { display: none; }
#order-teamcloudmodern .tc-cycle__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
#order-teamcloudmodern .tc-cycle__grid[hidden] { display: none; }
#order-teamcloudmodern .tc-cycle__card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px; width: 100%; padding: 14px 16px; text-align: left;
    background: var(--tc-surface-sunken); color: var(--tc-text-primary); border: 1.5px solid var(--tc-divider); border-radius: var(--tc-radius-md);
    cursor: pointer; font: inherit; transition: border-color var(--tc-transition), background-color var(--tc-transition), box-shadow var(--tc-transition);
}
#order-teamcloudmodern .tc-cycle__card:hover { border-color: var(--tc-outline); background: var(--tc-surface); }
#order-teamcloudmodern .tc-cycle__card:focus-visible { outline: 0; box-shadow: var(--tc-focus-ring); }
#order-teamcloudmodern .tc-cycle__card.is-selected { border-color: var(--tc-primary); background: var(--tc-primary-light); }
#order-teamcloudmodern .tc-cycle__top { display: flex; align-items: center; gap: 8px; width: 100%; flex-wrap: wrap; }
#order-teamcloudmodern .tc-cycle__dot { width: 16px; height: 16px; flex: none; border-radius: 50%; border: 1.5px solid var(--tc-outline); background: var(--tc-surface); }
#order-teamcloudmodern .tc-cycle__card.is-selected .tc-cycle__dot { border-color: var(--tc-primary); background: var(--tc-primary); box-shadow: inset 0 0 0 3.5px var(--tc-surface); }
#order-teamcloudmodern .tc-cycle__name { font-weight: 600; font-size: .95rem; }
#order-teamcloudmodern .tc-cycle__save { margin-left: auto; }
#order-teamcloudmodern .tc-cycle__price { font-size: .86rem; color: var(--tc-text-primary); line-height: 1.35; }
#order-teamcloudmodern .tc-cycle__card.is-selected .tc-cycle__price { color: var(--tc-primary-text); font-weight: 500; }
#order-teamcloudmodern .tc-cycle__permonth { font-size: .78rem; color: var(--tc-text-secondary); }

/* Metrics, server fields, configurable options */
#order-teamcloudmodern .tc-metric-list { list-style: none; margin: 0; padding: 0; }
#order-teamcloudmodern .tc-metric-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; align-items: center; padding: 12px 0; border-top: 1px solid var(--tc-divider); }
#order-teamcloudmodern .tc-metric-list__name { font-weight: 500; }
#order-teamcloudmodern .tc-metric-list__price { color: var(--tc-text-secondary); font-size: .9rem; text-align: right; }
#order-teamcloudmodern .tc-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
#order-teamcloudmodern .tc-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 20px; }
#order-teamcloudmodern .tc-option { min-width: 0; }
#order-teamcloudmodern .tc-option--wide { grid-column: 1 / -1; }
#order-teamcloudmodern .tc-option > .form-group > label:first-child { display: block; font-weight: 500; margin-bottom: .5rem; }
@media (max-width: 575.98px) { #order-teamcloudmodern .tc-options, #order-teamcloudmodern .tc-field-grid { grid-template-columns: minmax(0, 1fr); } }
#order-teamcloudmodern .tc-choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
#order-teamcloudmodern .tc-choice { display: flex; align-items: center; gap: .2rem; margin: 0; padding: 12px 14px; border: 1.5px solid var(--tc-divider); border-radius: var(--tc-radius-md); background: var(--tc-surface-sunken); cursor: pointer; font-weight: 400; transition: border-color var(--tc-transition), background-color var(--tc-transition); }
#order-teamcloudmodern .tc-choice:hover { border-color: var(--tc-outline); }
#order-teamcloudmodern .tc-choice:has(.checked) { border-color: var(--tc-primary); background: var(--tc-primary-light); }
#order-teamcloudmodern .tc-choice__text { min-width: 0; }
#order-teamcloudmodern .tc-qty { display: flex; align-items: center; gap: 12px; }
#order-teamcloudmodern .tc-qty .form-control-qty { max-width: 120px; }
#order-teamcloudmodern .tc-qty__unit { color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-range { padding: 4px 4px 0; }
#order-teamcloudmodern .irs { font-family: var(--tc-font); }
#order-teamcloudmodern .irs-line { background: var(--tc-surface-sunken); border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-pill); }
#order-teamcloudmodern .irs-bar, #order-teamcloudmodern .irs-bar-edge { background: var(--tc-primary); border-color: var(--tc-primary); }
#order-teamcloudmodern .irs-single, #order-teamcloudmodern .irs-from, #order-teamcloudmodern .irs-to { background: var(--tc-primary); color: var(--tc-on-primary); border-radius: var(--tc-radius-sm); }
#order-teamcloudmodern .irs-single:after { border-top-color: var(--tc-primary); }
#order-teamcloudmodern .irs-min, #order-teamcloudmodern .irs-max, #order-teamcloudmodern .irs-grid-text { color: var(--tc-text-secondary); background: transparent; }
#order-teamcloudmodern .irs-grid-pol { background: var(--tc-outline); }

/* Addons as toggle cards (.addon-products .panel-addon are JS hooks) */
#order-teamcloudmodern .tc-addons { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
#order-teamcloudmodern .tc-addon {
    display: flex; flex-direction: column; margin: 0; cursor: pointer; overflow: hidden;
    background: var(--tc-surface-sunken); border: 1.5px solid var(--tc-divider); border-radius: var(--tc-radius-md); box-shadow: none;
}
#order-teamcloudmodern .tc-addon:hover { border-color: var(--tc-outline); }
#order-teamcloudmodern .tc-addon.panel-addon-selected { border-color: var(--tc-primary); background: var(--tc-primary-light); }
#order-teamcloudmodern .tc-addon__body { padding: 16px; flex: 1; }
#order-teamcloudmodern .tc-addon__label { display: flex; align-items: center; margin: 0 0 6px; font-weight: 600; cursor: pointer; }
#order-teamcloudmodern .tc-addon__desc { font-size: .86rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-addon__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--tc-divider); }
#order-teamcloudmodern .tc-addon__price { font-weight: 600; font-size: .9rem; }
#order-teamcloudmodern .tc-addon__add { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .8rem; border: 1px solid var(--tc-outline); border-radius: var(--tc-radius-pill); background: var(--tc-surface); color: var(--tc-primary-text); font-size: .8rem; font-weight: 500; }
#order-teamcloudmodern .panel-addon-selected .tc-addon__add { border-color: var(--tc-primary); background: var(--tc-primary); color: var(--tc-on-primary); }
#order-teamcloudmodern .tc-addon-promo { margin-bottom: 14px; }

/* Summary actions */
#order-teamcloudmodern .tc-summary-actions { margin-top: 16px; }
#order-teamcloudmodern .tc-summary-actions .btn { border-radius: var(--tc-radius-pill); }

/* ---------- Product domain selection (configureproductdomain) ---------- */
#order-teamcloudmodern .tc-domain-options { display: grid; gap: 12px; }
#order-teamcloudmodern .tc-domain-option { padding: 14px 18px; background: var(--tc-surface-sunken); border: 1.5px solid var(--tc-divider); border-radius: var(--tc-radius-md); transition: border-color var(--tc-transition), background-color var(--tc-transition); }
#order-teamcloudmodern .tc-domain-option:hover { border-color: var(--tc-outline); }
#order-teamcloudmodern .tc-domain-option.option-selected { border-color: var(--tc-primary); background: var(--tc-surface); box-shadow: var(--tc-shadow-sm); }
#order-teamcloudmodern .tc-domain-option__label { display: flex; align-items: center; gap: .75rem; margin: 0; cursor: pointer; font-weight: 500; }
#order-teamcloudmodern .tc-domain-option.option-selected .tc-domain-option__label { color: var(--tc-primary-text); }
#order-teamcloudmodern .domain-selection-options .domain-input-group { display: none; margin: 14px 0 2px; }
#order-teamcloudmodern .tc-domain-entry { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
#order-teamcloudmodern .tc-domain-entry__field { flex: 1 1 260px; min-width: 0; }
#order-teamcloudmodern .tc-domain-entry__tld { flex: 0 1 150px; min-width: 110px; }
#order-teamcloudmodern .tc-domain-entry__tld--wide { flex-basis: 220px; }
#order-teamcloudmodern .tc-domain-entry__btn { flex: 0 0 auto; min-width: 120px; border-radius: var(--tc-radius-pill); }
@media (max-width: 575.98px) { #order-teamcloudmodern .tc-domain-entry__tld, #order-teamcloudmodern .tc-domain-entry__btn { flex: 1 1 100%; } }
#order-teamcloudmodern .tc-pdomain__free { margin: 16px 0 0; font-size: .86rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-pdomain__free i { color: var(--tc-success); margin-right: .3rem; }

/* Lookup results */
#order-teamcloudmodern .tc-pdomain__primary { text-align: center; }
#order-teamcloudmodern .tc-pdomain .domain-checker-result-headline,
#order-teamcloudmodern .tc-pdomain .domain-lookup-primary-results .headline { font-size: 1.2rem; font-weight: 600; word-wrap: break-word; margin: 6px 0 10px; }
#order-teamcloudmodern .tc-pdomain .domain-lookup-primary-loader { color: var(--tc-text-secondary); margin: 8px 0; }
#order-teamcloudmodern .domain-checker-available { color: var(--tc-success); }
#order-teamcloudmodern .domain-checker-unavailable { color: var(--tc-danger); }
#order-teamcloudmodern .tc-pdomain .domain-contact-support.headline { display: inline-flex; font-size: .95rem; }
#order-teamcloudmodern .tc-pdomain .transfer-eligible, #order-teamcloudmodern .tc-pdomain .transfer-not-eligible { margin: 14px auto; padding: 16px 20px; max-width: 640px; border-radius: var(--tc-radius-md); font-size: .9rem; }
#order-teamcloudmodern .tc-pdomain .transfer-eligible { background: var(--tc-success-light); }
#order-teamcloudmodern .tc-pdomain .transfer-not-eligible { background: var(--tc-surface-sunken); color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-pdomain .domain-invalid { color: var(--tc-text-secondary); font-size: .9rem; }
#order-teamcloudmodern .tc-pdomain .domain-price { display: inline-flex; align-items: baseline; gap: .5rem; margin-top: 6px; padding: .4rem 1rem; border: 1px solid var(--tc-outline); border-radius: var(--tc-radius-pill); font-size: .9rem; color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-pdomain .domain-price .price { font-size: 1.15rem; font-weight: 600; color: var(--tc-text-primary); }
#order-teamcloudmodern .tc-idn { max-width: 520px; margin: 14px auto 0; }
#order-teamcloudmodern .tc-idn__text { font-size: .88rem; color: var(--tc-text-secondary); }

/* Spotlight TLDs */
#order-teamcloudmodern .tc-pdomain .spotlight-tlds { margin: 0 0 24px; }
#order-teamcloudmodern .tc-pdomain .spotlight-tlds-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld-container { float: none; width: auto; padding: 0; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld { position: relative; overflow: hidden; min-height: 118px; padding: 16px 12px; text-align: center; font-weight: 600; font-size: 1.05rem; background: var(--tc-surface); border-radius: var(--tc-radius-lg); box-shadow: var(--tc-shadow-sm); border: 1px solid var(--tc-divider); }
#order-teamcloudmodern .tc-pdomain .spotlight-tld span { display: block; padding: 4px 0; font-weight: 500; font-size: .9rem; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld .btn { margin-top: 6px; padding: .3rem .8rem; font-size: .78rem; border-radius: var(--tc-radius-pill); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld .btn span { display: inline; padding: 0; font-size: inherit; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld .unavailable, #order-teamcloudmodern .tc-pdomain .spotlight-tld .invalid { background: var(--tc-surface-sunken); border-color: var(--tc-divider); color: var(--tc-text-muted); }
#order-teamcloudmodern .tc-pdomain .spotlight-tld-hot, #order-teamcloudmodern .tc-pdomain .spotlight-tld-new, #order-teamcloudmodern .tc-pdomain .spotlight-tld-sale { position: absolute; top: 8px; right: 8px; padding: .1rem .5rem; border-radius: var(--tc-radius-pill); font-size: .62rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
#order-teamcloudmodern .tc-pdomain .spotlight-tld-hot { background: var(--tc-danger-light); color: var(--tc-danger); }
#order-teamcloudmodern .tc-pdomain .spotlight-tld-new { background: var(--tc-success-light); color: var(--tc-success); }
#order-teamcloudmodern .tc-pdomain .spotlight-tld-sale { background: var(--tc-warning-light); color: var(--tc-warning); }

/* Shared add-to-cart pill (domain results) */
#order-teamcloudmodern .tc-pdomain .btn-add-to-cart, #order-teamcloudmodern .tc-domainopts .btn-default { border: 1px solid var(--tc-outline); background: var(--tc-surface); color: var(--tc-primary-text); border-radius: var(--tc-radius-pill); }
#order-teamcloudmodern .tc-pdomain .btn-add-to-cart:hover { border-color: var(--tc-primary); background: var(--tc-primary-light); }
#order-teamcloudmodern .tc-pdomain .btn-add-to-cart.checkout, #order-teamcloudmodern .tc-pdomain .btn-add-to-cart[disabled] { border-color: var(--tc-success); color: var(--tc-success); background: var(--tc-success-light); }

/* Suggestions */
#order-teamcloudmodern .tc-section--flush { padding: 0; overflow: hidden; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .card-header { display: flex; align-items: center; gap: .5rem; padding: 18px 24px; background: transparent; border-bottom: 1px solid var(--tc-divider); font-weight: 600; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .card-header i { color: var(--tc-primary-text); }
#order-teamcloudmodern .tc-pdomain .domain-lookup-suggestions-loader { padding: 28px 20px; text-align: center; color: var(--tc-text-secondary); font-size: .9rem; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .list-group { border-radius: 0; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .list-group-item { padding: 12px 24px; border: 0; border-bottom: 1px solid var(--tc-divider); border-radius: 0; word-wrap: break-word; line-height: 2.1; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .domain { font-weight: 500; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .extension { font-weight: 600; color: var(--tc-primary-text); }
#order-teamcloudmodern .tc-pdomain .suggested-domains .actions { float: right; display: inline-flex; align-items: center; gap: 12px; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .actions .btn { padding: .25rem .85rem; font-size: .8rem; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .price { font-weight: 600; }
#order-teamcloudmodern .tc-pdomain .suggested-domains .promo { padding: .1rem .5rem; border-radius: var(--tc-radius-pill); font-size: .66rem; font-weight: 600; text-transform: uppercase; background: var(--tc-neutral-light); color: var(--tc-text-secondary); }
#order-teamcloudmodern .tc-pdomain .suggested-domains .promo.hot { background: var(--tc-danger-light); color: var(--tc-danger); }
#order-teamcloudmodern .tc-pdomain .suggested-domains .promo.new { background: var(--tc-success-light); color: var(--tc-success); }
#order-teamcloudmodern .tc-pdomain .suggested-domains .promo.sale { background: var(--tc-warning-light); color: var(--tc-warning); }
#order-teamcloudmodern .tc-pdomain .more-suggestions { padding: 14px; background: transparent; border-top: 0; }
#order-teamcloudmodern .tc-pdomain .domain-suggestions-warning { padding: 10px 24px 16px; font-size: .76rem; }
#order-teamcloudmodern .tc-pdomain .domain-suggestions-warning p { margin: 0; }
@media (max-width: 767.98px) {
    #order-teamcloudmodern .tc-pdomain .suggested-domains .list-group-item { text-align: center; }
    #order-teamcloudmodern .tc-pdomain .suggested-domains .actions { float: none; display: flex; justify-content: center; flex-wrap: wrap; }
}
#order-teamcloudmodern .tc-pdomain__continue { margin: 8px 0 24px; }
#order-teamcloudmodern .tc-pdomain__continue .btn { border-radius: var(--tc-radius-pill); min-width: 220px; }

/* ---------- domainoptions.tpl (legacy lookup fragment) ---------- */
#order-teamcloudmodern .tc-domainopts__headline, .tc-domainopts .tc-domainopts__headline { display: flex; align-items: center; justify-content: center; gap: .6rem; margin: 8px 0 16px; font-size: 1.15rem; font-weight: 600; text-align: center; word-wrap: break-word; }
.tc-domainopts .tc-domainopts__primary { margin-bottom: 20px; }
.tc-domainopts .tc-domainopts__suggestions { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; margin-bottom: 20px; }
.tc-domainopts .tc-domainopts__item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); background: var(--tc-surface-sunken); }
.tc-domainopts .tc-domainopts__name { display: flex; align-items: center; margin: 0; min-width: 0; word-break: break-all; font-weight: 500; }
.tc-domainopts .tc-domainopts__price { flex: none; }

/* iCheck "square-green" (used by domainoptions suggestions) mapped to the TeamCloud control */
#order-teamcloudmodern .icheckbox_square-green, #order-teamcloudmodern .iradio_square-green {
    display: inline-block; vertical-align: middle; position: relative; margin: 0 .45rem 0 0; width: 20px; height: 20px;
    background: var(--tc-surface); border: 1.5px solid var(--tc-outline); border-radius: 6px; cursor: pointer;
}
#order-teamcloudmodern .iradio_square-green { border-radius: 50%; }
#order-teamcloudmodern .icheckbox_square-green.hover, #order-teamcloudmodern .iradio_square-green.hover { border-color: var(--tc-primary); }
#order-teamcloudmodern .icheckbox_square-green.checked { border-color: var(--tc-primary); background: var(--tc-primary) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3e%3cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.2l2.3 2.3 4.7-4.9'/%3e%3c/svg%3e") center/12px no-repeat; }
#order-teamcloudmodern .iradio_square-green.checked { border-color: var(--tc-primary); background: var(--tc-primary); box-shadow: inset 0 0 0 4.5px var(--tc-surface); }

/* ---------- Empty / error states ---------- */
#order-teamcloudmodern .tc-cart__empty { max-width: 680px; margin-left: auto; margin-right: auto; }
#order-teamcloudmodern .tc-cart__empty .tc-empty__title { margin: 0 0 .5rem; }
#order-teamcloudmodern .tc-empty__icon--danger { background: var(--tc-danger-light); color: var(--tc-danger); }
#order-teamcloudmodern .tc-cart__empty .btn { border-radius: var(--tc-radius-pill); }

/* ---------- MarketConnect promos & product recommendations ---------- */
.mc-promo, .product-recommendation { margin: 0 0 12px; background: var(--tc-surface); color: var(--tc-text-primary); border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); overflow: hidden; }
.product-recommendation { border-left-width: 4px; }
.mc-promo .header, .product-recommendation .header { display: flex; align-items: center; gap: 12px; padding: 12px 14px; cursor: pointer; min-height: 64px; }
.product-recommendation .header.header-static { cursor: default; }
.mc-promo .header .expander, .product-recommendation .header .expander { order: 1; flex: none; width: 18px; text-align: center; color: var(--tc-primary-text); }
.mc-promo .header .icon { order: 2; flex: none; width: 48px; height: 40px; display: flex; align-items: center; justify-content: center; }
.mc-promo .header .icon img { max-width: 100%; max-height: 100%; }
.mc-promo .header .content, .product-recommendation .header .content { order: 3; flex: 1 1 auto; min-width: 0; }
.mc-promo .header .cta, .product-recommendation .header .cta { order: 4; flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; text-align: right; }
.mc-promo .headline, .product-recommendation .headline { font-weight: 600; font-size: .95rem; }
.mc-promo .tagline, .product-recommendation .tagline { font-size: .82rem; color: var(--tc-text-secondary); }
.mc-promo .price, .product-recommendation .price { font-weight: 600; font-size: .9rem; color: var(--tc-primary-text); }
.mc-promo .btn-add, .product-recommendation .btn-add { display: inline-flex; align-items: stretch; padding: 0; overflow: hidden; border: 0; border-radius: var(--tc-radius-pill); background: var(--tc-primary); color: var(--tc-on-primary); font-size: .8rem; }
.mc-promo .btn-add .text, .product-recommendation .btn-add .text { padding: .3rem .4rem .3rem .85rem; color: var(--tc-on-primary); }
.mc-promo .btn-add .arrow, .product-recommendation .btn-add .arrow { display: inline-flex; align-items: center; padding: .3rem .7rem .3rem .4rem; background: transparent; color: var(--tc-on-primary); }
.mc-promo .body, .product-recommendation .body { display: none; padding: 12px 16px 14px 44px; border-top: 1px solid var(--tc-divider); background: var(--tc-surface-sunken); font-size: .86rem; color: var(--tc-text-secondary); }
.mc-promo .body ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; }
.mc-promo .body i { color: var(--tc-success); margin-right: .3rem; }
.mc-promo em { font-weight: 600; font-style: normal; }
.mc-promo .rotate, .product-recommendation .rotate { transition: transform .2s linear; }
.mc-promo .rotate.down, .product-recommendation .rotate.down { transform: rotate(90deg); }
@media (max-width: 575.98px) {
    .mc-promo .header, .product-recommendation .header { flex-wrap: wrap; }
    .mc-promo .header .cta, .product-recommendation .header .cta { flex: 1 1 100%; flex-direction: row; justify-content: space-between; align-items: center; }
    .mc-promo .body ul { grid-template-columns: minmax(0, 1fr); }
}
.product-recommendations-container { max-height: 600px; overflow-y: auto; margin: 16px 0 8px; }
.product-recommendations { margin: 0 auto; }
.product-added-panel.tc-added { margin-bottom: 16px; box-shadow: none; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); }
.tc-added__body { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; }
.tc-added__info { flex: 1 1 200px; min-width: 0; }
.tc-added__label { display: block; font-size: .78rem; }
.tc-added .product-name { font-weight: 600; }
.tc-added .product-group { color: var(--tc-text-secondary); font-size: .86rem; margin-left: .35rem; }
.tc-added__price { text-align: right; font-size: .9rem; }
.tc-added .product-price { font-weight: 600; display: block; }
.tc-added .product-cycle { color: var(--tc-text-secondary); font-size: .8rem; }
.tc-reco-modal .modal-header { align-items: center; }
.tc-reco-modal .modal-title { font-size: 1.1rem; font-weight: 600; margin: 0; }

/* ---------- Linked accounts (remote auth) ---------- */
#order-teamcloudmodern .tc-linked__or { display: flex; align-items: center; gap: 12px; margin: 20px 0 8px; color: var(--tc-text-secondary); font-size: .85rem; }
#order-teamcloudmodern .tc-linked__or::before, #order-teamcloudmodern .tc-linked__or::after { content: ""; flex: 1; height: 1px; background: var(--tc-divider); }
#order-teamcloudmodern .tc-linked__or span { background: none; padding: 0; color: inherit; }
#order-teamcloudmodern .tc-linked__btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

/* Reference markup keeps <span class="primary-bg-color"> inside headings — neutralise its fill */
#order-teamcloudmodern .tc-section__title .primary-bg-color, #order-teamcloudmodern .sub-heading .primary-bg-color { background: transparent !important; }

/* Category/actions/currency panels: always open on desktop (the cart JS collapses them when no ".container" exists) */
@media (min-width: 992px) {
    #order-teamcloudmodern .card-sidebar .collapsable-card-body, #order-teamcloudmodern .panel-sidebar .collapsable-card-body { display: block !important; }
    #order-teamcloudmodern .tc-catnav__title .panel-minimise { display: none; }
}