/* cPanel Extended - Client Hub (Part 7) */
.cpxt { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, Arial, sans-serif; }
.cpxt__wrap { max-width: 1100px; margin: 0 auto; padding: 18px 14px; }
.cpxt__hero { display:flex; align-items:flex-end; justify-content:space-between; gap: 14px; margin-bottom: 12px; }
.cpxt__h1 { margin:0; font-size: 26px; font-weight: 800; color:#0b1220; letter-spacing: -.3px; }
.cpxt__sub { margin:6px 0 0 0; color:#64748b; font-size: 14px; }
.cpxt__pill { background: rgba(16,185,129,.12); color:#065f46; border:1px solid rgba(16,185,129,.22); padding: 6px 12px; border-radius: 999px; font-weight: 800; font-size: 12px; }

.cpxt__alert { background:#ecfeff; border:1px solid #a5f3fc; color:#0e7490; padding: 10px 12px; border-radius: 14px; font-weight: 700; margin-bottom: 12px; }

.cpxt__grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-top: 12px; }
@media (max-width: 860px){ .cpxt__grid { grid-template-columns: 1fr; } }

.cpxt__card { background:#fff; border:1px solid #e5e7eb; border-radius: 16px; box-shadow: 0 10px 30px rgba(15,23,42,.06); overflow:hidden; }
.cpxt__card--pad { padding: 14px; }
.cpxt__card-h { font-weight: 850; color:#0b1220; padding: 14px; border-bottom: 1px solid #f1f5f9; }
.cpxt__muted { color:#64748b; font-size: 13px; }

.cpxt__tablewrap { overflow:auto; }
.cpxt__table { width: 100%; border-collapse: collapse; min-width: 720px; }
.cpxt__table th { text-align:left; font-size: 12px; color:#475569; padding: 10px 12px; border-bottom: 1px solid #e5e7eb; }
.cpxt__table td { padding: 12px; border-bottom: 1px solid #f1f5f9; font-size: 13px; vertical-align: top; }
.cpxt__right { text-align:right; }
.cpxt__svc-title { font-weight: 850; color:#0b1220; }
.cpxt__svc-sub { color:#64748b; font-size: 12px; margin-top: 4px; }

.cpxt__badge { display:inline-block; padding: 4px 10px; border-radius: 999px; background:#f1f5f9; color:#0f172a; font-weight: 800; font-size: 12px; }
.cpxt__badge--on { background: rgba(16,185,129,.14); color:#065f46; border: 1px solid rgba(16,185,129,.22); }

.cpxt__btn { display:inline-block; text-decoration:none; background:#0b1220; color:#fff; padding: 9px 12px; border-radius: 12px; font-weight: 850; font-size: 13px; }
.cpxt__btn:hover { opacity: .94; }
.cpxt__btn--ghost { background: #f8fafc; border: 1px solid #e5e7eb; color:#0b1220; cursor:not-allowed; }

.cpxt__actions { display:flex; flex-wrap:wrap; gap: 10px; margin-top: 10px; }

.cpxt__empty { padding: 14px; color:#64748b; }

.cpxt__list { list-style:none; padding: 0; margin: 10px 0 0 0; }
.cpxt__li { padding: 12px; border: 1px solid #f1f5f9; border-radius: 14px; margin-top: 10px; }
.cpxt__li-title { font-weight: 850; color:#0b1220; margin-bottom: 8px; }
.cpxt__tags { display:flex; flex-wrap:wrap; gap: 8px; }
.cpxt__tag { font-size: 12px; font-weight: 800; background:#f8fafc; border: 1px solid #e5e7eb; padding: 4px 10px; border-radius: 999px; color:#0b1220; }