/*! TeamCloud Modern — page styles (generated from source/page-css/*.css by build.js; edit the sources) */

/* ===== account.css ===== */
/* ==========================================================================
   TeamCloud Modern — Authentication & account pages (partial, merged into tc-pages.css)
   Tokens only; every selector is prefixed .tc-
   ========================================================================== */

/* Two-factor backup code (two-factor-new-backup-code.tpl) */
.tc-backup-code { margin: 0 0 var(--tc-spacing-md); padding: var(--tc-spacing-md) var(--tc-spacing-lg); text-align: center; }
.tc-backup-code__value { margin-top: .35rem; font-size: 1.45rem; font-weight: 600; letter-spacing: .12em; color: var(--tc-text-primary); word-break: break-all; }

/* Centred result cards (user-verify-email, subscription-manage) */
.tc-result-card { max-width: 560px; margin-left: auto; margin-right: auto; padding: 40px var(--tc-spacing-xl, 32px); }
.tc-result-card > .tc-icon-tile { margin-bottom: var(--tc-spacing-md); }
.tc-result-card__title { font-size: 1.3rem; font-weight: 600; margin: 0 0 .5rem; color: var(--tc-text-primary); }
.tc-result-card .alert { text-align: left; }

/* Table cards nested inside a floating card */
.tc-card .tc-table-card { box-shadow: none; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); margin-bottom: 0; }
.tc-card--flush > .tc-table-card { border: 0; border-top: 1px solid var(--tc-divider); border-radius: 0; }
.tc-card--flush > .tc-card__body > .tc-card__header { padding: 0; border-bottom: 0; }

/* Account switcher (user-switch-account) */
.tc-account-list { display: flex; flex-direction: column; gap: 8px; }
.tc-account-list__item {
    display: flex; align-items: center; gap: var(--tc-spacing-md);
    padding: .8rem 1rem; border-radius: var(--tc-radius-md);
    border: 1px solid var(--tc-divider); background: var(--tc-surface);
    color: var(--tc-text-primary); text-decoration: none;
    transition: background-color var(--tc-transition), border-color var(--tc-transition);
}
.tc-account-list__item:hover, .tc-account-list__item:focus { background: var(--tc-hover); border-color: var(--tc-primary); color: var(--tc-text-primary); text-decoration: none; }
.tc-account-list__item.disabled { opacity: .55; pointer-events: none; }

/* Forced switch target (user-switch-account-forced) */
.tc-switch-target { display: flex; align-items: center; gap: var(--tc-spacing-md); padding: var(--tc-spacing-md); margin-bottom: var(--tc-spacing-lg); text-align: left; }

/* Check grids (email preferences, permissions) */
.tc-check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .75rem var(--tc-spacing-lg); }
.tc-perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.tc-perm { margin: 0; padding: .85rem 1rem .85rem 2.6rem; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); background: var(--tc-surface); transition: border-color var(--tc-transition), background-color var(--tc-transition); }
.tc-perm:hover { border-color: var(--tc-outline); }
.tc-perm .custom-control-label { display: block; cursor: pointer; }
.tc-perm .custom-control-label::before, .tc-perm .custom-control-label::after { top: .15rem; }
.tc-perm:focus-within { border-color: var(--tc-primary); }

/* Contact picker (account-contacts-manage / -new) */
.tc-contact-picker { padding: var(--tc-spacing-md) var(--tc-spacing-lg); }
.tc-contact-picker__label { font-weight: 500; color: var(--tc-primary-text); white-space: nowrap; }
.tc-contact-picker__label i { margin-right: .35rem; }
@media (max-width: 575.98px) { .tc-contact-picker .tc-row { flex-direction: column; align-items: stretch; } }

/* SSO toggle (clientareasecurity) */
.tc-sso-toggle { padding: var(--tc-spacing-md) var(--tc-spacing-lg); margin-bottom: 0; }

/* Two-factor card */
.tc-twofa-card .alert { margin-bottom: 0; }
.tc-twofa-card .tc-card__subtitle .label { margin-left: .25rem; }

/* Users table */
.tc-users-table td { white-space: normal; }
@media (max-width: 767.98px) { .tc-users-table td.text-right { text-align: left !important; } }

/* Email history */
.tc-emails-table tbody tr { cursor: pointer; }

/* Registration */
.tc-register .password-strength-meter .progress { height: 6px; border-radius: var(--tc-radius-pill); background: var(--tc-surface-sunken); }
.tc-register__submit .tc-form-actions { margin-top: var(--tc-spacing-md); }

/* Email popup (viewemail.tpl, standalone page) */
.tc-popup { background: var(--tc-bg-secondary); padding: var(--tc-spacing-md); min-height: 100vh; }
.tc-popup__card { max-width: 900px; margin: 0 auto; }
.tc-popup__attachments { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--tc-spacing-md); }
.tc-popup__body iframe { display: block; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); background: #fff; }


/* ===== services.css ===== */
/* ==========================================================================
   TeamCloud Modern — Services & Domains page partial (merged into tc-pages.css)
   Tokens only. Selectors prefixed with .tc-
   ========================================================================== */

/* Upgrade plan cards (upgrade-configure.tpl) */
.tc-plan {
    display: flex; flex-direction: column; height: 100%;
    padding: 22px; border-radius: var(--tc-radius-lg);
    background: var(--tc-surface-sunken); border: 1px solid var(--tc-divider);
    transition: border-color var(--tc-transition), box-shadow var(--tc-transition);
}
.tc-plan:hover { border-color: var(--tc-outline); }
.tc-plan--recommended { border-color: var(--tc-primary); box-shadow: var(--tc-focus-ring); background: var(--tc-surface); }
.tc-plan__name { font-size: 1.1rem; font-weight: 600; margin: 0 0 .35rem; }
.tc-plan__features { list-style: none; padding: 0; margin: 0 0 18px; flex: 1 1 auto; }
.tc-plan__features li {
    display: flex; justify-content: space-between; gap: 12px;
    padding: .5rem 0; border-bottom: 1px solid var(--tc-divider); font-size: .88rem;
}
.tc-plan__features li:last-child { border-bottom: 0; }
.tc-plan__features li span { color: var(--tc-text-secondary); }

/* Management rows (domain details "doToday", domain addons) */
.tc-domain-manage { display: flex; flex-direction: column; }
.tc-domain-manage__row {
    display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
    padding: 14px 4px; border-bottom: 1px solid var(--tc-divider);
}
.tc-domain-manage__row:last-child { border-bottom: 0; }
.tc-domain-manage__row .tc-grow { min-width: 180px; }

/* Editable tables (DNS records, email forwarders) */
.tc-edit-table td { vertical-align: middle; }
.tc-edit-table .form-control { min-width: 110px; }
.tc-edit-table__new td { background: var(--tc-primary-light); }

/* EPP code reveal */
.tc-epp-code { letter-spacing: .04em; }
.tc-epp-code.is-masked { color: transparent; text-shadow: 0 0 8px var(--tc-text-secondary); user-select: none; }

/* Product details tab container is a card */
.tab-content.tc-card > .tab-pane { padding: 0; }
.tc-module-output .module-client-area,
.module-client-area { text-align: left; }


/* ===== billing.css ===== */
/* ==========================================================================
   TeamCloud Modern — Billing group (invoices, quotes, payments, affiliates)
   Merged into tc-pages.css. Tokens only.
   ========================================================================== */

/* ---------- Navy highlight card (amount + CTA) ---------- */
.tc-highlight-card { padding: 28px; border-radius: var(--tc-radius-xl); background: var(--tc-primary); color: var(--tc-on-primary); box-shadow: var(--tc-shadow-md); }
.tc-highlight-card__label { display: block; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }
.tc-highlight-card__amount { font-size: 2.1rem; font-weight: 600; line-height: 1.2; margin: 6px 0 18px; word-break: break-word; color: var(--tc-on-primary); }
.tc-highlight-card__meta { margin: 0; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .2); }
.tc-highlight-card__meta > div { display: flex; justify-content: space-between; gap: 12px; font-size: .88rem; padding: 4px 0; }
.tc-highlight-card__meta dt { font-weight: 400; opacity: .75; }
.tc-highlight-card__meta dd { margin: 0; font-weight: 500; text-align: right; }
.tc-highlight-card__field-label { font-size: .82rem; font-weight: 500; color: var(--tc-on-primary); opacity: .85; }
.tc-highlight-card .custom-select, .tc-highlight-card .form-control { background-color: #FFFFFF; color: #1F2937; border-color: transparent; }
.tc-highlight-card__cta { background: #FFFFFF; color: #004F96; border-color: #FFFFFF; font-weight: 500; }
.tc-highlight-card__cta:hover, .tc-highlight-card__cta:focus { background: rgba(255, 255, 255, .9); color: #003D75; border-color: transparent; }
.tc-highlight-card__cta.disabled, .tc-highlight-card__cta:disabled { background: rgba(255, 255, 255, .25); color: rgba(255, 255, 255, .8); }
.tc-highlight-card__note { margin-top: 10px; font-size: .8rem; opacity: .75; }
@media (min-width: 992px) { .col-lg-4 > .tc-highlight-card, .col-lg-5 > .tc-highlight-card:not(.h-100) { position: sticky; top: calc(var(--tc-header-h) + 16px); } }

/* ---------- Billing-style tables (mass pay) ---------- */
.tc-bill-table { margin: 0; }
.tc-bill-table th { font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .07em; color: var(--tc-text-muted); border-top: 0; border-bottom: 1px solid var(--tc-divider); padding: 10px 0; }
.tc-bill-table td { padding: 12px 0; border-top: 0; border-bottom: 1px solid var(--tc-divider); font-size: .92rem; }
.tc-bill-table th + th, .tc-bill-table td + td { padding-left: 16px; }
.tc-bill-table__amount { white-space: nowrap; width: 1%; font-variant-numeric: tabular-nums; }
.tc-bill-table__group td { background: var(--tc-surface-sunken); padding: 10px 14px !important; border-bottom: 0; border-radius: var(--tc-radius-sm); }
.tc-bill-table__group i { color: var(--tc-primary-text); margin-right: 6px; }
.tc-bill-table tfoot td { border-bottom: 0; padding-top: 6px; padding-bottom: 6px; color: var(--tc-text-secondary); }
.tc-bill-table tfoot tr:first-child td { padding-top: 16px; }
.tc-bill-table tfoot .tc-bill-table__amount { color: var(--tc-text-primary); }
.tc-bill-table__total td { border-top: 1px solid var(--tc-divider) !important; padding-top: 14px !important; font-weight: 600; font-size: 1.05rem; color: var(--tc-text-primary) !important; }

/* ---------- Invoice summary (payment page) ---------- */
.tc-sum-table { margin: 0 0 12px; }
.tc-sum-table th { font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .07em; color: var(--tc-text-muted); border-top: 0; border-bottom: 1px solid var(--tc-divider); padding: 8px 0 !important; }
.tc-sum-table td { border-top: 0; border-bottom: 1px solid var(--tc-divider); padding: 10px 0 !important; font-size: .88rem; }
.tc-sum-table td + td, .tc-sum-table th + th { padding-left: 12px !important; }
.tc-sum-table__amount { white-space: nowrap; width: 1%; }
.tc-sum-table tfoot td { border-bottom: 0; padding: 5px 0 !important; color: var(--tc-text-secondary); }
.tc-sum-table tfoot tr:first-child td { padding-top: 12px !important; }
.tc-sum-table tfoot .tc-sum-table__amount { color: var(--tc-text-primary); }
.tc-sum-table__total td { border-top: 1px solid var(--tc-divider) !important; padding-top: 10px !important; font-weight: 600; color: var(--tc-text-primary) !important; }
.tc-balance-due { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; padding: 14px 16px; border-radius: var(--tc-radius-md); background: var(--tc-primary); color: var(--tc-on-primary); font-weight: 500; }
.tc-balance-due strong { font-size: 1.15rem; }

/* ---------- Payment forms ---------- */
.tc-pay-form .form-group { margin-bottom: 1.1rem; }
.tc-pay-form .col-form-label, .tc-pay-form .control-label { font-weight: 500; font-size: .88rem; color: var(--tc-text-secondary); }
.tc-pay-form .input-inline-100 { display: inline-block; max-width: 140px; }
.tc-paymethod-grid { display: inline-grid; grid-template-columns: repeat(3, auto) minmax(10em, 30em) auto; align-items: center; column-gap: 12px; row-gap: 4px; font-size: .9rem; }
.two-column-grid.tc-paymethod-grid { grid-template-columns: repeat(2, auto) minmax(10em, 30em) auto; }
.tc-paymethod-grid > div { margin: 4px 0; }
.tc-paymethod-grid > div > label { margin: 0; font-weight: 400; cursor: pointer; }
.tc-paymethod-grid i { font-size: 1.25rem; color: var(--tc-primary-text); }
#frmPayment .paymethod-info { cursor: pointer; }
#frmPayment .paymethod-info label { font-weight: 400; cursor: pointer; }
.tc-paymethod-new { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--tc-divider); }
.tc-paymethod-new label { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
@media (max-width: 575.98px) { .tc-paymethod-grid { display: grid; grid-template-columns: auto auto 1fr; } .tc-paymethod-grid > div:nth-child(5n+4), .tc-paymethod-grid > div:nth-child(5n) { grid-column: 3; } }

.tc-choice-list { display: flex; flex-direction: column; gap: 8px; }
.tc-choice { display: flex !important; align-items: flex-start; gap: 10px; margin: 0 !important; padding: 12px 14px; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); cursor: pointer; transition: border-color var(--tc-transition), background-color var(--tc-transition); }
.tc-choice:hover { border-color: var(--tc-outline); background: var(--tc-hover); }
.tc-choice__text { display: flex; flex-direction: column; min-width: 0; font-size: .9rem; color: var(--tc-text-primary); }
.tc-choice__meta { font-size: .82rem; color: var(--tc-text-secondary); }
.tc-type-choices { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; }
.tc-type-choice { margin: 0 !important; padding: 10px 14px; border: 1px solid var(--tc-divider); border-radius: var(--tc-radius-md); gap: 8px; cursor: pointer; }
.tc-type-choice:hover { border-color: var(--tc-outline); }

/* ---------- Payment methods list ---------- */
.tc-paymethods-table th { font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .07em; color: var(--tc-text-muted); border-top: 0; }
.tc-paymethods-table td { vertical-align: middle; }
.tc-paymethods-table th:first-child, .tc-paymethods-table td:first-child { padding-left: 24px; }
.tc-paymethods-table th:last-child, .tc-paymethods-table td:last-child { padding-right: 24px; }
.tc-paymethods-table__icon { width: 56px; }
.tc-paymethods-table .tc-table-actions { flex-wrap: wrap; }

/* ---------- 3-D Secure / forwarding ---------- */
.tc-3ds .submit-3d { display: block; margin: 0 auto; }
.tc-forward { max-width: 560px; margin: 0 auto; padding: 40px 32px; }
.tc-forward__progress { height: 6px; max-width: 240px; margin-left: auto; margin-right: auto; border-radius: var(--tc-radius-pill); background: var(--tc-surface-sunken); }
.tc-forward__progress .progress-bar { background-color: var(--tc-primary); }
.tc-forward #frmPayment input[type="submit"], .tc-forward #frmPayment button { margin-top: 8px; }

/* ---------- Affiliates ---------- */
.tc-aff-stats { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: 24px; }
.tc-copy-field .form-control { background: var(--tc-surface-sunken); font-size: .88rem; }
.tc-aff-links { overflow-x: auto; }
.tc-aff-links img { max-width: 100%; height: auto; }
.tc-aff-signup__art { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; max-width: 260px; margin-left: auto; border-radius: var(--tc-radius-xl); background: var(--tc-primary-light); color: var(--tc-primary-text); font-size: 5rem; }


/* ===== support.css ===== */
/* ==========================================================================
   TeamCloud Modern — Support, content & misc page partial (merged into tc-pages.css)
   Tokens only. Selectors prefixed with .tc- (plus WHMCS hook classes where noted)
   ========================================================================== */

/* ---------- Shared helpers ---------- */
.tc-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; }
.tc-section-head__title { font-size: 1.1rem; font-weight: 600; margin: 0; letter-spacing: -.01em; }
.tc-hero--compact { padding: clamp(24px, 3vw, 40px); margin-bottom: 24px; }
.tc-hero--compact .tc-hero__title { font-size: clamp(1.4rem, 1.1rem + 1.1vw, 2rem); }
.tc-cat.card-body { padding: 20px; flex: none; }
.tc-cat .show-on-card-hover { opacity: 0; transition: opacity var(--tc-transition); }
.tc-cat:hover .show-on-card-hover, .kb-article-item:hover .show-on-card-hover, .tc-cat .show-on-card-hover:focus { opacity: 1; }
.tc-article-list .tc-empty { list-style: none; }
.tc-kb-search .form-control:focus { box-shadow: var(--tc-focus-ring); border-color: var(--tc-focus); }

/* ---------- Tickets list ---------- */
.tc-ticket-link { display: flex; flex-direction: column; gap: 2px; color: var(--tc-text-primary); text-decoration: none; }
.tc-ticket-link:hover { color: var(--tc-primary-text); text-decoration: none; }
.tc-ticket-link .ticket-number { font-size: .78rem; color: var(--tc-text-muted); }
.tc-ticket-link .ticket-subject { font-weight: 400; }
.tc-ticket-link .ticket-subject.unread { font-weight: 600; }
.tc-ticket-link .ticket-subject.unread::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--tc-primary); margin-right: .45rem; vertical-align: middle; }
.label.status-custom { color: #fff; border-color: transparent; }

/* ---------- Open ticket: departments ---------- */
.tc-dept {
    display: flex; align-items: flex-start; gap: 14px; padding: 18px;
    border-radius: var(--tc-radius-lg); background: var(--tc-surface-sunken); border: 1px solid var(--tc-divider);
    color: var(--tc-text-primary); text-decoration: none; transition: all var(--tc-transition);
}
.tc-dept:hover, .tc-dept:focus { background: var(--tc-surface); border-color: var(--tc-primary); box-shadow: var(--tc-shadow-md); color: var(--tc-text-primary); text-decoration: none; }
.tc-dept__body { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; min-width: 0; }
.tc-dept__name { font-weight: 600; }
.tc-dept__desc { font-size: .86rem; color: var(--tc-text-secondary); }
.tc-dept__arrow { color: var(--tc-text-muted); margin-top: 4px; transition: transform var(--tc-transition); }
.tc-dept:hover .tc-dept__arrow { transform: translateX(3px); color: var(--tc-primary-text); }
#autoAnswerSuggestions { padding: 20px; }

/* ---------- View ticket ---------- */
.tc-ticket-status { background: var(--tc-surface); border-color: var(--tc-outline); }
.tc-ticket-meta { font-size: .92rem; font-weight: 500; }
.tc-reply__head .tc-avatar { flex: none; }
.tc-reply .requestor-badge { margin-top: 2px; }
.tc-reply__body > p:last-child { margin-bottom: 0; }
.tc-reply__body blockquote { border-left: 3px solid var(--tc-divider); padding-left: 1rem; color: var(--tc-text-secondary); }
.tc-reply__body pre { white-space: pre-wrap; }
.tc-attachment-list { list-style: none; padding: 0; margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tc-attachment-list .caption { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tc-chip--disabled { opacity: .6; cursor: default; }
.ticket-reply .rating span.star::before,
.ticket-reply .rating-done .star::before {
    content: "\f005"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 300;
}
.ticket-reply .rating span.star.active::before, .ticket-reply .rating span.star:hover::before,
.ticket-reply .rating span.star:hover ~ span.star::before, .ticket-reply .rating-done .star.active::before { font-weight: 900; }
.ticket-reply .rating-done > span:first-child { direction: rtl; unicode-bidi: bidi-override; display: inline-block; }
.ticket-reply .rating-done .star { color: var(--tc-outline); font-size: 1rem; }
.ticket-reply .rating-done .star.active { color: var(--tc-warning); }
.ticket-reply .rated { font-size: .82rem; color: var(--tc-text-secondary); }

/* ---------- Ticket feedback ---------- */
.tc-rate-scale { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tc-rate-scale__end { font-size: .78rem; color: var(--tc-text-secondary); padding: 0 4px; }
.tc-rate-scale__item { position: relative; margin: 0; cursor: pointer; }
.tc-rate-scale__item input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.tc-rate-scale__item span {
    display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
    border-radius: 50%; border: 1px solid var(--tc-outline); background: var(--tc-surface);
    font-size: .88rem; font-weight: 500; color: var(--tc-text-primary); transition: all var(--tc-transition);
}
.tc-rate-scale__item:hover span { border-color: var(--tc-primary); color: var(--tc-primary-text); }
.tc-rate-scale__item input:checked + span { background: var(--tc-primary); border-color: var(--tc-primary); color: var(--tc-on-primary); }
.tc-rate-scale__item input:focus-visible + span { box-shadow: var(--tc-focus-ring); }

/* ---------- Knowledgebase / announcements articles ---------- */
.tc-article { padding: clamp(24px, 3vw, 40px); }
.tc-article__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid var(--tc-divider); }
.tc-article__title { font-size: clamp(1.35rem, 1.1rem + .9vw, 1.85rem); font-weight: 600; letter-spacing: -.015em; margin: .35rem 0 0; }
.tc-helpful { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 28px; padding: 16px 20px; border-radius: var(--tc-radius-md); background: var(--tc-surface-sunken); border: 1px solid var(--tc-divider); }
.tc-helpful__q { font-weight: 500; }
.tc-announcement__title { font-size: 1.1rem; font-weight: 600; margin: 0 0 .25rem; }
.tc-announcement__title a { color: var(--tc-text-primary); }
.tc-announcement__title a:hover { color: var(--tc-primary-text); text-decoration: none; }
.tc-announcement .show-on-hover { opacity: 0; transition: opacity var(--tc-transition); }
.tc-announcement:hover .show-on-hover, .tc-announcement .show-on-hover:focus { opacity: 1; }
.tc-announcement__excerpt { font-size: .95rem; color: var(--tc-text-secondary); }
.tc-announcement__excerpt > :last-child { margin-bottom: 0; }

/* ---------- Downloads ---------- */
.tc-dl-type img { max-width: 18px; max-height: 18px; padding: 0 !important; }

/* ---------- Markdown guide (modal) ---------- */
.tc-md-guide__title { font-size: .95rem; font-weight: 600; margin: 18px 0 8px; }
.tc-md-guide__title:first-child { margin-top: 0; }
.tc-md-guide pre { font-size: .82rem; border: 1px solid var(--tc-divider); }

/* ---------- Server status ---------- */
.tc-server-table td { vertical-align: middle; }
.tc-port .tc-status-dot { vertical-align: middle; }
.tc-port img { max-height: 16px; }
.tc-issue .tc-prose { font-size: .95rem; }

/* ---------- Homepage ---------- */
.tc-group-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; height: 100%; }
.tc-group-card__title { font-size: 1.05rem; font-weight: 600; margin: 6px 0 0; }
.tc-group-card__text { color: var(--tc-text-secondary); font-size: .9rem; margin: 0 0 8px; flex: 1 1 auto; }
.tc-group-card .btn { margin-top: auto; }
.tc-quick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 16px; }
.tc-quick {
    display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 20px;
    border-radius: var(--tc-radius-lg); background: var(--tc-surface); box-shadow: var(--tc-shadow-md);
    color: var(--tc-text-primary); text-decoration: none; transition: all var(--tc-transition);
}
[data-theme="dark"] .tc-quick { border: 1px solid var(--tc-divider); }
.tc-quick:hover, .tc-quick:focus { box-shadow: var(--tc-shadow-lg); transform: translateY(-2px); color: var(--tc-text-primary); text-decoration: none; }
.tc-quick__label { font-weight: 500; font-size: .95rem; }

/* ---------- Error pages ---------- */
.tc-error__title { font-size: 1.3rem; font-weight: 600; margin: 18px 0 8px; }

/* ---------- Server calculator ---------- */
.tc-calc-field { margin-bottom: 20px; }
.tc-calc-field:last-child { margin-bottom: 0; }
.tc-calc-field__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.tc-calc-field__label { font-weight: 500; margin: 0; }
.tc-calc-field__unit { font-size: .8rem; color: var(--tc-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.tc-calc-field__control { display: flex; align-items: center; gap: 16px; }
.tc-calc-number { flex: 0 0 96px; max-width: 96px; text-align: center; }
.tc-calc-number-group { max-width: 180px; }
.tc-calc-range { flex: 1 1 auto; min-width: 0; -webkit-appearance: none; appearance: none; height: 4px; border-radius: 4px; background: var(--tc-divider); outline: none; }
.tc-calc-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--tc-primary); border: 3px solid var(--tc-surface); box-shadow: 0 0 0 1px var(--tc-primary); cursor: pointer; }
.tc-calc-range::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; background: var(--tc-primary); border: 3px solid var(--tc-surface); box-shadow: 0 0 0 1px var(--tc-primary); cursor: pointer; }
.tc-calc-range:focus-visible::-webkit-slider-thumb { box-shadow: var(--tc-focus-ring); }
.tc-calc-group { padding: 18px 0; border-bottom: 1px solid var(--tc-divider); }
.tc-calc-group:first-of-type { padding-top: 0; }
.tc-calc-group:last-child { border-bottom: 0; padding-bottom: 0; }
.tc-calc-group__label { font-weight: 500; margin-bottom: 10px; }
.tc-calc-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.tc-calc-choice { position: relative; margin: 0; cursor: pointer; }
.tc-calc-choice input, .tc-calc-option > input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.tc-calc-choice span {
    display: inline-flex; align-items: center; gap: .45rem; padding: .5rem 1rem; border-radius: var(--tc-radius-pill);
    border: 1px solid var(--tc-outline); background: var(--tc-surface); font-size: .9rem; color: var(--tc-text-primary); transition: all var(--tc-transition);
}
.tc-calc-choice:hover span { border-color: var(--tc-primary); }
.tc-calc-choice input:checked + span { border-color: var(--tc-primary); background: var(--tc-primary-light); color: var(--tc-primary-text); font-weight: 500; }
.tc-calc-choice input:focus-visible + span { box-shadow: var(--tc-focus-ring); }
.tc-calc-toggle { display: inline-flex; align-items: center; gap: .5rem; margin: 0; cursor: pointer; font-size: .9rem; }
.tc-calc-toggle input { width: 18px; height: 18px; accent-color: var(--tc-primary); }
.tc-calc-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.tc-calc-option {
    position: relative; display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 14px 16px; cursor: pointer;
    border-radius: var(--tc-radius-md); border: 1px solid var(--tc-divider); background: var(--tc-surface-sunken); transition: all var(--tc-transition);
}
.tc-calc-option:hover { border-color: var(--tc-outline); }
.tc-calc-option__check {
    flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 6px; border: 1px solid var(--tc-outline); background: var(--tc-surface);
    display: inline-flex; align-items: center; justify-content: center; transition: all var(--tc-transition);
}
.tc-calc-option > input:checked + .tc-calc-option__check { background: var(--tc-primary); border-color: var(--tc-primary); }
.tc-calc-option > input:checked + .tc-calc-option__check::after { content: "\f00c"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 900; font-size: .7rem; color: var(--tc-on-primary); }
.tc-calc-option > input:focus-visible + .tc-calc-option__check { box-shadow: var(--tc-focus-ring); }
.tc-calc-option:has(> input:checked) { border-color: var(--tc-primary); background: var(--tc-primary-light); }
.tc-calc-option.is-disabled { opacity: .55; cursor: not-allowed; }
.tc-calc-option.is-locked { cursor: default; margin-top: 4px; }
.tc-calc-option__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tc-calc-option__title { font-weight: 500; font-size: .92rem; }
.tc-calc-option__desc { font-size: .8rem; color: var(--tc-text-secondary); }
.tc-calc-summary { position: sticky; top: 88px; }
.tc-calc-recap { list-style: none; padding: 0; margin: 0 0 16px; }
.tc-calc-recap li { display: flex; justify-content: space-between; gap: 12px; padding: .45rem 0; font-size: .88rem; border-bottom: 1px solid var(--tc-divider); }
.tc-calc-recap li span { color: var(--tc-text-secondary); }
.tc-calc-recap li strong { font-weight: 500; text-align: right; }
.tc-calc-result { margin-bottom: 16px; }
.tc-calc-result__empty { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border-radius: var(--tc-radius-md); background: var(--tc-surface-sunken); color: var(--tc-text-secondary); font-size: .85rem; }
.tc-calc-result__empty i { color: var(--tc-primary-text); margin-top: 3px; }
#pricesummary:not(:empty) + .tc-calc-result__empty { display: none; }
/* Normalise the legacy inline-styled markup returned by pricesummary.php */
#pricesummary { overflow-x: auto; }
#pricesummary h1 { font-family: var(--tc-font) !important; font-size: 1rem !important; line-height: 1.3 !important; font-weight: 600 !important; color: var(--tc-text-primary) !important; text-align: left !important; margin: 0 0 10px !important; }
#pricesummary table { width: 100% !important; border: 0 !important; border-collapse: collapse !important; font-size: .85rem; }
#pricesummary th { background: transparent !important; color: var(--tc-text-muted) !important; border: 0 !important; border-bottom: 1px solid var(--tc-divider) !important; font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; padding: 6px 0 !important; }
#pricesummary td { border-color: var(--tc-divider) !important; padding: 7px 0 !important; color: var(--tc-text-primary); vertical-align: top; }
#pricesummary td + td, #pricesummary th + th { text-align: right !important; padding-left: 12px !important; }
#pricesummary br { display: none; }
.tc-calc-actions { display: flex; flex-direction: column; gap: 10px; }
.tc-calc-actions__row { display: flex; gap: 8px; justify-content: space-between; align-items: center; }
.tc-calc-actions__row .btn-default { flex: 1 1 auto; }
@media (max-width: 991.98px) { .tc-calc-summary { position: static; } }
@media (max-width: 575.98px) {
    .tc-calc-field__control { flex-wrap: wrap; }
    .tc-calc-number { flex-basis: 100%; max-width: none; }
}

/* ---------- SSL store ---------- */
.tc-chip-nav { display: flex; flex-wrap: wrap; gap: 8px; }
.tc-ssl-hero .tc-eyebrow i { margin-right: .3rem; }
.tc-price-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.tc-price-card {
    display: flex; flex-direction: column; gap: 18px; padding: 24px; border-radius: var(--tc-radius-xl);
    background: var(--tc-surface); box-shadow: var(--tc-shadow-md); transition: box-shadow var(--tc-transition), transform var(--tc-transition);
}
[data-theme="dark"] .tc-price-card { border: 1px solid var(--tc-divider); }
.tc-price-card:hover { box-shadow: var(--tc-shadow-lg); transform: translateY(-2px); }
.tc-price-card__head { display: flex; gap: 14px; align-items: center; }
.tc-price-card__name { font-size: 1.05rem; font-weight: 600; margin: 0; line-height: 1.3; }
.tc-price-card__group { font-size: .82rem; color: var(--tc-text-secondary); margin: 2px 0 0; }
.tc-price-card__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; padding: 16px 0; border-top: 1px solid var(--tc-divider); border-bottom: 1px solid var(--tc-divider); }
.tc-price-card__amount { font-size: 1.85rem; font-weight: 700; letter-spacing: -.02em; color: var(--tc-text-primary); line-height: 1.1; }
.tc-price-card__cur { font-size: .95rem; font-weight: 500; color: var(--tc-text-secondary); margin: 0 .15rem; }
.tc-price-card__cycle { font-size: .88rem; color: var(--tc-text-secondary); }
.tc-price-card__features { font-size: .88rem; color: var(--tc-text-secondary); list-style: none; padding: 0; margin: 0; }
.tc-price-card__features ul { list-style: none; padding: 0; margin: 0; }
.tc-price-card__features li { position: relative; padding: .35rem 0 .35rem 1.5rem; }
.tc-price-card__features li::before { content: "\f00c"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 300; position: absolute; left: 0; top: .35rem; color: var(--tc-success); }
.tc-price-card__features > :last-child { margin-bottom: 0; }

