.client-experience { --ux-line: var(--bs-border-color, #e5e7eb); --ux-muted: var(--bs-secondary-color, #606873); }
.client-experience .dashboard-sidebar { width: 248px; padding: 24px 18px; }
.client-experience .dashboard-shell { grid-template-columns: 248px minmax(0, 1fr); }
.client-experience .dashboard-topbar { min-height: 84px; padding: 20px 32px; }
.client-experience .dashboard-content { padding: 24px 32px 40px; gap:16px; }
.client-experience .dashboard-shell.sidebar-collapsed { grid-template-columns:92px minmax(0,1fr); }
.client-experience .dashboard-shell.sidebar-collapsed .dashboard-sidebar { width:92px; }
.client-experience .dashboard-shell.sidebar-collapsed .sidebar-foot > a { font-size:0; }
.client-experience .dashboard-shell.sidebar-collapsed .sidebar-foot > a::after { content:'Preferências'; font-size:9px; }
.client-experience .screen-title { font-size: 1.4rem; letter-spacing: -.025em; }
.client-experience .client-nav { gap: 4px; margin-top: 30px; }
.client-experience .client-nav a { padding: 12px; border-radius: 6px; }
.client-experience .client-nav a.active { box-shadow: inset 3px 0 #67e43a; }
.client-experience .surface-panel { padding: 24px; border-radius: 10px; box-shadow: none; }
.client-experience .security-inline-warning { margin-bottom: 22px; padding: 10px 14px; font-size: .82rem; }
.client-experience .workspace-index,
.client-experience .workspace-index-section { display:grid; align-content:start; gap:24px; min-width:0; }
.client-experience .surface-panel.workspace-index-section { background:transparent; border:0; padding:0; border-radius:0; box-shadow:none; }
.client-experience .workspace-index > p,
.client-experience .workspace-index .workspace-heading,
.client-experience .workspace-index .panel-heading,
.client-experience .workspace-index .site-filter,
.client-experience .workspace-index .workspace-tools { margin:0; }
.client-experience .workspace-index .panel-stack { gap:24px; min-width:0; }
.client-experience .workspace-index .workspace-tools { gap:0 24px; }
.client-experience .workspace-index .workspace-tool { padding:12px 0; }
.client-experience .workspace-index .panel-heading p { font-size:.875rem; }
.client-experience .workspace-index .kpi-grid { margin:0; gap:16px; }
.client-experience .workspace-index .kpi-card { padding:16px; }
.client-experience .dashboard-content:has(> .workspace-index) { align-content:start; gap:24px; }
.client-experience .dashboard-content:has(> .workspace-index) .security-inline-warning { margin-bottom:0; }
.workspace-table-scroll { min-width:0; max-width:100%; overflow-x:auto; }
.workspace-table-scroll .datagrid { min-width:680px; }
@media (max-width:767px) {
 .client-experience .workspace-index .panel-heading,
 .client-experience .workspace-index .workspace-heading { flex-direction:column; align-items:stretch; }
 .client-experience .workspace-index .page-actions { flex-wrap:wrap; }
 .client-experience .workspace-index .hosting-row { flex-wrap:wrap; }
}
.workspace-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin: 0 0 8px; }
.workspace-heading p, .site-meta, .site-runtime small, .hosting-row p { color: var(--ux-muted); margin:0; }
.workspace-breadcrumb { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; font-size:.86rem; }
.workspace-breadcrumb > * + *::before { content:'/'; margin-right:10px; color:var(--ux-muted); }
.workspace-tabs { display:flex; gap:26px; overflow-x:auto; border-bottom:1px solid var(--ux-line); margin-bottom:24px; }
.workspace-tabs a { flex:none; padding:12px 0; color:var(--ux-muted); text-decoration:none; border-bottom:2px solid transparent; }
.workspace-tabs a[aria-current="page"] { color:var(--bs-body-color); border-color:#67e43a; font-weight:600; }
.site-filter { display:flex; gap:12px; align-items:end; flex-wrap:wrap; margin:20px 0; }
.site-filter > div:first-child { flex:1; min-width:220px; max-width:520px; }
.site-filter label { display:block; font-size:.8rem; margin-bottom:6px; color:var(--ux-muted); }
.site-list { border:1px solid var(--ux-line); border-radius:8px; background:var(--bs-body-bg); }
.site-row { display:grid; grid-template-columns:minmax(240px, 1fr) minmax(125px,.45fr) minmax(100px,.35fr) auto; align-items:center; gap:20px; padding:22px; }
.site-row + .site-row, .hosting-row + .hosting-row { border-top:1px solid var(--ux-line); }
.site-identity { display:flex; gap:14px; align-items:center; min-width:0; }
.site-identity > div { min-width:0; }
.site-icon { font-size:22px; color:var(--ux-muted); }
.site-name { font-weight:600; font-size:1rem; color:var(--bs-body-color); overflow-wrap:anywhere; text-decoration:none; }
.site-name:hover { text-decoration:underline; }
.site-meta { display:flex; flex-wrap:wrap; gap:10px; font-size:.78rem; margin-top:5px; }
.site-meta a { color:inherit; }
.site-runtime, .site-state { display:grid; gap:5px; font-size:.84rem; }
.site-runtime small, .site-state small { font-size:.75rem; color:var(--ux-muted); }
.site-state { min-width:0; overflow-wrap:anywhere; }
.site-diagnostic { grid-column:1 / -1; min-width:0; border-top:1px solid var(--ux-line); padding-top:8px; font-size:.84rem; overflow-wrap:anywhere; }
.site-diagnostic summary { cursor:pointer; padding:8px 0; }
.site-diagnostic summary > span:first-child { text-decoration:underline; text-underline-offset:3px; font-weight:600; }
.site-diagnostic__preview { color:var(--ux-muted); }
.site-diagnostic__body { display:grid; gap:12px; padding-top:8px; }
.site-diagnostic__body p { margin:0; color:var(--ux-muted); font-size:.8rem; }
.site-diagnostic__body .btn { white-space:normal; }
.site-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; max-width:340px; }
.site-tool { font-size:.82rem; color:var(--ux-muted); white-space:nowrap; }
.site-tool i { margin-right:5px; }
.ux-status { display:inline-flex; align-items:center; gap:7px; font-size:.8rem; font-weight:500; }
.ux-status::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; }
.ux-status--success { color:#26713b; }.ux-status--danger { color:#b52a31; }.ux-status--warning { color:#946014; }.ux-status--info { color:#2564a4; }.ux-status--muted { color:var(--ux-muted); }
.site-pagination { display:flex; justify-content:space-between; align-items:center; margin:18px 0; font-size:.82rem; color:var(--ux-muted); }.site-pagination > div { display:flex; gap:8px; }
.workspace-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.workspace-facts dt { color:var(--ux-muted); font-size:.8rem; font-weight:400; }.workspace-facts dd { margin:6px 0; overflow-wrap:anywhere; }
.hosting-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; }.hosting-row p { font-size:.83rem; margin-top:5px; }
.workspace-tools { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 28px; margin:16px 0 26px; }
.workspace-tool { display:flex; gap:14px; align-items:center; padding:20px 0; border-bottom:1px solid var(--ux-line); text-decoration:none; color:var(--bs-body-color); }
.workspace-tool i { font-size:24px; color:var(--ux-muted); }.workspace-tool strong { font-size:.92rem; display:block; }.workspace-tool small { color:var(--ux-muted); display:block; margin-top:4px; }.workspace-tool:hover strong { text-decoration:underline; }
.client-experience #installation-summary .kpi-grid { gap:12px; }.client-experience #installation-summary .kpi-card { padding:14px; background:transparent; border-radius:6px; }.client-experience #installation-summary .kpi-card__value { font-size:1.15rem; }.client-experience #installation-summary .kpi-card__hint { font-size:.76rem; }
.client-experience #installation-summary > .detail-grid { display:none; }.client-experience #installation-summary .panel-heading > div:first-child { display:none; }.client-experience #installation-summary .panel-heading { justify-content:flex-end; }
.wizard-progress { display:flex; gap:20px; padding:0; margin:0 0 24px; list-style:none; counter-reset:step; }.wizard-progress li { counter-increment:step; color:var(--ux-muted); padding-bottom:10px; border-bottom:2px solid var(--ux-line); }.wizard-progress li::before { content:counter(step) '. '; }.wizard-progress li[aria-current="step"] { color:var(--bs-body-color); border-color:#67e43a; font-weight:600; }
.wizard-controls { display:flex; justify-content:space-between; gap:16px; margin-top:24px; }.wizard-step-title { font-size:1.1rem; margin-bottom:18px; }
.skip-link { position:fixed; top:-100px; left:16px; z-index:10000; padding:12px; background:var(--bs-body-bg); }.skip-link:focus { top:12px; }
.client-experience :focus-visible { outline:2px solid var(--ux-focus, #26713b); outline-offset:3px; }
.client-experience .onboarding-sidebar .stack-list { gap:0; }
.client-experience .onboarding-sidebar .stack-list__item { border:0; border-bottom:1px solid var(--ux-line); border-radius:0; padding:12px 0; }
.client-experience .onboarding-sidebar .stack-list__item p { font-size:.78rem; }
.mobile-menu-toggle { display:none; }
.rollout-target-review { border:1px solid var(--border); border-radius:12px; max-height:320px; overflow:auto; }
.rollout-target-choice { display:flex; align-items:flex-start; gap:12px; padding:16px; cursor:pointer; }
.rollout-target-choice + .rollout-target-choice { border-top:1px solid var(--border); }
.rollout-target-choice input { flex:none; margin-top:4px; }
.rollout-target-choice strong,.rollout-target-choice small { display:block; overflow-wrap:anywhere; }
.rollout-target-choice small { margin-top:4px; color:var(--text-soft); }
#rolloutsIndexApp .filter-toolbar { grid-template-columns:repeat(2,minmax(0,1fr)); }
#rolloutsIndexApp .filter-toolbar > div { min-width:0; }
.rollout-table-scroll { min-width:0; max-width:100%; overflow-x:auto; }
.rollout-table-scroll .datagrid { min-width:640px; }
.rollout-table-scroll .rollout-target-table { min-width:1200px; }
@media (max-width:767px) {
    #rolloutsIndexApp .filter-toolbar { grid-template-columns:minmax(0,1fr); }
    #rolloutsIndexApp .panel-heading { flex-direction:column; align-items:stretch; }
    #rolloutsIndexApp .page-actions { flex-wrap:wrap; }
}
.infrastructure-table-wrap { min-width:0; }
.infrastructure-table .infrastructure-role-col { width:180px; }
.infrastructure-table .infrastructure-state-col { width:132px; }
.infrastructure-table .infrastructure-actions-col { width:256px; }
.infrastructure-table tbody td { vertical-align:middle; }
.infrastructure-host { display:block; margin-top:4px; color:var(--text-soft); font-size:12px; overflow-wrap:anywhere; }
.infrastructure-role { display:inline-flex; align-items:center; gap:8px; font-size:14px; }
.infrastructure-role i { color:var(--text-soft); font-size:18px; flex:none; }
.infrastructure-actions { display:flex; justify-content:flex-end; align-items:center; gap:20px; }
.infrastructure-actions > a { flex:none; white-space:nowrap; }
.infrastructure-apps { font-size:13px; color:var(--text-soft); text-underline-offset:3px; }
.infrastructure-table .infrastructure-empty { padding:32px 24px; text-align:center; color:var(--text-soft); }
@media (max-width:1100px) {
 .infrastructure-table .infrastructure-role-col { width:150px; }
 .infrastructure-table .infrastructure-state-col { width:110px; }
 .infrastructure-table .infrastructure-actions-col { width:210px; }
 .infrastructure-table thead th,.infrastructure-table tbody td { padding:16px 12px; }
 .infrastructure-actions { gap:12px; }
}
@media (max-width:900px) {
 .infrastructure-table,.infrastructure-table tbody { display:block; }
 .infrastructure-table colgroup { display:none; }
 .infrastructure-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
 .infrastructure-table tbody tr { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px 24px; padding:20px; }
 .infrastructure-table tbody tr + tr { border-top:1px solid var(--border); }
 .infrastructure-table tbody td { display:block; padding:0; border:0; }
 .infrastructure-table .infrastructure-identity,.infrastructure-table .infrastructure-action-cell,.infrastructure-table .infrastructure-empty { grid-column:1 / -1; }
 .infrastructure-table td[data-label]::before { content:attr(data-label); display:block; font-size:12px; color:var(--text-soft); margin-bottom:6px; }
 .infrastructure-table .infrastructure-action-cell { border-top:1px solid var(--border); padding-top:16px; }
 .infrastructure-actions { justify-content:flex-end; gap:20px; }
}
@media(max-width:767px) {
 .client-experience .dashboard-shell.sidebar-collapsed { grid-template-columns:minmax(0,1fr); }
 .client-experience .dashboard-shell.sidebar-collapsed .dashboard-sidebar { width:auto; }
 .client-experience .dashboard-sidebar .sidebar-toggle { display:none; }
 .client-experience .mobile-menu-toggle { display:flex; }
 .client-experience .dashboard-sidebar .client-nav, .client-experience .dashboard-sidebar .sidebar-foot { display:none; }
 .client-experience .dashboard-sidebar.mobile-menu-open .client-nav { display:flex; }
 .client-experience .dashboard-sidebar.mobile-menu-open .sidebar-foot { display:block; }
 .client-experience .dashboard-shell.sidebar-collapsed .brand-mark { opacity:1; width:auto; pointer-events:auto; }
 .client-experience .dashboard-shell.sidebar-collapsed .dashboard-nav a span { display:inline; }
 .client-experience .dashboard-shell.sidebar-collapsed .dashboard-nav a { justify-content:start; padding:8px; }
 .client-experience .dashboard-topbar .topbar-actions { flex-direction:row; gap:8px; }
 .client-experience .dashboard-topbar .user-chip { display:none; }
}
@media(max-width:1200px) { .site-row { grid-template-columns: minmax(200px,1fr) 140px; }.site-runtime { display:none; }.site-actions { grid-column:1 / -1; }.workspace-tools { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) { .client-experience .dashboard-shell { grid-template-columns:minmax(0,1fr); }.client-experience .dashboard-sidebar { width:auto; padding:14px; }.client-experience .client-nav { margin-top:12px; display:flex; flex-direction:row; flex-wrap:wrap; }.client-experience .client-nav a { padding:8px; font-size:.82rem; }.client-experience .sidebar-foot { margin-top:12px; }.client-experience .dashboard-topbar, .client-experience .dashboard-content { padding:18px 16px; }.workspace-search,.user-chip__info { display:none; }.site-row { padding:16px; grid-template-columns:1fr; gap:12px; }.site-actions { flex-wrap:wrap; }.workspace-tools,.workspace-facts { grid-template-columns:1fr; }.workspace-heading,.hosting-row { align-items:flex-start; flex-direction:column; }.workspace-tabs { gap:20px; }.wizard-progress { gap:12px; font-size:.78rem; } }
@media(prefers-reduced-motion:reduce) { .client-experience * { scroll-behavior:auto!important; transition:none!important; } }
@media(max-width:767px) {
 .client-experience .paas-grid { grid-template-columns:minmax(0,1fr); }
 .client-experience #jobDetailApp .panel-heading,
 .client-experience #jobDetailApp .stack-list__item { flex-direction:column; align-items:stretch; gap:12px; }
 .client-experience #jobDetailApp .status-pill { align-self:flex-start; }
 .client-experience #jobDetailApp .text-end { text-align:left!important; }
 .client-experience #jobDetailApp .page-actions { flex-direction:row; flex-wrap:wrap; justify-content:flex-start; }
 .client-experience #service-summary > .panel-heading { flex-direction:column; align-items:stretch; }
 .client-experience #service-summary .page-actions { flex-direction:row; flex-wrap:wrap; justify-content:flex-start; }
 .client-experience #hosting-checklist .stack-list__item { flex-direction:column; align-items:stretch; gap:12px; }
 .client-experience #hosting-checklist .status-pill { align-self:flex-start; }
 .client-experience #installationPaasApp .panel-heading { flex-direction:column; align-items:stretch; }
 .client-experience #installationPaasApp .page-actions { flex-wrap:wrap; }
}

/* Readable semantic states and keyboard focus on both supported surfaces. */
[data-bs-theme="dark"] .client-experience { --ux-focus: #86efac; }
[data-bs-theme="dark"] .ux-status--success { color: #86efac; }
[data-bs-theme="dark"] .ux-status--danger { color: #fca5a5; }
[data-bs-theme="dark"] .ux-status--warning { color: #fcd34d; }
[data-bs-theme="dark"] .ux-status--info { color: #93c5fd; }
[data-bs-theme="dark"] .status-pill:is([data-status="saudavel"],[data-status="sucesso"],[data-status="rodando"],[data-status="ativa"],[data-status="ativo"],[data-status="publicada"]) { color: #86efac; }
[data-bs-theme="dark"] .status-pill:is([data-status="atencao"],[data-status="warning"],[data-status="pendente"],[data-status="agendada"],[data-status="processando"]) { color: #fcd34d; }
[data-bs-theme="dark"] .status-pill:is([data-status="critico"],[data-status="falha"],[data-status="offline"],[data-status="erro"],[data-status="bloqueada"],[data-status="cancelada"]) { color: #fca5a5; }
.workspace-breadcrumb { flex-wrap: wrap; }
.workspace-breadcrumb > *, .topbar-title-group { min-width: 0; overflow-wrap: anywhere; }
.workspace-tabs { padding: 4px; }
.client-experience .workspace-tabs a { min-height: 44px; }
@media(max-width:767px) {
    .site-pagination { flex-wrap: wrap; gap: 12px; }
    .site-filter > div:first-child { min-width: 0; width: 100%; }
    .client-experience .dashboard-topbar { flex-wrap: wrap; gap: 12px; }
}
.client-experience .btn-outline-secondary { --bs-btn-color: var(--text-soft); --bs-btn-hover-color: var(--text); --bs-btn-hover-bg: var(--surface-muted); --bs-btn-active-color: var(--text); --bs-btn-active-bg: var(--surface-muted); }
@media(max-width:767px) {
    .client-experience .btn-sm, .client-experience .btn-icon { min-height:44px; min-width:44px; }
    #installation-domains .stack-list__item { flex-direction:column; align-items:flex-start; }
    #installation-domains .installation-inline-actions { display:flex; flex-wrap:wrap; min-width:0; }
}
.client-experience .text-secondary, .client-experience .text-muted, .client-experience .form-text { color: var(--text-soft) !important; }