:root {
    --connect-primary: #176BFF;
    --connect-primary-dark: #0B45C9;
    --connect-accent: #16C7E8;
    --connect-navy: #081B33;
    --connect-navy-deep: #041020;
    --connect-surface: #F5F8FF;
    --connect-white: #FFFFFF;
    --connect-text: #20304A;
    --connect-muted: #66748D;
    --connect-border: #DFE7F5;
    --connect-success: #14A36D;
    --connect-shadow-sm: 0 12px 34px rgba(8, 27, 51, .08);
    --connect-shadow-md: 0 24px 70px rgba(4, 16, 32, .16);
    --connect-radius-sm: 12px;
    --connect-radius-md: 20px;
    --connect-radius-lg: 30px;
}

html {
    scroll-behavior: smooth;
}

body.connect-theme {
    color: var(--connect-text);
    background: var(--connect-white);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

body.connect-theme a {
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

body.connect-theme .container {
    max-width: 1200px;
}

.connect-full-bleed {
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

.connect-offer-bar {
    background: linear-gradient(90deg, var(--connect-primary-dark), var(--connect-primary), var(--connect-accent));
    color: var(--connect-white);
    font-size: 13px;
    font-weight: 700;
}

.connect-offer-inner {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    text-align: center;
}

.connect-offer-inner span,
.connect-offer-inner a {
    color: inherit;
}

.connect-offer-inner i {
    margin-right: 6px;
}

.connect-offer-inner a {
    padding-left: 20px;
    border-left: 1px solid rgba(255, 255, 255, .35);
    text-decoration: none;
}

.connect-contact-strip {
    background: var(--connect-navy-deep);
    color: #C7D6EF;
    font-size: 12px;
}

.connect-contact-strip .container {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.connect-contact-strip-left,
.connect-contact-strip-right {
    display: flex;
    align-items: center;
    gap: 22px;
}

.connect-contact-strip a {
    color: inherit;
    text-decoration: none;
}

.connect-contact-strip a:hover {
    color: var(--connect-white);
}

.connect-contact-strip i {
    margin-right: 7px;
    color: var(--connect-accent);
}

.connect-header {
    position: relative;
    z-index: 100;
    background: var(--connect-white);
    box-shadow: 0 10px 30px rgba(8, 27, 51, .06);
}

.connect-header.connect-header-scrolled {
    position: sticky;
    top: 0;
    box-shadow: 0 16px 42px rgba(8, 27, 51, .13);
}

.connect-brand-row {
    min-height: 86px;
    padding: 10px 0;
}

.connect-brand-logo {
    width: auto !important;
    height: 58px !important;
    max-width: 330px !important;
    object-fit: contain;
}

.connect-header .navbar-light .navbar-nav .nav-link,
.connect-header .toolbar .nav-link {
    color: var(--connect-navy);
}

.connect-header .search .form-control {
    min-width: 240px;
    border-color: var(--connect-border);
    border-radius: 0 var(--connect-radius-sm) var(--connect-radius-sm) 0;
}

.connect-header .search .btn {
    border-color: var(--connect-border);
    border-radius: var(--connect-radius-sm) 0 0 var(--connect-radius-sm);
}

.connect-header-cta {
    min-height: 44px;
    align-items: center;
    padding: 0 20px;
    margin-left: 16px;
    border-radius: 999px;
    background: var(--connect-primary);
    color: var(--connect-white) !important;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(23, 107, 255, .24);
}

.connect-header-cta:hover {
    background: var(--connect-primary-dark);
    transform: translateY(-1px);
}

.main-navbar-wrapper {
    background: var(--connect-white);
    border-top: 1px solid var(--connect-border);
    border-bottom: 1px solid var(--connect-border);
}

.main-navbar-wrapper .navbar-nav > li > a {
    color: var(--connect-text) !important;
    font-size: 14px;
    font-weight: 700;
}

.main-navbar-wrapper .navbar-nav > li > a:hover,
.main-navbar-wrapper .navbar-nav > li.active > a {
    color: var(--connect-primary) !important;
}

.master-breadcrumb {
    background: var(--connect-surface);
    border-bottom: 1px solid var(--connect-border);
}

.template-homepage .master-breadcrumb,
.template-homepage #main-body > .container > .row > .primary-content > .header-lined {
    display: none;
}

#main-body {
    min-height: 520px;
}

.template-homepage #main-body,
.template-homepage #main-body > .container,
.template-homepage #main-body > .container > .row,
.template-homepage #main-body .primary-content {
    max-width: none;
    width: 100%;
    padding: 0;
    margin: 0;
}

.connect-home {
    overflow: hidden;
}

.connect-hero {
    position: relative;
    isolation: isolate;
    color: var(--connect-white);
    background:
        radial-gradient(circle at 76% 14%, rgba(22, 199, 232, .28), transparent 28%),
        radial-gradient(circle at 92% 75%, rgba(23, 107, 255, .2), transparent 24%),
        linear-gradient(135deg, var(--connect-navy-deep), var(--connect-navy) 55%, #0B2D60);
    padding: 94px 0 92px;
}

.connect-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .4;
    background-image:
        linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, black, transparent 90%);
}

.connect-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr);
    align-items: center;
    gap: 58px;
}

.connect-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    color: #D9E8FF;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.connect-kicker i {
    color: var(--connect-accent);
}

.connect-kicker-light {
    color: var(--connect-primary);
    background: rgba(23, 107, 255, .08);
    border-color: rgba(23, 107, 255, .14);
}

.connect-hero h1 {
    max-width: 760px;
    margin: 24px 0 20px;
    color: var(--connect-white);
    font-size: clamp(42px, 5.2vw, 68px);
    font-weight: 850;
    line-height: 1.02;
    letter-spacing: -.045em;
}

.connect-hero-copy > p {
    max-width: 690px;
    margin: 0;
    color: #C9D8F2;
    font-size: 18px;
    line-height: 1.72;
}

.connect-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.btn-connect-primary,
.btn-connect-ghost,
.btn-connect-light,
.btn-connect-cta-ghost,
.btn-connect-outline-dark,
.btn-connect-plan,
.btn-connect-domain-transfer {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 24px;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none !important;
}

.btn-connect-primary {
    border: 1px solid var(--connect-primary);
    background: linear-gradient(135deg, var(--connect-primary), var(--connect-primary-dark));
    color: var(--connect-white) !important;
    box-shadow: 0 14px 34px rgba(23, 107, 255, .32);
}

.btn-connect-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 42px rgba(23, 107, 255, .42);
}

.btn-connect-ghost {
    border: 1px solid rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .08);
    color: var(--connect-white) !important;
}

.btn-connect-ghost:hover {
    background: rgba(255, 255, 255, .14);
}

.connect-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 27px;
    color: #D8E6FA;
    font-size: 13px;
    font-weight: 700;
}

.connect-trust-row i {
    margin-right: 7px;
    color: var(--connect-accent);
}

.connect-hero-visual {
    position: relative;
    min-height: 500px;
    display: grid;
    place-items: center;
}

.connect-orbit {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
}

.connect-orbit-one {
    width: 450px;
    height: 450px;
}

.connect-orbit-two {
    width: 330px;
    height: 330px;
    border-style: dashed;
    animation: connect-spin 28s linear infinite;
}

.connect-server-stack {
    position: relative;
    width: min(100%, 460px);
}

.connect-server-card-main {
    position: relative;
    z-index: 2;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, .19);
    border-radius: 28px;
    background: linear-gradient(160deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, .055));
    box-shadow: 0 38px 90px rgba(0, 0, 0, .3);
    backdrop-filter: blur(16px);
}

.connect-server-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
    color: #DDEAFF;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .09em;
}

.connect-online-dot {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #28E395;
    box-shadow: 0 0 0 7px rgba(40, 227, 149, .12);
}

.connect-server-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 24px 0;
}

.connect-server-metrics div {
    padding: 18px 14px;
    border-radius: 17px;
    background: rgba(1, 9, 25, .32);
}

.connect-server-metrics small,
.connect-server-metrics strong {
    display: block;
}

.connect-server-metrics small {
    margin-bottom: 8px;
    color: #9FB3D4;
    font-size: 11px;
}

.connect-server-metrics strong {
    color: var(--connect-white);
    font-size: 22px;
}

.connect-server-bars {
    display: flex;
    align-items: flex-end;
    gap: 9px;
    height: 106px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(1, 9, 25, .28);
}

.connect-server-bars i {
    flex: 1;
    min-width: 0;
    border-radius: 8px 8px 3px 3px;
    background: linear-gradient(to top, var(--connect-primary), var(--connect-accent));
}

.connect-server-bars i:nth-child(1) { height: 42%; }
.connect-server-bars i:nth-child(2) { height: 67%; }
.connect-server-bars i:nth-child(3) { height: 52%; }
.connect-server-bars i:nth-child(4) { height: 84%; }
.connect-server-bars i:nth-child(5) { height: 72%; }

.connect-floating-card {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 210px;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 17px;
    background: rgba(255, 255, 255, .96);
    color: var(--connect-navy);
    box-shadow: var(--connect-shadow-md);
}

.connect-floating-card > i {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(23, 107, 255, .11);
    color: var(--connect-primary);
    font-size: 18px;
}

.connect-floating-card b,
.connect-floating-card small {
    display: block;
}

.connect-floating-card b {
    font-size: 13px;
}

.connect-floating-card small {
    margin-top: 3px;
    color: var(--connect-muted);
    font-size: 11px;
}

.connect-floating-speed {
    top: -42px;
    right: -26px;
}

.connect-floating-support {
    left: -48px;
    bottom: -34px;
}

.connect-domain-box {
    position: relative;
    z-index: 10;
    display: grid;
    grid-template-columns: minmax(230px, .8fr) minmax(440px, 1.4fr);
    align-items: center;
    gap: 24px 30px;
    margin-top: 72px;
    margin-bottom: -154px;
    padding: 28px 30px;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 24px;
    background: var(--connect-white);
    color: var(--connect-text);
    box-shadow: var(--connect-shadow-md);
}

.connect-domain-copy span,
.connect-domain-copy strong {
    display: block;
}

.connect-domain-copy span {
    margin-bottom: 5px;
    color: var(--connect-primary);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.connect-domain-copy strong {
    color: var(--connect-navy);
    font-size: 21px;
    line-height: 1.3;
}

.connect-domain-form .input-group {
    padding: 5px;
    border: 1px solid var(--connect-border);
    border-radius: 15px;
    background: var(--connect-surface);
}

.connect-domain-form .form-control {
    height: 52px;
    border: 0;
    background: transparent;
    font-size: 16px;
    box-shadow: none;
}

.connect-domain-form .btn {
    min-height: 48px;
}

.btn-connect-domain-transfer {
    min-height: 48px;
    margin-left: 6px;
    border: 1px solid var(--connect-border);
    background: var(--connect-white);
    color: var(--connect-navy);
}

.connect-tlds {
    grid-column: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: -10px;
}

.connect-tlds span {
    display: inline-flex;
    gap: 7px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--connect-surface);
    color: var(--connect-muted);
    font-size: 12px;
}

.connect-tlds b {
    color: var(--connect-navy);
}

.connect-proof-strip {
    padding: 102px 0 26px;
    background: var(--connect-white);
}

.connect-proof-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.connect-proof-grid > div {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 18px 16px;
    border-radius: 16px;
}

.connect-proof-grid > div > i {
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: rgba(23, 107, 255, .09);
    color: var(--connect-primary);
}

.connect-proof-grid strong,
.connect-proof-grid small {
    display: block;
}

.connect-proof-grid strong {
    color: var(--connect-navy);
    font-size: 14px;
}

.connect-proof-grid small {
    margin-top: 3px;
    color: var(--connect-muted);
    font-size: 11px;
}

.connect-section {
    padding: 102px 0;
}

.connect-section-heading {
    max-width: 790px;
    margin: 0 auto 52px;
    text-align: center;
}

.connect-section-heading > span,
.connect-faq-intro > span,
.connect-cta-inner > div > span {
    color: var(--connect-primary);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.connect-section-heading h2,
.connect-why h2,
.connect-faq h2,
.connect-cta h2 {
    margin: 12px 0 16px;
    color: var(--connect-navy);
    font-size: clamp(34px, 4vw, 48px);
    font-weight: 850;
    line-height: 1.08;
    letter-spacing: -.035em;
}

.connect-section-heading p,
.connect-why-copy > p,
.connect-faq-intro > p {
    margin: 0;
    color: var(--connect-muted);
    font-size: 17px;
    line-height: 1.72;
}

.connect-solution-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.connect-service-card {
    position: relative;
    min-height: 292px;
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow: hidden;
    border: 1px solid var(--connect-border);
    border-radius: var(--connect-radius-md);
    background: var(--connect-white);
    color: var(--connect-text) !important;
    text-decoration: none !important;
    box-shadow: 0 10px 34px rgba(8, 27, 51, .045);
}

.connect-service-card::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -90px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(23, 107, 255, .05);
    transition: transform .3s ease;
}

.connect-service-card:hover {
    transform: translateY(-7px);
    border-color: rgba(23, 107, 255, .3);
    box-shadow: var(--connect-shadow-sm);
}

.connect-service-card:hover::after {
    transform: scale(1.35);
}

.connect-service-card-featured {
    background: linear-gradient(150deg, var(--connect-navy), #0B2D60);
    border-color: transparent;
    color: var(--connect-white) !important;
}

.connect-service-number {
    position: absolute;
    top: 26px;
    right: 28px;
    color: rgba(23, 107, 255, .25);
    font-size: 28px;
    font-weight: 900;
}

.connect-service-card-featured .connect-service-number {
    color: rgba(255, 255, 255, .2);
}

.connect-service-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-bottom: 24px;
    border-radius: 17px;
    background: rgba(23, 107, 255, .1);
    color: var(--connect-primary);
    font-size: 22px;
}

.connect-service-card-featured .connect-service-icon {
    background: rgba(255, 255, 255, .11);
    color: var(--connect-accent);
}

.connect-service-card h3 {
    margin: 0 0 12px;
    color: var(--connect-navy);
    font-size: 21px;
    font-weight: 850;
}

.connect-service-card-featured h3 {
    color: var(--connect-white);
}

.connect-service-card p {
    margin: 0 0 24px;
    color: var(--connect-muted);
    font-size: 14px;
    line-height: 1.7;
}

.connect-service-card-featured p {
    color: #C7D7F0;
}

.connect-service-card strong {
    position: relative;
    z-index: 1;
    margin-top: auto;
    color: var(--connect-primary);
    font-size: 13px;
}

.connect-service-card-featured strong {
    color: var(--connect-accent);
}

.connect-pricing-section {
    position: relative;
    padding: 108px 0 92px;
    background:
        radial-gradient(circle at 15% 0, rgba(22, 199, 232, .16), transparent 23%),
        linear-gradient(145deg, var(--connect-navy-deep), var(--connect-navy));
}

.connect-heading-light h2 {
    color: var(--connect-white);
}

.connect-heading-light p {
    color: #BFCDE4;
}

.connect-heading-light > span {
    color: var(--connect-accent);
}

.connect-pricing-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 38px;
}

.connect-category-tabs,
.connect-billing-toggle {
    display: inline-flex;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
}

.connect-category-tabs button,
.connect-billing-toggle button {
    min-height: 43px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #C5D4EC;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.connect-category-tabs button.is-active,
.connect-billing-toggle button.is-active {
    background: var(--connect-white);
    color: var(--connect-navy);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .16);
}

.connect-pricing-panel[hidden] {
    display: none !important;
}

.connect-plan-card {
    position: relative;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    padding: 34px 30px 30px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 23px;
    background: var(--connect-white);
    color: var(--connect-text);
    box-shadow: 0 25px 70px rgba(0, 0, 0, .18);
}

.connect-plan-featured {
    transform: translateY(-12px);
    border: 2px solid var(--connect-accent);
    box-shadow: 0 32px 88px rgba(22, 199, 232, .18);
}

.connect-plan-badge {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: max-content;
    padding: 7px 15px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--connect-primary), var(--connect-accent));
    color: var(--connect-white);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.connect-plan-head > span {
    color: var(--connect-primary);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.connect-plan-head h3 {
    margin: 10px 0 10px;
    color: var(--connect-navy);
    font-size: 27px;
    font-weight: 850;
}

.connect-plan-head p {
    min-height: 47px;
    margin: 0;
    color: var(--connect-muted);
    font-size: 13px;
    line-height: 1.65;
}

.connect-price-row {
    display: flex;
    align-items: flex-end;
    margin-top: 28px;
    color: var(--connect-navy);
}

.connect-price-row small {
    margin: 0 7px 9px 0;
    font-size: 15px;
    font-weight: 850;
}

.connect-price-row strong {
    font-size: 48px;
    line-height: .95;
    font-weight: 900;
    letter-spacing: -.05em;
}

.connect-price-row span {
    margin: 0 0 7px 7px;
    color: var(--connect-muted);
    font-size: 13px;
}

.connect-price-detail {
    min-height: 20px;
    margin: 10px 0 22px;
    color: var(--connect-muted);
    font-size: 11px;
}

.connect-plan-card ul {
    display: grid;
    gap: 12px;
    margin: 0 0 28px;
    padding: 22px 0 0;
    border-top: 1px solid var(--connect-border);
    list-style: none;
}

.connect-plan-card li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #4E5C74;
    font-size: 13px;
    line-height: 1.45;
}

.connect-plan-card li i {
    margin-top: 2px;
    color: var(--connect-success);
}

.btn-connect-plan {
    width: 100%;
    margin-top: auto;
    border: 1px solid var(--connect-primary);
    background: var(--connect-primary);
    color: var(--connect-white) !important;
}

.btn-connect-plan:hover {
    background: var(--connect-primary-dark);
    transform: translateY(-2px);
}

.connect-price-disclaimer {
    max-width: 900px;
    margin: 14px auto 0;
    color: #AABBD4;
    font-size: 11px;
    line-height: 1.65;
    text-align: center;
}

.connect-why {
    background: var(--connect-white);
}

.connect-why-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(480px, 1.1fr);
    align-items: center;
    gap: 78px;
}

.connect-check-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-top: 34px;
}

.connect-check-grid > div {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--connect-border);
    border-radius: 16px;
    background: var(--connect-surface);
}

.connect-check-grid > div > i {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(20, 163, 109, .1);
    color: var(--connect-success);
    font-size: 12px;
}

.connect-check-grid strong,
.connect-check-grid small {
    display: block;
}

.connect-check-grid strong {
    color: var(--connect-navy);
    font-size: 14px;
}

.connect-check-grid small {
    margin-top: 4px;
    color: var(--connect-muted);
    font-size: 11px;
    line-height: 1.5;
}

.connect-dashboard-mockup {
    overflow: hidden;
    border: 1px solid var(--connect-border);
    border-radius: 26px;
    background: var(--connect-white);
    box-shadow: var(--connect-shadow-md);
    transform: perspective(1200px) rotateY(-5deg) rotateX(2deg);
}

.connect-mockup-top {
    height: 52px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 18px;
    border-bottom: 1px solid var(--connect-border);
    background: #FBFCFF;
}

.connect-mockup-top span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #D7DEEA;
}

.connect-mockup-top b {
    margin-left: 10px;
    color: var(--connect-muted);
    font-size: 11px;
}

.connect-mockup-body {
    min-height: 390px;
    display: grid;
    grid-template-columns: 88px 1fr;
}

.connect-mockup-body aside {
    display: grid;
    align-content: start;
    gap: 18px;
    padding: 28px 20px;
    background: var(--connect-navy);
}

.connect-mockup-body aside i {
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
}

.connect-mockup-body aside i:first-child {
    background: var(--connect-accent);
}

.connect-mockup-body main {
    padding: 30px;
    background: var(--connect-surface);
}

.connect-mockup-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.connect-mockup-welcome span,
.connect-mockup-welcome strong {
    display: block;
    border-radius: 999px;
    background: #CBD6E8;
}

.connect-mockup-welcome span { width: 150px; height: 13px; }
.connect-mockup-welcome strong { width: 70px; height: 30px; background: var(--connect-primary); }

.connect-mockup-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.connect-mockup-stats i {
    height: 88px;
    border-radius: 16px;
    background: var(--connect-white);
    box-shadow: 0 8px 24px rgba(8, 27, 51, .05);
}

.connect-mockup-chart {
    height: 185px;
    display: flex;
    align-items: flex-end;
    gap: 13px;
    margin-top: 18px;
    padding: 24px;
    border-radius: 18px;
    background: var(--connect-white);
}

.connect-mockup-chart span {
    flex: 1;
    border-radius: 8px 8px 2px 2px;
    background: linear-gradient(to top, var(--connect-primary), var(--connect-accent));
}

.connect-mockup-chart span:nth-child(1) { height: 34%; }
.connect-mockup-chart span:nth-child(2) { height: 54%; }
.connect-mockup-chart span:nth-child(3) { height: 43%; }
.connect-mockup-chart span:nth-child(4) { height: 72%; }
.connect-mockup-chart span:nth-child(5) { height: 63%; }
.connect-mockup-chart span:nth-child(6) { height: 88%; }

.connect-comparison {
    background: var(--connect-surface);
}

.connect-benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.connect-benefit-grid article {
    padding: 28px;
    border: 1px solid var(--connect-border);
    border-radius: 18px;
    background: var(--connect-white);
}

.connect-benefit-grid i {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin-bottom: 20px;
    border-radius: 14px;
    background: rgba(23, 107, 255, .09);
    color: var(--connect-primary);
    font-size: 19px;
}

.connect-benefit-grid h3 {
    color: var(--connect-navy);
    font-size: 18px;
    font-weight: 850;
}

.connect-benefit-grid p {
    margin: 0;
    color: var(--connect-muted);
    font-size: 13px;
    line-height: 1.65;
}

.connect-faq {
    padding: 100px 0;
    background: var(--connect-white);
}

.connect-faq-grid {
    display: grid;
    grid-template-columns: minmax(300px, .75fr) minmax(0, 1.25fr);
    gap: 80px;
}

.connect-faq-intro {
    align-self: start;
}

.btn-connect-outline-dark {
    margin-top: 28px;
    border: 1px solid var(--connect-border);
    background: var(--connect-white);
    color: var(--connect-navy) !important;
}

.btn-connect-outline-dark:hover {
    border-color: var(--connect-primary);
    color: var(--connect-primary) !important;
}

.connect-faq-list {
    display: grid;
    gap: 14px;
}

.connect-faq-item {
    overflow: hidden;
    border: 1px solid var(--connect-border);
    border-radius: 17px;
    background: var(--connect-white);
}

.connect-faq-item.is-open {
    border-color: rgba(23, 107, 255, .3);
    box-shadow: var(--connect-shadow-sm);
}

.connect-faq-item > button {
    width: 100%;
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 22px;
    border: 0;
    background: transparent;
    color: var(--connect-navy);
    font-size: 15px;
    font-weight: 850;
    text-align: left;
    cursor: pointer;
}

.connect-faq-item > button i {
    transition: transform .2s ease;
}

.connect-faq-item.is-open > button i {
    transform: rotate(45deg);
}

.connect-faq-answer {
    padding: 0 22px 22px;
}

.connect-faq-answer p {
    margin: 0;
    color: var(--connect-muted);
    font-size: 13px;
    line-height: 1.7;
}

.connect-product-groups {
    background: var(--connect-surface);
}

.connect-group-card {
    height: 100%;
    display: block;
    padding: 28px;
    border: 1px solid var(--connect-border);
    border-radius: 18px;
    background: var(--connect-white);
    color: var(--connect-text) !important;
    text-decoration: none !important;
}

.connect-group-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--connect-shadow-sm);
}

.connect-group-card h3 {
    color: var(--connect-navy);
    font-size: 20px;
}

.connect-group-card p {
    min-height: 45px;
    color: var(--connect-muted);
    font-size: 13px;
}

.connect-group-card span {
    color: var(--connect-primary);
    font-size: 13px;
    font-weight: 800;
}

.connect-cta {
    padding: 72px 0;
    background: linear-gradient(110deg, var(--connect-primary-dark), var(--connect-primary), #0B87E8);
}

.connect-cta-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 45px;
}

.connect-cta-inner > div > span {
    color: #DDF8FF;
}

.connect-cta h2 {
    max-width: 730px;
    margin-bottom: 0;
    color: var(--connect-white);
    font-size: clamp(30px, 3.5vw, 44px);
}

.connect-cta-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

.btn-connect-light {
    background: var(--connect-white);
    color: var(--connect-primary) !important;
}

.btn-connect-cta-ghost {
    border: 1px solid rgba(255, 255, 255, .4);
    background: rgba(255, 255, 255, .08);
    color: var(--connect-white) !important;
}

.connect-footer {
    padding: 76px 0 0;
    background: var(--connect-navy-deep);
    color: #AEBBD0;
}

.connect-footer-top {
    display: grid;
    grid-template-columns: 1.45fr .7fr .7fr 1fr;
    gap: 54px;
    padding-bottom: 55px;
}

.connect-footer-logo {
    width: auto;
    height: 58px;
    max-width: 310px;
    object-fit: contain;
}

.connect-footer-brand p {
    max-width: 410px;
    margin: 24px 0 0;
    color: #AEBBD0;
    font-size: 13px;
    line-height: 1.75;
}

.connect-social-list {
    margin-top: 22px;
}

.connect-footer h4 {
    margin: 4px 0 20px;
    color: var(--connect-white);
    font-size: 14px;
    font-weight: 850;
}

.connect-footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.connect-footer-column li,
.connect-footer-contact li {
    margin-bottom: 12px;
}

.connect-footer a {
    color: #AEBBD0;
    font-size: 13px;
    text-decoration: none;
}

.connect-footer a:hover {
    color: var(--connect-white);
}

.connect-footer-contact li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.connect-footer-contact li > i {
    width: 18px;
    margin-top: 4px;
    color: var(--connect-accent);
}

.connect-footer-security {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 9px 12px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    color: #D3DFF0;
    font-size: 11px;
}

.connect-footer-bottom {
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid rgba(255, 255, 255, .09);
}

.connect-footer-bottom p,
.connect-footer-bottom a,
.connect-footer-bottom button {
    color: #8291A9;
    font-size: 11px;
}

.connect-footer-locale {
    display: flex;
    align-items: center;
    gap: 18px;
}

.connect-footer-locale .btn {
    padding: 0;
    background: transparent;
}

.connect-whatsapp-float {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1050;
    min-height: 56px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    border-radius: 999px;
    background: #20B766;
    color: var(--connect-white) !important;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none !important;
    box-shadow: 0 16px 38px rgba(32, 183, 102, .32);
}

.connect-whatsapp-float:hover {
    transform: translateY(-3px);
    background: #159B52;
}

.connect-whatsapp-float i {
    font-size: 22px;
}

/* Client area and cart */
.connect-theme .card,
.connect-theme .panel,
.connect-theme .list-group,
.connect-theme .form-control,
.connect-theme .input-group-text,
.connect-theme .btn {
    border-radius: var(--connect-radius-sm);
}

.connect-theme .card,
.connect-theme .panel {
    border-color: var(--connect-border);
    box-shadow: 0 8px 26px rgba(8, 27, 51, .045);
}

.connect-theme .btn-primary,
#order-standard_cart .btn-primary,
#order-standard_cart .btn-success {
    border-color: var(--connect-primary) !important;
    background: var(--connect-primary) !important;
}

.connect-theme .btn-primary:hover,
#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-success:hover {
    border-color: var(--connect-primary-dark) !important;
    background: var(--connect-primary-dark) !important;
}

.connect-theme .sidebar .list-group-item.active,
.connect-theme .sidebar .list-group-item.active:hover {
    border-color: var(--connect-primary);
    background: var(--connect-primary);
}

.connect-theme .header-lined h1 {
    color: var(--connect-navy);
    font-weight: 850;
}

#order-standard_cart .products .product,
#order-standard_cart .view-cart-items,
#order-standard_cart .summary-container,
#order-standard_cart .domain-checker-container,
#order-standard_cart .sub-heading span {
    border-color: var(--connect-border) !important;
    border-radius: 16px !important;
}

#order-standard_cart .products .product header,
#order-standard_cart .view-cart-items-header {
    background: var(--connect-navy) !important;
}

#order-standard_cart .product-info,
#order-standard_cart .summary-container {
    color: var(--connect-text);
}

@keyframes connect-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media (max-width: 1199.98px) {
    .connect-header-cta { display: none !important; }
    .connect-hero-grid { grid-template-columns: 1fr 430px; gap: 30px; }
    .connect-floating-speed { right: 0; }
    .connect-floating-support { left: 0; }
    .connect-footer-top { grid-template-columns: 1.3fr .7fr .7fr; }
    .connect-footer-contact { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .connect-brand-logo { height: 52px !important; max-width: 280px !important; }
    .connect-hero { padding-top: 72px; }
    .connect-hero-grid { grid-template-columns: 1fr; }
    .connect-hero-copy { text-align: center; }
    .connect-hero h1,
    .connect-hero-copy > p { margin-left: auto; margin-right: auto; }
    .connect-hero-actions,
    .connect-trust-row { justify-content: center; }
    .connect-hero-visual { min-height: 430px; }
    .connect-domain-box { grid-template-columns: 1fr; margin-top: 35px; margin-bottom: -148px; }
    .connect-tlds { grid-column: 1; }
    .connect-proof-grid { grid-template-columns: repeat(2, 1fr); }
    .connect-solution-grid { grid-template-columns: repeat(2, 1fr); }
    .connect-plan-featured { transform: none; }
    .connect-why-grid { grid-template-columns: 1fr; }
    .connect-dashboard-mockup { transform: none; }
    .connect-benefit-grid { grid-template-columns: repeat(2, 1fr); }
    .connect-faq-grid { grid-template-columns: 1fr; gap: 44px; }
    .connect-cta-inner { flex-direction: column; text-align: center; }
    .connect-footer-top { grid-template-columns: 1.2fr 1fr 1fr; }
    .connect-footer-contact { grid-column: 1 / -1; }
    .main-navbar-wrapper .navbar-collapse { padding: 14px 0; }
}

@media (max-width: 767.98px) {
    .connect-offer-inner { min-height: 44px; font-size: 11px; }
    .connect-offer-inner a { display: none; }
    .connect-contact-strip-left { display: none; }
    .connect-contact-strip-right { width: 100%; justify-content: space-between; }
    .connect-brand-row { min-height: 74px; }
    .connect-brand-logo { height: 44px !important; max-width: 225px !important; }
    .connect-hero { padding: 58px 0 72px; }
    .connect-hero h1 { font-size: 40px; }
    .connect-hero-copy > p { font-size: 16px; }
    .connect-hero-actions { flex-direction: column; align-items: stretch; }
    .connect-trust-row { flex-direction: column; gap: 10px; }
    .connect-hero-visual { min-height: 380px; }
    .connect-orbit-one { width: 350px; height: 350px; }
    .connect-orbit-two { width: 260px; height: 260px; }
    .connect-server-stack { width: 92%; }
    .connect-server-card-main { padding: 20px; }
    .connect-floating-card { min-width: 184px; padding: 11px 12px; }
    .connect-floating-speed { top: -26px; right: -6px; }
    .connect-floating-support { bottom: -25px; left: -6px; }
    .connect-domain-box { padding: 22px; border-radius: 20px; margin-bottom: -174px; }
    .connect-domain-form .input-group { display: block; padding: 0; border: 0; background: transparent; }
    .connect-domain-form .form-control { width: 100%; border: 1px solid var(--connect-border); border-radius: 12px; background: var(--connect-surface); }
    .connect-domain-form .input-group-append { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
    .connect-domain-form .btn { width: 100%; margin: 0; border-radius: 11px !important; }
    .connect-tlds { overflow-x: auto; flex-wrap: nowrap; }
    .connect-proof-strip { padding-top: 134px; }
    .connect-proof-grid { grid-template-columns: 1fr; }
    .connect-section { padding: 78px 0; }
    .connect-section-heading { margin-bottom: 38px; }
    .connect-section-heading h2,
    .connect-why h2,
    .connect-faq h2 { font-size: 33px; }
    .connect-section-heading p,
    .connect-why-copy > p,
    .connect-faq-intro > p { font-size: 15px; }
    .connect-solution-grid { grid-template-columns: 1fr; }
    .connect-service-card { min-height: 260px; }
    .connect-pricing-section { padding: 82px 0 70px; }
    .connect-pricing-controls { flex-direction: column; align-items: stretch; }
    .connect-category-tabs,
    .connect-billing-toggle { width: 100%; }
    .connect-category-tabs button,
    .connect-billing-toggle button { flex: 1; padding: 0 10px; font-size: 11px; }
    .connect-check-grid { grid-template-columns: 1fr; }
    .connect-dashboard-mockup { margin: 0 -8px; }
    .connect-mockup-body { grid-template-columns: 60px 1fr; min-height: 320px; }
    .connect-mockup-body main { padding: 18px; }
    .connect-mockup-stats { gap: 8px; }
    .connect-mockup-stats i { height: 64px; }
    .connect-mockup-chart { height: 150px; padding: 16px; }
    .connect-benefit-grid { grid-template-columns: 1fr; }
    .connect-faq { padding: 78px 0; }
    .connect-cta { padding: 58px 0; }
    .connect-cta-actions { width: 100%; flex-direction: column; }
    .connect-footer { padding-top: 58px; }
    .connect-footer-top { grid-template-columns: 1fr 1fr; gap: 36px 24px; }
    .connect-footer-brand,
    .connect-footer-contact { grid-column: 1 / -1; }
    .connect-footer-bottom { flex-direction: column; justify-content: center; padding: 22px 0; text-align: center; }
    .connect-footer-locale { flex-wrap: wrap; justify-content: center; }
    .connect-whatsapp-float { width: 56px; height: 56px; padding: 0; justify-content: center; }
    .connect-whatsapp-float span { display: none; }
}

@media (max-width: 420px) {
    .connect-hero h1 { font-size: 35px; }
    .connect-server-metrics { gap: 7px; }
    .connect-server-metrics div { padding: 13px 8px; }
    .connect-server-metrics strong { font-size: 18px; }
    .connect-floating-card { min-width: 166px; }
    .connect-floating-card > i { width: 36px; height: 36px; }
    .connect-footer-top { grid-template-columns: 1fr; }
    .connect-footer-brand,
    .connect-footer-contact { grid-column: auto; }
}


/* CONNECT Cliente v2.1.0 — alinhamento visual com connecthospedagemdesites.com.br */
body.connect-theme{
    --connect-primary:#0B74FF;
    --connect-primary-dark:#075BD4;
    --connect-accent:#16C7E8;
    --connect-navy:#07172F;
    --connect-navy-deep:#020817;
    --connect-surface:#F4F7FB;
    color:#17243A;
    background:#F6F8FC;
}
.connect-account-bar{background:#020713;color:#B7C8DD;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px}
.connect-account-bar-inner{min-height:36px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.connect-account-bar .btn{padding:4px 0;background:transparent;color:#B7C8DD;border:0;box-shadow:none}
.connect-account-user{display:flex;align-items:center;gap:8px}.connect-account-user a{color:#fff;font-weight:700}.connect-admin-return{margin-left:10px;color:#63C7FF!important}
.connect-header{position:sticky;top:0;z-index:1030;background:#020817!important;border-bottom:1px solid rgba(73,137,218,.22);box-shadow:0 14px 36px rgba(0,0,0,.22)}
.connect-header.connect-header-scrolled{box-shadow:0 18px 46px rgba(0,0,0,.32)}
.connect-brand-row{min-height:74px!important;padding:8px 0!important;background:radial-gradient(circle at 8% 50%,rgba(8,105,255,.16),transparent 20%),#020817!important}
.connect-brand-container{display:flex;align-items:center;gap:28px}.connect-brand{margin:0!important;padding:0!important}.connect-brand-logo{height:50px!important;width:auto!important;max-width:235px!important;filter:contrast(1.08) saturate(1.18) brightness(1.04) drop-shadow(0 5px 16px rgba(0,100,255,.18))}
.connect-public-nav{align-items:center;gap:6px;margin-left:auto}.connect-public-nav a{padding:9px 11px;border-radius:9px;color:#D8E5F4!important;font-size:12px;font-weight:700;text-decoration:none}.connect-public-nav a:hover,.connect-public-nav a:focus{color:#fff!important;background:rgba(20,119,255,.12)}
.connect-header-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.connect-header-whatsapp,.connect-client-btn,.connect-cart-btn,.connect-menu-toggle{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(77,144,225,.35);border-radius:10px;background:rgba(5,22,49,.72);color:#EAF4FF!important;text-decoration:none!important}.connect-header-whatsapp,.connect-client-btn{padding:0 14px}.connect-header-whatsapp{color:#B9F6D0!important;border-color:rgba(46,205,111,.26)}.connect-cart-btn,.connect-menu-toggle{width:42px;padding:0}.connect-header-actions a:hover,.connect-menu-toggle:hover{background:rgba(14,89,184,.32);border-color:rgba(96,178,255,.55)}.connect-cart-btn .badge{position:absolute;transform:translate(12px,-13px);font-size:9px}
.connect-native-nav{min-height:48px;padding:0;background:#061126!important;border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(78,141,219,.16)}.connect-native-nav .navbar-nav>li>a{color:#CBD9EA!important;font-size:12px!important;font-weight:700!important;padding:14px 10px!important}.connect-native-nav .navbar-nav>li>a:hover,.connect-native-nav .navbar-nav>li.active>a{color:#fff!important;background:rgba(14,116,255,.10)}.connect-native-nav .dropdown-menu{border:1px solid #DCE5F1;border-radius:12px;box-shadow:0 18px 45px rgba(5,19,42,.15)}
.connect-breadcrumb{background:#F2F6FB!important;border-bottom:1px solid #DDE6F1!important}.connect-breadcrumb .breadcrumb{margin-bottom:0;padding:10px 0;background:transparent;font-size:12px}
.template-homepage .connect-breadcrumb,.template-homepage #main-body>.container>.row>.primary-content>.header-lined{display:none}
.template-homepage #main-body,.template-homepage #main-body>.container,.template-homepage #main-body>.container>.row,.template-homepage #main-body .primary-content{max-width:none;width:100%;padding:0;margin:0}
.connect-client-home{overflow:hidden}.connect-client-hero{position:relative;color:#fff;padding:76px 0 88px;background:radial-gradient(circle at 78% 12%,rgba(24,171,255,.18),transparent 25%),radial-gradient(circle at 96% 72%,rgba(41,76,255,.18),transparent 24%),linear-gradient(135deg,#020817,#061B3B 55%,#092D63)}.connect-client-hero:before{content:"";position:absolute;inset:0;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 90%)}
.connect-client-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 460px;align-items:center;gap:64px}.connect-client-hero-copy h1{max-width:720px;margin:18px 0 16px;color:#fff;font-size:clamp(40px,4.7vw,64px);font-weight:850;line-height:1.03;letter-spacing:-.045em}.connect-client-hero-copy>p{max-width:650px;margin:0;color:#B9CBE1;font-size:18px;line-height:1.65}.connect-client-hero-actions{display:flex;gap:12px;margin-top:26px}.btn-connect-primary,.btn-connect-secondary{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0 20px;border-radius:10px;font-weight:800}.btn-connect-primary{border:0;background:linear-gradient(180deg,#168BFF,#0868EA);color:#fff!important;box-shadow:0 13px 28px rgba(5,104,239,.25)}.btn-connect-secondary{border:1px solid rgba(119,174,235,.37);background:rgba(4,20,47,.46);color:#E8F4FF!important}.connect-client-trust{display:flex;gap:20px;flex-wrap:wrap;margin-top:24px;color:#AFC4DC;font-size:12px;font-weight:700}.connect-client-trust i{margin-right:6px;color:#38C4FF}
.connect-client-console{border:1px solid rgba(100,167,243,.24);border-radius:18px;background:rgba(6,26,58,.76);box-shadow:0 30px 70px rgba(0,0,0,.28);overflow:hidden;transform:rotate(-1deg)}.connect-console-top{height:42px;display:flex;align-items:center;gap:6px;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.08);color:#7893B3;font-size:10px;font-weight:800}.connect-console-top i{width:7px;height:7px;border-radius:50%;background:#1E71E8}.connect-console-top i:nth-child(2){background:#17B6E1}.connect-console-top i:nth-child(3){background:#3AD58C}.connect-console-top span{margin-left:auto;letter-spacing:.12em}.connect-console-content{display:grid;grid-template-columns:64px 1fr;min-height:280px}.connect-console-side{padding:18px 12px;background:rgba(1,10,26,.55);border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;align-items:center;gap:16px}.connect-console-side b{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#0B74FF;color:#fff}.connect-console-side i{width:28px;height:6px;border-radius:4px;background:#163A69}.connect-console-main{padding:24px}.connect-console-status{display:flex;align-items:center;justify-content:space-between}.connect-console-status span{color:#6F89A8;font-size:10px;font-weight:900;letter-spacing:.1em}.connect-console-status strong{padding:5px 9px;border-radius:999px;background:rgba(24,193,113,.12);color:#58E39E;font-size:10px}.connect-console-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.connect-console-metrics div{padding:14px;border:1px solid rgba(88,145,215,.16);border-radius:10px;background:rgba(2,13,31,.38)}.connect-console-metrics small{display:block;color:#728CAA;font-size:9px;text-transform:uppercase}.connect-console-metrics b{display:block;margin-top:4px;font-size:20px}.connect-console-chart{height:112px;display:flex;align-items:flex-end;gap:10px;margin-top:20px;padding:12px;border:1px solid rgba(88,145,215,.14);border-radius:10px;background:rgba(2,13,31,.34)}.connect-console-chart i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(#18C8F4,#0B71FF)}.connect-console-chart i:nth-child(1){height:34%}.connect-console-chart i:nth-child(2){height:50%}.connect-console-chart i:nth-child(3){height:44%}.connect-console-chart i:nth-child(4){height:70%}.connect-console-chart i:nth-child(5){height:62%}.connect-console-chart i:nth-child(6){height:88%}
.connect-domain-quick{position:relative;z-index:3;margin-top:-35px;padding:22px 24px;display:grid;grid-template-columns:1fr 1.3fr;gap:28px;align-items:center;border:1px solid #DCE6F3;border-radius:16px;background:#fff;box-shadow:0 20px 55px rgba(7,26,54,.13)}.connect-domain-quick-copy span,.connect-client-section-head>span,.connect-help-copy>span{color:#0B74FF;font-size:10px;font-weight:900;letter-spacing:.13em}.connect-domain-quick-copy h2{margin:4px 0 0;font-size:20px;font-weight:800}.connect-domain-quick-form{display:grid;grid-template-columns:1fr 170px;gap:10px}.connect-domain-quick-form input{height:48px;border:1px solid #C7D5E7;border-radius:9px;padding:0 14px;background:#F8FAFD;color:#14233A;outline:none}.connect-domain-quick-form input:focus{border-color:#0B74FF;box-shadow:0 0 0 3px rgba(11,116,255,.10)}
.connect-client-section{padding:78px 0}.connect-client-section-head{text-align:center;max-width:720px;margin:0 auto 34px}.connect-client-section-head h2,.connect-help-copy h2{margin:7px 0 8px;color:#0B1F3A;font-size:34px;font-weight:850;letter-spacing:-.025em}.connect-client-section-head p,.connect-help-copy p{margin:0;color:#71829A;font-size:14px}.connect-client-actions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.connect-client-action{min-height:92px;display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:16px;border:1px solid #DFE7F2;border-radius:14px;background:#fff;color:#17263B!important;text-decoration:none!important;box-shadow:0 8px 24px rgba(7,27,55,.04)}.connect-client-action>i{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;background:#EDF5FF;color:#0B74FF;font-size:18px}.connect-client-action strong,.connect-client-action small{display:block}.connect-client-action strong{font-size:14px}.connect-client-action small{margin-top:3px;color:#8190A4;font-size:11px}.connect-client-action>span{color:#4BAEFF;font-size:20px}.connect-client-action:hover{transform:translateY(-2px);border-color:#A9CEF8;box-shadow:0 14px 30px rgba(8,76,158,.08)}
.connect-products-section{padding:78px 0;background:linear-gradient(180deg,#061126,#071B38);color:#fff}.connect-light-head h2{color:#fff}.connect-light-head p{color:#9FB3CC}.connect-product-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.connect-product-group-card{min-height:230px;padding:24px;border:1px solid rgba(93,154,229,.20);border-radius:16px;background:linear-gradient(180deg,rgba(10,35,75,.92),rgba(5,22,48,.96));box-shadow:0 16px 40px rgba(0,0,0,.13)}.connect-product-group-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:rgba(11,116,255,.14);color:#41BBFF}.connect-product-group-card h3{margin:18px 0 8px;color:#fff;font-size:19px}.connect-product-group-card p{min-height:48px;margin:0 0 18px;color:#9EB2CB;font-size:13px;line-height:1.55}.connect-product-group-card .btn{border-color:#2F79CF;color:#CBE4FF}.connect-product-group-card .btn:hover{background:#0B74FF;color:#fff}
.connect-help-section{padding:78px 0}.connect-help-copy{max-width:620px;margin-bottom:28px}.connect-help-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.connect-help-card{min-height:150px;display:flex;flex-direction:column;padding:20px;border:1px solid #DFE7F2;border-radius:14px;background:#fff;color:#17263B!important;text-decoration:none!important}.connect-help-card>i{color:#0B74FF;font-size:22px}.connect-help-card strong{margin-top:20px;font-size:14px}.connect-help-card small{margin-top:5px;color:#8393A8;font-size:11px;line-height:1.5}.connect-help-card:hover{border-color:#B1D4FB;box-shadow:0 12px 28px rgba(8,76,158,.07);transform:translateY(-2px)}
.connect-footer{padding-top:50px!important;background:#020817!important;color:#9EB2CB!important}.connect-footer-top{display:grid;grid-template-columns:1.45fr .75fr .75fr 1fr;gap:34px;padding-bottom:36px}.connect-footer-logo{height:48px!important;max-width:230px!important;filter:contrast(1.06) saturate(1.12) brightness(1.05)}.connect-footer-brand p{max-width:350px;margin:14px 0;color:#849AB4;font-size:12px;line-height:1.65}.connect-footer-site{color:#56BCFF!important;font-size:12px;font-weight:700}.connect-footer h4{margin-bottom:14px;color:#F3F8FF;font-size:13px}.connect-footer ul{list-style:none;padding:0;margin:0}.connect-footer li{margin:8px 0}.connect-footer a{color:#9FB2C9!important;font-size:12px}.connect-footer a:hover{color:#fff!important}.connect-footer-contact li{display:flex;align-items:center;gap:8px}.connect-footer-contact i{width:17px;color:#4BBEFF}.connect-footer-security{display:inline-flex;align-items:center;gap:6px;margin-top:10px;color:#8BA1B9;font-size:11px}.connect-footer-bottom{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid rgba(255,255,255,.07);font-size:11px}.connect-footer-locale{display:flex;align-items:center;gap:14px}.connect-footer-locale .btn{color:#9FB2C9!important}
.connect-whatsapp-float{right:18px!important;bottom:18px!important;min-height:54px!important;padding:0 17px!important;background:#20B766!important;box-shadow:0 14px 36px rgba(32,183,102,.28)!important}
/* Internal WHMCS pages */
body.connect-theme:not(.template-homepage) #main-body{padding:32px 0 54px}.connect-theme .header-lined{margin-bottom:22px}.connect-theme .header-lined h1{color:#0A2140;font-weight:850;letter-spacing:-.02em}.connect-theme .card,.connect-theme .panel{border:1px solid #DFE7F2!important;border-radius:14px!important;box-shadow:0 8px 24px rgba(7,27,55,.045)!important}.connect-theme .card-header,.connect-theme .panel-heading{border-bottom-color:#E1E8F2!important;background:#F7FAFD!important}.connect-theme .form-control{min-height:42px;border-color:#C8D5E5;border-radius:8px!important}.connect-theme .form-control:focus{border-color:#0B74FF;box-shadow:0 0 0 3px rgba(11,116,255,.10)}.connect-theme .btn-primary,#order-standard_cart .btn-primary,#order-standard_cart .btn-success{border-color:#0B74FF!important;background:#0B74FF!important}.connect-theme .btn-primary:hover,#order-standard_cart .btn-primary:hover,#order-standard_cart .btn-success:hover{border-color:#075BD4!important;background:#075BD4!important}.connect-theme .sidebar .list-group-item{border-color:#E0E7F1}.connect-theme .sidebar .list-group-item.active{border-color:#0B74FF!important;background:#0B74FF!important}.connect-theme table.table{background:#fff}.connect-theme .table thead th{border-top:0;color:#4E6078;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:1199.98px){.connect-brand-container{gap:14px}.connect-client-hero-grid{grid-template-columns:1fr 410px;gap:36px}.connect-header-whatsapp{display:none!important}.connect-product-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:991.98px){.connect-brand-logo{height:46px!important;max-width:215px!important}.connect-client-hero{padding:62px 0 78px}.connect-client-hero-grid{grid-template-columns:1fr}.connect-client-hero-copy{text-align:center}.connect-client-hero-copy>p{margin-left:auto;margin-right:auto}.connect-client-hero-actions,.connect-client-trust{justify-content:center}.connect-client-console{max-width:620px;width:100%;margin:12px auto 0;transform:none}.connect-domain-quick{grid-template-columns:1fr;margin-left:16px;margin-right:16px}.connect-client-actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.connect-help-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.connect-footer-top{grid-template-columns:1.3fr 1fr 1fr}.connect-footer-contact{grid-column:1/-1}}
@media(max-width:767.98px){.connect-account-bar{display:none}.connect-brand-row{min-height:66px!important}.connect-brand-logo{height:42px!important;max-width:195px!important}.connect-header-actions{gap:5px}.connect-client-btn{width:42px;padding:0}.connect-client-btn span{display:none}.connect-native-nav{padding:8px 0}.connect-native-nav .navbar-nav>li>a{padding:11px 10px!important}.connect-client-hero{padding:50px 0 66px}.connect-client-hero-copy h1{font-size:38px}.connect-client-hero-copy>p{font-size:15px}.connect-client-hero-actions{flex-direction:column}.connect-client-trust{flex-direction:column;gap:8px}.connect-client-console{display:none}.connect-domain-quick{margin-top:-25px;padding:18px;gap:16px}.connect-domain-quick-form{grid-template-columns:1fr}.connect-client-section,.connect-products-section,.connect-help-section{padding:58px 0}.connect-client-section-head h2,.connect-help-copy h2{font-size:28px}.connect-client-actions-grid,.connect-product-groups,.connect-help-grid{grid-template-columns:1fr}.connect-client-action{min-height:82px}.connect-footer-top{grid-template-columns:1fr 1fr}.connect-footer-brand,.connect-footer-contact{grid-column:1/-1}.connect-footer-bottom{flex-direction:column;justify-content:center;padding:18px 0;text-align:center}.connect-footer-locale{flex-wrap:wrap;justify-content:center}.connect-whatsapp-float{width:54px!important;height:54px!important;padding:0!important;justify-content:center}.connect-whatsapp-float span{display:none}}
@media(max-width:420px){.connect-brand-logo{height:39px!important;max-width:178px!important}.connect-footer-top{grid-template-columns:1fr}.connect-footer-brand,.connect-footer-contact{grid-column:auto}}


/* =========================================================
   CONNECT Cliente v2.2.0 — WHMCS LOOP 001
   Refinamento global, integração institucional e páginas internas
   ========================================================= */

.connect-skip-link{
    position:fixed;
    left:16px;
    top:-80px;
    z-index:2000;
    padding:10px 14px;
    border-radius:8px;
    background:#fff;
    color:#07172F!important;
    font-weight:800;
    box-shadow:0 10px 30px rgba(0,0,0,.22);
    transition:top .18s ease;
}
.connect-skip-link:focus{top:12px}

.connect-public-nav .connect-back-site{
    margin-right:4px;
    color:#8ED5FF!important;
    border:1px solid rgba(75,166,255,.18);
    background:rgba(13,94,191,.11);
}
.connect-public-nav .connect-back-site i{font-size:10px}

.connect-mobile-institutional{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin:0 0 14px;
    padding:12px;
    border:1px solid rgba(87,151,226,.18);
    border-radius:13px;
    background:rgba(8,31,66,.55);
}
.connect-mobile-institutional a{
    min-height:40px;
    display:flex;
    align-items:center;
    padding:0 11px;
    border-radius:8px;
    color:#C7DCF3!important;
    font-size:12px;
    font-weight:700;
    text-decoration:none!important;
}
.connect-mobile-institutional a:hover,
.connect-mobile-institutional a:focus-visible{
    background:rgba(27,117,230,.17);
    color:#fff!important;
}

.connect-theme a:focus-visible,
.connect-theme button:focus-visible,
.connect-theme input:focus-visible,
.connect-theme select:focus-visible,
.connect-theme textarea:focus-visible{
    outline:3px solid rgba(22,199,232,.48)!important;
    outline-offset:2px!important;
}
.connect-theme .btn,
.connect-theme button,
.connect-theme input,
.connect-theme select{
    min-height:42px;
}
.connect-theme textarea{min-height:120px}
body.connect-menu-open{overflow:hidden}

/* Base das páginas internas */
body.connect-theme:not(.template-homepage) #main-body{
    background:
        radial-gradient(circle at 12% 0,rgba(11,116,255,.055),transparent 24%),
        #F6F8FC;
}
body.connect-theme:not(.template-homepage) #main-body > .container{max-width:1180px}
body.connect-theme:not(.template-homepage) .primary-content{min-width:0}
.connect-breadcrumb{
    border-bottom:1px solid #E1E8F1!important;
    background:#fff!important;
}
.connect-breadcrumb .breadcrumb{
    min-height:44px;
    margin:0;
    padding:10px 0;
    background:transparent!important;
    font-size:12px;
}
.connect-theme .header-lined{
    padding-bottom:14px;
    border-bottom:1px solid #E2E8F1;
}
.connect-theme .header-lined h1{
    margin-bottom:4px;
    font-size:clamp(26px,3vw,36px);
}

/* Cards, alertas e tabelas */
.connect-theme .card,
.connect-theme .panel{
    overflow:hidden;
    background:#fff;
}
.connect-theme .card-title,
.connect-theme .panel-title{
    color:#0A2140;
    font-weight:800;
}
.connect-theme .alert{
    border-radius:11px;
    border-width:1px;
}
.connect-theme .table-responsive{
    border:1px solid #E1E8F1;
    border-radius:12px;
    background:#fff;
}
.connect-theme table.table{margin-bottom:0}
.connect-theme .table td,
.connect-theme .table th{vertical-align:middle}
.connect-theme .badge{border-radius:999px}

/* Formulários */
.connect-theme label,
.connect-theme .form-control-label{
    color:#334963;
    font-size:12px;
    font-weight:750;
}
.connect-theme .form-control,
.connect-theme .field,
.connect-theme select.form-control{
    width:100%;
    min-height:44px;
    border:1px solid #C8D5E5!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#17263B!important;
}
.connect-theme .form-control::placeholder,
.connect-theme .field::placeholder{color:#8A9BAF}
.connect-theme .input-group-text{
    border-color:#C8D5E5!important;
    background:#F4F7FB!important;
    color:#66809D!important;
}
.connect-theme .custom-control-label,
.connect-theme .form-check{font-size:13px}
.connect-theme .btn-default,
.connect-theme .btn-secondary{
    border-color:#C7D5E5!important;
    background:#fff!important;
    color:#29435F!important;
}
.connect-theme .btn-default:hover,
.connect-theme .btn-secondary:hover{
    border-color:#9DB8D5!important;
    background:#F6F9FD!important;
}

/* Login */
.template-login .primary-content{
    display:flex;
    justify-content:center;
}
.template-login .login-form{
    width:min(100%,560px);
    margin:8px auto 22px;
}
.template-login .login-form .card{
    border-top:3px solid #0B74FF!important;
    box-shadow:0 22px 55px rgba(8,37,75,.09)!important;
}
.template-login .login-form .card-body{padding:36px!important}
.template-login .login-form .h3{
    color:#071F3D;
    font-size:28px;
    font-weight:850;
}
.template-login .login-form .btn-primary{min-width:135px}
.template-login .login-form .card-footer{
    border-top:1px solid #E4EAF2;
    background:#F8FAFD;
}

/* Registro */
.template-clientregister #registration{
    max-width:920px;
    margin:0 auto;
}
.template-clientregister #registration .card{
    margin-bottom:18px!important;
    border-top:2px solid rgba(11,116,255,.22)!important;
}
.template-clientregister #registration .card-body{padding:26px!important}
.template-clientregister #registration .card-title{
    margin-bottom:20px;
    font-size:20px;
}
.template-clientregister #registration .prepend-icon .field{padding-left:42px!important}
.template-clientregister #registration .field-icon{color:#64809E}
.template-clientregister #registration .btn-lg{
    min-width:220px;
    border-radius:9px;
}

/* Recuperação de senha e autenticação */
.template-pwreset .primary-content > .card,
.template-two-factor-challenge .primary-content > .card{
    max-width:650px;
    margin-left:auto;
    margin-right:auto;
}

/* Contato e suporte */
.template-contact .primary-content > .card,
.template-supportticketsubmit-stepone .primary-content > .card,
.template-supportticketsubmit-steptwo .primary-content > form > .card{
    max-width:920px;
    margin-left:auto;
    margin-right:auto;
}
.template-contact .card-body,
.template-supportticketsubmit-stepone .card-body,
.template-supportticketsubmit-steptwo .card-body{padding:28px!important}
.template-supportticketsubmit-stepone .alert-info{
    padding:18px;
    border-color:#C8DFF7;
    background:#F1F7FD;
    color:#34516F;
}

/* Sidebar */
.connect-theme .sidebar .card,
.connect-theme .sidebar .panel{box-shadow:none!important}
.connect-theme .sidebar .list-group-item{
    min-height:44px;
    display:flex;
    align-items:center;
    color:#3D526B;
    font-size:13px;
}
.connect-theme .sidebar .list-group-item:hover{
    background:#F4F8FD;
    color:#0B5DB8;
}

/* Carrinho */
#order-standard_cart{color:#17263B!important}
#order-standard_cart .products .product{
    overflow:hidden;
    margin-bottom:16px!important;
    border:1px solid #DDE6F1!important;
    background:#fff!important;
    box-shadow:0 10px 28px rgba(8,37,75,.045);
}
#order-standard_cart .products .product header{
    padding:16px 18px!important;
    background:linear-gradient(135deg,#07172F,#0A2A56)!important;
    color:#fff!important;
}
#order-standard_cart .products .product .product-desc{color:#70839A!important}
#order-standard_cart .products .product .product-pricing{
    color:#0A2140!important;
    font-weight:800;
}
#order-standard_cart .summary-container,
#order-standard_cart .view-cart-items,
#order-standard_cart .domain-checker-container{
    border:1px solid #DDE6F1!important;
    background:#fff!important;
    box-shadow:0 10px 28px rgba(8,37,75,.04);
}
#order-standard_cart .summary-container{
    position:sticky;
    top:120px;
}
#order-standard_cart .btn-primary,
#order-standard_cart .btn-success{
    min-height:44px;
    border-radius:9px!important;
}

/* Modais */
.connect-theme .modal-content{
    overflow:hidden;
    border:0;
    border-radius:15px;
    box-shadow:0 24px 80px rgba(0,0,0,.24);
}
.connect-theme .modal-header{
    border-bottom-color:#E4EAF2;
    background:#F8FAFD;
}
.connect-theme .modal-footer{border-top-color:#E4EAF2}

/* Rodapé */
.connect-footer-site{
    display:inline-flex;
    align-items:center;
    gap:5px;
}
.connect-footer-contact a[href^="tel:"]{white-space:nowrap}

@media(max-width:1199.98px){
    .connect-public-nav{display:none!important}
}
@media(max-width:991.98px){
    #order-standard_cart .summary-container{position:static}
    body.connect-theme:not(.template-homepage) #main-body{padding-top:24px}
}
@media(max-width:767.98px){
    .connect-mobile-institutional{grid-template-columns:1fr 1fr}
    .template-login .login-form .card-body{padding:26px 20px!important}
    .template-clientregister #registration .card-body{padding:20px!important}
    .connect-theme .header-lined h1{font-size:27px}
    .connect-theme .table-responsive{border-radius:9px}
    .connect-whatsapp-float{
        right:max(14px,env(safe-area-inset-right))!important;
        bottom:max(14px,env(safe-area-inset-bottom))!important;
    }
}
@media(max-width:480px){
    .connect-mobile-institutional{grid-template-columns:1fr}
    .template-login .login-form .float-left,
    .template-login .login-form .text-right{
        float:none!important;
        text-align:left!important;
    }
    .template-login .login-form .float-left{margin-bottom:14px}
}


/* =========================================================
   CONNECT Cliente v2.3.0 — WHMCS LOOP 002
   Páginas internas, contato, suporte, carrinho e domínios
   ========================================================= */

.connect-inner-hero{
    margin:0 0 22px;
    padding:26px 28px;
    border:1px solid #DCE7F3;
    border-radius:16px;
    background:
        radial-gradient(circle at 95% 5%,rgba(13,116,255,.14),transparent 32%),
        linear-gradient(135deg,#07182F,#0A2A56);
    color:#fff;
    box-shadow:0 15px 42px rgba(8,37,75,.09);
}
.connect-inner-hero span{
    display:block;
    margin-bottom:6px;
    color:#61CBFF;
    font-size:11px;
    font-weight:900;
    letter-spacing:.13em;
}
.connect-inner-hero h1{
    margin:0 0 7px;
    color:#fff;
    font-size:clamp(26px,3vw,36px);
    font-weight:850;
    letter-spacing:-.025em;
}
.connect-inner-hero p{
    max-width:760px;
    margin:0;
    color:#BAD0E7;
    font-size:14px;
    line-height:1.65;
}
.connect-inner-hero-compact{padding-top:22px;padding-bottom:22px}

.connect-contact-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:22px;
    align-items:start;
}
.connect-contact-card{
    border:1px solid #DFE8F2!important;
    border-radius:15px!important;
}
.connect-contact-card .card-body{padding:30px!important}
.connect-section-heading{
    margin-bottom:24px;
    padding-bottom:18px;
    border-bottom:1px solid #E6ECF3;
}
.connect-section-heading>span,
.connect-contact-side-head>span{
    display:block;
    color:#0B74FF;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
}
.connect-section-heading h2,
.connect-contact-side-head h2{
    margin:5px 0 5px;
    color:#0A2140;
    font-size:24px;
    font-weight:850;
}
.connect-section-heading p,
.connect-contact-side-head p{
    margin:0;
    color:#74889F;
    font-size:13px;
}
.connect-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.connect-form-grid .form-group{margin:0}
.connect-form-full{grid-column:1/-1}
.connect-contact-form label{
    display:block;
    margin-bottom:7px;
}
.connect-contact-form textarea.form-control{min-height:175px}
.connect-form-actions{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-top:22px;
    padding-top:20px;
    border-top:1px solid #E7EDF4;
}
.connect-form-actions small{
    max-width:440px;
    color:#8194AA;
    font-size:11px;
}
.connect-form-actions .btn{min-width:170px}

.connect-contact-side{
    position:sticky;
    top:112px;
    padding:24px;
    border:1px solid #143963;
    border-radius:15px;
    background:linear-gradient(180deg,#07182F,#061326);
    color:#fff;
    box-shadow:0 16px 44px rgba(7,31,62,.14);
}
.connect-contact-side-head{margin-bottom:19px}
.connect-contact-side-head>span{color:#56C7FF}
.connect-contact-side-head h2{color:#fff}
.connect-contact-side-head p{color:#93AAC2}
.connect-channel{
    min-height:66px;
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:12px;
    align-items:center;
    margin-bottom:10px;
    padding:10px 12px;
    border:1px solid rgba(119,169,220,.18);
    border-radius:12px;
    background:rgba(255,255,255,.035);
    color:#fff!important;
    text-decoration:none!important;
}
.connect-channel:hover,
.connect-channel:focus-visible{
    border-color:rgba(73,170,255,.42);
    background:rgba(25,111,216,.12);
}
.connect-channel>i{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:rgba(22,119,226,.15);
    color:#62C9FF;
}
.connect-channel-whatsapp>i{
    background:rgba(36,181,91,.13);
    color:#55E58A;
}
.connect-channel small{
    display:block;
    margin-bottom:2px;
    color:#7F97B1;
    font-size:9px;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.08em;
}
.connect-channel strong{
    display:block;
    color:#F3F8FF;
    font-size:13px;
    overflow-wrap:anywhere;
}
.connect-client-support-box{
    margin-top:18px;
    padding:18px;
    border-top:1px solid rgba(127,174,222,.14);
}
.connect-client-support-box>strong{font-size:14px}
.connect-client-support-box p{
    margin:5px 0 13px;
    color:#8FA6BE;
    font-size:11px;
    line-height:1.55;
}

/* Suporte */
.connect-support-card{
    border:1px solid #DFE8F2!important;
    border-radius:15px!important;
}
.connect-support-card .card-body{padding:28px!important}
.connect-support-grid{display:grid;gap:12px}
.connect-support-department{
    min-height:82px;
    display:grid;
    grid-template-columns:50px minmax(0,1fr) 24px;
    gap:14px;
    align-items:center;
    padding:14px 16px;
    border:1px solid #DDE7F1;
    border-radius:13px;
    background:#fff;
    color:#18304E!important;
    text-decoration:none!important;
    box-shadow:0 8px 24px rgba(8,37,75,.035);
}
.connect-support-department:hover,
.connect-support-department:focus-visible{
    border-color:#9DC8F8;
    transform:translateY(-1px);
    box-shadow:0 12px 30px rgba(8,80,160,.08);
}
.connect-support-icon,
.connect-support-unavailable-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#EAF4FF;
    color:#0B74FF;
    font-size:18px;
}
.connect-support-department strong{
    display:block;
    color:#0A2140;
    font-size:15px;
}
.connect-support-department small{
    display:block;
    margin-top:3px;
    color:#7B8FA5;
    font-size:12px;
}
.connect-support-department>i{color:#6E89A6}

.connect-support-unavailable{
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    gap:16px;
    align-items:start;
    padding:22px;
    border:1px solid #F1D5A5;
    border-radius:13px;
    background:#FFF9EE;
}
.connect-support-unavailable-icon{
    width:56px;
    height:56px;
    background:#FFF0CF;
    color:#C58215;
}
.connect-support-unavailable h2{
    margin:1px 0 5px;
    color:#69430B;
    font-size:18px;
    font-weight:850;
}
.connect-support-unavailable p{
    margin:0;
    color:#846538;
    font-size:13px;
    line-height:1.55;
}
.connect-support-alternatives{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}
.connect-support-alternatives>a{
    min-height:78px;
    display:grid;
    grid-template-columns:38px 1fr;
    gap:10px;
    align-items:center;
    padding:12px;
    border:1px solid #DDE7F1;
    border-radius:12px;
    background:#fff;
    color:#18304E!important;
    text-decoration:none!important;
}
.connect-support-alternatives>a:hover{border-color:#A5C9F2;background:#F8FBFF}
.connect-support-alternatives i{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#EEF6FF;
    color:#0B74FF;
}
.connect-support-alternatives small{
    display:block;
    color:#7D91A7;
    font-size:9px;
    text-transform:uppercase;
    font-weight:850;
    letter-spacing:.06em;
}
.connect-support-alternatives strong{
    color:#18304E;
    font-size:12px;
    overflow-wrap:anywhere;
}

/* Registro */
.template-clientregister #registration .card{
    border-radius:14px!important;
}
.template-clientregister #registration .card-title{
    color:#0A2140!important;
    font-weight:850!important;
}
.template-clientregister #registration .form-group{
    margin-bottom:16px;
}
.template-clientregister #registration .prepend-icon .field{
    border-color:#CBD8E7!important;
}
.template-clientregister #registration .prepend-icon .field:focus{
    border-color:#0B74FF!important;
    box-shadow:0 0 0 3px rgba(11,116,255,.11)!important;
}

/* Domínios / Carrinho */
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card,
#order-standard_cart .cart-sidebar .list-group{
    overflow:hidden;
    border:1px solid #DEE7F1!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:none!important;
}
#order-standard_cart .cart-sidebar .panel-heading,
#order-standard_cart .cart-sidebar .card-header{
    border-bottom:1px solid #E5EBF3!important;
    background:#F7F9FC!important;
    color:#163454!important;
}
#order-standard_cart .cart-sidebar a{
    color:#3C5672!important;
}
#order-standard_cart .cart-sidebar a:hover{
    color:#0B68CC!important;
}
#order-standard_cart .domain-checker-container{
    overflow:hidden;
    border:1px solid #DDE7F1!important;
    border-radius:16px!important;
    background:#fff!important;
}
#order-standard_cart .domain-checker-bg{
    padding:30px 24px!important;
    background:
        radial-gradient(circle at 90% 15%,rgba(16,151,255,.12),transparent 30%),
        linear-gradient(135deg,#07182F,#0A2A56)!important;
}
#order-standard_cart .domain-checker-bg h2,
#order-standard_cart .domain-checker-bg p,
#order-standard_cart .domain-checker-bg label{
    color:#fff!important;
}
#order-standard_cart .domain-checker-bg .form-control{
    min-height:50px!important;
    border-color:rgba(255,255,255,.28)!important;
    background:#fff!important;
    color:#15283F!important;
}
#order-standard_cart .domain-checker-bg .btn{
    min-height:50px!important;
    border-radius:9px!important;
}
#order-standard_cart .domain-checker-result-headline{
    padding:16px!important;
    border-radius:10px;
}
#order-standard_cart .domain-suggestions{
    border-radius:12px;
}
#order-standard_cart .domain-suggestion{
    border-color:#E1E8F1!important;
}
#order-standard_cart .domain-pricing{
    overflow:hidden;
    margin-top:20px;
    border:1px solid #DDE7F1;
    border-radius:13px;
    background:#fff;
}
#order-standard_cart .domain-pricing .tld-pricing-header{
    background:#F6F9FD!important;
}
#order-standard_cart .domain-pricing .tld-row{
    border-bottom-color:#E7EDF4!important;
}
#order-standard_cart .domain-pricing .tld-row:hover{
    background:#F8FBFF;
}
#order-standard_cart .products .product{
    border-radius:14px!important;
}
#order-standard_cart .products .product header{
    min-height:82px;
}
#order-standard_cart .products .product .product-desc{
    line-height:1.6;
}
#order-standard_cart .products .product .product-pricing{
    font-size:16px;
}
#order-standard_cart .view-cart-tabs .nav-link,
#order-standard_cart .nav-tabs .nav-link{
    border-radius:9px 9px 0 0;
}
#order-standard_cart .summary-container{
    border-radius:14px!important;
}

/* Não transforma moeda/preço: apenas melhora apresentação */
#order-standard_cart .price,
#order-standard_cart .product-pricing{
    font-variant-numeric:tabular-nums;
}

/* Mobile */
@media(max-width:991.98px){
    .connect-contact-layout{grid-template-columns:1fr}
    .connect-contact-side{position:static}
    .connect-support-alternatives{grid-template-columns:1fr}
}
@media(max-width:767.98px){
    .connect-inner-hero{padding:22px 18px;border-radius:13px}
    .connect-contact-card .card-body,
    .connect-support-card .card-body{padding:20px!important}
    .connect-form-grid{grid-template-columns:1fr}
    .connect-form-full{grid-column:auto}
    .connect-form-actions{display:grid}
    .connect-form-actions .btn{width:100%}
    #order-standard_cart .domain-checker-bg{padding:23px 16px!important}
}


/* =========================================================
   CONNECT Cliente v2.4.0 — WHMCS LOOP 003
   Produtos, fluxo de contratação, carrinho, checkout e domínio
   ========================================================= */

#order-standard_cart .header-lined{
    margin-bottom:18px!important;
}
#order-standard_cart .header-lined h1{
    color:#0A2140!important;
    font-size:clamp(27px,3vw,36px)!important;
    font-weight:850!important;
    letter-spacing:-.025em;
}
#order-standard_cart .header-lined p{
    max-width:760px;
    color:#70849A!important;
    font-size:13px!important;
    line-height:1.65!important;
}

/* Barra de progresso do pedido */
.connect-order-progress{
    margin:0 0 22px;
    padding:13px 14px;
    border:1px solid #DDE7F1;
    border-radius:13px;
    background:#fff;
    box-shadow:0 8px 24px rgba(8,37,75,.035);
}
.connect-order-progress ol{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:6px;
    margin:0;
    padding:0;
    list-style:none;
}
.connect-order-progress li{
    position:relative;
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:38px;
    color:#8A9CAF;
}
.connect-order-progress li:not(:last-child)::after{
    content:"";
    position:absolute;
    right:-7px;
    width:14px;
    height:1px;
    background:#D8E2ED;
}
.connect-order-progress li>span{
    flex:0 0 27px;
    width:27px;
    height:27px;
    display:grid;
    place-items:center;
    border:1px solid #CBD8E6;
    border-radius:50%;
    background:#F6F9FC;
    color:#7890A8;
    font-size:10px;
    font-weight:900;
}
.connect-order-progress li>strong{
    min-width:0;
    color:inherit;
    font-size:10px;
    font-weight:850;
    white-space:nowrap;
}
.connect-order-progress li.is-done{
    color:#1E7B54;
}
.connect-order-progress li.is-done>span{
    border-color:#B9E5D0;
    background:#ECF9F2;
    color:#168052;
}
.connect-order-progress li.is-active{
    color:#0B62C3;
}
.connect-order-progress li.is-active>span{
    border-color:#0B74FF;
    background:#0B74FF;
    color:#fff;
    box-shadow:0 0 0 4px rgba(11,116,255,.10);
}

/* Produtos */
#order-standard_cart .products{
    margin-top:4px;
}
#order-standard_cart .products .row{
    align-items:stretch;
}
#order-standard_cart .products .col-md-6{
    margin-bottom:18px;
}
#order-standard_cart .products .product{
    height:100%;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid #DCE6F1!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 13px 34px rgba(7,39,81,.055)!important;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
#order-standard_cart .products .product:hover{
    transform:translateY(-2px);
    border-color:#A8CBEF!important;
    box-shadow:0 18px 40px rgba(7,63,126,.09)!important;
}
#order-standard_cart .products .product header{
    min-height:72px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px;
    padding:16px 18px!important;
    border-bottom:0!important;
    background:
        radial-gradient(circle at 92% 10%,rgba(23,166,255,.16),transparent 28%),
        linear-gradient(135deg,#07172F,#0A2B57)!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:850!important;
}
#order-standard_cart .products .product header .qty{
    flex:0 0 auto;
    border:1px solid rgba(255,255,255,.15);
    border-radius:999px;
    background:rgba(255,255,255,.07);
    color:#B9D5EF!important;
    font-size:10px!important;
}
#order-standard_cart .products .product .product-desc{
    flex:1;
    padding:18px!important;
    color:#6D8298!important;
    font-size:13px!important;
    line-height:1.6!important;
}
#order-standard_cart .products .product .product-desc ul{
    margin:0;
    padding:0;
    list-style:none;
}
#order-standard_cart .products .product .product-desc li{
    position:relative;
    margin:0 0 8px;
    padding-left:20px;
}
#order-standard_cart .products .product .product-desc li::before{
    content:"✓";
    position:absolute;
    left:0;
    top:0;
    color:#18A96C;
    font-weight:900;
}
#order-standard_cart .products .product footer{
    min-height:96px;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px;
    padding:16px 18px!important;
    border-top:1px solid #E7EDF4!important;
    background:#FAFCFE!important;
}
#order-standard_cart .products .product .product-pricing{
    color:#17304D!important;
    font-size:12px!important;
    line-height:1.35!important;
}
#order-standard_cart .products .product .product-pricing .price{
    display:inline-block;
    color:#071F3D!important;
    font-size:22px!important;
    font-weight:900!important;
    letter-spacing:-.02em;
}
#order-standard_cart .products .product .btn-order-now{
    min-width:132px;
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:0!important;
    border-radius:9px!important;
    background:linear-gradient(135deg,#0B74FF,#098DFF)!important;
    box-shadow:0 10px 24px rgba(11,116,255,.18)!important;
    font-weight:800!important;
}
#order-standard_cart .products .product .btn-order-now:hover{
    background:linear-gradient(135deg,#096AE9,#077EEC)!important;
}
#order-standard_cart .connect-single-product{
    flex:0 0 100%!important;
    max-width:100%!important;
}
#order-standard_cart .connect-single-product .product{
    max-width:760px;
}
.connect-empty-product-description{
    display:none!important;
}

/* Sidebar comercial */
#order-standard_cart .cart-sidebar{
    position:relative;
}
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card,
#order-standard_cart .cart-sidebar .list-group{
    border-radius:13px!important;
}
#order-standard_cart .cart-sidebar .panel-heading,
#order-standard_cart .cart-sidebar .card-header{
    padding:13px 14px!important;
    color:#13385E!important;
    font-size:12px!important;
    font-weight:850!important;
}
#order-standard_cart .cart-sidebar .list-group-item,
#order-standard_cart .cart-sidebar a{
    min-height:42px;
    align-items:center;
    font-size:12px!important;
}

/* Domínio */
#order-standard_cart .domain-checker-container{
    margin-bottom:22px;
}
#order-standard_cart .domain-checker-bg{
    border-radius:15px 15px 0 0!important;
}
#order-standard_cart .domain-checker-bg .input-group{
    max-width:840px;
    margin-left:auto;
    margin-right:auto;
}
#order-standard_cart .domain-checker-bg .btn{
    padding-left:22px!important;
    padding-right:22px!important;
    font-weight:800!important;
}
#order-standard_cart .domain-checker-result-headline{
    border:1px solid #E1E8F1;
    background:#F8FBFE!important;
}
#order-standard_cart .domain-suggestions{
    overflow:hidden;
    border:1px solid #DDE7F1!important;
    background:#fff!important;
}
#order-standard_cart .domain-suggestion{
    min-height:58px;
    align-items:center;
    padding:10px 12px!important;
}
#order-standard_cart .domain-pricing{
    box-shadow:0 10px 28px rgba(8,37,75,.04);
}
#order-standard_cart .domain-pricing .tld-row{
    min-height:52px;
}
#order-standard_cart .domain-pricing .tld-row strong{
    color:#0A2140;
}

/* Configuração de produto/domínio */
#order-standard_cart .product-info,
#order-standard_cart .product-configurable-options,
#order-standard_cart .domain-configure-container{
    border-color:#DDE7F1!important;
    border-radius:13px!important;
    background:#fff!important;
}
#order-standard_cart .sub-heading{
    margin-top:22px!important;
}
#order-standard_cart .sub-heading span{
    border-radius:999px!important;
    background:#0B74FF!important;
    font-size:10px!important;
    font-weight:850!important;
    letter-spacing:.04em;
}
#order-standard_cart .field,
#order-standard_cart .form-control{
    min-height:45px!important;
    border-color:#C8D6E6!important;
    border-radius:9px!important;
}
#order-standard_cart textarea.form-control{
    min-height:120px!important;
}

/* Carrinho */
#order-standard_cart .view-cart-items{
    overflow:hidden;
    border-radius:14px!important;
}
#order-standard_cart .view-cart-items-header{
    padding:14px 16px!important;
    background:#F5F8FC!important;
    color:#153656!important;
    font-weight:850!important;
}
#order-standard_cart .view-cart-item{
    padding-top:16px!important;
    padding-bottom:16px!important;
}
#order-standard_cart .summary-container{
    overflow:hidden;
    border-radius:14px!important;
}
#order-standard_cart .summary-container .subtotal,
#order-standard_cart .summary-container .total-due-today{
    color:#0A2140!important;
}

/* Checkout */
.connect-checkout-trust{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:0 0 20px;
}
.connect-checkout-trust>span{
    min-height:72px;
    display:grid;
    grid-template-columns:36px 1fr;
    column-gap:10px;
    align-content:center;
    padding:10px 12px;
    border:1px solid #DCE7F2;
    border-radius:12px;
    background:#fff;
}
.connect-checkout-trust i{
    grid-row:1/3;
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#EDF6FF;
    color:#0B74FF;
}
.connect-checkout-trust strong{
    color:#183653;
    font-size:11px;
}
.connect-checkout-trust small{
    color:#8295AA;
    font-size:9px;
    line-height:1.35;
}
#order-standard_cart .already-registered{
    margin-bottom:18px!important;
    padding:14px!important;
    border:1px solid #DDE7F1;
    border-radius:11px;
    background:#F8FBFE;
}
#order-standard_cart #frmCheckout .sub-heading{
    margin-bottom:16px!important;
}
#order-standard_cart #frmCheckout .form-group{
    margin-bottom:15px!important;
}
#order-standard_cart #frmCheckout .form-control,
#order-standard_cart #frmCheckout .field{
    background:#fff!important;
}
#order-standard_cart .payment-methods{
    border-radius:12px;
}
#order-standard_cart .terms-of-service{
    padding:13px 14px;
    border:1px solid #E1E8F0;
    border-radius:10px;
    background:#F8FAFD;
}
.connect-commercial-cta{
    font-weight:800!important;
}

/* Nunca mascara preços/ciclos: apenas organiza a apresentação */
#order-standard_cart .price,
#order-standard_cart .product-pricing,
#order-standard_cart .summary-container{
    font-variant-numeric:tabular-nums;
}

@media(max-width:991.98px){
    .connect-order-progress ol{
        grid-template-columns:repeat(5,1fr);
    }
    .connect-order-progress li{
        display:grid;
        justify-items:center;
        gap:4px;
        text-align:center;
    }
    .connect-order-progress li:not(:last-child)::after{
        top:14px;
    }
    .connect-checkout-trust{
        grid-template-columns:1fr;
    }
}
@media(max-width:767.98px){
    .connect-order-progress{
        padding:10px 7px;
        overflow-x:auto;
    }
    .connect-order-progress ol{
        min-width:520px;
    }
    #order-standard_cart .products .product footer{
        display:grid!important;
        align-items:start!important;
    }
    #order-standard_cart .products .product .btn-order-now{
        width:100%;
    }
    #order-standard_cart .connect-single-product .product{
        max-width:none;
    }
}


/* =========================================================
   CONNECT Cliente v2.5.0 — WHMCS LOOP 004
   Faturas, pagamentos, métodos de pagamento e área financeira
   ========================================================= */

/* Banner financeiro */
.connect-finance-banner{
    min-height:76px;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) auto;
    gap:13px;
    align-items:center;
    margin:0 0 20px;
    padding:14px 16px;
    border:1px solid #DCE7F2;
    border-radius:13px;
    background:
        radial-gradient(circle at 92% 0,rgba(11,116,255,.08),transparent 30%),
        #fff;
    box-shadow:0 9px 28px rgba(8,37,75,.04);
}
.connect-finance-banner-icon{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#EAF4FF;
    color:#0B74FF;
    font-size:17px;
}
.connect-finance-banner strong{
    display:block;
    color:#113353;
    font-size:13px;
    font-weight:850;
}
.connect-finance-banner small{
    display:block;
    margin-top:2px;
    color:#7B90A6;
    font-size:10px;
    line-height:1.45;
}
.connect-finance-banner>a{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 13px;
    border:1px solid #C9DAEB;
    border-radius:8px;
    background:#F8FBFE;
    color:#2367A8!important;
    font-size:11px;
    font-weight:800;
    text-decoration:none!important;
}
.connect-finance-banner>a:hover{
    border-color:#9FC5ED;
    background:#F1F7FD;
}

/* Área do cliente: tiles financeiras */
.template-clientareahome .tiles{
    overflow:hidden;
    border:1px solid #DFE7F0;
    border-radius:14px;
    background:#fff;
    box-shadow:0 10px 30px rgba(8,37,75,.04);
}
.template-clientareahome .tiles .tile{
    min-height:108px;
    border-right:1px solid #E8EDF3!important;
    border-bottom:1px solid #E8EDF3!important;
    background:#fff!important;
    transition:background .15s ease,transform .15s ease;
}
.template-clientareahome .tiles .tile:hover{
    background:#F8FBFE!important;
}
.template-clientareahome .tiles .tile .stat{
    color:#0A2140!important;
    font-size:24px!important;
    font-weight:900!important;
}
.template-clientareahome .tiles .tile .title{
    color:#6F8398!important;
    font-size:11px!important;
    font-weight:800!important;
}
.template-clientareahome .tiles .tile i{
    color:#0B74FF!important;
}
.template-clientareahome .tiles .tile .highlight{
    opacity:.88;
}

/* Lista de faturas */
.template-clientareainvoices .table-container{
    overflow:hidden;
    border:1px solid #DFE8F2;
    border-radius:14px;
    background:#fff;
    box-shadow:0 10px 30px rgba(8,37,75,.04);
}
.template-clientareainvoices #tableInvoicesList{
    margin:0!important;
}
.template-clientareainvoices #tableInvoicesList thead th{
    padding:13px 14px!important;
    border-bottom:1px solid #DDE7F1!important;
    background:#F4F8FC!important;
    color:#536B84!important;
    font-size:10px!important;
    font-weight:900!important;
    letter-spacing:.045em;
    text-transform:uppercase;
}
.template-clientareainvoices #tableInvoicesList tbody td{
    padding:14px!important;
    border-top:1px solid #EDF1F6!important;
    color:#324B64!important;
    font-size:12px!important;
}
.template-clientareainvoices #tableInvoicesList tbody tr:hover td{
    background:#F8FBFE!important;
}
.template-clientareainvoices #tableInvoicesList a{
    color:#0B67C7!important;
    font-weight:750;
}
.template-clientareainvoices .dataTables_wrapper .dataTables_filter input,
.template-clientareainvoices .dataTables_wrapper select{
    min-height:40px!important;
    border:1px solid #CDD9E7!important;
    border-radius:8px!important;
    background:#fff!important;
}
.template-clientareainvoices .dataTables_wrapper .pagination .page-link{
    min-width:37px;
    min-height:37px;
    display:grid;
    place-items:center;
    border-color:#DCE5EE!important;
    color:#42617F!important;
}
.template-clientareainvoices .dataTables_wrapper .page-item.active .page-link{
    border-color:#0B74FF!important;
    background:#0B74FF!important;
    color:#fff!important;
}

/* Status */
.connect-theme .status,
.connect-theme .invoice-status{
    border-radius:999px!important;
    font-weight:850!important;
}
.connect-theme .status{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    min-height:26px;
    padding:3px 9px!important;
    border:1px solid transparent;
    font-size:9px!important;
    line-height:1!important;
}
.connect-status-paid,
.connect-theme .status.Paid,
.connect-theme .invoice-status.paid{
    border-color:#BDE8D1!important;
    background:#ECF9F2!important;
    color:#16754B!important;
}
.connect-status-unpaid,
.connect-theme .status.Unpaid,
.connect-theme .invoice-status.unpaid{
    border-color:#C8DFF9!important;
    background:#EEF6FF!important;
    color:#0B62BD!important;
}
.connect-status-overdue,
.connect-theme .status.Overdue{
    border-color:#F2C8C8!important;
    background:#FFF0F0!important;
    color:#B93B3B!important;
}
.connect-status-cancelled,
.connect-theme .status.Cancelled,
.connect-theme .invoice-status.cancelled{
    border-color:#DBE0E7!important;
    background:#F4F5F7!important;
    color:#707A86!important;
}
.connect-status-refunded,
.connect-theme .status.Refunded,
.connect-theme .invoice-status.refunded{
    border-color:#E5D3F6!important;
    background:#F8F0FF!important;
    color:#8052AA!important;
}

/* Visualização da fatura */
.template-viewinvoice #main-body{
    background:#F2F5F9!important;
}
.template-viewinvoice .connect-invoice-shell{
    max-width:1000px;
    margin:0 auto 28px!important;
    padding:34px!important;
    border:1px solid #D9E3ED!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 20px 55px rgba(8,37,75,.08)!important;
}
.template-viewinvoice .invoice-header{
    margin-bottom:24px!important;
    padding-bottom:22px!important;
    border-bottom:1px solid #E3EAF2!important;
}
.template-viewinvoice .invoice-header h2{
    margin-bottom:6px!important;
    color:#09213F!important;
    font-size:27px!important;
    font-weight:900!important;
}
.template-viewinvoice .invoice-header h3{
    color:#71879E!important;
    font-size:12px!important;
    font-weight:700!important;
}
.template-viewinvoice .invoice-status{
    min-width:108px!important;
    padding:8px 15px!important;
    border:1px solid transparent!important;
    font-size:11px!important;
    letter-spacing:.035em;
}
.template-viewinvoice .invoice-col{
    color:#486079!important;
    font-size:12px!important;
    line-height:1.6!important;
}
.template-viewinvoice .invoice-col strong{
    color:#163552!important;
}
.template-viewinvoice .payment-btn-container{
    margin:16px 0!important;
}
.template-viewinvoice .payment-btn-container .btn,
.template-viewinvoice .connect-payment-cta{
    min-height:45px!important;
    padding-left:20px!important;
    padding-right:20px!important;
    border:0!important;
    border-radius:9px!important;
    background:linear-gradient(135deg,#0B74FF,#078EFF)!important;
    box-shadow:0 11px 28px rgba(11,116,255,.20)!important;
    color:#fff!important;
    font-weight:850!important;
}
.template-viewinvoice .card{
    border:1px solid #E0E8F1!important;
    border-radius:12px!important;
    box-shadow:none!important;
}
.template-viewinvoice .card-header{
    padding:13px 15px!important;
    border-bottom:1px solid #E3EAF2!important;
    background:#F6F9FC!important;
    color:#153655!important;
}
.template-viewinvoice .card-header.bg-success{
    border-color:#BDE8D1!important;
    background:#ECF9F2!important;
    color:#18734B!important;
}
.template-viewinvoice .table-responsive{
    border-radius:10px!important;
}
.template-viewinvoice table th{
    background:#F7F9FC!important;
    color:#60758C!important;
    font-size:10px!important;
    font-weight:900!important;
    text-transform:uppercase;
}
.template-viewinvoice table td{
    color:#334C65!important;
    font-size:11px!important;
}
.template-viewinvoice .total-row td{
    color:#09213F!important;
    font-weight:850!important;
}
.template-viewinvoice .transactions-container{
    margin-top:24px;
    padding-top:22px;
    border-top:1px solid #E4EBF2;
}
.template-viewinvoice .btn-group .btn{
    border-color:#CCD8E5!important;
    background:#fff!important;
    color:#3D5874!important;
}

/* Métodos de pagamento */
.template-account-paymentmethods .card,
.template-account-paymentmethods-manage .card{
    border:1px solid #DFE8F2!important;
    border-radius:14px!important;
    box-shadow:0 10px 28px rgba(8,37,75,.04)!important;
}
.template-account-paymentmethods .card-body,
.template-account-paymentmethods-manage .card-body{
    padding:26px!important;
}
.template-account-paymentmethods #payMethodList{
    margin-top:18px!important;
    border:1px solid #E1E8F1!important;
    border-radius:10px;
}
.template-account-paymentmethods #payMethodList th{
    background:#F6F9FC!important;
    color:#60748A!important;
    font-size:10px!important;
    font-weight:850!important;
}
.template-account-paymentmethods #payMethodList td{
    vertical-align:middle!important;
    color:#344D67!important;
    font-size:12px!important;
}
.template-account-paymentmethods #payMethodList .btn-sm{
    min-height:34px!important;
    border-radius:7px!important;
}
.template-account-paymentmethods-manage .form-group.row{
    margin-bottom:17px!important;
    padding-bottom:16px;
    border-bottom:1px solid #F0F3F7;
}
.template-account-paymentmethods-manage .control-label{
    color:#425D78!important;
    font-size:11px!important;
    font-weight:850!important;
}
.template-account-paymentmethods-manage .submit-container{
    border-bottom:0!important;
}
.template-account-paymentmethods-manage #btnSubmit{
    min-width:160px;
}

/* Adicionar crédito */
.template-clientareaaddfunds .card{
    overflow:hidden;
    border:1px solid #DFE8F2!important;
    border-radius:14px!important;
    box-shadow:0 10px 30px rgba(8,37,75,.04)!important;
}
.template-clientareaaddfunds .card-body{
    padding:25px!important;
}
.template-clientareaaddfunds .table{
    overflow:hidden;
    margin-bottom:0!important;
    border:1px solid #E3EAF2;
    border-radius:9px;
}
.template-clientareaaddfunds .btn-primary.btn-block{
    min-height:46px!important;
    border-radius:9px!important;
    font-weight:850!important;
}

/* Pagamento em massa */
.template-masspay .card,
.template-masspay .panel{
    border:1px solid #DFE8F2!important;
    border-radius:14px!important;
    box-shadow:0 10px 30px rgba(8,37,75,.04)!important;
}
.template-masspay table{
    background:#fff!important;
}
.template-masspay table th{
    background:#F6F9FC!important;
    color:#597089!important;
    font-size:10px!important;
    font-weight:900!important;
}
.template-masspay table td{
    vertical-align:middle!important;
    color:#334E68!important;
    font-size:12px!important;
}

/* Orçamentos */
.template-clientareaquotes .table-container{
    overflow:hidden;
    border:1px solid #DFE8F2;
    border-radius:14px;
    background:#fff;
}
.template-clientareaquotes table{
    margin:0!important;
}
.template-clientareaquotes table th{
    background:#F6F9FC!important;
    color:#5E738A!important;
    font-size:10px!important;
    font-weight:900!important;
}
.template-clientareaquotes table td{
    color:#344E68!important;
    font-size:12px!important;
}

/* Modal de exclusão / confirmação financeira */
.template-account-paymentmethods .modal-content,
.template-account-paymentmethods-manage .modal-content{
    border-radius:14px!important;
}
.template-account-paymentmethods .modal-title,
.template-account-paymentmethods-manage .modal-title{
    color:#173654!important;
    font-weight:850!important;
}

/* Segurança visual sem alterar lógica de pagamento */
.connect-theme .gateway-errors{
    border-radius:10px!important;
}
.connect-theme .cc-details{
    padding:18px;
    border:1px solid #E0E8F1;
    border-radius:12px;
    background:#F9FBFD;
}
.connect-theme .cc-details .form-control{
    background:#fff!important;
}

/* Impressão: não poluir a fatura */
@media print{
    .connect-finance-banner,
    .connect-top,
    .connect-header,
    .connect-footer,
    .connect-whatsapp-float,
    .connect-breadcrumb{
        display:none!important;
    }
    .template-viewinvoice #main-body{
        background:#fff!important;
    }
    .template-viewinvoice .connect-invoice-shell{
        max-width:none!important;
        margin:0!important;
        padding:0!important;
        border:0!important;
        box-shadow:none!important;
    }
}

@media(max-width:991.98px){
    .connect-finance-banner{
        grid-template-columns:44px 1fr;
    }
    .connect-finance-banner>a{
        grid-column:1/-1;
        width:100%;
    }
}
@media(max-width:767.98px){
    .connect-finance-banner{
        margin-bottom:15px;
        padding:12px;
    }
    .template-viewinvoice .connect-invoice-shell{
        padding:20px 16px!important;
        border-radius:12px!important;
    }
    .template-viewinvoice .invoice-header{
        text-align:left!important;
    }
    .template-viewinvoice .invoice-status{
        margin-top:10px;
    }
    .template-account-paymentmethods .card-body,
    .template-account-paymentmethods-manage .card-body,
    .template-clientareaaddfunds .card-body{
        padding:19px!important;
    }
    .template-account-paymentmethods #payMethodList{
        min-width:680px;
    }
}


/* =========================================================
   CONNECT Cliente v2.6.0 — WHMCS LOOP 005
   Suporte, chamados, respostas e acabamento da logomarca
   ========================================================= */

/* Ajuste seguro da marca: usa o arquivo oficial existente */
.connect-brand-logo{
    height:54px!important;
    max-width:255px!important;
    object-fit:contain!important;
    object-position:left center!important;
}
.connect-brand{
    display:flex!important;
    align-items:center!important;
    min-width:255px;
}
.connect-brand-row{
    min-height:78px!important;
}

/* Cabeçalho das páginas de suporte */
.connect-support-page,
.connect-ticket-view-shell,
.connect-ticket-confirm-shell{
    width:100%;
}
.connect-support-page-head{
    min-height:92px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    margin:0 0 20px;
    padding:20px 22px;
    border:1px solid #DCE7F2;
    border-radius:14px;
    background:
        radial-gradient(circle at 94% 10%,rgba(19,146,255,.13),transparent 30%),
        linear-gradient(135deg,#07182F,#0A2A56);
    color:#fff;
    box-shadow:0 13px 34px rgba(8,37,75,.07);
}
.connect-support-page-head span{
    display:block;
    margin-bottom:4px;
    color:#62CCFF;
    font-size:10px;
    font-weight:900;
    letter-spacing:.13em;
}
.connect-support-page-head h1{
    margin:0 0 4px;
    color:#fff;
    font-size:26px;
    font-weight:900;
    letter-spacing:-.025em;
}
.connect-support-page-head p{
    margin:0;
    color:#AFC5DB;
    font-size:12px;
    line-height:1.55;
}
.connect-support-page-head>.btn{
    flex:0 0 auto;
    min-height:42px!important;
    border-radius:9px!important;
}

/* Lista de tickets */
.connect-support-page .table-container{
    overflow:hidden;
    border:1px solid #DFE8F2;
    border-radius:14px;
    background:#fff;
    box-shadow:0 10px 30px rgba(8,37,75,.045);
}
.connect-support-page #tableTicketsList{
    margin:0!important;
}
.connect-support-page #tableTicketsList thead th{
    padding:13px 14px!important;
    border-bottom:1px solid #DDE7F1!important;
    background:#F4F8FC!important;
    color:#546D86!important;
    font-size:10px!important;
    font-weight:900!important;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.connect-support-page #tableTicketsList tbody td{
    padding:15px 14px!important;
    border-top:1px solid #ECF1F6!important;
    color:#38516A!important;
    font-size:12px!important;
    vertical-align:middle!important;
}
.connect-support-page #tableTicketsList tbody tr{
    cursor:pointer;
    transition:background .15s ease;
}
.connect-support-page #tableTicketsList tbody tr:hover td{
    background:#F8FBFE!important;
}
.connect-support-page #tableTicketsList .ticket-number{
    display:block;
    margin-bottom:2px;
    color:#7C91A6;
    font-size:9px;
    font-weight:850;
}
.connect-support-page #tableTicketsList .ticket-subject{
    display:block;
    color:#163A5E;
    font-size:12px;
    font-weight:750;
}
.connect-support-page #tableTicketsList .ticket-subject.unread{
    color:#0B68CC;
    font-weight:900;
}
.connect-support-page #tableTicketsList .status{
    min-width:72px;
}

/* Formulário: abrir ticket */
.connect-ticket-create-form>.card{
    overflow:hidden;
    border:1px solid #DFE8F2!important;
    border-radius:14px!important;
    box-shadow:0 12px 32px rgba(8,37,75,.045)!important;
}
.connect-ticket-create-form>.card>.card-body{
    padding:28px!important;
}
.connect-ticket-form-title{
    margin-bottom:24px;
    padding-bottom:18px;
    border-bottom:1px solid #E5ECF3;
}
.connect-ticket-form-title>span{
    display:block;
    color:#0B74FF;
    font-size:10px;
    font-weight:900;
    letter-spacing:.11em;
}
.connect-ticket-form-title h2{
    margin:5px 0 4px;
    color:#0B2947;
    font-size:23px;
    font-weight:900;
}
.connect-ticket-form-title p{
    margin:0;
    color:#788CA2;
    font-size:12px;
}
.connect-ticket-create-form label{
    margin-bottom:6px!important;
    color:#38526C!important;
    font-size:11px!important;
    font-weight:850!important;
}
.connect-ticket-create-form .form-control{
    min-height:46px!important;
    border-color:#CAD8E7!important;
    border-radius:9px!important;
}
.connect-ticket-create-form textarea.form-control{
    min-height:190px!important;
    line-height:1.6!important;
}
.connect-ticket-create-form .custom-file-label{
    min-height:44px;
    display:flex;
    align-items:center;
    border-color:#CAD8E7!important;
    border-radius:9px!important;
}
.connect-ticket-create-form .custom-file-label::after{
    min-height:42px;
    display:flex;
    align-items:center;
}
.connect-ticket-create-form #btnTicketAttachmentsAdd{
    min-height:44px!important;
    border-radius:0 9px 9px 0!important;
}
.connect-ticket-create-form #customFieldsContainer{
    margin-top:18px;
}
.connect-ticket-submit-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:22px;
    padding-top:20px;
    border-top:1px solid #E7EDF4;
}
.connect-ticket-submit-actions small{
    color:#8195AA;
    font-size:10px;
}
.connect-ticket-submit-actions>div{
    display:flex;
    gap:8px;
}
.connect-ticket-submit-actions .btn{
    min-width:128px;
}

/* Sugestões da base de conhecimento */
.connect-ticket-kb-suggestions{
    margin:18px 0;
    padding:18px;
    border:1px solid #CCE1F6;
    border-radius:13px;
    background:#F4F9FE;
}
.connect-ticket-kb-heading{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:12px;
    align-items:start;
}
.connect-ticket-kb-heading>i{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#E2F1FF;
    color:#0B74FF;
}
.connect-ticket-kb-suggestions h3{
    color:#153B61!important;
    font-size:15px!important;
    font-weight:900!important;
}
.connect-ticket-kb-suggestions p{
    color:#71869D!important;
    font-size:11px!important;
}
.connect-ticket-kb-suggestions .list-group-item{
    margin-bottom:7px;
    border:1px solid #D7E5F3!important;
    border-radius:9px!important;
    background:#fff!important;
}

/* Visualização de ticket */
.connect-ticket-view-shell>.view-ticket{
    overflow:hidden;
    border:1px solid #DDE7F1!important;
    border-radius:15px!important;
    box-shadow:0 12px 34px rgba(8,37,75,.05)!important;
}
.connect-ticket-view-shell>.view-ticket>.card-body:first-child{
    padding:20px 22px!important;
    border-bottom:1px solid #E3EAF2!important;
    background:#F8FAFD;
}
.connect-ticket-view-shell .view-ticket .card-title{
    color:#0C2D4D!important;
    font-size:20px!important;
    font-weight:900!important;
}
.connect-ticket-view-shell .ticket-actions .btn{
    min-height:37px!important;
    border-radius:8px!important;
}
.connect-ticket-view-shell .ticket-reply{
    overflow:hidden;
    border:1px solid #DFE8F2!important;
    border-radius:12px!important;
    background:#fff;
}
.connect-ticket-view-shell .ticket-reply.staff{
    border-color:#C8DFF7!important;
    background:#FBFDFF;
}
.connect-ticket-view-shell .ticket-reply .posted-by{
    min-height:42px;
    display:flex;
    align-items:center;
    padding:9px 12px!important;
    border-bottom:1px solid #E7EDF4;
    background:#F5F8FC!important;
    color:#657B92!important;
    font-size:10px!important;
}
.connect-ticket-view-shell .ticket-reply.staff .posted-by{
    background:#EDF6FF!important;
}
.connect-ticket-view-shell .ticket-reply .posted-by-name{
    color:#193A5B!important;
    font-weight:900!important;
}
.connect-ticket-view-shell .ticket-reply .message{
    padding:18px!important;
    color:#344E68!important;
    font-size:13px!important;
    line-height:1.7!important;
}
.connect-ticket-view-shell .ticket-reply .attachments{
    border-top:1px solid #E8EEF4;
    background:#FAFCFE;
}
.connect-ticket-view-shell .attachment-list figure{
    border-radius:8px!important;
    background:#EEF6FF!important;
    color:#0B74FF!important;
}
.connect-ticket-view-shell #ticketReplyContainer{
    overflow:hidden;
    margin-top:20px;
    border:1px solid #DDE7F1!important;
    border-radius:14px!important;
    box-shadow:0 10px 28px rgba(8,37,75,.04)!important;
}
.connect-ticket-view-shell #ticketReplyContainer>.card-body{
    padding:25px!important;
}
.connect-ticket-view-shell #ticketReplyContainer textarea{
    min-height:180px!important;
}
.connect-ticket-view-shell #ticketReplyContainer .btn-primary{
    min-width:130px;
}

/* Confirmação de ticket */
.connect-ticket-confirm-shell{
    max-width:760px;
    margin:10px auto 30px;
}
.connect-ticket-confirm-shell>.card{
    overflow:hidden;
    border:1px solid #CDE9DB!important;
    border-radius:15px!important;
    background:#fff!important;
    box-shadow:0 16px 38px rgba(8,65,44,.07)!important;
}
.connect-ticket-confirm-shell>.card>.card-body{
    padding:35px 28px!important;
    text-align:center;
}
.connect-confirm-icon{
    width:62px;
    height:62px;
    display:grid;
    place-items:center;
    margin:0 auto 15px;
    border-radius:50%;
    background:#EAF8F1;
    color:#15925B;
    font-size:25px;
}
.connect-ticket-confirm-shell .card-title{
    color:#164A36!important;
    font-size:24px!important;
    font-weight:900!important;
}
.connect-ticket-confirm-shell .alert-success{
    border-color:#CDE9DB!important;
    background:#F1FBF6!important;
    color:#27664C!important;
}

/* Mobile */
@media(max-width:1199.98px){
    .connect-brand{min-width:220px}
    .connect-brand-logo{height:50px!important;max-width:230px!important}
}
@media(max-width:767.98px){
    .connect-brand{min-width:0}
    .connect-brand-row{min-height:68px!important}
    .connect-brand-logo{height:43px!important;max-width:200px!important}
    .connect-support-page-head{
        display:grid;
        padding:17px;
    }
    .connect-support-page-head>.btn{width:100%}
    .connect-ticket-create-form>.card>.card-body,
    .connect-ticket-view-shell #ticketReplyContainer>.card-body{
        padding:19px!important;
    }
    .connect-ticket-submit-actions{
        display:grid;
    }
    .connect-ticket-submit-actions>div{
        display:grid;
        grid-template-columns:1fr;
    }
    .connect-ticket-submit-actions .btn{
        width:100%;
    }
    .connect-ticket-view-shell .ticket-actions{
        float:none!important;
        display:flex;
        gap:6px;
        margin-top:12px!important;
    }
    .connect-ticket-view-shell .ticket-reply .posted-by{
        display:block;
    }
}


.connect-ticket-open{border-color:#C7DCF7!important;background:#EEF6FF!important;color:#0B63BD!important}
.connect-ticket-answered{border-color:#BFE9D3!important;background:#EDF9F3!important;color:#177650!important}
.connect-ticket-replied{border-color:#F0D7AC!important;background:#FFF8EA!important;color:#A2670D!important}
.connect-ticket-closed{border-color:#D9E0E8!important;background:#F3F5F7!important;color:#6A7785!important}


/* =========================================================
   CONNECT Cliente v2.6.1 — WHMCS LOOP 006 SAFE
   Ajustes incrementais sobre a base estável v2.6.0.
   Mantém a estrutura e os assets do tema que já está funcionando.
   ========================================================= */

/* Header mais compacto, sem duplicar a navegação do WHMCS */
.connect-brand-row{
    min-height:68px!important;
    padding:5px 0!important;
    background:#020817!important;
}
.connect-brand-container{gap:18px}
.connect-brand-logo{
    height:46px!important;
    max-width:220px!important;
}
.connect-public-nav-simple{
    margin-left:auto;
    margin-right:2px;
}
.connect-public-nav-simple .connect-back-site{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:0 11px;
    border:1px solid rgba(67,140,224,.28);
    border-radius:8px;
    background:rgba(8,39,78,.42);
    color:#D5E7F8!important;
    font-size:11px;
}
.connect-public-nav-simple .connect-back-site:hover{
    border-color:rgba(91,174,255,.45);
    background:rgba(11,85,170,.22);
}
.connect-header-actions{gap:6px}
.connect-client-btn,
.connect-cart-btn,
.connect-menu-toggle{
    min-height:38px;
    border-radius:8px;
}
.connect-client-btn{padding:0 12px}
.connect-cart-btn,.connect-menu-toggle{width:38px}
.connect-native-nav{min-height:44px!important}
.connect-native-nav .navbar-nav>li>a{padding:12px 10px!important}

/* Preview administrativo: não ocupa uma faixa vertical enorme na lateral */
.btn-return-to-admin{
    top:auto!important;
    right:16px!important;
    bottom:82px!important;
    width:auto!important;
    height:38px!important;
    padding:0 11px!important;
    border-radius:8px!important;
    transform:none!important;
    writing-mode:horizontal-tb!important;
    font-size:10px!important;
}

/* Hero menos alto e mais equilibrado, mantendo a identidade existente */
.connect-client-hero{padding:52px 0 62px!important}
.connect-client-hero-grid{
    grid-template-columns:minmax(0,1fr) 390px!important;
    gap:44px!important;
}
.connect-client-hero-copy h1{
    max-width:650px!important;
    margin:14px 0 12px!important;
    font-size:clamp(38px,4.1vw,54px)!important;
    line-height:1.04!important;
}
.connect-client-hero-copy>p{
    max-width:620px!important;
    font-size:16px!important;
    line-height:1.6!important;
}
.connect-client-hero-actions{margin-top:21px!important}
.connect-client-trust{margin-top:19px!important}
.connect-client-console{
    border-radius:14px!important;
    transform:none!important;
    box-shadow:0 22px 48px rgba(0,0,0,.23)!important;
}
.connect-console-content{min-height:230px!important;grid-template-columns:54px 1fr!important}
.connect-console-side{padding:15px 9px!important;gap:13px!important}
.connect-console-main{padding:19px!important}
.connect-console-metrics{margin-top:15px!important}
.connect-console-metrics div{padding:11px!important}
.connect-console-chart{height:86px!important;margin-top:15px!important}

/* Menos espaços vazios entre as seções */
.connect-client-section,
.connect-products-section,
.connect-help-section{padding:62px 0!important}
.connect-client-section-head{margin-bottom:26px!important}
.connect-client-section-head h2,
.connect-help-copy h2{font-size:31px!important}
.connect-client-action{min-height:84px!important;border-radius:12px!important}
.connect-product-group-card{min-height:205px!important;padding:21px!important;border-radius:13px!important}
.connect-help-card{min-height:128px!important;padding:18px!important;border-radius:12px!important}
.connect-help-card strong{margin-top:15px!important}

/* Footer ligeiramente mais compacto */
.connect-footer{padding-top:42px!important}
.connect-footer-top{padding-bottom:30px!important}
.connect-footer-bottom{min-height:54px!important}

@media(max-width:1199.98px){
    .connect-client-hero-grid{grid-template-columns:1fr 350px!important;gap:30px!important}
}
@media(max-width:991.98px){
    .connect-client-hero{padding:48px 0 58px!important}
    .connect-client-hero-grid{grid-template-columns:1fr!important}
    .connect-client-console{max-width:560px!important}
}
@media(max-width:767.98px){
    .connect-brand-row{min-height:64px!important}
    .connect-brand-logo{height:41px!important;max-width:190px!important}
    .connect-native-nav{padding:6px 0!important}
    .connect-mobile-institutional{grid-template-columns:1fr 1fr!important}
    .connect-client-hero{padding:44px 0 56px!important}
    .connect-client-hero-copy h1{font-size:36px!important}
    .connect-client-section,
    .connect-products-section,
    .connect-help-section{padding:50px 0!important}
}
@media(max-width:420px){
    .connect-brand-logo{height:38px!important;max-width:172px!important}
    .connect-mobile-institutional{grid-template-columns:1fr!important}
}


/* =========================================================
   CONNECT Cliente v2.6.2 — WHMCS LOOP 007 SAFE
   Recursos inspirados em temas premium sem alterar o core
   ========================================================= */

.connect-client-promo{
    border-bottom:1px solid rgba(109,168,228,.20);
    background:#06152C;
}
.connect-client-promo-inner{
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    color:#BFD4E9;
    font-size:10px;
    font-weight:700;
}
.connect-client-promo-inner>span{
    display:flex;
    align-items:center;
    gap:7px;
}
.connect-client-promo-inner>span i{
    color:#4DC9FF;
}
.connect-client-promo-inner>a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#6BD2FF;
    font-size:10px;
    font-weight:850;
    text-decoration:none;
}
.connect-client-promo-inner>a:hover{
    color:#fff;
}

.connect-client-hero-grid-simple{
    grid-template-columns:minmax(0,760px)!important;
    justify-content:start;
}
.connect-client-hero-grid-simple .connect-client-hero-copy{
    max-width:760px;
}

.connect-client-alerts{
    margin-top:22px;
    margin-bottom:4px;
}
.connect-client-alerts-head{
    display:flex;
    align-items:baseline;
    gap:10px;
    margin-bottom:10px;
}
.connect-client-alerts-head>span{
    color:#0B74FF;
    font-size:9px;
    font-weight:900;
    letter-spacing:.10em;
}
.connect-client-alerts-head>strong{
    color:#1D3A57;
    font-size:12px;
}
.connect-client-alerts-list{
    display:grid;
    gap:8px;
}
.connect-client-alert{
    min-height:48px;
    display:grid;
    grid-template-columns:30px minmax(0,1fr) 16px;
    gap:9px;
    align-items:center;
    padding:8px 11px;
    border:1px solid #DDE7F1;
    border-radius:10px;
    background:#fff;
    color:#36516C;
    font-size:10px;
    font-weight:700;
    text-decoration:none;
}
.connect-client-alert:hover{
    background:#F9FCFF;
}
.connect-client-alert>i:first-child{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:#EDF6FF;
    color:#0B74FF;
}
.connect-client-alert-warning{
    border-color:#F0D9B5;
    background:#FFF9F0;
}
.connect-client-alert-warning>i:first-child{
    background:#FFF0CF;
    color:#B77A18;
}
.connect-client-alert-danger{
    border-color:#F1CCCC;
    background:#FFF5F5;
}
.connect-client-alert-danger>i:first-child{
    background:#FFE7E7;
    color:#C14545;
}
.connect-client-alert-success{
    border-color:#CBE7D8;
    background:#F5FBF8;
}
.connect-client-alert-success>i:first-child{
    background:#E8F7EF;
    color:#16815A;
}

@media(max-width:767.98px){
    .connect-client-promo-inner{
        min-height:44px;
        justify-content:space-between;
        gap:10px;
        padding-top:6px;
        padding-bottom:6px;
    }
    .connect-client-promo-inner>span{
        line-height:1.35;
    }
    .connect-client-promo-inner>a{
        flex:0 0 auto;
        white-space:nowrap;
    }
    .connect-client-alerts-head{
        display:grid;
        gap:2px;
    }
}


/* =========================================================
   CONNECT Cliente v2.6.4 — WHMCS LOOP 009 SAFE
   Refino do bloco "Serviços CONNECT" para 1 grupo de produto
   ========================================================= */

.connect-product-groups{
    align-items:stretch;
}

.connect-product-group-card{
    position:relative;
    overflow:hidden;
    min-height:238px;
    padding:24px;
    border-radius:24px;
    background:linear-gradient(180deg,rgba(14,41,84,.96),rgba(6,25,54,.98));
    box-shadow:0 18px 42px rgba(0,0,0,.16);
}

.connect-product-group-card::after{
    content:"";
    position:absolute;
    inset:auto -40px -48px auto;
    width:160px;
    height:160px;
    border-radius:999px;
    background:radial-gradient(circle at center, rgba(65,187,255,.18), rgba(65,187,255,0));
    pointer-events:none;
}

.connect-product-group-icon{
    width:48px;
    height:48px;
    border-radius:15px;
}

.connect-product-group-card h3{
    margin:18px 0 10px;
    font-size:20px;
    line-height:1.25;
}

.connect-product-group-card p{
    min-height:auto;
    max-width:42ch;
    margin:0 0 18px;
    font-size:13px;
    line-height:1.6;
}

.connect-product-group-card .btn{
    min-height:40px;
    padding:0 16px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-weight:800;
}

.connect-product-groups-single{
    grid-template-columns:minmax(320px,460px);
    justify-content:center;
}

.connect-product-group-card-single{
    min-height:226px;
}

@media(max-width:767.98px){
    .connect-product-group-card{
        border-radius:20px;
        padding:20px;
    }
}


/* =========================================================
   CONNECT Cliente v2.6.5 — WHMCS LOOP 010 FINAL POLISH
   Acabamento comercial sem alterar a estrutura estável v2.6.x
   ========================================================= */

/* Ritmo visual */
.connect-client-home .container,
.connect-main-inner>.container,
.connect-products-section>.container,
.connect-help-section.container{
    max-width:1180px;
}

.connect-client-section-head,
.connect-help-copy{
    max-width:760px;
}

.connect-client-section-head h2,
.connect-help-copy h2{
    line-height:1.15;
    letter-spacing:-.02em;
}

/* Cards e blocos */
.connect-client-action,
.connect-product-group-card,
.connect-help-card,
.connect-support-department,
.connect-support-alternatives>a,
.connect-channel,
.connect-client-alert,
.connect-contact-card,
.connect-support-card,
.connect-ticket-create-form>.card,
.connect-ticket-view-shell>.view-ticket,
.connect-ticket-view-shell #ticketReplyContainer,
.connect-theme .card,
.connect-theme .panel{
    border-radius:18px;
}

.connect-client-action,
.connect-help-card,
.connect-support-department,
.connect-support-alternatives>a,
.connect-channel,
.connect-client-alert{
    transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}

.connect-client-action:hover,
.connect-help-card:hover,
.connect-support-department:hover,
.connect-support-alternatives>a:hover,
.connect-channel:hover,
.connect-client-alert:hover{
    transform:translateY(-1px);
}

/* Botões */
.connect-theme .btn,
.connect-client-home .btn{
    border-radius:11px;
}

.connect-product-group-card .btn{
    border-radius:12px;
}

/* Formulários */
.connect-theme .form-control,
.connect-theme .field,
.connect-theme select.form-control{
    border-radius:10px;
}

/* Estados vazios e alertas */
.connect-theme .alert.alert-info,
.connect-theme .alert-info,
.connect-theme .no-data,
.connect-theme .empty-state{
    border-color:#D8E6F4;
    border-radius:14px;
    background:#F7FBFF;
    color:#4D6780;
}

.connect-theme .alert.alert-info a,
.connect-theme .alert-info a{
    color:#0B64C1;
    font-weight:800;
}

/* Tabelas */
.connect-theme .table-responsive,
.connect-theme .table-container{
    border-radius:14px;
}

.connect-theme table.table thead th{
    padding-top:12px;
    padding-bottom:12px;
}

.connect-theme table.table tbody td{
    padding-top:12px;
    padding-bottom:12px;
}

/* Logo */
.connect-brand-logo{
    object-fit:contain;
    object-position:left center;
}

.connect-brand-container{
    min-width:0;
}

/* Produto único */
.connect-product-groups-single{
    grid-template-columns:minmax(340px,520px);
}

.connect-product-group-card-single{
    width:100%;
    min-height:230px;
}

/* Suporte */
.connect-support-unavailable{
    border-radius:16px;
}

.connect-ticket-confirm-shell>.card{
    border-radius:18px;
}

/* Footer */
.connect-footer-column h4{
    letter-spacing:.01em;
}

.connect-footer-column>a,
.connect-footer-brand>a{
    line-height:1.5;
}

/* Mobile */
@media(max-width:767.98px){
    .connect-whatsapp-float{
        right:14px;
        bottom:14px;
    }

    .connect-client-action,
    .connect-help-card,
    .connect-product-group-card,
    .connect-contact-card,
    .connect-support-card,
    .connect-theme .card,
    .connect-theme .panel{
        border-radius:16px;
    }

    .connect-client-section-head h2,
    .connect-help-copy h2{
        font-size:27px;
    }
}

@media(max-width:430px){
    .connect-product-groups-single{
        grid-template-columns:1fr;
    }

    .connect-client-action,
    .connect-help-card{
        min-width:0;
    }
}

/* =========================================================
   CONNECT Cliente v2.6.9 — LOOP 015 FINAL
   Seção de planos estabilizada, cache-safe e pronta para homologação
   ========================================================= */

body.connect-theme .connect-growth-section{
    position:relative;
    isolation:isolate;
    padding:68px 0 82px;
    background:linear-gradient(180deg,#031126 0%,#071a36 100%);
    color:#fff;
}

body.connect-theme .connect-growth-section::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background:
        radial-gradient(circle at 50% 0%,rgba(18,119,255,.12),transparent 32%),
        linear-gradient(180deg,rgba(2,15,34,.08),rgba(2,15,34,0));
}

body.connect-theme .connect-growth-section .connect-client-section-head{
    max-width:820px;
    margin:0 auto 30px;
    text-align:center;
}

body.connect-theme .connect-growth-section .connect-client-section-head>span{
    display:block;
    margin-bottom:8px;
    color:#28a8ff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.14em;
}

body.connect-theme .connect-growth-section .connect-client-section-head h2{
    margin:0 0 10px;
    color:#fff;
    font-size:34px;
    line-height:1.15;
    font-weight:900;
    letter-spacing:-.025em;
}

body.connect-theme .connect-growth-section .connect-client-section-head p{
    margin:0;
    color:#a9bfd8;
    font-size:14px;
    line-height:1.6;
}

.connect-growth-group{
    margin-top:18px;
}

.connect-growth-recommendations{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-width:1040px;
    margin:0 auto 20px;
    overflow:hidden;
    border:1px solid rgba(77,145,224,.36);
    border-radius:14px;
    background:#071a34;
}

.connect-growth-recommendation{
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:9px 14px;
    color:#e4eef9;
    border-right:1px solid rgba(77,145,224,.22);
    text-align:center;
    font-size:11px;
}

.connect-growth-recommendation:last-child{
    border-right:0;
}

.connect-growth-recommendation span{
    color:#91abc7;
}

.connect-growth-recommendation strong{
    color:#fff;
    font-weight:850;
}

.connect-growth-recommendation.is-featured{
    background:rgba(25,100,205,.16);
}

.connect-growth-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    max-width:1120px;
    margin:0 auto 18px;
}

.connect-growth-group-name{
    color:#dbe8f7;
    font-size:12px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.connect-billing-toggle{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:4px;
    border:1px solid rgba(77,145,224,.35);
    border-radius:999px;
    background:#071a34;
}

.connect-billing-toggle button{
    min-width:76px;
    min-height:34px;
    padding:0 15px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:#bed0e3;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
}

.connect-billing-toggle button.is-active{
    background:linear-gradient(90deg,#0d74ff,#3c9dff);
    color:#fff;
    box-shadow:0 7px 18px rgba(13,116,255,.26);
}

.connect-plan-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    max-width:1120px;
    margin:0 auto;
}

.connect-plan-grid.is-single{
    grid-template-columns:minmax(320px,520px);
    justify-content:center;
}

.connect-plan-grid.is-double{
    grid-template-columns:repeat(2,minmax(300px,1fr));
    max-width:820px;
}

body.connect-theme .connect-plan-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    min-height:100%;
    padding:22px 22px 20px;
    border:1px solid rgba(48,134,238,.46);
    border-radius:22px;
    background:linear-gradient(180deg,#0a2145 0%,#07182f 100%);
    color:#fff;
    box-shadow:0 18px 34px rgba(0,0,0,.18);
}

body.connect-theme .connect-plan-card.is-featured{
    border-color:#2996ff;
    box-shadow:0 20px 40px rgba(18,113,233,.20);
}

.connect-plan-badge{
    position:absolute;
    top:-12px;
    left:50%;
    transform:translateX(-50%);
    min-height:26px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 14px;
    border-radius:999px;
    background:linear-gradient(90deg,#2481ff,#645cff);
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
    white-space:nowrap;
}

.connect-plan-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    margin-bottom:14px;
    border:1px solid rgba(52,157,255,.7);
    border-radius:11px;
    background:#092650;
    color:#29a6ff;
    font-size:16px;
}

body.connect-theme .connect-plan-card h3{
    margin:0 0 7px;
    color:#fff;
    font-size:19px;
    line-height:1.25;
    font-weight:900;
}

body.connect-theme .connect-plan-card p{
    min-height:40px;
    margin:0 0 18px;
    color:#b8cce3;
    font-size:12px;
    line-height:1.55;
}

.connect-plan-price-stack{
    margin:0 0 17px;
}

.connect-plan-price{
    display:flex;
    align-items:flex-end;
    gap:6px;
    color:#fff;
}

.connect-plan-currency{
    padding-bottom:3px;
    color:#fff;
    font-size:16px;
    font-weight:900;
}

.connect-plan-price strong{
    color:#fff;
    font-size:34px;
    line-height:1;
    font-weight:900;
    letter-spacing:-.035em;
}

.connect-plan-price small{
    padding-bottom:3px;
    color:#d6e3f1;
    font-size:12px;
}

.connect-plan-note{
    margin-top:5px;
    color:#8fa9c5;
    font-size:11px;
    line-height:1.4;
}

.connect-price-annual,
.connect-price-annual-note{
    display:none;
}

.connect-growth-section[data-connect-billing="annual"] .connect-price-monthly,
.connect-growth-section[data-connect-billing="annual"] .connect-price-monthly-note{
    display:none;
}

.connect-growth-section[data-connect-billing="annual"] .connect-price-annual{
    display:flex;
}

.connect-growth-section[data-connect-billing="annual"] .connect-price-annual-note{
    display:block;
}

.connect-plan-features{
    list-style:none;
    margin:0 0 18px;
    padding:0;
}

.connect-plan-features li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:8px;
    color:#e5effa;
    font-size:12px;
    line-height:1.45;
}

.connect-plan-features li i{
    flex:0 0 auto;
    margin-top:3px;
    color:#41cb8a;
    font-size:10px;
}

body.connect-theme .connect-plan-cta{
    width:100%;
    min-height:44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:auto;
    border-radius:10px;
    background:linear-gradient(90deg,#0f74f7,#238cff);
    color:#fff;
    font-size:12px;
    font-weight:900;
    text-decoration:none;
    box-shadow:0 9px 22px rgba(13,116,255,.18);
}

body.connect-theme .connect-plan-cta:hover{
    background:linear-gradient(90deg,#0965db,#1c7ee8);
    color:#fff;
    transform:translateY(-1px);
}

.connect-plan-grid-fallback{
    grid-template-columns:minmax(300px,480px);
    justify-content:center;
}

@media(max-width:991.98px){
    .connect-growth-recommendations{
        grid-template-columns:1fr;
        max-width:620px;
    }

    .connect-growth-recommendation{
        border-right:0;
        border-bottom:1px solid rgba(77,145,224,.22);
    }

    .connect-growth-recommendation:last-child{
        border-bottom:0;
    }

    .connect-plan-grid,
    .connect-plan-grid.is-double{
        grid-template-columns:repeat(2,minmax(0,1fr));
        max-width:820px;
    }
}

@media(max-width:767.98px){
    body.connect-theme .connect-growth-section{
        padding:54px 0 68px;
    }

    body.connect-theme .connect-growth-section .connect-client-section-head h2{
        font-size:28px;
    }

    .connect-growth-toolbar{
        align-items:flex-start;
    }

    .connect-plan-grid,
    .connect-plan-grid.is-single,
    .connect-plan-grid.is-double{
        grid-template-columns:1fr;
        max-width:540px;
    }
}

@media(max-width:430px){
    .connect-growth-toolbar{
        display:grid;
        grid-template-columns:1fr;
    }

    .connect-billing-toggle{
        width:max-content;
        max-width:100%;
    }

    body.connect-theme .connect-plan-card{
        padding:19px 18px 18px;
        border-radius:18px;
    }

    .connect-plan-price strong{
        font-size:30px;
    }
}


/* =========================================================
   CONNECT Final — LOOP 017
   Logo neon aprovada + domínio estável
   ========================================================= */
body.connect-theme .connect-brand-row{min-height:104px!important;padding:8px 0!important;background:#020817!important}
body.connect-theme .connect-brand{display:flex!important;align-items:center!important;min-width:0!important}
body.connect-theme .connect-brand-logo{
  width:330px!important;max-width:330px!important;height:auto!important;max-height:none!important;
  object-fit:contain!important;object-position:left center!important;
}
body.connect-theme .connect-footer-logo{
  width:315px!important;max-width:100%!important;height:auto!important;max-height:none!important;
  object-fit:contain!important;filter:drop-shadow(0 4px 12px rgba(0,150,255,.16))!important;opacity:1!important;
}
/* Remove qualquer conversão monocromática herdada */
body.connect-theme .connect-brand-logo,body.connect-theme .connect-footer-logo{mix-blend-mode:normal!important}

/* Busca da home sem sobrepor alertas/hero */
body.connect-theme .connect-domain-quick{
  position:relative!important;z-index:2!important;margin-top:28px!important;margin-bottom:0!important;
  padding:23px 25px!important;grid-template-columns:minmax(250px,.9fr) minmax(400px,1.35fr)!important;
  gap:26px!important;box-shadow:0 16px 42px rgba(7,26,54,.10)!important;
}
body.connect-theme .connect-client-alerts + .connect-domain-quick{margin-top:26px!important}
body.connect-theme .connect-domain-quick-form{display:grid!important;grid-template-columns:minmax(0,1fr) 184px!important;gap:10px!important;width:100%!important;align-items:stretch!important}
body.connect-theme .connect-domain-quick-form input{min-width:0!important;width:100%!important;height:52px!important}
body.connect-theme .connect-domain-quick-form .btn{min-height:52px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;white-space:nowrap!important}

/* Busca nativa do standard_cart: só layout; resultado continua 100% do WHMCS */
body.connect-theme #order-standard_cart .domain-checker-container{overflow:visible!important;border-radius:16px!important}
body.connect-theme #order-standard_cart .domain-checker-bg{overflow:visible!important;padding:28px 24px!important}
body.connect-theme #order-standard_cart .domain-checker-bg form{margin:0!important}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group{display:flex!important;flex-wrap:nowrap!important;align-items:stretch!important;width:100%!important;max-width:860px!important;margin:0 auto!important}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group>.form-control,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[type="text"]{
  flex:1 1 auto!important;width:1%!important;min-width:0!important;min-height:58px!important;margin:0!important;
  border:2px solid #73d9ef!important;border-right:0!important;border-radius:12px 0 0 12px!important;
  padding:0 18px!important;background:#fff!important;color:#17283e!important;box-shadow:none!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group-append,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group-btn,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group>span{display:flex!important;flex:0 0 auto!important;width:auto!important;margin:0!important}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn,
body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"]{
  position:static!important;transform:none!important;visibility:visible!important;opacity:1!important;
  min-width:200px!important;min-height:58px!important;margin:0!important;padding:0 22px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  border:2px solid #0b74ff!important;border-radius:0 12px 12px 0!important;
  background:linear-gradient(180deg,#1688ff,#0b6de5)!important;color:#fff!important;font-weight:850!important;white-space:nowrap!important;
}
/* Usa classes nativas do WHMCS. Não deduz disponibilidade pelo texto. */
body.connect-theme #order-standard_cart .domain-available,
body.connect-theme #order-standard_cart .domain-checker-result-headline.domain-available{color:#157347!important;background:#eefaf3!important;border-color:#b7e3c8!important}
body.connect-theme #order-standard_cart .domain-unavailable,
body.connect-theme #order-standard_cart .domain-checker-result-headline.domain-unavailable{color:#b42318!important;background:#fff4f4!important;border-color:#efc2c2!important}

@media(max-width:1199.98px){body.connect-theme .connect-brand-logo{width:290px!important;max-width:290px!important}body.connect-theme .connect-brand-row{min-height:94px!important}}
@media(max-width:991.98px){body.connect-theme .connect-brand-logo{width:245px!important;max-width:245px!important}body.connect-theme .connect-domain-quick{grid-template-columns:1fr!important;gap:17px!important;margin-top:24px!important}}
@media(max-width:767.98px){body.connect-theme .connect-brand-logo{width:210px!important;max-width:210px!important}body.connect-theme .connect-domain-quick{padding:18px!important}body.connect-theme .connect-domain-quick-form{grid-template-columns:1fr!important}body.connect-theme .connect-domain-quick-form .btn{width:100%!important}body.connect-theme .connect-footer-logo{width:280px!important}}
@media(max-width:575.98px){body.connect-theme .connect-brand-logo{width:185px!important;max-width:185px!important}body.connect-theme #order-standard_cart .domain-checker-bg{padding:20px 14px!important}body.connect-theme #order-standard_cart .domain-checker-bg .input-group{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}body.connect-theme #order-standard_cart .domain-checker-bg .input-group>.form-control,body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[type="text"]{width:100%!important;border:2px solid #73d9ef!important;border-radius:11px!important}body.connect-theme #order-standard_cart .domain-checker-bg .input-group-append,body.connect-theme #order-standard_cart .domain-checker-bg .input-group-btn,body.connect-theme #order-standard_cart .domain-checker-bg .input-group>span{width:100%!important}body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn,body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"]{width:100%!important;min-width:0!important;border-radius:11px!important}}

/* =========================================================
   CONNECT Final — LOOP 018
   Header aprovado + acabamento final de navegação
   ========================================================= */

/* A logo superior agora usa SEMPRE o PNG aprovado local do LOOP 018.
   Nenhum valor antigo de logo_header_url pode substituí-la. */
body.connect-theme .connect-brand-row{
    min-height:136px!important;
    padding:8px 0!important;
    background:
        radial-gradient(circle at 14% 50%,rgba(0,132,255,.13),transparent 28%),
        #020817!important;
    overflow:visible!important;
}
body.connect-theme .connect-brand-container{
    min-height:118px!important;
    align-items:center!important;
}
body.connect-theme .connect-brand{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
}
body.connect-theme .connect-brand-logo{
    display:block!important;
    width:355px!important;
    max-width:355px!important;
    height:auto!important;
    max-height:118px!important;
    object-fit:contain!important;
    object-position:left center!important;
opacity:1!important;
    mix-blend-mode:normal!important;
}

/* Mantém o rodapé aprovado; somente garante que regras antigas não alterem a imagem. */
body.connect-theme .connect-footer-logo{
    mix-blend-mode:normal!important;
    opacity:1!important;
}

/* Navegação mais limpa e sem vazamento de itens muito longos. */
body.connect-theme .connect-native-nav .navbar-nav>li>a{
    line-height:1.25!important;
}
body.connect-theme .connect-native-nav .dropdown-menu{
    max-width:min(360px,calc(100vw - 24px))!important;
}
body.connect-theme .connect-native-nav .dropdown-item{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
}

/* Cart/Lookup: reforço final para manter botão visível em todos os breakpoints. */
body.connect-theme #order-standard_cart .domain-checker-bg .input-group{
    overflow:visible!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn,
body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"]{
    z-index:2!important;
    flex:0 0 auto!important;
}

@media(max-width:1199.98px){
    body.connect-theme .connect-brand-row{min-height:122px!important}
    body.connect-theme .connect-brand-container{min-height:104px!important}
    body.connect-theme .connect-brand-logo{width:315px!important;max-width:315px!important;max-height:104px!important}
}
@media(max-width:991.98px){
    body.connect-theme .connect-brand-row{min-height:104px!important}
    body.connect-theme .connect-brand-container{min-height:88px!important}
    body.connect-theme .connect-brand-logo{width:260px!important;max-width:260px!important;max-height:88px!important}
}
@media(max-width:767.98px){
    body.connect-theme .connect-brand-row{min-height:88px!important}
    body.connect-theme .connect-brand-container{min-height:72px!important}
    body.connect-theme .connect-brand-logo{width:218px!important;max-width:218px!important;max-height:72px!important}
}
@media(max-width:420px){
    body.connect-theme .connect-brand-logo{width:190px!important;max-width:190px!important;max-height:66px!important}
}


/* =========================================================
   CONNECT Final — LOOP 019
   Correção definitiva do botão de domínio + estabilidade do lookup
   ========================================================= */

/* Desktop: campo + botão com medidas que cabem dentro do card sem recorte. */
body.connect-theme #order-standard_cart .domain-checker-bg .input-group{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 156px!important;
    align-items:stretch!important;
    gap:0!important;
    width:100%!important;
    max-width:760px!important;
    margin:0 auto!important;
    overflow:visible!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group>.form-control,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[type="text"],
body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[name="query"],
body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[name="domain"]{
    width:100%!important;
    min-width:0!important;
    height:58px!important;
    min-height:58px!important;
    border:2px solid #73d9ef!important;
    border-right:0!important;
    border-radius:12px 0 0 12px!important;
    padding:0 18px!important;
    font-size:16px!important;
    line-height:1.2!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group-append,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group-btn,
body.connect-theme #order-standard_cart .domain-checker-bg .input-group>span{
    display:block!important;
    width:156px!important;
    min-width:156px!important;
    margin:0!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn,
body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"],
body.connect-theme #order-standard_cart .domain-checker-bg input[type="submit"]{
    width:156px!important;
    min-width:156px!important;
    max-width:156px!important;
    height:58px!important;
    min-height:58px!important;
    padding:0 12px!important;
    margin:0!important;
    border:2px solid #0b74ff!important;
    border-radius:0 12px 12px 0!important;
    background:linear-gradient(180deg,#1688ff,#0b6de5)!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:static!important;
    transform:none!important;
    z-index:3!important;
}
body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn i,
body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"] i{
    margin-right:6px!important;
}

/* Resultado: evita linha/cartão quebrado e melhora leitura. */
body.connect-theme #order-standard_cart .domain-checker-result-headline{
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    line-height:1.45!important;
}

@media(max-width:767.98px){
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group{
        grid-template-columns:1fr!important;
        gap:10px!important;
        max-width:100%!important;
    }
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group>.form-control,
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[type="text"],
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[name="query"],
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group input[name="domain"]{
        border:2px solid #73d9ef!important;
        border-radius:12px!important;
    }
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group-append,
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group-btn,
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group>span,
    body.connect-theme #order-standard_cart .domain-checker-bg .input-group .btn,
    body.connect-theme #order-standard_cart .domain-checker-bg button[type="submit"],
    body.connect-theme #order-standard_cart .domain-checker-bg input[type="submit"]{
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
        border-radius:12px!important;
    }
}
/* =========================================================
   CONNECT Final — LOOP 023
   SISTEMA RESPONSIVO UNIFICADO DE MARCA
   Header + Footer / fonte única de verdade
   ========================================================= */

body.connect-theme{
    --connect-brand-bg:#020817;
    --connect-logo-header-desktop:350px;
    --connect-logo-header-tablet-lg:285px;
    --connect-logo-header-tablet:255px;
    --connect-logo-header-mobile:220px;
    --connect-logo-header-mobile-sm:195px;
    --connect-logo-footer-desktop:320px;
    --connect-logo-footer-tablet:280px;
    --connect-logo-footer-mobile:250px;
    --connect-logo-footer-mobile-sm:225px;
}

/* Base comum: preserva proporção, transparência e evita distorção/CLS. */
body.connect-theme .connect-logo-header,
body.connect-theme .connect-logo-footer{
    display:block!important;
    height:auto!important;
    max-height:none!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:left center!important;
opacity:1!important;
    mix-blend-mode:normal!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    aspect-ratio:1916 / 821;
}

/* ======================= HEADER ======================= */
body.connect-theme .connect-brand-row{
    min-height:158px!important;
    padding:8px 0!important;
    overflow:visible!important;
    background:
        radial-gradient(circle at 16% 50%,rgba(0,128,255,.16),transparent 30%),
        var(--connect-brand-bg)!important;
}
body.connect-theme .connect-brand-container{
    min-height:142px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:22px!important;
    overflow:visible!important;
}
body.connect-theme .connect-brand,
body.connect-theme .connect-brand-header{
    min-width:0!important;
    flex:0 1 auto!important;
    display:flex!important;
    align-items:center!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
}
body.connect-theme .connect-brand-logo,
body.connect-theme .connect-logo-header{
    width:var(--connect-logo-header-desktop)!important;
    max-width:min(var(--connect-logo-header-desktop),38vw)!important;
    margin:0!important;
}
body.connect-theme .connect-header-actions{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    min-width:0!important;
}
body.connect-theme .connect-public-nav{
    flex:0 0 auto!important;
}

/* ======================= FOOTER ======================= */
body.connect-theme .connect-footer{
    background:var(--connect-brand-bg)!important;
}
body.connect-theme .connect-footer-top{
    align-items:start!important;
    gap:34px!important;
}
body.connect-theme .connect-footer-brand,
body.connect-theme .connect-brand-footer{
    min-width:0!important;
}
body.connect-theme .connect-footer-logo,
body.connect-theme .connect-logo-footer{
    width:var(--connect-logo-footer-desktop)!important;
    max-width:100%!important;
    margin:0 0 14px 0!important;
}
body.connect-theme .connect-footer-brand p,
body.connect-theme .connect-brand-footer p{
    max-width:365px!important;
    margin:0 0 12px 0!important;
    line-height:1.65!important;
}
body.connect-theme .connect-footer-site{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
}
body.connect-theme .connect-footer-contact a[href^="tel:"],
body.connect-theme .connect-footer-contact a[href^="mailto:"],
body.connect-theme .connect-footer-contact a[href*="wa.me"]{
    overflow-wrap:anywhere!important;
}
body.connect-theme .connect-footer-security{
    margin-top:12px!important;
}

/* ======================= RESPONSIVO ======================= */
@media(max-width:1199.98px){
    body.connect-theme .connect-brand-row{min-height:138px!important}
    body.connect-theme .connect-brand-container{min-height:122px!important;gap:14px!important}
    body.connect-theme .connect-brand-logo,
    body.connect-theme .connect-logo-header{
        width:var(--connect-logo-header-tablet-lg)!important;
        max-width:min(var(--connect-logo-header-tablet-lg),42vw)!important;
    }
}
@media(max-width:991.98px){
    body.connect-theme .connect-brand-row{min-height:124px!important}
    body.connect-theme .connect-brand-container{min-height:108px!important}
    body.connect-theme .connect-brand-logo,
    body.connect-theme .connect-logo-header{
        width:var(--connect-logo-header-tablet)!important;
        max-width:min(var(--connect-logo-header-tablet),45vw)!important;
    }
    body.connect-theme .connect-footer-logo,
    body.connect-theme .connect-logo-footer{
        width:var(--connect-logo-footer-tablet)!important;
    }
}
@media(max-width:767.98px){
    body.connect-theme .connect-brand-row{min-height:106px!important}
    body.connect-theme .connect-brand-container{min-height:90px!important;gap:8px!important}
    body.connect-theme .connect-brand-logo,
    body.connect-theme .connect-logo-header{
        width:var(--connect-logo-header-mobile)!important;
        max-width:min(var(--connect-logo-header-mobile),59vw)!important;
    }
    body.connect-theme .connect-header-actions{gap:5px!important}
    body.connect-theme .connect-footer-top{gap:28px 22px!important}
    body.connect-theme .connect-footer-logo,
    body.connect-theme .connect-logo-footer{
        width:var(--connect-logo-footer-mobile)!important;
        max-width:min(var(--connect-logo-footer-mobile),82vw)!important;
    }
}
@media(max-width:429.98px){
    body.connect-theme .connect-brand-row{min-height:96px!important}
    body.connect-theme .connect-brand-container{min-height:80px!important}
    body.connect-theme .connect-brand-logo,
    body.connect-theme .connect-logo-header{
        width:var(--connect-logo-header-mobile-sm)!important;
        max-width:min(var(--connect-logo-header-mobile-sm),56vw)!important;
    }
    body.connect-theme .connect-footer-logo,
    body.connect-theme .connect-logo-footer{
        width:var(--connect-logo-footer-mobile-sm)!important;
        max-width:78vw!important;
    }
}
@media(max-width:359.98px){
    body.connect-theme .connect-brand-logo,
    body.connect-theme .connect-logo-header{
        width:185px!important;
        max-width:54vw!important;
    }
}
/* =========================================================
   CONNECT Final — LOOP 024
   LIMPEZA VISUAL / PROTEÇÕES DE IDENTIDADE
   ========================================================= */

/* A marca aprovada nunca recebe painel branco ou filtro de conversão. */
body.connect-theme .connect-logo-header,
body.connect-theme .connect-logo-footer,
body.connect-theme .connect-brand-logo,
body.connect-theme .connect-footer-logo{
    filter:none!important;
    -webkit-filter:none!important;
    background-color:transparent!important;
}

/* Textos comerciais extensos devem quebrar de forma limpa em menus/cart. */
body.connect-theme .navbar-nav a,
body.connect-theme .cart-sidebar a,
body.connect-theme #order-standard_cart a,
body.connect-theme #order-standard_cart option{
    overflow-wrap:anywhere;
}

/* Evita quebra visual em itens administrativos convertidos para nomes comerciais. */
body.connect-theme .dropdown-menu .dropdown-item{
    white-space:normal;
    line-height:1.35;
}
/* =========================================================
   CONNECT FINAL BRAND v1.0 — LOOP 025
   QA FINAL / IDENTIDADE CONGELADA
   Não alterar em loops futuros sem aprovação explícita.
   ========================================================= */

/* Evita mudança de tamanho durante carregamento e mantém as duas marcas estáveis. */
body.connect-theme .connect-logo-header,
body.connect-theme .connect-logo-footer{
    contain:layout paint;
}

/* Foco visível e consistente nos controles do header/footer. */
body.connect-theme .connect-brand-row a:focus-visible,
body.connect-theme .connect-footer a:focus-visible{
    outline:3px solid currentColor!important;
    outline-offset:3px!important;
    border-radius:6px;
}

/* Toques confortáveis sem alterar a composição aprovada. */
@media(max-width:767.98px){
    body.connect-theme .connect-header-actions a,
    body.connect-theme .connect-header-actions button,
    body.connect-theme .connect-footer a{
        min-height:44px;
    }
}

/* Congelamento final: logos sempre transparentes, proporcionais e sem filtros. */
body.connect-theme .connect-logo-header,
body.connect-theme .connect-logo-footer,
body.connect-theme .connect-brand-logo,
body.connect-theme .connect-footer-logo{
    filter:none!important;
    -webkit-filter:none!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    object-fit:contain!important;
    height:auto!important;
}
/* =========================================================
   CONNECT — LOOP 026
   ESTABILIDADE DE CACHE E RENDERIZAÇÃO
   A identidade CONNECT FINAL BRAND v1.0 permanece congelada.
   ========================================================= */

/* Evita animação excessiva para quem prefere movimento reduzido. */
@media (prefers-reduced-motion: reduce){
    body.connect-theme *,
    body.connect-theme *::before,
    body.connect-theme *::after{
        scroll-behavior:auto!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important;
    }
}

/* Mantém leitura limpa em sidebar/cart após rótulos comerciais maiores. */
body.connect-theme .sidebar .list-group-item,
body.connect-theme .panel-sidebar a,
body.connect-theme #order-standard_cart .cart-sidebar a{
    line-height:1.35;
}


/* CONNECT — LOOP 027
   Nenhuma alteração visual de disponibilidade foi aplicada.
   O resultado permanece 100% fornecido pelo backend do WHMCS. */


/* CONNECT — LOOP 028
   Nenhuma disponibilidade é calculada no frontend.
   .com.br passa a ter um provider backend dedicado via Registro.br ISAVAIL. */


/* CONNECT — LOOP 029
   Nenhuma alteração visual. Lookup .com/.com.br estabilizado no backend. */
/* =========================================================
   CONNECT — LOOP 030
   PAINEL DE HOSPEDAGEM PREMIUM / ÁREA DO CLIENTE
   ========================================================= */

body.connect-theme .connect-service-console{
    border:1px solid #d9e4f1;
    border-radius:18px;
    background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
    box-shadow:0 18px 42px rgba(7,23,47,.08);
    overflow:hidden;
}
body.connect-theme .connect-service-console-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:24px 26px 18px;
    border-bottom:1px solid #e4ebf4;
}
body.connect-theme .connect-service-eyebrow{
    display:block;
    margin-bottom:5px;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.12em;
    color:#0b74ff;
}
body.connect-theme .connect-service-console-head h3{
    margin:0;
    color:#07172f;
    font-size:1.55rem;
    font-weight:800;
}
body.connect-theme .connect-service-console-head p{
    margin:6px 0 0;
    color:#617086;
}
body.connect-theme .connect-service-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:32px;
    padding:6px 12px;
    border-radius:999px;
    font-size:.75rem;
    font-weight:800;
    white-space:nowrap;
    background:#e9eef5;
    color:#34445b;
}
body.connect-theme .connect-service-status-active{
    background:#ddf8e7;
    color:#16733a;
}
body.connect-theme .connect-service-status-pending{
    background:#fff1d6;
    color:#8a5b00;
}
body.connect-theme .connect-service-status-suspended,
body.connect-theme .connect-service-status-cancelled,
body.connect-theme .connect-service-status-terminated{
    background:#ffe0e3;
    color:#a32935;
}

body.connect-theme .connect-service-quick-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    padding:18px 26px 8px;
}
body.connect-theme .connect-service-action{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:72px;
    padding:14px 16px;
    border:1px solid #d7e2ef;
    border-radius:14px;
    background:#fff;
    color:#12223b!important;
    text-decoration:none!important;
    transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
body.connect-theme .connect-service-action:hover{
    transform:translateY(-2px);
    border-color:#8ebdff;
    box-shadow:0 12px 26px rgba(7,23,47,.10);
}
body.connect-theme .connect-service-action > i{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:11px;
    background:#edf5ff;
    color:#0b74ff;
    font-size:1rem;
}
body.connect-theme .connect-service-action-primary{
    background:linear-gradient(135deg,#075bd4,#0b74ff);
    border-color:#0b74ff;
    color:#fff!important;
}
body.connect-theme .connect-service-action-primary > i{
    background:rgba(255,255,255,.15);
    color:#fff;
}
body.connect-theme .connect-service-action span{
    min-width:0;
}
body.connect-theme .connect-service-action strong{
    display:block;
    font-size:.92rem;
    line-height:1.2;
}
body.connect-theme .connect-service-action small{
    display:block;
    margin-top:4px;
    color:#708095;
    font-size:.74rem;
    overflow:hidden;
    text-overflow:ellipsis;
}
body.connect-theme .connect-service-action-primary small{
    color:rgba(255,255,255,.78);
}

body.connect-theme .connect-service-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1.35fr;
    gap:16px;
    padding:16px 26px 26px;
}
body.connect-theme .connect-service-info-card{
    min-width:0;
    padding:20px;
    border:1px solid #e0e8f2;
    border-radius:16px;
    background:#fff;
}
body.connect-theme .connect-service-card-title{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:15px;
    color:#12223b;
    font-weight:800;
}
body.connect-theme .connect-service-card-title i{
    color:#0b74ff;
}
body.connect-theme .connect-service-kv{
    margin:0;
}
body.connect-theme .connect-service-kv > div{
    display:grid;
    grid-template-columns:112px minmax(0,1fr);
    gap:12px;
    padding:9px 0;
    border-bottom:1px solid #eef2f7;
}
body.connect-theme .connect-service-kv > div:last-child{
    border-bottom:0;
}
body.connect-theme .connect-service-kv dt{
    color:#67778c;
    font-weight:700;
    font-size:.79rem;
}
body.connect-theme .connect-service-kv dd{
    min-width:0;
    margin:0;
    color:#15243c;
    overflow-wrap:anywhere;
}
body.connect-theme .connect-service-kv code{
    padding:3px 7px;
    border-radius:7px;
    background:#eef5ff;
    color:#075bd4;
    font-size:.82rem;
}
body.connect-theme .connect-copy-row{
    display:flex;
    align-items:center;
    gap:7px;
}
body.connect-theme .connect-copy-btn{
    display:inline-grid;
    place-items:center;
    width:30px;
    height:30px;
    border:1px solid #d7e2ef;
    border-radius:8px;
    background:#fff;
    color:#0b74ff;
    cursor:pointer;
}
body.connect-theme .connect-password-mask{
    display:block;
    letter-spacing:.10em;
    color:#263954;
    font-weight:800;
}
body.connect-theme .connect-security-note{
    display:block;
    margin-top:3px;
    color:#7a899a;
    font-size:.70rem;
}
body.connect-theme .connect-inline-status{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-weight:800;
}
body.connect-theme .connect-inline-status.is-ok{
    color:#14813d;
}
body.connect-theme .connect-inline-status.is-warn{
    color:#9a6810;
}

body.connect-theme .connect-usage-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    align-items:start;
}
body.connect-theme .connect-usage-item{
    text-align:center;
}
body.connect-theme .connect-usage-ring{
    --connect-usage-pct:0;
    position:relative;
    width:124px;
    height:124px;
    margin:2px auto 12px;
    border-radius:50%;
    background:
        conic-gradient(#0b74ff calc(var(--connect-usage-pct) * 1%), #e6edf5 0);
    box-shadow:inset 0 0 0 1px rgba(11,116,255,.08);
}
body.connect-theme .connect-usage-ring::before{
    content:"";
    position:absolute;
    inset:10px;
    border-radius:50%;
    background:#fff;
}
body.connect-theme .connect-usage-ring-inner{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    z-index:1;
}
body.connect-theme .connect-usage-ring-inner strong{
    color:#07172f;
    font-size:1.22rem;
    font-weight:900;
}
body.connect-theme .connect-usage-ring-inner span{
    color:#7b899b;
    font-size:.68rem;
}
body.connect-theme .connect-usage-item h4{
    margin:0;
    color:#1a2b44;
    font-size:.88rem;
    font-weight:800;
}
body.connect-theme .connect-usage-item p{
    margin:4px 0 0;
    color:#77869a;
    font-size:.72rem;
}
body.connect-theme .connect-usage-empty{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:120px;
    padding:18px;
    border-radius:13px;
    background:#f6f9fd;
    color:#617086;
}
body.connect-theme .connect-usage-empty > i{
    font-size:1.4rem;
    color:#0b74ff;
}
body.connect-theme .connect-usage-empty strong{
    color:#1b2b44;
}
body.connect-theme .connect-usage-empty p{
    margin:4px 0 0;
    font-size:.78rem;
}

/* Transforma o link SSO nativo do módulo em fallback discreto quando ainda visível. */
body.connect-theme .module-client-area a[href*="2083"],
body.connect-theme .module-client-area a[href*="user_session"]{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:9px 14px;
    border-radius:10px;
    background:#0b74ff;
    color:#fff!important;
    text-decoration:none!important;
}

@media(max-width:1199.98px){
    body.connect-theme .connect-service-quick-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    body.connect-theme .connect-service-info-grid{
        grid-template-columns:1fr 1fr;
    }
    body.connect-theme .connect-service-usage-card{
        grid-column:1 / -1;
    }
}
@media(max-width:767.98px){
    body.connect-theme .connect-service-console-head{
        padding:20px 18px 16px;
        flex-direction:column;
    }
    body.connect-theme .connect-service-quick-grid{
        grid-template-columns:1fr;
        padding:16px 18px 6px;
    }
    body.connect-theme .connect-service-info-grid{
        grid-template-columns:1fr;
        padding:14px 18px 20px;
    }
    body.connect-theme .connect-service-usage-card{
        grid-column:auto;
    }
    body.connect-theme .connect-service-kv > div{
        grid-template-columns:1fr;
        gap:4px;
    }
}
@media(max-width:430px){
    body.connect-theme .connect-usage-grid{
        grid-template-columns:1fr;
    }
}
/* =========================================================
   CONNECT — LOOP 031
   QA AUTENTICADO + CORREÇÕES DA AUDITORIA
   ========================================================= */

/* Compacta a visão geral sem remover informação. */
body.connect-theme .product-details .product-icon,
body.connect-theme .product-details .product-icon-holder{
    transform:scale(.90);
    transform-origin:center top;
}
body.connect-theme .product-details .product-icon + *,
body.connect-theme .product-details .product-icon-holder + *{
    margin-top:-8px;
}
body.connect-theme .product-details .row{
    align-items:flex-start;
}

/* Contexto autenticado no novo console. */
body.connect-theme .connect-service-context{
    display:flex;
    flex-wrap:wrap;
    gap:8px 12px;
    margin:7px 0 0;
}
body.connect-theme .connect-service-context span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:4px 8px;
    border-radius:999px;
    background:#eef5ff;
    color:#42546b;
    font-size:.72rem;
    font-weight:700;
}

/* Aviso quando os nameservers são iguais. */
body.connect-theme .connect-service-alert-row{
    background:#fff8e7;
    border-radius:10px;
    padding-left:8px!important;
    padding-right:8px!important;
}
body.connect-theme .connect-service-alert-row .is-warn{
    font-size:.76rem;
    line-height:1.35;
}

/* Explicação de origem das métricas. */
body.connect-theme .connect-usage-updated-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    margin:-2px 0 14px;
    color:#718196;
    font-size:.72rem;
}

/* Evita que o WhatsApp cubra botões/cards da área do cliente. */
body.connect-theme .connect-whatsapp-float,
body.connect-theme .whatsapp-float,
body.connect-theme a[href*="wa.me"][class*="float"]{
    bottom:24px!important;
    right:24px!important;
    z-index:1035!important;
}
body.connect-theme main,
body.connect-theme .main-content,
body.connect-theme #main-body{
    padding-bottom:92px;
}

/* Campo de busca de serviços mais claro. */
body.connect-theme .dataTables_filter input,
body.connect-theme input[type="search"]{
    min-height:42px;
    border-radius:10px!important;
    border:1px solid #cbd8e8!important;
    padding:8px 12px!important;
}
body.connect-theme .dataTables_filter input:focus,
body.connect-theme input[type="search"]:focus{
    border-color:#0b74ff!important;
    box-shadow:0 0 0 3px rgba(11,116,255,.12)!important;
    outline:none!important;
}

/* Menor desperdício vertical no topo dos detalhes do produto. */
body.connect-theme .connect-service-console{
    margin-top:12px!important;
}
body.connect-theme .connect-service-console-head{
    padding-top:20px!important;
    padding-bottom:16px!important;
}
body.connect-theme .connect-service-info-card{
    padding:18px!important;
}

/* Mobile: WhatsApp menor e sem cobrir ações. */
@media(max-width:767.98px){
    body.connect-theme .connect-whatsapp-float,
    body.connect-theme .whatsapp-float,
    body.connect-theme a[href*="wa.me"][class*="float"]{
        right:14px!important;
        bottom:14px!important;
        max-width:190px;
    }
    body.connect-theme main,
    body.connect-theme .main-content,
    body.connect-theme #main-body{
        padding-bottom:104px;
    }
}
/* =========================================================
   CONNECT — LOOP 032
   HOTFIX VISUAL DO PAINEL DE HOSPEDAGEM
   Corrige o layout comprimido visto na área real do cliente.
   ========================================================= */

/* O erro visual do LOOP 031 vinha de 3 cards espremidos dentro
   da coluna principal do Twenty-One. Agora os dados ficam em 2 colunas
   e o uso de recursos ocupa a largura total. */
body.connect-theme .connect-service-info-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:16px!important;
}
body.connect-theme .connect-service-usage-card{
    grid-column:1 / -1!important;
    min-height:0!important;
}

/* Cards mais naturais, sem altura forçada. */
body.connect-theme .connect-service-info-card{
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
}

/* Evita quebra caractere por caractere em domínio/hostname/nameservers. */
body.connect-theme .connect-service-kv > div{
    grid-template-columns:118px minmax(0,1fr)!important;
    align-items:start!important;
}
body.connect-theme .connect-service-kv dd,
body.connect-theme .connect-service-kv .connect-long-value,
body.connect-theme .connect-service-kv .connect-long-value a{
    word-break:normal!important;
    overflow-wrap:break-word!important;
    hyphens:none!important;
}
body.connect-theme .connect-service-kv .connect-long-value{
    font-size:.83rem!important;
    line-height:1.45!important;
}
body.connect-theme .connect-service-kv code{
    white-space:nowrap!important;
}

/* Botão copiar fica integrado ao usuário, sem "flutuar" para fora do card. */
body.connect-theme .connect-copy-row{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    flex-wrap:wrap!important;
}
body.connect-theme .connect-copy-btn{
    flex:0 0 30px!important;
}

/* Aviso de DNS duplicado mais compacto. */
body.connect-theme .connect-service-alert-row{
    padding:9px 10px!important;
    margin-top:6px!important;
}
body.connect-theme .connect-service-alert-row dt{
    display:none!important;
}
body.connect-theme .connect-service-alert-row dd{
    grid-column:1 / -1!important;
}

/* Uso sem sincronização deixa de virar um card alto e vazio. */
body.connect-theme .connect-usage-empty{
    min-height:0!important;
    padding:16px 18px!important;
    margin:0!important;
}
body.connect-theme .connect-service-usage-card:has(.connect-usage-empty){
    padding-bottom:18px!important;
}

/* Quando houver métricas reais, círculos alinhados e compactos. */
body.connect-theme .connect-usage-grid{
    max-width:560px!important;
    margin:0 auto!important;
}
body.connect-theme .connect-usage-ring{
    width:112px!important;
    height:112px!important;
}

/* Mantém os 4 acessos rápidos, mas com melhor largura e tipografia. */
body.connect-theme .connect-service-quick-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
body.connect-theme .connect-service-action{
    min-width:0!important;
    padding:13px 14px!important;
}
body.connect-theme .connect-service-action strong{
    font-size:.88rem!important;
}
body.connect-theme .connect-service-action small{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

/* Em larguras intermediárias, 2 botões por linha — sem esmagar texto. */
@media(max-width:1050px){
    body.connect-theme .connect-service-quick-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}

/* Tablet/mobile: tudo em 1 coluna, sem micro-colunas. */
@media(max-width:820px){
    body.connect-theme .connect-service-info-grid{
        grid-template-columns:1fr!important;
    }
    body.connect-theme .connect-service-usage-card{
        grid-column:auto!important;
    }
}
@media(max-width:640px){
    body.connect-theme .connect-service-quick-grid{
        grid-template-columns:1fr!important;
    }
    body.connect-theme .connect-service-kv > div{
        grid-template-columns:1fr!important;
        gap:4px!important;
    }
    body.connect-theme .connect-service-kv dt{
        font-size:.75rem!important;
    }
    body.connect-theme .connect-service-kv dd{
        font-size:.84rem!important;
    }
}


/* =========================================================
   CONNECT — LOOP 033
   INTEGRAÇÃO CWP + FTP
   ========================================================= */
body.connect-theme .connect-service-card-help{
    margin:-5px 0 12px;
    color:#718196;
    font-size:.75rem;
    line-height:1.45;
}
body.connect-theme .connect-password-row dd{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
}
body.connect-theme .connect-password-change-btn{
    margin-top:4px;
    border-radius:9px!important;
    font-weight:700!important;
}
body.connect-theme .connect-service-kv code{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
}
body.connect-theme #connectCwpHost,
body.connect-theme #connectFtpHost{
    white-space:normal!important;
    line-height:1.35!important;
}
body.connect-theme .connect-cwp-native-sso{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:8px 12px;
    border-radius:9px;
    background:#0b74ff;
    color:#fff!important;
    text-decoration:none!important;
}
@media(max-width:640px){
    body.connect-theme .connect-password-change-btn{
        width:100%;
    }
}
/* =========================================================
   CONNECT — LOOP 034
   BOTÃO CWP CONTROL NA SEÇÃO "INFORMAÇÕES DE HOSPEDAGEM"
   ========================================================= */

body.connect-theme .connect-native-hosting-access-title{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    margin:20px 0 10px;
    color:#42546b;
    font-size:.78rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.05em;
}

body.connect-theme .connect-native-hosting-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin:0 auto 14px;
    max-width:820px;
}

body.connect-theme .connect-native-hosting-btn{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:44px;
    padding:10px 15px!important;
    border:1px solid #cbd9e9!important;
    border-radius:11px!important;
    background:#fff!important;
    color:#19314e!important;
    font-weight:800!important;
    text-decoration:none!important;
    box-shadow:0 4px 12px rgba(8,31,63,.05);
    transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

body.connect-theme .connect-native-hosting-btn:hover{
    transform:translateY(-1px);
    border-color:#81b6ff!important;
    box-shadow:0 8px 18px rgba(8,31,63,.09);
}

body.connect-theme .connect-native-hosting-btn i{
    color:#0b74ff;
}

body.connect-theme .connect-native-hosting-btn-primary{
    background:linear-gradient(135deg,#075bd4,#0b74ff)!important;
    border-color:#0b74ff!important;
    color:#fff!important;
}

body.connect-theme .connect-native-hosting-btn-primary i{
    color:#fff!important;
}

body.connect-theme .connect-native-hosting-btn-primary[data-connect-native-sso="1"]::after{
    content:"SSO";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:30px;
    height:20px;
    margin-left:2px;
    padding:0 5px;
    border-radius:999px;
    background:rgba(255,255,255,.16);
    color:#fff;
    font-size:.60rem;
    font-weight:900;
    letter-spacing:.04em;
}

/* Mantém o bloco nativo mais limpo e centralizado. */
body.connect-theme #tabOverview .module-client-area{
    margin-top:8px!important;
}

/* O botão antigo .btn-default do Twenty-One não interfere nessa barra. */
body.connect-theme .connect-native-hosting-actions .btn{
    margin:0!important;
}

@media(max-width:767.98px){
    body.connect-theme .connect-native-hosting-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        width:100%;
        gap:9px;
    }
    body.connect-theme .connect-native-hosting-btn{
        width:100%;
    }
}
@media(max-width:480px){
    body.connect-theme .connect-native-hosting-actions{
        grid-template-columns:1fr;
    }
}


/* =========================================================
   CONNECT — LOOP 035
   NOVA SENHA CWP/FTP — UMA ÚNICA VEZ
   ========================================================= */
body.connect-theme .connect-password-once{
    width:100%;
    max-width:520px;
    padding:12px;
    border:1px solid #bee6cc;
    border-radius:12px;
    background:#f3fff7;
}
body.connect-theme .connect-password-once-alert{
    display:flex;
    align-items:flex-start;
    gap:9px;
    margin-bottom:10px;
    color:#166534;
    font-size:.77rem;
    line-height:1.4;
}
body.connect-theme .connect-password-once-alert > i{
    margin-top:2px;
    color:#16a34a;
}
body.connect-theme .connect-password-once-alert strong{
    display:block;
    margin-bottom:2px;
}
body.connect-theme .connect-password-once-field{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    gap:7px;
    align-items:center;
}
body.connect-theme .connect-password-once-field input{
    min-width:0;
    height:42px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
    font-weight:800;
}
body.connect-theme .connect-password-once-field .btn{
    min-height:42px;
    border-radius:9px!important;
    font-weight:800;
}
body.connect-theme .connect-password-copy.is-copied{
    background:#15803d!important;
    border-color:#15803d!important;
}
body.connect-theme .connect-password-once.is-expired{
    background:#f8fafc;
    border-color:#d8e0ea;
}
body.connect-theme .connect-password-once.is-expired .connect-password-once-alert{
    color:#64748b;
}
@media(max-width:640px){
    body.connect-theme .connect-password-once-field{
        grid-template-columns:1fr 1fr;
    }
    body.connect-theme .connect-password-once-field input{
        grid-column:1 / -1;
    }
}
/* =========================================================
   CONNECT — LOOP 036
   REDESIGN DA ÁREA DE HOSPEDAGEM
   ========================================================= */

/* Layout principal: credenciais + recursos; DNS abaixo. */
body.connect-theme .connect-service-info-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr)!important;
    grid-template-areas:
        "credentials usage"
        "dns dns"!important;
    gap:16px!important;
}
body.connect-theme .connect-credentials-card{
    grid-area:credentials!important;
}
body.connect-theme .connect-dns-card{
    grid-area:dns!important;
}
body.connect-theme .connect-service-usage-card{
    grid-area:usage!important;
    grid-column:auto!important;
}

/* Credenciais com labels estáveis e valores legíveis. */
body.connect-theme .connect-credentials-card .connect-service-kv > div{
    grid-template-columns:145px minmax(0,1fr)!important;
}
body.connect-theme .connect-credentials-card .connect-service-card-help{
    max-width:680px;
}

/* DNS em linhas compactas para não virar um bloco enorme. */
body.connect-theme .connect-dns-card .connect-service-kv{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 22px;
}
body.connect-theme .connect-dns-card .connect-service-kv > div{
    grid-template-columns:125px minmax(0,1fr)!important;
}

/* Recursos: compacto quando ainda não sincronizados. */
body.connect-theme .connect-service-usage-card{
    align-self:start!important;
}
body.connect-theme .connect-service-usage-card .connect-usage-empty{
    min-height:92px!important;
}

/* Senha atual sob demanda. */
body.connect-theme .connect-current-password{
    width:100%;
}
body.connect-theme .connect-current-password-field{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    gap:7px;
    align-items:center;
    width:100%;
}
body.connect-theme .connect-current-password-field input{
    min-width:0;
    height:42px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
    font-weight:800;
}
body.connect-theme .connect-current-password-field .btn{
    min-height:42px;
    border-radius:9px!important;
    white-space:nowrap;
}

/* A área nativa de Informações de Hospedagem deixa de parecer uma folha vazia. */
body.connect-theme #domain.connect-native-domain-summary{
    max-width:920px;
    margin:0 auto;
    padding:18px 22px 20px!important;
    text-align:left!important;
}
body.connect-theme #domain.connect-native-domain-summary > .row{
    display:grid!important;
    grid-template-columns:180px minmax(0,1fr)!important;
    align-items:start;
    margin:0!important;
    padding:7px 0!important;
    border-bottom:1px solid #edf2f7;
}
body.connect-theme #domain.connect-native-domain-summary > .row > [class*="col-sm-"]{
    width:auto!important;
    max-width:none!important;
    flex:none!important;
    padding:0!important;
    text-align:left!important;
}
body.connect-theme #domain.connect-native-domain-summary > .row > .col-sm-5{
    color:#5f7188;
}
body.connect-theme #domain.connect-native-domain-summary > .row > .col-sm-7{
    color:#14243b;
    overflow-wrap:break-word;
}
body.connect-theme #domain.connect-native-domain-summary .connect-native-hosting-access-title{
    justify-content:flex-start!important;
    margin-top:18px!important;
}
body.connect-theme #domain.connect-native-domain-summary .connect-native-hosting-actions{
    justify-content:flex-start!important;
    margin-left:0!important;
    margin-right:0!important;
}

/* Reduz excesso de espaço entre console, tabs e rodapé. */
body.connect-theme .product-details-tab-container{
    padding-top:6px!important;
    padding-bottom:8px!important;
}
body.connect-theme .connect-service-console{
    box-shadow:0 12px 32px rgba(7,23,47,.07)!important;
}

/* Mantém host e nameserver sem quebra por caractere. */
body.connect-theme .connect-service-kv dd,
body.connect-theme .connect-service-kv code,
body.connect-theme .connect-service-kv a{
    word-break:normal!important;
    overflow-wrap:break-word!important;
}

/* Tablet */
@media(max-width:1100px){
    body.connect-theme .connect-service-info-grid{
        grid-template-columns:1fr!important;
        grid-template-areas:
            "credentials"
            "usage"
            "dns"!important;
    }
    body.connect-theme .connect-dns-card .connect-service-kv{
        grid-template-columns:1fr;
    }
}

/* Mobile */
@media(max-width:700px){
    body.connect-theme .connect-current-password-field{
        grid-template-columns:1fr 1fr;
    }
    body.connect-theme .connect-current-password-field input{
        grid-column:1 / -1;
    }
    body.connect-theme .connect-credentials-card .connect-service-kv > div,
    body.connect-theme .connect-dns-card .connect-service-kv > div{
        grid-template-columns:1fr!important;
        gap:4px!important;
    }
    body.connect-theme #domain.connect-native-domain-summary > .row{
        grid-template-columns:1fr!important;
        gap:3px;
    }
}
/* =========================================================
   CONNECT — LOOP 037
   REORGANIZAÇÃO CWP/FTP + DNS SEM QUEBRA
   ========================================================= */

/* A área principal deixa de espremer CWP e DNS lado a lado. */
body.connect-theme .connect-service-info-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:
        "credentials"
        "dns"
        "usage"!important;
    gap:14px!important;
}

body.connect-theme .connect-credentials-card{
    grid-area:credentials!important;
}
body.connect-theme .connect-dns-card{
    grid-area:dns!important;
}
body.connect-theme .connect-service-usage-card{
    grid-area:usage!important;
    grid-column:auto!important;
}

/* CWP/FTP usa duas colunas internas no desktop. */
body.connect-theme .connect-credentials-card .connect-service-kv{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:0 26px!important;
}

body.connect-theme .connect-credentials-card .connect-service-kv > div{
    grid-template-columns:130px minmax(0,1fr)!important;
    min-width:0!important;
    padding:10px 0!important;
}

/* Domínio e senha ocupam largura total para melhor leitura. */
body.connect-theme .connect-credentials-card .connect-service-kv > div:first-child,
body.connect-theme .connect-credentials-card .connect-password-row{
    grid-column:1 / -1!important;
}

/* Host CWP/FTP: uma única linha, com scroll horizontal apenas se realmente necessário. */
body.connect-theme #connectCwpHost,
body.connect-theme #connectFtpHost{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    text-overflow:clip!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    scrollbar-width:thin;
    font-size:.78rem!important;
}

/* Copy rows: valor e botão sempre na mesma linha. */
body.connect-theme .connect-copy-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px!important;
    gap:8px!important;
    align-items:center!important;
    min-width:0!important;
}
body.connect-theme .connect-copy-row .connect-copy-btn{
    width:34px!important;
    height:34px!important;
    margin:0!important;
    flex:none!important;
}

/* DNS agora tem largura total, com labels fixos e host sem quebra. */
body.connect-theme .connect-dns-card .connect-service-kv{
    display:block!important;
}

body.connect-theme .connect-dns-card .connect-service-kv > div{
    display:grid!important;
    grid-template-columns:150px minmax(0,1fr)!important;
    gap:18px!important;
    align-items:center!important;
    padding:11px 0!important;
    min-width:0!important;
}

body.connect-theme .connect-dns-card .connect-dns-row code{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    font-size:.82rem!important;
    line-height:1.4!important;
    scrollbar-width:thin;
}

/* SSL fica compacto e alinhado. */
body.connect-theme .connect-dns-card .connect-inline-status{
    white-space:nowrap!important;
}

/* Evita que valores longos "quebrem a página". */
body.connect-theme .connect-service-kv .connect-long-value,
body.connect-theme .connect-service-kv .connect-long-value code,
body.connect-theme .connect-service-kv .connect-long-value a{
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
}

/* Títulos e descrições mais compactos. */
body.connect-theme .connect-service-info-card{
    padding:18px 20px!important;
}
body.connect-theme .connect-service-card-title{
    margin-bottom:10px!important;
}
body.connect-theme .connect-service-card-help{
    margin:0 0 10px!important;
    max-width:none!important;
}

/* Reduz altura visual do painel sem cortar conteúdo. */
body.connect-theme .connect-service-info-grid{
    padding-top:12px!important;
    padding-bottom:20px!important;
}

/* Recursos só ganham altura quando houver métricas. */
body.connect-theme .connect-service-usage-card .connect-usage-empty{
    min-height:76px!important;
    padding:14px 16px!important;
}

/* Tablet / mobile: uma coluna simples e sem overflow estranho. */
@media(max-width:900px){
    body.connect-theme .connect-credentials-card .connect-service-kv{
        grid-template-columns:1fr!important;
    }

    body.connect-theme .connect-credentials-card .connect-service-kv > div{
        grid-column:auto!important;
    }

    body.connect-theme .connect-credentials-card .connect-service-kv > div:first-child,
    body.connect-theme .connect-credentials-card .connect-password-row{
        grid-column:auto!important;
    }
}

@media(max-width:640px){
    body.connect-theme .connect-credentials-card .connect-service-kv > div,
    body.connect-theme .connect-dns-card .connect-service-kv > div{
        grid-template-columns:1fr!important;
        gap:5px!important;
    }

    body.connect-theme #connectCwpHost,
    body.connect-theme #connectFtpHost,
    body.connect-theme .connect-dns-card .connect-dns-row code{
        font-size:.76rem!important;
    }
}
/* =========================================================
   CONNECT — LOOP 038
   ACABAMENTO PREMIUM DA HOSPEDAGEM
   ========================================================= */

/* Resumo enxuto antes das ações. */
body.connect-theme .connect-service-summary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding:14px 26px 2px;
}
body.connect-theme .connect-service-summary-item{
    min-width:0;
    padding:10px 12px;
    border:1px solid #e2eaf4;
    border-radius:12px;
    background:#f8fbff;
}
body.connect-theme .connect-service-summary-item span{
    display:block;
    margin-bottom:3px;
    color:#7a899c;
    font-size:.68rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.045em;
}
body.connect-theme .connect-service-summary-item strong{
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#162740;
    font-size:.83rem;
}
body.connect-theme .connect-summary-status{
    display:inline-flex!important;
    width:max-content;
    max-width:100%;
    padding:4px 8px;
    border-radius:999px;
    background:#eaf0f7;
}
body.connect-theme .connect-summary-status-active{
    background:#ddf8e7;
    color:#16733a!important;
}
body.connect-theme .connect-summary-status-pending{
    background:#fff1d6;
    color:#8a5b00!important;
}
body.connect-theme .connect-summary-status-suspended,
body.connect-theme .connect-summary-status-cancelled,
body.connect-theme .connect-summary-status-terminated{
    background:#ffe0e3;
    color:#a32935!important;
}

/* Ações mais enxutas e com menos texto visual. */
body.connect-theme .connect-service-quick-grid{
    padding-top:12px!important;
}
body.connect-theme .connect-service-action{
    min-height:64px!important;
}
body.connect-theme .connect-service-action small{
    margin-top:2px!important;
}

/* Valores longos ficam em uma linha com reticências, sem scroll nem quebra. */
body.connect-theme #connectCwpHost,
body.connect-theme #connectFtpHost,
body.connect-theme .connect-dns-card .connect-dns-row code{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
}
body.connect-theme #connectCwpHost::-webkit-scrollbar,
body.connect-theme #connectFtpHost::-webkit-scrollbar,
body.connect-theme .connect-dns-card .connect-dns-row code::-webkit-scrollbar{
    display:none!important;
}

/* Botões copiar permanecem visíveis mesmo com valor longo. */
body.connect-theme .connect-copy-row{
    grid-template-columns:minmax(0,1fr) 34px!important;
}
body.connect-theme .connect-copy-row code{
    min-width:0!important;
}

/* Seção técnica nativa fica recolhida por padrão. */
body.connect-theme .connect-tech-disclosure{
    max-width:920px;
    margin:0 auto;
    border:1px solid #dfe8f2;
    border-radius:14px;
    background:#fff;
    overflow:hidden;
}
body.connect-theme .connect-tech-disclosure > summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:15px 18px;
    cursor:pointer;
    list-style:none;
    background:#f8fbff;
    color:#17304d;
    font-weight:800;
    text-align:left;
}
body.connect-theme .connect-tech-disclosure > summary::-webkit-details-marker{
    display:none;
}
body.connect-theme .connect-tech-disclosure > summary span{
    display:flex;
    align-items:center;
    gap:8px;
}
body.connect-theme .connect-tech-disclosure > summary span i{
    color:#0b74ff;
}
body.connect-theme .connect-tech-disclosure > summary small{
    color:#748398;
    font-weight:600;
}
body.connect-theme .connect-tech-disclosure > summary::after{
    content:"⌄";
    flex:0 0 auto;
    font-size:1.05rem;
    color:#5f7188;
    transition:transform .15s ease;
}
body.connect-theme .connect-tech-disclosure[open] > summary::after{
    transform:rotate(180deg);
}
body.connect-theme .connect-tech-disclosure-body{
    padding:12px 18px 16px;
}

/* Dentro do disclosure, linhas técnicas mais compactas. */
body.connect-theme .connect-tech-disclosure-body > .row{
    display:grid!important;
    grid-template-columns:180px minmax(0,1fr)!important;
    gap:16px!important;
    align-items:start!important;
    margin:0!important;
    padding:7px 0!important;
    border-bottom:1px solid #edf2f7;
}
body.connect-theme .connect-tech-disclosure-body > .row > [class*="col-sm-"]{
    width:auto!important;
    max-width:none!important;
    flex:none!important;
    padding:0!important;
    text-align:left!important;
}
body.connect-theme .connect-tech-disclosure-body > .row > .col-sm-5{
    color:#607188;
}
body.connect-theme .connect-tech-disclosure-body > .row > .col-sm-7{
    min-width:0;
    overflow-wrap:break-word;
    color:#162740;
}

/* Remove a sensação de página duplicada dentro da aba técnica. */
body.connect-theme #domain.connect-native-domain-summary{
    padding:14px 0 8px!important;
    max-width:none!important;
}

/* Recursos vazios: status curto. */
body.connect-theme .connect-service-usage-card .connect-usage-empty{
    min-height:0!important;
    padding:12px 14px!important;
}
body.connect-theme .connect-service-usage-card .connect-usage-empty p{
    margin:2px 0 0!important;
}

/* Responsivo */
@media(max-width:1000px){
    body.connect-theme .connect-service-summary{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:640px){
    body.connect-theme .connect-service-summary{
        grid-template-columns:1fr;
        padding-left:18px;
        padding-right:18px;
    }
    body.connect-theme .connect-tech-disclosure > summary{
        align-items:flex-start;
        flex-direction:column;
        gap:4px;
    }
    body.connect-theme .connect-tech-disclosure-body > .row{
        grid-template-columns:1fr!important;
        gap:3px!important;
    }
}
/* =========================================================
   CONNECT — LOOP 039
   AJUSTES FINAIS: SERVIDOR/IP + TÉCNICOS ABERTOS + WEBMAIL
   ========================================================= */

/* Servidor e Endereço IP ficam em linhas próprias para nunca colidirem. */
body.connect-theme .connect-credentials-card .connect-service-kv > .connect-server-row,
body.connect-theme .connect-credentials-card .connect-service-kv > .connect-ip-row{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:150px minmax(0,1fr)!important;
    gap:22px!important;
    align-items:center!important;
}

body.connect-theme .connect-server-row .connect-long-value{
    min-width:0!important;
}

body.connect-theme .connect-server-row .connect-long-value span{
    display:block!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

body.connect-theme .connect-ip-row code{
    display:inline-flex!important;
    align-items:center!important;
    min-height:30px;
    padding:4px 9px!important;
    border-radius:8px;
    white-space:nowrap!important;
}

/* Espaçamento extra entre bloco de senha e dados do servidor. */
body.connect-theme .connect-password-row{
    padding-bottom:14px!important;
    margin-bottom:4px!important;
    border-bottom:1px solid #e9eef5!important;
}

body.connect-theme .connect-server-row{
    padding-top:14px!important;
}

/* Detalhes técnicos ficam abertos por padrão e visualmente integrados. */
body.connect-theme .connect-tech-disclosure[open]{
    border-color:#d8e5f2!important;
    box-shadow:0 6px 18px rgba(7,23,47,.04);
}

body.connect-theme .connect-tech-disclosure[open] > summary{
    background:#f5f9fe!important;
    border-bottom:1px solid #e4ebf4;
}

body.connect-theme .connect-tech-disclosure > summary{
    cursor:default!important;
}

/* Remove a sensação de "accordion fechado" agora que deve ficar aberto. */
body.connect-theme .connect-tech-disclosure > summary::after{
    display:none!important;
}

/* Webmail: sinal visual discreto da rota oficial /webmail/. */
body.connect-theme a[data-connect-webmail-fixed="1"]{
    position:relative;
}

/* Em telas pequenas, servidor/IP continuam confortáveis. */
@media(max-width:700px){
    body.connect-theme .connect-credentials-card .connect-service-kv > .connect-server-row,
    body.connect-theme .connect-credentials-card .connect-service-kv > .connect-ip-row{
        grid-template-columns:1fr!important;
        gap:5px!important;
    }

    body.connect-theme .connect-server-row .connect-long-value span{
        white-space:normal!important;
        overflow-wrap:break-word!important;
    }
}
/* =========================================================
   CONNECT — LOOP 040
   RECURSOS CWP — SINCRONIZAÇÃO MANUAL
   ========================================================= */

body.connect-theme .connect-resource-title{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
}

body.connect-theme .connect-resource-title-main{
    display:flex;
    align-items:center;
    gap:9px;
    min-width:0;
}

body.connect-theme .connect-resource-title-main i{
    color:#0b74ff;
}

body.connect-theme .connect-usage-refresh-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:36px;
    padding:7px 11px;
    border:1px solid #b9d6fb;
    border-radius:9px;
    background:#f2f8ff;
    color:#075bd4;
    font-size:.72rem;
    font-weight:800;
    white-space:nowrap;
    cursor:pointer;
    transition:background .15s ease, border-color .15s ease, transform .15s ease;
}

body.connect-theme .connect-usage-refresh-btn:hover{
    background:#e8f3ff;
    border-color:#7fb8ff;
    transform:translateY(-1px);
}

body.connect-theme .connect-usage-refresh-btn:disabled{
    opacity:.65;
    cursor:wait;
    transform:none;
}

body.connect-theme .connect-usage-refresh-status{
    min-height:0;
    margin:-2px 0 9px;
    padding:0;
    font-size:.72rem;
    line-height:1.4;
}

body.connect-theme .connect-usage-refresh-status:empty{
    display:none;
}

body.connect-theme .connect-usage-refresh-status.is-working{
    color:#52657d;
}

body.connect-theme .connect-usage-refresh-status.is-success{
    color:#16803d;
}

body.connect-theme .connect-usage-refresh-status.is-error{
    padding:8px 10px;
    border:1px solid #f0caca;
    border-radius:9px;
    background:#fff5f5;
    color:#9f2f39;
}

body.connect-theme .connect-usage-updated-note{
    justify-content:flex-start!important;
    margin:0 0 12px!important;
    padding:7px 9px;
    border-radius:9px;
    background:#f4f8fd;
}

body.connect-theme .connect-usage-updated-note i{
    color:#16a34a;
}

@media(max-width:640px){
    body.connect-theme .connect-resource-title{
        align-items:flex-start!important;
        flex-direction:column;
    }

    body.connect-theme .connect-usage-refresh-btn{
        width:100%;
    }
}
/* =========================================================
   CONNECT — LOOP 041
   AUDITORIA E PADRONIZAÇÃO GERAL DA ÁREA DO CLIENTE
   ========================================================= */

/* ---------- Estrutura geral ---------- */
body.connect-theme:not(.template-homepage) #main-body{
    background:
        radial-gradient(circle at 10% 0,rgba(11,116,255,.035),transparent 28%),
        #f5f8fc;
}

body.connect-theme:not(.template-homepage) #main-body > .container{
    max-width:1240px;
}

body.connect-theme .primary-content{
    min-width:0;
}

body.connect-theme .header-lined{
    margin-bottom:20px!important;
    padding-bottom:12px;
    border-bottom:1px solid #e1e8f1;
}

body.connect-theme .header-lined h1{
    margin-bottom:2px!important;
    font-size:1.65rem!important;
    line-height:1.18;
}

body.connect-theme .header-lined .breadcrumb{
    margin-top:5px;
}

/* ---------- Breadcrumb ---------- */
body.connect-theme .connect-breadcrumb{
    border-bottom:1px solid #e3eaf3;
    background:#fff;
}

body.connect-theme .connect-breadcrumb .breadcrumb{
    min-height:42px;
    align-items:center;
    margin:0;
    padding-top:8px;
    padding-bottom:8px;
    font-size:.74rem;
}

body.connect-theme .connect-breadcrumb a{
    color:#56718f;
}

body.connect-theme .connect-breadcrumb .active{
    color:#8a98a8;
}

/* ---------- Sidebar ---------- */
@media(min-width:992px){
    body.connect-theme #main-body .sidebar{
        position:sticky;
        top:18px;
    }
}

body.connect-theme .sidebar .card,
body.connect-theme .sidebar .panel{
    overflow:hidden;
    border:1px solid #dde6f0!important;
    border-radius:14px!important;
    background:#fff!important;
}

body.connect-theme .sidebar .card-header,
body.connect-theme .sidebar .panel-heading{
    min-height:45px;
    display:flex;
    align-items:center;
    background:#f7faff!important;
    color:#17304d!important;
    font-weight:850;
}

body.connect-theme .sidebar .list-group-item{
    min-height:43px;
    display:flex;
    align-items:center;
    gap:7px;
    padding:10px 13px!important;
    color:#435a73!important;
    font-size:.78rem;
}

body.connect-theme .sidebar .list-group-item:hover{
    background:#f4f8fd!important;
    color:#0b5fba!important;
}

body.connect-theme .sidebar .list-group-item.active{
    color:#fff!important;
}

/* ---------- Dashboard inicial ---------- */
body.template-clientareahome .connect-account-dashboard-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin:0 0 18px;
    padding:20px 22px;
    border:1px solid #d9e5f2;
    border-radius:18px;
    background:
        radial-gradient(circle at 90% -10%,rgba(31,142,255,.13),transparent 34%),
        linear-gradient(135deg,#ffffff,#f7fbff);
    box-shadow:0 10px 30px rgba(8,37,75,.045);
}

body.template-clientareahome .connect-account-dashboard-kicker{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-bottom:5px;
    color:#0b74ff;
    font-size:.69rem;
    font-weight:900;
    letter-spacing:.07em;
}

body.template-clientareahome .connect-account-dashboard-head h1{
    margin:0;
    color:#112945;
    font-size:1.55rem;
    line-height:1.15;
    letter-spacing:-.025em;
}

body.template-clientareahome .connect-account-dashboard-head p{
    margin:6px 0 0;
    color:#6b7f95;
    font-size:.82rem;
}

body.template-clientareahome .connect-account-dashboard-actions{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    flex:0 0 auto;
}

body.template-clientareahome .connect-account-dashboard-actions .btn{
    min-height:41px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding-left:14px;
    padding-right:14px;
    font-size:.78rem;
    font-weight:850;
}

body.template-clientareahome .client-home-cards .card{
    overflow:hidden;
}

body.template-clientareahome .client-home-cards .card-header{
    min-height:48px;
    display:flex;
    align-items:center;
    padding:11px 15px!important;
}

body.template-clientareahome .client-home-cards .card-title{
    color:#17304d;
    font-size:.89rem;
    font-weight:850;
}

body.template-clientareahome .client-home-cards .list-group-item{
    padding-top:11px;
    padding-bottom:11px;
    color:#486079;
    font-size:.79rem;
}

body.template-clientareahome .tiles .tile{
    padding-top:17px!important;
    padding-bottom:15px!important;
}

body.template-clientareahome .tiles .tile:focus-visible{
    position:relative;
    z-index:3;
}

/* ---------- Tabelas principais ---------- */
body.connect-theme #tableServicesList,
body.connect-theme #tableDomainsList,
body.connect-theme #tableInvoicesList,
body.connect-theme #tableTicketsList{
    margin-bottom:0!important;
}

body.connect-theme .table-container{
    overflow:hidden;
    border:1px solid #dfe7f1;
    border-radius:15px;
    background:#fff;
    box-shadow:0 9px 26px rgba(7,29,59,.035);
}

body.connect-theme #tableServicesList thead th,
body.connect-theme #tableDomainsList thead th,
body.connect-theme #tableInvoicesList thead th,
body.connect-theme #tableTicketsList thead th{
    padding:12px 13px!important;
    border-bottom:1px solid #dce5ef!important;
    background:#f6f9fd!important;
    color:#607289!important;
    font-size:.67rem!important;
    font-weight:900!important;
    letter-spacing:.045em;
    white-space:nowrap;
}

body.connect-theme #tableServicesList tbody td,
body.connect-theme #tableDomainsList tbody td,
body.connect-theme #tableInvoicesList tbody td,
body.connect-theme #tableTicketsList tbody td{
    padding:13px!important;
    border-top:1px solid #edf1f6!important;
    vertical-align:middle!important;
    color:#314a64;
    font-size:.78rem;
}

body.connect-theme #tableServicesList tbody tr,
body.connect-theme #tableDomainsList tbody tr,
body.connect-theme #tableInvoicesList tbody tr,
body.connect-theme #tableTicketsList tbody tr{
    transition:background .12s ease;
}

body.connect-theme #tableServicesList tbody tr:hover td,
body.connect-theme #tableDomainsList tbody tr:hover td,
body.connect-theme #tableInvoicesList tbody tr:hover td,
body.connect-theme #tableTicketsList tbody tr:hover td{
    background:#f7fbff!important;
}

body.connect-theme #tableServicesList tbody tr[onclick],
body.connect-theme #tableDomainsList tbody tr[onclick],
body.connect-theme #tableInvoicesList tbody tr[onclick],
body.connect-theme #tableTicketsList tbody tr[onclick]{
    cursor:pointer;
}

/* Produto/domínio podem quebrar por palavra; datas/status não. */
body.connect-theme #tableServicesList tbody td:nth-child(2),
body.connect-theme #tableDomainsList tbody td:nth-child(1),
body.connect-theme #tableTicketsList tbody td:nth-child(2){
    min-width:190px;
    overflow-wrap:break-word;
}

body.connect-theme #tableServicesList tbody td:nth-last-child(-n+3),
body.connect-theme #tableInvoicesList tbody td,
body.connect-theme #tableDomainsList tbody td:last-child{
    white-space:nowrap;
}

/* ---------- DataTables ---------- */
body.connect-theme .dataTables_wrapper{
    color:#64788f;
    font-size:.76rem;
}

body.connect-theme .dataTables_wrapper > .row:first-child{
    align-items:center;
    margin-bottom:10px;
}

body.connect-theme .dataTables_wrapper .dataTables_length label,
body.connect-theme .dataTables_wrapper .dataTables_filter label{
    margin-bottom:0;
    color:#60748c;
    font-weight:700;
}

body.connect-theme .dataTables_wrapper .dataTables_filter{
    text-align:right;
}

body.connect-theme .dataTables_wrapper .dataTables_filter input{
    width:min(270px,100%)!important;
    min-height:41px!important;
    margin-left:7px!important;
    border:1px solid #cbd8e7!important;
    border-radius:10px!important;
    background:#fff!important;
}

body.connect-theme .dataTables_wrapper .dataTables_length select{
    min-height:37px;
    margin:0 5px;
    border:1px solid #cbd8e7;
    border-radius:9px;
    background:#fff;
}

body.connect-theme .dataTables_wrapper .dataTables_info{
    padding-top:13px!important;
    color:#7b8b9e;
}

body.connect-theme .dataTables_wrapper .pagination{
    margin-top:10px!important;
}

body.connect-theme .dataTables_wrapper .page-link{
    min-width:36px;
    min-height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-color:#dce5ef!important;
    color:#4b6681!important;
}

body.connect-theme .dataTables_wrapper .page-item.active .page-link{
    border-color:#0b74ff!important;
    background:#0b74ff!important;
    color:#fff!important;
}

/* ---------- Status ---------- */
body.connect-theme .status{
    min-width:62px;
    min-height:27px!important;
    font-size:.66rem!important;
    letter-spacing:.01em;
}

body.connect-theme .status.status-active,
body.connect-theme .status-active{
    border-color:#bce5cb!important;
    background:#eaf9f0!important;
    color:#177a3f!important;
}

body.connect-theme .status.status-pending,
body.connect-theme .status-pending{
    border-color:#f0d9a5!important;
    background:#fff8e8!important;
    color:#8b6300!important;
}

body.connect-theme .status.status-suspended,
body.connect-theme .status-suspended,
body.connect-theme .status.status-cancelled,
body.connect-theme .status-cancelled,
body.connect-theme .status.status-terminated,
body.connect-theme .status-terminated{
    border-color:#efc7cc!important;
    background:#fff0f2!important;
    color:#aa3541!important;
}

/* ---------- Formulários / perfil / segurança ---------- */
body.connect-theme .card-body form label,
body.connect-theme .form-group label{
    color:#445b74;
    font-size:.77rem;
    font-weight:750;
}

body.connect-theme .form-control,
body.connect-theme .custom-select{
    min-height:42px;
}

body.connect-theme textarea.form-control{
    min-height:110px;
}

body.connect-theme .input-group .btn{
    min-height:42px;
}

body.connect-theme .custom-control-label{
    color:#526980;
    font-size:.79rem;
}

body.connect-theme .btn-danger,
body.connect-theme .btn-outline-danger{
    font-weight:800;
}

/* ---------- Alertas ---------- */
body.connect-theme .alert{
    border-width:1px!important;
    border-radius:13px!important;
    box-shadow:none!important;
}

body.connect-theme .alert a{
    font-weight:800;
}

/* ---------- Acessibilidade ---------- */
body.connect-theme a:focus-visible,
body.connect-theme button:focus-visible,
body.connect-theme input:focus-visible,
body.connect-theme select:focus-visible,
body.connect-theme textarea:focus-visible,
body.connect-theme summary:focus-visible{
    outline:3px solid rgba(11,116,255,.28)!important;
    outline-offset:2px!important;
}

/* ---------- WhatsApp: zona segura do rodapé ---------- */
body.connect-theme.connect-footer-visible .connect-whatsapp-float{
    transform:translateY(-76px);
}

@media(prefers-reduced-motion:reduce){
    body.connect-theme *,
    body.connect-theme *::before,
    body.connect-theme *::after{
        scroll-behavior:auto!important;
        transition-duration:.001ms!important;
        animation-duration:.001ms!important;
        animation-iteration-count:1!important;
    }
}

/* ---------- Responsivo ---------- */
@media(max-width:991.98px){
    body.connect-theme #main-body .sidebar{
        position:static;
    }

    body.template-clientareahome .connect-account-dashboard-head{
        align-items:flex-start;
        flex-direction:column;
    }
}

@media(max-width:767.98px){
    body.connect-theme .dataTables_wrapper > .row:first-child{
        gap:8px;
    }

    body.connect-theme .dataTables_wrapper .dataTables_filter,
    body.connect-theme .dataTables_wrapper .dataTables_length{
        text-align:left!important;
    }

    body.connect-theme .dataTables_wrapper .dataTables_filter input{
        display:block;
        width:100%!important;
        margin:6px 0 0!important;
    }

    body.connect-theme .table-container{
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    body.connect-theme #tableServicesList,
    body.connect-theme #tableDomainsList,
    body.connect-theme #tableInvoicesList,
    body.connect-theme #tableTicketsList{
        min-width:720px;
    }

    body.template-clientareahome .connect-account-dashboard-actions{
        width:100%;
    }

    body.template-clientareahome .connect-account-dashboard-actions .btn{
        flex:1 1 160px;
    }
}

@media(max-width:575.98px){
    body.template-clientareahome .connect-account-dashboard-head{
        padding:17px;
        border-radius:15px;
    }

    body.template-clientareahome .connect-account-dashboard-head h1{
        font-size:1.35rem;
    }

    body.connect-theme .header-lined h1{
        font-size:1.4rem!important;
    }
}
/* =========================================================
   CONNECT — LOOP 042
   AVISOS DA CONTA — LEGIBILIDADE E HIERARQUIA
   ========================================================= */

/* Cabeçalho da seção */
body.connect-theme .connect-client-alerts{
    margin-top:26px!important;
    margin-bottom:10px!important;
}

body.connect-theme .connect-client-alerts-head{
    display:flex!important;
    align-items:baseline!important;
    gap:12px!important;
    margin-bottom:12px!important;
}

body.connect-theme .connect-client-alerts-head > span{
    color:#0b74ff!important;
    font-size:11px!important;
    line-height:1.2!important;
    font-weight:900!important;
    letter-spacing:.095em!important;
}

body.connect-theme .connect-client-alerts-head > strong{
    color:#17304d!important;
    font-size:14px!important;
    line-height:1.35!important;
    font-weight:800!important;
}

/* Cada aviso fica mais alto e muito mais legível */
body.connect-theme .connect-client-alert{
    min-height:58px!important;
    grid-template-columns:36px minmax(0,1fr) 18px!important;
    gap:12px!important;
    padding:11px 14px!important;
    border-radius:14px!important;
    font-size:13.5px!important;
    line-height:1.45!important;
    font-weight:650!important;
}

body.connect-theme .connect-client-alert > span{
    min-width:0;
    color:#294760!important;
    font-size:13.5px!important;
    line-height:1.45!important;
    letter-spacing:0!important;
}

/* Ícone principal mais visível */
body.connect-theme .connect-client-alert > i:first-child{
    width:34px!important;
    height:34px!important;
    border-radius:10px!important;
    font-size:13px!important;
}

/* Seta de ação */
body.connect-theme .connect-client-alert > i:last-child{
    justify-self:end;
    color:#536b84;
    font-size:12px;
}

/* Diferencia melhor os alertas importantes */
body.connect-theme .connect-client-alert-warning > span{
    color:#6f4c10!important;
}

body.connect-theme .connect-client-alert-danger > span{
    color:#87363d!important;
}

body.connect-theme .connect-client-alert-success > span{
    color:#236b4e!important;
}

/* Hover discreto, sem perder contraste */
body.connect-theme .connect-client-alert:hover{
    box-shadow:0 7px 20px rgba(8,37,75,.055)!important;
}

/* Mobile: mantém fonte confortável sem estourar largura */
@media(max-width:767.98px){
    body.connect-theme .connect-client-alerts-head{
        display:grid!important;
        gap:3px!important;
    }

    body.connect-theme .connect-client-alerts-head > span{
        font-size:10.5px!important;
    }

    body.connect-theme .connect-client-alerts-head > strong{
        font-size:13.5px!important;
    }

    body.connect-theme .connect-client-alert{
        min-height:56px!important;
        grid-template-columns:34px minmax(0,1fr) 16px!important;
        gap:10px!important;
        padding:10px 12px!important;
        font-size:13px!important;
    }

    body.connect-theme .connect-client-alert > span{
        font-size:13px!important;
        line-height:1.45!important;
    }
}

@media(max-width:420px){
    body.connect-theme .connect-client-alert{
        grid-template-columns:32px minmax(0,1fr)!important;
    }

    body.connect-theme .connect-client-alert > i:last-child{
        display:none!important;
    }
}
/* =========================================================
   CONNECT — LOOP 043
   LOGIN EM UMA TELA — TOPO COMPACTO
   ========================================================= */

/*
 * Escopo intencional:
 * somente páginas de autenticação.
 * O topo da Área do Cliente logada permanece como está.
 */
body.template-login,
body.template-pwreset,
body.template-two-factor-challenge{
    --connect-auth-logo-width:300px;
}

/* Reduz o bloco superior nas telas de autenticação. */
body.template-login .connect-brand-row,
body.template-pwreset .connect-brand-row,
body.template-two-factor-challenge .connect-brand-row{
    min-height:112px!important;
    padding:4px 0!important;
}

body.template-login .connect-brand-container,
body.template-pwreset .connect-brand-container,
body.template-two-factor-challenge .connect-brand-container{
    min-height:104px!important;
}

body.template-login .connect-brand-logo,
body.template-login .connect-logo-header,
body.template-pwreset .connect-brand-logo,
body.template-pwreset .connect-logo-header,
body.template-two-factor-challenge .connect-brand-logo,
body.template-two-factor-challenge .connect-logo-header{
    width:var(--connect-auth-logo-width)!important;
    max-width:min(var(--connect-auth-logo-width),34vw)!important;
}

/* Navegação mais baixa, ainda totalmente clicável. */
body.template-login .connect-native-nav,
body.template-pwreset .connect-native-nav,
body.template-two-factor-challenge .connect-native-nav{
    min-height:40px!important;
    padding:2px 0!important;
}

body.template-login .connect-native-nav .navbar-nav>li>a,
body.template-pwreset .connect-native-nav .navbar-nav>li>a,
body.template-two-factor-challenge .connect-native-nav .navbar-nav>li>a{
    padding-top:8px!important;
    padding-bottom:8px!important;
}

/*
 * Na tela de login o breadcrumb não acrescenta contexto e estava
 * criando uma faixa branca vazia de aproximadamente 40px.
 */
body.template-login .connect-breadcrumb,
body.template-pwreset .connect-breadcrumb,
body.template-two-factor-challenge .connect-breadcrumb{
    display:none!important;
}

/* Aproxima o formulário do topo sem deixar apertado. */
body.template-login #main-body,
body.template-pwreset #main-body,
body.template-two-factor-challenge #main-body{
    padding-top:22px!important;
    padding-bottom:28px!important;
    min-height:auto!important;
}

body.template-login .primary-content{
    align-items:flex-start!important;
}

body.template-login .login-form{
    width:min(100%,540px)!important;
    margin:0 auto 14px!important;
}

body.template-login .login-form .card-body{
    padding:26px 34px 24px!important;
}

body.template-login .login-form .h3{
    margin-bottom:4px!important;
    font-size:27px!important;
}

body.template-login .login-form .card-body > p,
body.template-login .login-form .card-body .text-muted{
    margin-bottom:18px!important;
}

body.template-login .login-form .form-group{
    margin-bottom:14px!important;
}

body.template-login .login-form .form-control{
    min-height:42px!important;
}

body.template-login .login-form .card-footer{
    padding-top:12px!important;
    padding-bottom:12px!important;
}

/* Reduz espaço extra antes do rodapé em viewport curta. */
@media(min-width:992px) and (max-height:850px){
    body.template-login .connect-brand-row,
    body.template-pwreset .connect-brand-row,
    body.template-two-factor-challenge .connect-brand-row{
        min-height:102px!important;
    }

    body.template-login .connect-brand-container,
    body.template-pwreset .connect-brand-container,
    body.template-two-factor-challenge .connect-brand-container{
        min-height:94px!important;
    }

    body.template-login,
    body.template-pwreset,
    body.template-two-factor-challenge{
        --connect-auth-logo-width:285px;
    }

    body.template-login #main-body,
    body.template-pwreset #main-body,
    body.template-two-factor-challenge #main-body{
        padding-top:16px!important;
        padding-bottom:20px!important;
    }

    body.template-login .login-form .card-body{
        padding:22px 32px 20px!important;
    }

    body.template-login .login-form .form-group{
        margin-bottom:11px!important;
    }
}

/* Tablet */
@media(max-width:991.98px){
    body.template-login,
    body.template-pwreset,
    body.template-two-factor-challenge{
        --connect-auth-logo-width:250px;
    }

    body.template-login .connect-brand-row,
    body.template-pwreset .connect-brand-row,
    body.template-two-factor-challenge .connect-brand-row{
        min-height:98px!important;
    }

    body.template-login .connect-brand-container,
    body.template-pwreset .connect-brand-container,
    body.template-two-factor-challenge .connect-brand-container{
        min-height:90px!important;
    }

    body.template-login .connect-brand-logo,
    body.template-login .connect-logo-header,
    body.template-pwreset .connect-brand-logo,
    body.template-pwreset .connect-logo-header,
    body.template-two-factor-challenge .connect-brand-logo,
    body.template-two-factor-challenge .connect-logo-header{
        max-width:min(var(--connect-auth-logo-width),44vw)!important;
    }
}

/* Mobile */
@media(max-width:575.98px){
    body.template-login,
    body.template-pwreset,
    body.template-two-factor-challenge{
        --connect-auth-logo-width:205px;
    }

    body.template-login .connect-brand-row,
    body.template-pwreset .connect-brand-row,
    body.template-two-factor-challenge .connect-brand-row{
        min-height:86px!important;
    }

    body.template-login .connect-brand-container,
    body.template-pwreset .connect-brand-container,
    body.template-two-factor-challenge .connect-brand-container{
        min-height:78px!important;
    }

    body.template-login #main-body,
    body.template-pwreset #main-body,
    body.template-two-factor-challenge #main-body{
        padding-top:14px!important;
    }

    body.template-login .login-form .card-body{
        padding:21px 18px 19px!important;
    }
}
/* =========================================================
   CONNECT — LOOP 044
   LOGIN DEDICADO — UMA TELA / HEADER E FOOTER MÍNIMOS
   ========================================================= */

/* O login agora possui header próprio, sem a segunda navbar completa. */
body.template-login .connect-auth-header{
    border:0!important;
    background:#020817!important;
    box-shadow:0 8px 24px rgba(2,8,23,.12);
}

body.template-login .connect-auth-header-row{
    min-height:88px;
    display:flex;
    align-items:center;
    background:
        radial-gradient(circle at 8% 50%,rgba(0,118,255,.14),transparent 22%),
        #020817;
}

body.template-login .connect-auth-header-inner{
    min-height:88px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

body.template-login .connect-auth-brand{
    display:inline-flex;
    align-items:center;
    flex:0 0 auto;
}

body.template-login .connect-auth-logo{
    display:block;
    width:270px!important;
    max-width:32vw!important;
    height:auto!important;
    object-fit:contain;
}

body.template-login .connect-auth-header-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
}

body.template-login .connect-auth-header-link{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:7px 11px;
    border:1px solid #274667;
    border-radius:9px;
    color:#d9e8f8!important;
    font-size:.74rem;
    font-weight:800;
    text-decoration:none!important;
    white-space:nowrap;
}

body.template-login .connect-auth-header-link:hover{
    border-color:#4d7cab;
    background:#08192f;
    color:#fff!important;
}

body.template-login .connect-auth-header-link-primary{
    border-color:#0b74ff;
    background:#0b74ff;
    color:#fff!important;
}

/* Remove elementos antigos do login que não são mais necessários. */
body.template-login .connect-breadcrumb{
    display:none!important;
}

body.template-login #main-body{
    min-height:0!important;
    padding:14px 0 16px!important;
    background:
        radial-gradient(circle at 50% 0,rgba(11,116,255,.06),transparent 32%),
        #f5f8fc!important;
}

body.template-login #main-body > .container{
    max-width:1180px!important;
}

body.template-login #main-body .row{
    min-height:0!important;
}

body.template-login .primary-content{
    min-height:0!important;
    display:block!important;
}

/* Shell centralizado sem desperdiçar altura. */
body.template-login .connect-auth-shell{
    width:100%;
    display:flex;
    justify-content:center;
    padding:0;
}

body.template-login .connect-auth-form{
    width:min(100%,510px)!important;
    margin:0 auto!important;
}

body.template-login .connect-auth-card{
    overflow:hidden;
    margin:0!important;
    border:1px solid #d7e2ee!important;
    border-top:3px solid #0b74ff!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 16px 42px rgba(7,31,62,.08)!important;
}

body.template-login .connect-auth-card .card-body{
    padding:22px 30px 18px!important;
}

body.template-login .connect-auth-card-head{
    margin-bottom:15px;
}

body.template-login .connect-auth-kicker{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-bottom:4px;
    color:#0b74ff;
    font-size:.64rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.085em;
}

body.template-login .connect-auth-card-head h1{
    margin:0!important;
    color:#112945!important;
    font-size:1.72rem!important;
    line-height:1.12!important;
    font-weight:900!important;
    letter-spacing:-.025em;
}

body.template-login .connect-auth-card-head p{
    margin:5px 0 0!important;
    color:#6e7f92!important;
    font-size:.82rem!important;
    line-height:1.35!important;
}

body.template-login .connect-auth-card .form-group{
    margin-bottom:12px!important;
}

body.template-login .connect-auth-card label.form-control-label{
    margin-bottom:5px!important;
    color:#3e5872!important;
    font-size:.72rem!important;
    line-height:1.2;
    font-weight:800!important;
}

body.template-login .connect-auth-input .input-group-text,
body.template-login .connect-auth-input .form-control,
body.template-login .connect-auth-input .btn{
    min-height:42px!important;
}

body.template-login .connect-auth-input .input-group-text{
    min-width:42px;
    justify-content:center;
    border-color:#cbd9e8!important;
    background:#f5f9fd!important;
    color:#6a7f96!important;
}

body.template-login .connect-auth-input .form-control{
    border-color:#cbd9e8!important;
    background:#fff!important;
    font-size:.88rem!important;
}

body.template-login .connect-auth-input .form-control:focus{
    border-color:#75aff7!important;
    box-shadow:0 0 0 3px rgba(11,116,255,.12)!important;
}

body.template-login .connect-auth-options{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:1px 0 12px;
}

body.template-login .connect-auth-remember{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin:0!important;
    color:#526980;
    font-size:.74rem;
    cursor:pointer;
}

body.template-login .connect-auth-remember input{
    margin:0!important;
}

body.template-login .connect-auth-forgot{
    color:#55708d!important;
    font-size:.73rem;
    font-weight:700;
}

body.template-login .connect-auth-submit{
    min-height:43px!important;
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:10px!important;
    font-size:.84rem!important;
    font-weight:900!important;
}

body.template-login .connect-auth-trust{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;
    margin-top:11px;
    color:#77899d;
    font-size:.67rem;
}

body.template-login .connect-auth-trust span{
    display:inline-flex;
    align-items:center;
    gap:5px;
}

body.template-login .connect-auth-trust i{
    color:#0b74ff;
}

body.template-login .connect-auth-card-footer{
    min-height:43px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:9px 16px!important;
    border-top:1px solid #e7edf4!important;
    background:#f8fbff!important;
    color:#667a90;
    font-size:.72rem;
}

body.template-login .connect-auth-card-footer a{
    color:#0b74ff!important;
    font-weight:900;
}

body.template-login .connect-auth-alert{
    margin-top:0!important;
}

/* Footer mínimo do login */
body.template-login .connect-auth-footer{
    min-height:46px;
    display:flex;
    align-items:center;
    border-top:1px solid #12233a;
    background:#020817!important;
    color:#8fa5be;
}

body.template-login .connect-auth-footer-inner{
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

body.template-login .connect-auth-footer-copy,
body.template-login .connect-auth-footer-links{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:.66rem;
}

body.template-login .connect-auth-footer-copy i{
    color:#17c5f5;
}

body.template-login .connect-auth-footer-links a{
    color:#a9bdd2!important;
    text-decoration:none!important;
}

body.template-login .connect-auth-footer-links a:hover{
    color:#fff!important;
}

/* WhatsApp discreto no login para não cobrir o formulário. */
body.template-login .connect-whatsapp-float{
    width:46px!important;
    height:46px!important;
    right:18px!important;
    bottom:58px!important;
    padding:0!important;
    justify-content:center!important;
    border-radius:50%!important;
}

body.template-login .connect-whatsapp-float span{
    display:none!important;
}

/* Altura típica de notebook: aperta somente o necessário. */
@media(min-width:992px) and (max-height:700px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:78px!important;
    }

    body.template-login .connect-auth-logo{
        width:245px!important;
    }

    body.template-login #main-body{
        padding-top:10px!important;
        padding-bottom:10px!important;
    }

    body.template-login .connect-auth-card .card-body{
        padding:18px 28px 15px!important;
    }

    body.template-login .connect-auth-card-head{
        margin-bottom:11px!important;
    }

    body.template-login .connect-auth-card-head h1{
        font-size:1.55rem!important;
    }

    body.template-login .connect-auth-card .form-group{
        margin-bottom:9px!important;
    }

    body.template-login .connect-auth-trust{
        margin-top:8px!important;
    }

    body.template-login .connect-auth-footer,
    body.template-login .connect-auth-footer-inner{
        min-height:42px!important;
    }
}

/* Tablet */
@media(max-width:991.98px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:80px;
    }

    body.template-login .connect-auth-logo{
        width:230px!important;
        max-width:42vw!important;
    }

    body.template-login .connect-auth-header-link span{
        display:none;
    }

    body.template-login .connect-auth-header-link{
        width:38px;
        padding:0;
    }

    body.template-login .connect-auth-footer-inner{
        flex-direction:column;
        justify-content:center;
        gap:4px;
        padding-top:8px;
        padding-bottom:8px;
    }
}

/* Mobile */
@media(max-width:575.98px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:72px;
    }

    body.template-login .connect-auth-logo{
        width:190px!important;
        max-width:55vw!important;
    }

    body.template-login .connect-auth-header-actions{
        gap:5px;
    }

    body.template-login .connect-auth-header-link{
        width:34px;
        min-height:34px;
        border-radius:8px;
    }

    body.template-login #main-body{
        padding:10px 0 12px!important;
    }

    body.template-login .connect-auth-card{
        border-radius:14px!important;
    }

    body.template-login .connect-auth-card .card-body{
        padding:19px 17px 16px!important;
    }

    body.template-login .connect-auth-options{
        align-items:flex-start;
        flex-direction:column;
        gap:7px;
    }

    body.template-login .connect-auth-trust{
        gap:8px;
    }

    body.template-login .connect-auth-footer-links{
        flex-wrap:wrap;
        justify-content:center;
    }
}
/* =========================================================
   CONNECT — LOOP 045
   ACABAMENTO VISUAL APÓS AUDITORIA POR CAPTURAS REAIS
   ========================================================= */

/* ---------------------------------------------------------
   1. LOGIN — CORREÇÃO CRÍTICA DOS INPUT GROUPS
   Na captura do LOOP 044 o ícone, input e botão de olho
   estavam quebrando em linhas diferentes.
   --------------------------------------------------------- */

body.template-login .connect-auth-input{
    display:grid!important;
    width:100%!important;
    align-items:stretch!important;
    gap:0!important;
    flex-wrap:nowrap!important;
}

body.template-login .connect-auth-input-email{
    grid-template-columns:42px minmax(0,1fr)!important;
}

body.template-login .connect-auth-input-password{
    grid-template-columns:42px minmax(0,1fr) 42px!important;
}

body.template-login .connect-auth-input > .input-group-prepend,
body.template-login .connect-auth-input > .input-group-append{
    display:flex!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
}

body.template-login .connect-auth-input > .input-group-prepend{
    grid-column:1!important;
}

body.template-login .connect-auth-input-email > .form-control{
    grid-column:2!important;
}

body.template-login .connect-auth-input-password > .form-control{
    grid-column:2!important;
}

body.template-login .connect-auth-input-password > .input-group-append{
    grid-column:3!important;
}

body.template-login .connect-auth-input .input-group-text,
body.template-login .connect-auth-input .btn-reveal-pw{
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #cbd9e8!important;
    box-shadow:none!important;
}

body.template-login .connect-auth-input .input-group-text{
    border-radius:9px 0 0 9px!important;
    border-right:0!important;
}

body.template-login .connect-auth-input .form-control{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    margin:0!important;
    padding:8px 12px!important;
    border-radius:0!important;
    box-shadow:none;
}

body.template-login .connect-auth-input-email .form-control{
    border-radius:0 9px 9px 0!important;
}

body.template-login .connect-auth-input-password .btn-reveal-pw{
    border-left:0!important;
    border-radius:0 9px 9px 0!important;
    background:#f8fbff!important;
    color:#496781!important;
}

body.template-login .connect-auth-input-password .btn-reveal-pw:hover{
    background:#edf6ff!important;
    color:#0b74ff!important;
}

body.template-login .connect-auth-input .form-control:focus{
    position:relative;
    z-index:2;
    border-color:#78b4ff!important;
    box-shadow:inset 0 0 0 1px #78b4ff,0 0 0 3px rgba(11,116,255,.10)!important;
}

/* O card fica um pouco mais compacto após corrigir os campos. */
body.template-login .connect-auth-card .card-body{
    padding-top:20px!important;
    padding-bottom:16px!important;
}

body.template-login .connect-auth-card-head{
    margin-bottom:13px!important;
}

body.template-login .connect-auth-card .form-group{
    margin-bottom:10px!important;
}

body.template-login .connect-auth-options{
    margin-top:2px!important;
    margin-bottom:10px!important;
}

body.template-login .connect-auth-trust{
    margin-top:8px!important;
}

body.template-login .connect-auth-card-footer{
    min-height:40px!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
}

/* ---------------------------------------------------------
   2. LOGIN — ajuste fino de altura para notebook
   --------------------------------------------------------- */
@media(min-width:992px) and (max-height:760px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:76px!important;
    }

    body.template-login .connect-auth-logo{
        width:238px!important;
    }

    body.template-login #main-body{
        padding-top:10px!important;
        padding-bottom:9px!important;
    }

    body.template-login .connect-auth-card .card-body{
        padding:16px 26px 13px!important;
    }

    body.template-login .connect-auth-card-head{
        margin-bottom:9px!important;
    }

    body.template-login .connect-auth-card-head h1{
        font-size:1.5rem!important;
    }

    body.template-login .connect-auth-card-head p{
        margin-top:3px!important;
    }

    body.template-login .connect-auth-card .form-group{
        margin-bottom:8px!important;
    }

    body.template-login .connect-auth-options{
        margin-bottom:8px!important;
    }

    body.template-login .connect-auth-trust{
        margin-top:6px!important;
    }

    body.template-login .connect-auth-footer,
    body.template-login .connect-auth-footer-inner{
        min-height:40px!important;
    }
}

/* ---------------------------------------------------------
   3. DASHBOARD LOGADO — hierarquia e sidebar
   --------------------------------------------------------- */

body.template-clientareahome .connect-account-dashboard-head{
    padding:18px 20px!important;
    margin-bottom:15px!important;
}

body.template-clientareahome .connect-account-dashboard-head h1{
    font-size:1.45rem!important;
}

body.template-clientareahome .connect-account-dashboard-head p{
    margin-top:4px!important;
}

/* A informação cadastral deixa de competir visualmente com o painel principal. */
body.template-clientareahome #main-body .sidebar .card:first-child .card-header,
body.template-clientareahome #main-body .sidebar .panel:first-child .panel-heading{
    min-height:43px!important;
    padding-top:9px!important;
    padding-bottom:9px!important;
}

body.template-clientareahome #main-body .sidebar .card:first-child .card-body,
body.template-clientareahome #main-body .sidebar .panel:first-child .panel-body{
    padding:13px 16px!important;
    color:#4e657c!important;
    font-size:.75rem!important;
    line-height:1.42!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
}

body.template-clientareahome #main-body .sidebar .card:first-child .card-body strong,
body.template-clientareahome #main-body .sidebar .card:first-child .card-body b,
body.template-clientareahome #main-body .sidebar .panel:first-child .panel-body strong,
body.template-clientareahome #main-body .sidebar .panel:first-child .panel-body b{
    color:#17304d!important;
    font-weight:850!important;
}

/* Tiles ligeiramente mais compactos para mostrar mais conteúdo sem rolar. */
body.template-clientareahome .tiles{
    margin-bottom:15px!important;
}

body.template-clientareahome .tiles .tile{
    min-height:112px!important;
    padding-top:14px!important;
    padding-bottom:12px!important;
}

body.template-clientareahome .tiles .tile i{
    transform:scale(.92);
    transform-origin:center;
}

/* ---------------------------------------------------------
   4. WHATSAPP — respeitar conteúdo e cantos da viewport
   --------------------------------------------------------- */
body.template-clientareahome .connect-whatsapp-float{
    right:24px!important;
    bottom:20px!important;
}

@media(max-width:991.98px){
    body.template-clientareahome .connect-whatsapp-float{
        right:16px!important;
        bottom:16px!important;
    }
}

/* ---------------------------------------------------------
   5. RESPONSIVO — autenticação
   --------------------------------------------------------- */
@media(max-width:575.98px){
    body.template-login .connect-auth-input-email{
        grid-template-columns:40px minmax(0,1fr)!important;
    }

    body.template-login .connect-auth-input-password{
        grid-template-columns:40px minmax(0,1fr) 40px!important;
    }

    body.template-login .connect-auth-input > .input-group-prepend,
    body.template-login .connect-auth-input > .input-group-append,
    body.template-login .connect-auth-input .input-group-text,
    body.template-login .connect-auth-input .btn-reveal-pw{
        width:40px!important;
        min-width:40px!important;
        max-width:40px!important;
    }
}
/* =========================================================
   CONNECT — LOOP 046 FINAL
   TOPO COMPACTO SEM REDUZIR A LOGOMARCA
   ========================================================= */

/*
 * A logo oficial possui área transparente acima/abaixo do desenho.
 * Este loop NÃO reduz a largura da marca.
 * A técnica abaixo diminui o espaço do header cortando somente
 * a área transparente do canvas PNG.
 */

/* ---------- Desktop / área pública e cliente logado ---------- */
body.connect-theme:not(.template-login) .connect-brand-row{
    min-height:126px!important;
    padding:3px 0!important;
}

body.connect-theme:not(.template-login) .connect-brand-container{
    min-height:120px!important;
}

/* Mantém os 350px já aprovados. */
body.connect-theme:not(.template-login) .connect-brand-logo,
body.connect-theme:not(.template-login) .connect-logo-header{
    width:var(--connect-logo-header-desktop)!important;
    max-width:min(var(--connect-logo-header-desktop),38vw)!important;
    flex:none!important;
    transform:translateY(-10%)!important;
    transform-origin:left center!important;
}

/*
 * Janela visual de 120px:
 * remove transparência do PNG, não o conteúdo visível da marca.
 */
body.connect-theme:not(.template-login) .connect-brand-header{
    height:120px!important;
    min-height:120px!important;
    display:flex!important;
    align-items:flex-start!important;
    overflow:hidden!important;
}

/* Barra superior do cliente logado um pouco mais eficiente. */
body.connect-theme .connect-account-bar-inner{
    min-height:32px!important;
}

body.connect-theme .connect-account-bar{
    font-size:11.5px!important;
}

body.connect-theme .connect-account-bar .btn{
    padding-top:2px!important;
    padding-bottom:2px!important;
}

/* Navegação sem reduzir tipografia; apenas espaço vertical ocioso. */
body.connect-theme:not(.template-login) .connect-native-nav{
    min-height:43px!important;
    padding-top:2px!important;
    padding-bottom:2px!important;
}

body.connect-theme:not(.template-login) .connect-native-nav .navbar-nav>li>a{
    padding-top:9px!important;
    padding-bottom:9px!important;
}

/* ---------- 1200px ---------- */
@media(max-width:1199.98px){
    body.connect-theme:not(.template-login) .connect-brand-row{
        min-height:104px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-container{
        min-height:98px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-header{
        height:98px!important;
        min-height:98px!important;
    }

    /* Mantém os 285px já definidos no sistema responsivo. */
    body.connect-theme:not(.template-login) .connect-brand-logo,
    body.connect-theme:not(.template-login) .connect-logo-header{
        width:var(--connect-logo-header-tablet-lg)!important;
        max-width:min(var(--connect-logo-header-tablet-lg),42vw)!important;
    }
}

/* ---------- Tablet ---------- */
@media(max-width:991.98px){
    body.connect-theme:not(.template-login) .connect-brand-row{
        min-height:94px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-container{
        min-height:88px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-header{
        height:88px!important;
        min-height:88px!important;
    }

    /* Mantém os 255px. */
    body.connect-theme:not(.template-login) .connect-brand-logo,
    body.connect-theme:not(.template-login) .connect-logo-header{
        width:var(--connect-logo-header-tablet)!important;
        max-width:min(var(--connect-logo-header-tablet),45vw)!important;
    }
}

/* ---------- Mobile ---------- */
@media(max-width:767.98px){
    body.connect-theme:not(.template-login) .connect-brand-row{
        min-height:82px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-container{
        min-height:76px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-header{
        height:76px!important;
        min-height:76px!important;
    }

    /* Mantém os 220px. */
    body.connect-theme:not(.template-login) .connect-brand-logo,
    body.connect-theme:not(.template-login) .connect-logo-header{
        width:var(--connect-logo-header-mobile)!important;
        max-width:min(var(--connect-logo-header-mobile),59vw)!important;
    }

    body.connect-theme:not(.template-login) .connect-native-nav{
        min-height:40px!important;
    }
}

@media(max-width:429.98px){
    body.connect-theme:not(.template-login) .connect-brand-row{
        min-height:74px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-container{
        min-height:68px!important;
    }

    body.connect-theme:not(.template-login) .connect-brand-header{
        height:68px!important;
        min-height:68px!important;
    }

    /* Mantém os 195px. */
    body.connect-theme:not(.template-login) .connect-brand-logo,
    body.connect-theme:not(.template-login) .connect-logo-header{
        width:var(--connect-logo-header-mobile-sm)!important;
        max-width:min(var(--connect-logo-header-mobile-sm),56vw)!important;
    }
}

/* ---------- Login ----------
 * O LOOP 045 já deixou o login muito próximo do limite físico
 * da altura visível da logo. Aqui retiramos apenas 4px extras,
 * sem alterar a largura da logomarca.
 */
body.template-login .connect-auth-header-row,
body.template-login .connect-auth-header-inner{
    min-height:72px!important;
}

body.template-login .connect-auth-brand{
    height:72px!important;
    overflow:hidden!important;
    align-items:flex-start!important;
}

body.template-login .connect-auth-logo{
    /* NÃO reduzir a largura definida no LOOP 045. */
    transform:translateY(-10%)!important;
    transform-origin:left center!important;
}

@media(min-width:992px) and (max-height:760px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:72px!important;
    }

    body.template-login .connect-auth-brand{
        height:72px!important;
    }

    /* Cancela a redução para 238px do loop anterior:
       mantém a logo maior mesmo com o topo menor. */
    body.template-login .connect-auth-logo{
        width:270px!important;
        max-width:32vw!important;
    }
}

/* Em telas muito baixas, priorizar a marca sem esmagar o formulário. */
@media(min-width:992px) and (max-height:680px){
    body.template-login .connect-auth-header-row,
    body.template-login .connect-auth-header-inner{
        min-height:68px!important;
    }

    body.template-login .connect-auth-brand{
        height:68px!important;
    }
}

/* Garantia: nenhum elemento do logo recebe scale() neste loop. */
body.connect-theme .connect-brand-logo,
body.connect-theme .connect-logo-header,
body.template-login .connect-auth-logo{
    scale:none!important;
}


/* =========================================================
   CONNECT SERVICES MOBILE CARDS — V1
   Remove a rolagem horizontal da lista Produtos & Serviços.
   Escopo exclusivo: clientarea.php?action=services em <= 767.98px.
   ========================================================= */
@media (max-width:767.98px){
  body.template-clientareaproducts.connect-theme .table-container{
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:auto!important;
    margin:0!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList thead{
    display:none!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody{
    display:grid!important;
    width:100%!important;
    gap:10px!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody tr{
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr)!important;
    width:100%!important;
    min-width:0!important;
    padding:12px!important;
    border:1px solid #dfe7f1!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(7,29,59,.035)!important;
    overflow:hidden!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td{
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding:5px 0!important;
    border:0!important;
    background:transparent!important;
    text-align:left!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(1){
    grid-column:1!important;
    grid-row:1 / span 4!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;
    padding:5px 8px 0 0!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(1) img{
    width:30px!important;
    height:auto!important;
    max-width:30px!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(2){
    grid-column:2!important;
    grid-row:1!important;
    padding-top:2px!important;
    padding-bottom:8px!important;
    font-size:.92rem!important;
    line-height:1.35!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(2) strong{
    display:block!important;
    color:#183c5e!important;
    font-size:1rem!important;
    line-height:1.25!important;
    font-weight:850!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(2) a{
    display:inline-block!important;
    margin-top:2px!important;
    color:#3d668a!important;
    font-size:.88rem!important;
    line-height:1.3!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(3),
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(4),
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(5){
    grid-column:2!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    min-height:32px!important;
    border-top:1px solid #edf2f7!important;
    color:#2f4d69!important;
    font-size:.82rem!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(3)::before{
    content:'Preço';
  }
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(4)::before{
    content:'Próximo vencimento';
  }
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(5)::before{
    content:'Status';
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(3)::before,
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(4)::before,
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(5)::before{
    flex:0 0 auto!important;
    color:#73869b!important;
    font-size:.7rem!important;
    font-weight:800!important;
    letter-spacing:.025em!important;
    text-transform:uppercase!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(3) small{
    display:inline!important;
    margin-left:3px!important;
  }

  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(5) .status{
    margin-left:auto!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper > .row:first-child,
  body.template-clientareaproducts.connect-theme .dataTables_wrapper > .row:last-child{
    margin-left:0!important;
    margin-right:0!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper > .row:first-child > [class*='col-'],
  body.template-clientareaproducts.connect-theme .dataTables_wrapper > .row:last-child > [class*='col-']{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_filter,
  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_length{
    width:100%!important;
    margin-bottom:8px!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_filter label{
    width:100%!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_filter input{
    width:100%!important;
    max-width:none!important;
    margin:6px 0 0!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_info{
    padding-top:8px!important;
    text-align:center!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .dataTables_paginate{
    display:flex!important;
    justify-content:center!important;
    width:100%!important;
  }

  body.template-clientareaproducts.connect-theme .dataTables_wrapper .pagination{
    justify-content:center!important;
    flex-wrap:wrap!important;
    margin:8px 0 0!important;
  }
}

@media (max-width:390px){
  body.template-clientareaproducts.connect-theme #tableServicesList tbody tr{
    grid-template-columns:38px minmax(0,1fr)!important;
    padding:10px!important;
  }
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(1) img{
    width:27px!important;
    max-width:27px!important;
  }
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(3),
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(4),
  body.template-clientareaproducts.connect-theme #tableServicesList tbody td:nth-child(5){
    gap:8px!important;
    font-size:.78rem!important;
  }
}

/* =========================================================
   CONNECT INVOICES MOBILE CARDS — V1
   Remove rolagem horizontal da lista de faturas no celular.
   Escopo exclusivo: clientarea.php?action=invoices em <= 767.98px.
   ========================================================= */
@media (max-width:767.98px){
  body.template-clientareainvoices.connect-theme .table-container{
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:auto!important;
    margin:0!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList thead{
    display:none!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody{
    display:grid!important;
    width:100%!important;
    gap:10px!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:12px 14px!important;
    border:1px solid #dfe7f1!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(7,29,59,.035)!important;
    overflow:hidden!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:42px!important;
    padding:9px 0!important;
    border:0!important;
    border-top:1px solid #edf2f7!important;
    background:transparent!important;
    color:#2f4d69!important;
    font-size:.84rem!important;
    line-height:1.3!important;
    text-align:right!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:first-child{
    min-height:48px!important;
    padding-top:2px!important;
    padding-bottom:11px!important;
    border-top:0!important;
    color:#163c5e!important;
    font-size:1rem!important;
    font-weight:850!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td::before{
    flex:0 0 auto!important;
    max-width:52%!important;
    color:#73869b!important;
    font-size:.7rem!important;
    font-weight:850!important;
    letter-spacing:.025em!important;
    line-height:1.2!important;
    text-align:left!important;
    text-transform:uppercase!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1)::before{content:'Fatura nº';}
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2)::before{content:'Emissão';}
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3)::before{content:'Vencimento';}
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4)::before{content:'Total';}
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5)::before{content:'Status';}

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td .w-hidden{
    display:none!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5) .status{
    margin-left:auto!important;
  }

  /* Neutraliza a largura mínima genérica de 720px somente nesta página. */
  body.template-clientareainvoices.connect-theme #tableInvoicesList{
    min-width:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper{
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .listtable{
    width:100%!important;
    min-width:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper > .row,
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .listtable > .row{
    margin-left:0!important;
    margin-right:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter{
    width:100%!important;
    margin:0 0 6px!important;
    text-align:left!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter label{
    display:block!important;
    width:100%!important;
    margin:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter input{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-height:46px!important;
    margin:0!important;
    padding:0 14px!important;
    border-radius:12px!important;
    font-size:.9rem!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_info{
    width:100%!important;
    padding:7px 0 10px!important;
    text-align:center!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length{
    width:100%!important;
    margin:10px 0 0!important;
    text-align:center!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length label{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    margin:0!important;
    white-space:normal!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length select{
    width:auto!important;
    min-width:74px!important;
    margin:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_paginate{
    display:flex!important;
    justify-content:center!important;
    width:100%!important;
    margin-top:6px!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .pagination{
    justify-content:center!important;
    flex-wrap:wrap!important;
    margin:0!important;
  }
}

@media (max-width:390px){
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    padding:10px 12px!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td{
    gap:8px!important;
    font-size:.8rem!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td::before{
    font-size:.66rem!important;
  }
}



/* =========================================================
   CONNECT CLIENT PANEL RESPONSIVE MASTER — V1
   Responsive hardening for authenticated client-area content.
   Preserves WHMCS data, routes, actions and business logic.
   ========================================================= */
@media (max-width:767.98px){
  /* Global client-area containment */
  body.connect-theme:not(.template-homepage):not(.template-login) #main-body{
    overflow-x:hidden;
  }
  body.connect-theme:not(.template-homepage):not(.template-login) #main-body > .container{
    width:100%;
    max-width:100%;
    padding-left:12px;
    padding-right:12px;
  }
  body.connect-theme #main-body .primary-content,
  body.connect-theme #main-body .secondary-content,
  body.connect-theme #main-body [class*="col-"]{
    min-width:0;
  }
  body.connect-theme .connect-breadcrumb .breadcrumb{
    display:flex;
    flex-wrap:wrap;
    gap:3px 0;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  body.connect-theme .header-lined{
    margin-bottom:14px;
  }
  body.connect-theme .header-lined h1{
    overflow-wrap:anywhere;
  }
  body.connect-theme .card,
  body.connect-theme .panel{
    max-width:100%;
  }
  body.connect-theme .card-body,
  body.connect-theme .panel-body{
    min-width:0;
  }
  body.connect-theme .form-control,
  body.connect-theme .custom-select,
  body.connect-theme input,
  body.connect-theme select,
  body.connect-theme textarea{
    max-width:100%;
  }
  body.connect-theme .input-group{
    min-width:0;
    max-width:100%;
  }
  body.connect-theme .input-group > .form-control{
    min-width:0;
  }
  body.connect-theme pre,
  body.connect-theme code{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  /* Shared DataTables controls become a vertical mobile toolbar. */
  body.connect-theme .dataTables_wrapper,
  body.connect-theme .dataTables_wrapper .listtable{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body.connect-theme .dataTables_wrapper > .row,
  body.connect-theme .dataTables_wrapper .listtable > .row{
    margin-left:0!important;
    margin-right:0!important;
  }
  body.connect-theme .dataTables_wrapper > .row > [class*="col-"],
  body.connect-theme .dataTables_wrapper .listtable > .row > [class*="col-"]{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  body.connect-theme .dataTables_wrapper .dataTables_filter,
  body.connect-theme .dataTables_wrapper .dataTables_length{
    width:100%!important;
    text-align:left!important;
  }
  body.connect-theme .dataTables_wrapper .dataTables_filter label{
    display:block!important;
    width:100%!important;
  }
  body.connect-theme .dataTables_wrapper .dataTables_filter input{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:6px 0 0!important;
  }
  body.connect-theme .dataTables_wrapper .dataTables_info{
    width:100%!important;
    text-align:center!important;
  }
  body.connect-theme .dataTables_wrapper .dataTables_paginate{
    width:100%!important;
    display:flex!important;
    justify-content:center!important;
  }
  body.connect-theme .dataTables_wrapper .pagination{
    justify-content:center!important;
    flex-wrap:wrap!important;
  }

  /* DOMAINS — card layout, no horizontal scrolling. */
  body.template-clientareadomains.connect-theme .table-container{
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList thead{display:none!important;}
  body.template-clientareadomains.connect-theme #tableDomainsList tbody{
    display:grid!important;
    width:100%!important;
    gap:10px!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody tr{
    display:grid!important;
    grid-template-columns:34px 40px minmax(0,1fr)!important;
    width:100%!important;
    min-width:0!important;
    padding:12px!important;
    border:1px solid #dfe7f1!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(7,29,59,.035)!important;
    overflow:hidden!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td{
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding:5px 0!important;
    border:0!important;
    background:transparent!important;
    text-align:left!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(1){
    grid-column:1!important;grid-row:1!important;
    display:flex!important;align-items:flex-start!important;justify-content:center!important;
    padding-top:8px!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(2){
    grid-column:2!important;grid-row:1!important;
    display:flex!important;align-items:flex-start!important;justify-content:center!important;
    padding-top:5px!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(2) img{
    width:28px!important;max-width:28px!important;height:auto!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(3){
    grid-column:3!important;grid-row:1!important;
    padding:2px 0 9px!important;
    color:#183c5e!important;
    font-weight:800!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(3) a{
    color:#245d8c!important;font-size:.9rem!important;font-weight:850!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(3) small{
    display:block!important;margin-top:3px!important;color:#6d8197!important;font-weight:650!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(4),
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(5),
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(6){
    grid-column:1 / -1!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    gap:12px!important;min-height:38px!important;
    border-top:1px solid #edf2f7!important;
    color:#2f4d69!important;font-size:.82rem!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(4)::before{content:'Registro';}
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(5)::before{content:'Próximo vencimento';}
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(6)::before{content:'Status';}
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(4)::before,
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(5)::before,
  body.template-clientareadomains.connect-theme #tableDomainsList tbody td:nth-child(6)::before{
    color:#73869b!important;font-size:.7rem!important;font-weight:800!important;
    letter-spacing:.025em!important;text-transform:uppercase!important;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList .w-hidden{display:none!important;}

  /* SUPPORT TICKETS — card layout. */
  body.template-supportticketslist.connect-theme .table-container{
    overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList{
    display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList thead{display:none!important;}
  body.template-supportticketslist.connect-theme #tableTicketsList tbody{
    display:grid!important;width:100%!important;gap:10px!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList tbody tr{
    display:grid!important;width:100%!important;min-width:0!important;
    padding:12px!important;border:1px solid #dfe7f1!important;border-radius:14px!important;
    background:#fff!important;box-shadow:0 8px 22px rgba(7,29,59,.035)!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td{
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    gap:12px!important;width:100%!important;min-width:0!important;max-width:100%!important;
    padding:8px 0!important;border:0!important;border-top:1px solid #edf2f7!important;
    text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;
    color:#2f4d69!important;font-size:.82rem!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(2){
    grid-row:1!important;display:block!important;border-top:0!important;padding-top:2px!important;padding-bottom:10px!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(2) a{
    display:block!important;border-left:0!important;padding-left:0!important;min-width:0!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList .ticket-number{
    color:#0b74ff!important;font-size:.72rem!important;font-weight:850!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList .ticket-subject{
    display:block!important;margin-top:3px!important;color:#183c5e!important;font-size:.96rem!important;font-weight:850!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(1)::before{content:'Departamento';}
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(3)::before{content:'Status';}
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(4)::before{content:'Atualização';}
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(1)::before,
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(3)::before,
  body.template-supportticketslist.connect-theme #tableTicketsList tbody td:nth-child(4)::before{
    color:#73869b!important;font-size:.7rem!important;font-weight:800!important;text-transform:uppercase!important;
  }
  body.template-supportticketslist.connect-theme #tableTicketsList .w-hidden{display:none!important;}

  /* QUOTES — card layout. */
  body.template-clientareaquotes.connect-theme .table-container{
    overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList{
    display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList thead{display:none!important;}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody{
    display:grid!important;width:100%!important;gap:10px!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody tr{
    display:grid!important;width:100%!important;min-width:0!important;padding:12px!important;
    border:1px solid #dfe7f1!important;border-radius:14px!important;background:#fff!important;
    box-shadow:0 8px 22px rgba(7,29,59,.035)!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td{
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    gap:12px!important;width:100%!important;min-width:0!important;padding:8px 0!important;
    border:0!important;border-top:1px solid #edf2f7!important;text-align:left!important;
    white-space:normal!important;overflow-wrap:anywhere!important;font-size:.82rem!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(2){
    grid-row:1!important;display:block!important;border-top:0!important;padding-top:2px!important;
    color:#183c5e!important;font-size:.96rem!important;font-weight:850!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(1)::before{content:'Orçamento nº';}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(3)::before{content:'Emissão';}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(4)::before{content:'Válido até';}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(5)::before{content:'Status';}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(1)::before,
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(3)::before,
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(4)::before,
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(5)::before{
    color:#73869b!important;font-size:.7rem!important;font-weight:800!important;text-transform:uppercase!important;
  }
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(6){display:block!important;}
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(6) form,
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody td:nth-child(6) .btn{width:100%!important;}
  body.template-clientareaquotes.connect-theme #tableQuotesList .w-hidden{display:none!important;}

  /* EMAIL HISTORY — compact cards. */
  body.template-clientareaemails.connect-theme .table-container{
    overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList{
    display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList thead{display:none!important;}
  body.template-clientareaemails.connect-theme #tableEmailsList tbody{
    display:grid!important;width:100%!important;gap:10px!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList tbody tr{
    display:grid!important;width:100%!important;min-width:0!important;padding:12px!important;
    border:1px solid #dfe7f1!important;border-radius:14px!important;background:#fff!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList tbody td{
    width:100%!important;min-width:0!important;max-width:100%!important;padding:7px 0!important;
    border:0!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList tbody td:nth-child(1)::before{
    content:'Data';display:inline-block;margin-right:8px;color:#73869b;font-size:.7rem;font-weight:800;text-transform:uppercase;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList tbody td:nth-child(2){
    color:#183c5e!important;font-size:.92rem!important;font-weight:800!important;
    border-top:1px solid #edf2f7!important;
  }
  body.template-clientareaemails.connect-theme #tableEmailsList tbody td:nth-child(3){border-top:1px solid #edf2f7!important;}
  body.template-clientareaemails.connect-theme #tableEmailsList tbody td:nth-child(3) .btn{width:100%!important;min-height:42px!important;}
  body.template-clientareaemails.connect-theme #tableEmailsList .w-hidden{display:none!important;}

  /* Forms/account/security: prevent squeezed columns and action overflow. */
  body.template-clientareadetails.connect-theme .card-body,
  body.template-clientareasecurity.connect-theme .card-body,
  body.template-clientareaproductdetails.connect-theme .card-body,
  body.template-account-paymentmethods.connect-theme .card-body,
  body.template-account-paymentmethods-manage.connect-theme .card-body{
    padding:16px!important;
  }
  body.template-clientareadetails.connect-theme form > .form-group.text-center{
    display:grid!important;grid-template-columns:1fr!important;gap:8px!important;
  }
  body.template-clientareadetails.connect-theme form > .form-group.text-center .btn{
    width:100%!important;min-height:44px!important;margin:0!important;
  }
  body.template-clientareaproductdetails.connect-theme .product-actions-wrapper .btn{
    white-space:normal!important;min-height:44px!important;
  }

  /* Fallback: never allow an unhandled account table to widen the whole page. */
  body.connect-theme .table-responsive,
  body.connect-theme .table-container{
    max-width:100%!important;
  }
}

@media (max-width:390px){
  body.connect-theme:not(.template-homepage):not(.template-login) #main-body > .container{
    padding-left:9px;
    padding-right:9px;
  }
  body.template-clientareadomains.connect-theme #tableDomainsList tbody tr,
  body.template-supportticketslist.connect-theme #tableTicketsList tbody tr,
  body.template-clientareaquotes.connect-theme #tableQuotesList tbody tr,
  body.template-clientareaemails.connect-theme #tableEmailsList tbody tr{
    padding:10px!important;
    border-radius:12px!important;
  }
}

/* =========================================================
   CONNECT VIEW INVOICE — MOBILE PRINT/DOWNLOAD FIX V1
   Escopo exclusivo: botoes Imprimir e Download no rodape da fatura.
   Nao altera QR Code, Pix, boleto ou conteudo da fatura.
   ========================================================= */
@media(max-width:767.98px){
    .invoice-container > .float-right.btn-group.btn-group-sm.d-print-none{
        float:none!important;
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr));
        width:100%!important;
        max-width:100%!important;
        margin:16px 0 0!important;
        gap:8px!important;
        clear:both!important;
        box-sizing:border-box!important;
    }
    .invoice-container > .float-right.btn-group.btn-group-sm.d-print-none > .btn{
        display:flex!important;
        align-items:center!important;
        justify-content:center!important;
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        margin:0!important;
        box-sizing:border-box!important;
        white-space:normal!important;
        text-align:center!important;
    }
}


/* =========================================================
   CONNECT INVOICES PREMIUM MOBILE — LOOP 2 V2
   Refinamento visual + QA mobile dos cards de fatura.
   Escopo exclusivo: clientarea.php?action=invoices <= 767.98px.
   Não altera dados, rotas, Pix, boleto, QR Code ou lógica WHMCS.
   ========================================================= */
@media (max-width:767.98px){
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody{
    gap:14px!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    column-gap:16px!important;
    width:100%!important;
    padding:0 16px 14px!important;
    border:1px solid #d6e3f0!important;
    border-radius:18px!important;
    background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%)!important;
    box-shadow:0 12px 30px rgba(8,37,74,.065)!important;
    overflow:hidden!important;
    cursor:pointer!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr::after{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;
    background:linear-gradient(90deg,#0b74ff 0%,#26a7ff 100%);
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td{
    width:auto!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    margin:0!important;
    background:transparent!important;
    color:#304b67!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td::before{
    display:block!important;
    max-width:none!important;
    margin:0 0 5px!important;
    color:#7b8da1!important;
    font-size:.66rem!important;
    font-weight:850!important;
    letter-spacing:.055em!important;
    line-height:1.1!important;
    text-transform:uppercase!important;
  }

  /* Cabeçalho visual do card: número da fatura + valor total. */
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1){
    grid-column:1!important;
    grid-row:1!important;
    display:block!important;
    padding:20px 0 13px!important;
    border:0!important;
    text-align:left!important;
    color:#123b61!important;
    font-size:1.12rem!important;
    font-weight:900!important;
    line-height:1.15!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1)::before{
    content:'Fatura'!important;
    text-align:left!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4){
    grid-column:2!important;
    grid-row:1!important;
    display:block!important;
    padding:20px 0 13px!important;
    border:0!important;
    text-align:right!important;
    color:#0b67c7!important;
    font-size:1.08rem!important;
    font-weight:900!important;
    line-height:1.15!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4)::before{
    content:'Total'!important;
    text-align:right!important;
  }

  /* Datas em duas colunas compactas. */
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2),
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3){
    grid-row:2!important;
    display:block!important;
    padding:13px 0!important;
    border:0!important;
    border-top:1px solid #e7edf4!important;
    color:#395873!important;
    font-size:.85rem!important;
    font-weight:700!important;
    line-height:1.25!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2){
    grid-column:1!important;
    text-align:left!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3){
    grid-column:2!important;
    text-align:right!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2)::before{
    content:'Emissão'!important;
    text-align:left!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3)::before{
    content:'Vencimento'!important;
    text-align:right!important;
  }

  /* Status em faixa final do card. */
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5){
    grid-column:1 / -1!important;
    grid-row:3!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:13px 0 0!important;
    border:0!important;
    border-top:1px solid #e7edf4!important;
    text-align:left!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5)::before{
    content:'Status'!important;
    display:block!important;
    margin:0!important;
    text-align:left!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5) .status{
    margin:0 0 0 auto!important;
    padding:7px 13px!important;
    border-radius:999px!important;
    font-size:.76rem!important;
    font-weight:850!important;
    line-height:1.1!important;
    box-shadow:0 4px 12px rgba(8,37,74,.04)!important;
  }

  /* Interação discreta sem alterar o onclick nativo do WHMCS. */
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:active{
    transform:translateY(1px);
  }

  @media (prefers-reduced-motion:reduce){
    body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:active{
      transform:none;
    }
  }
}

@media (max-width:430px){
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    column-gap:12px!important;
    padding:0 13px 13px!important;
    border-radius:16px!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1),
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4){
    padding-top:18px!important;
  }
}

@media (max-width:390px){
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    column-gap:10px!important;
    padding:0 11px 12px!important;
    border-radius:14px!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1){
    font-size:1.02rem!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4){
    font-size:1rem!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2),
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3){
    font-size:.8rem!important;
  }
}

@media (max-width:340px){
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    column-gap:8px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td::before{
    font-size:.62rem!important;
  }
}


/* =========================================================
   CONNECT INVOICES PREMIUM MOBILE — LOOP 3 FINAL POLISH
   Acabamento visual final da lista de faturas no celular.
   Escopo exclusivo: clientarea.php?action=invoices <= 767.98px.
   Não altera dados, rotas, Pix, boleto, QR Code ou lógica WHMCS.
   ========================================================= */
@media (max-width:767.98px){
  body.template-clientareainvoices.connect-theme .dataTables_wrapper{
    padding-bottom:10px!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter{
    position:relative!important;
    margin-bottom:8px!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter input{
    min-height:50px!important;
    padding:0 16px!important;
    border:1px solid #d6e2ee!important;
    border-radius:15px!important;
    background:#fff!important;
    color:#244765!important;
    box-shadow:0 8px 22px rgba(8,37,74,.045)!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter input:focus{
    border-color:#8fc2ff!important;
    box-shadow:0 0 0 3px rgba(11,116,255,.09),0 10px 24px rgba(8,37,74,.05)!important;
    outline:0!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_info{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    max-width:100%!important;
    margin:0 auto 12px!important;
    padding:7px 12px!important;
    border:1px solid #e1e9f2!important;
    border-radius:999px!important;
    background:#f8fbfe!important;
    color:#71859a!important;
    font-size:.74rem!important;
    line-height:1.2!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody{
    gap:15px!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
    isolation:isolate!important;
    transition:box-shadow .16s ease,border-color .16s ease,transform .12s ease!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr::after{
    z-index:1!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:active{
    border-color:#bcd6f0!important;
    box-shadow:0 8px 22px rgba(8,37,74,.055)!important;
    transform:translateY(1px)!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(1),
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4){
    position:relative!important;
    z-index:2!important;
  }
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(4){
    letter-spacing:-.01em!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(2),
  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(3){
    color:#355773!important;
  }

  body.template-clientareainvoices.connect-theme #tableInvoicesList tbody td:nth-child(5) .status{
    min-height:31px!important;
    padding:7px 14px!important;
    border-width:1px!important;
    letter-spacing:.01em!important;
  }

  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length,
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_paginate{
    margin-top:10px!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length label{
    color:#71859a!important;
    font-size:.76rem!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_length select{
    min-height:40px!important;
    border:1px solid #d6e2ee!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#294b69!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .pagination .page-link{
    min-width:40px!important;
    min-height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-color:#d9e4ee!important;
    color:#45627f!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .page-item.active .page-link{
    border-color:#0b74ff!important;
    background:#0b74ff!important;
    color:#fff!important;
    box-shadow:0 6px 14px rgba(11,116,255,.18)!important;
  }

  @media (hover:hover) and (pointer:fine){
    body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:hover{
      border-color:#c6dbef!important;
      box-shadow:0 14px 34px rgba(8,37,74,.085)!important;
      transform:translateY(-1px)!important;
    }
  }

  @media (prefers-reduced-motion:reduce){
    body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr{
      transition:none!important;
    }
    body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:hover,
    body.template-clientareainvoices.connect-theme #tableInvoicesList tbody tr:active{
      transform:none!important;
    }
  }
}

@media (max-width:430px){
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_filter input{
    min-height:48px!important;
    border-radius:13px!important;
  }
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .dataTables_info{
    font-size:.71rem!important;
  }
}

@media (max-width:340px){
  body.template-clientareainvoices.connect-theme .dataTables_wrapper .pagination .page-link{
    min-width:36px!important;
    min-height:38px!important;
    padding:.35rem .5rem!important;
  }
}


/* =========================================================
   CONNECT LOOP 008 — HOMEPAGE PORTAL / RESPONSIVIDADE
   Escopo exclusivo da homepage pública; não altera clientarea.
   ========================================================= */
body.connect-theme.template-homepage .connect-growth-section{
  overflow-x:clip;
}
body.connect-theme.template-homepage .connect-growth-group,
body.connect-theme.template-homepage .connect-plan-grid,
body.connect-theme.template-homepage .connect-plan-card{
  min-width:0;
}
body.connect-theme.template-homepage .connect-plan-card h3,
body.connect-theme.template-homepage .connect-plan-card p,
body.connect-theme.template-homepage .connect-plan-features li{
  overflow-wrap:anywhere;
  word-break:normal;
}
body.connect-theme.template-homepage .connect-plan-cta{
  min-height:48px;
  touch-action:manipulation;
}
body.connect-theme.template-homepage .connect-billing-toggle button{
  min-height:44px;
  touch-action:manipulation;
}
@media(max-width:991.98px){
  body.connect-theme.template-homepage .connect-plan-grid,
  body.connect-theme.template-homepage .connect-plan-grid.is-double{
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
}
@media(max-width:767.98px){
  body.connect-theme.template-homepage .connect-growth-section{
    padding-left:0;
    padding-right:0;
  }
  body.connect-theme.template-homepage .connect-growth-toolbar{
    width:100%;
    gap:12px;
  }
  body.connect-theme.template-homepage .connect-plan-grid,
  body.connect-theme.template-homepage .connect-plan-grid.is-single,
  body.connect-theme.template-homepage .connect-plan-grid.is-double{
    grid-template-columns:minmax(0,1fr);
    width:100%;
    max-width:540px;
  }
  body.connect-theme.template-homepage .connect-plan-card{
    width:100%;
  }
  body.connect-theme.template-homepage .connect-plan-cta{
    min-height:50px;
  }
}
@media(max-width:430px){
  body.connect-theme.template-homepage .connect-growth-toolbar{
    grid-template-columns:minmax(0,1fr);
  }
  body.connect-theme.template-homepage .connect-billing-toggle{
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body.connect-theme.template-homepage .connect-billing-toggle button{
    width:100%;
    min-width:0;
    white-space:normal;
  }
}
@media(prefers-reduced-motion:reduce){
  body.connect-theme.template-homepage .connect-plan-card,
  body.connect-theme.template-homepage .connect-plan-cta,
  body.connect-theme.template-homepage .connect-billing-toggle button{
    transition:none!important;
    animation:none!important;
  }
}


/* CONNECT LOOP 010 — HARDENING FINAL / CARD COMPACTNESS
   Remove somente os vazios artificiais dos cards públicos da homepage.
   Logo, painel do cliente e lógica comercial permanecem fora do escopo. */
body.connect-theme.template-homepage .connect-plan-card{
  min-height:0;
}
body.connect-theme.template-homepage .connect-plan-features{
  margin-top:0;
  margin-bottom:14px;
}
body.connect-theme.template-homepage .connect-plan-features li:last-child{
  margin-bottom:0;
}
body.connect-theme.template-homepage .connect-plan-cta{
  margin-top:0;
}
@media(max-width:767.98px){
  body.connect-theme.template-homepage .connect-plan-card{
    min-height:0;
  }
  body.connect-theme.template-homepage .connect-plan-features{
    margin-top:0;
    margin-bottom:12px;
  }
  body.connect-theme.template-homepage .connect-plan-cta{
    margin-top:0;
  }
}
