/* MiContador360: shared product geometry, independent of the brand palette.
   Loaded last. Explicit components avoid changing charts, hidden navigation,
   document previews, icon-only controls and public marketing pages. */
:root {--global-sidebar:208px;--global-topbar:60px;--product-radius:8px;--product-control:38px;--product-page:1280px;--product-form:780px}
html:not([data-density]):has(#appScreen:not([hidden])) {zoom:1}
#appScreen {font-family:Inter,system-ui,sans-serif!important;font-size:13px;line-height:1.5}
#appScreen .sidebar {box-shadow:none!important;backdrop-filter:none!important}
@media(min-width:1101px){#appScreen .shell:not(.sidebar-collapsed) .sidebar {width:208px!important;box-sizing:border-box!important}#appScreen .shell:not(.sidebar-collapsed) .shell-main {margin-left:208px!important}#appScreen .shell:not(.sidebar-collapsed) .liquid-topnav {left:208px!important}}
#appScreen .sidebar-nav-group {margin-bottom:12px!important;border:0!important}
#appScreen .sidebar .nav-item {position:relative;min-height:36px!important;padding:8px 10px!important;border-radius:5px!important;font-size:12px!important;font-weight:500!important;line-height:1.4!important;box-shadow:none!important;transform:none!important}
#appScreen .sidebar .nav-item .nav-label {white-space:normal;overflow-wrap:break-word}
#appScreen .sidebar .nav-item.active::before {content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:2px;background:currentColor}
#appScreen .sidebar .nav-icon svg {width:17px!important;height:17px!important;stroke-width:1.6}
#appScreen .sidebar [data-finance-section],#appScreen .sidebar .payroll-submenu-item {padding-left:27px!important}
#appScreen .liquid-topnav {box-shadow:none!important;backdrop-filter:none!important}
#appScreen .global-top-search {border-radius:7px!important;box-shadow:none!important}
#appScreen .shell-main :is(.dash,.consult-view) {max-width:var(--product-page)!important;width:100%!important;box-sizing:border-box;margin-left:auto!important;margin-right:auto!important;padding-left:24px!important;padding-right:24px!important}
#appScreen .shell-main .consult-layout {max-width:100%!important}
#appScreen .shell-main :is(.consult-card,.account-panel,.company-card,.action-card,.cc-panel,.commercial-section,.accounting-ops,.accounting-catalog,.finance-catalog,.accounting-settlement-card,.payroll-panel,.bank-reconciliation-results) {border-radius:var(--product-radius)!important;box-shadow:none!important;background-image:none!important;transform:none!important}
#appScreen .shell-main :is(.accounting-center-shell,.bank-reconciliation-shell,.monthly-close-shell,.commercial-center,.work-inbox-shell,.client-requests-shell)>header,
#appScreen .shell-main :is(.billing-center-hero,.payroll-hero,.cc-hero,.welcome-banner) {border-radius:var(--product-radius)!important;box-shadow:none!important;background-image:none!important;padding:16px 20px!important}
#appScreen .shell-main :is(.card-heading,.accounting-ops>header,.finance-catalog>header) {padding:16px 20px!important;gap:12px!important}
#appScreen .shell-main .card-heading>div {min-width:0}
#appScreen .shell-main .card-heading p {white-space:normal!important;overflow-wrap:break-word}
#appScreen .shell-main :is(h1,h2,h3,h4) {font-family:Inter,system-ui,sans-serif!important;letter-spacing:-.015em!important;line-height:1.35!important}
#appScreen .shell-main h2 {font-size:21px!important;font-weight:650!important}
#appScreen .shell-main h3 {font-size:17px!important;font-weight:600!important}
#appScreen .shell-main h4 {font-size:14px!important;font-weight:600!important}
#appScreen .shell-main :is(header>div>small,header>small,.section-label) {letter-spacing:.035em!important;font-weight:600!important;font-size:10px!important}
#appScreen .shell-main label {font-size:12px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}
#appScreen .shell-main :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select,textarea) {border-radius:6px!important;font-family:inherit!important;font-size:13px!important;font-weight:400!important;box-sizing:border-box;line-height:1.4!important}
#appScreen .shell-main :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select) {min-height:var(--product-control)!important;padding:8px 11px!important}
#appScreen .shell-main :is(button.primary,button.secondary,button[type=submit],a.primary,a.secondary) {min-height:var(--product-control)!important;border-radius:6px!important;padding:8px 14px!important;font:600 12px/1.4 Inter,system-ui,sans-serif!important;box-shadow:none!important;transform:none!important;height:auto!important}
#appScreen .shell-main :is(button,a):focus-visible {outline:2px solid var(--ui-primary)!important;outline-offset:3px}
#appScreen .shell-main :is(.accounting-summary,.billing-kpis,.payroll-summary,.work-inbox-workload)>article {box-shadow:none!important;background-image:none!important;border-radius:var(--product-radius)!important;padding:16px!important}
#appScreen .shell-main table {font-family:Inter,system-ui,sans-serif!important;font-size:12px!important;font-variant-numeric:tabular-nums;border-collapse:collapse}
#appScreen .shell-main table th {font-size:11px!important;font-weight:600!important;letter-spacing:.01em!important;text-transform:none!important;padding:11px 14px!important;white-space:nowrap}
#appScreen .shell-main table td {padding:13px 14px!important;line-height:1.5!important;vertical-align:middle}
#appScreen .shell-main table :is(th,td) {box-shadow:none!important;border-left:0!important;border-right:0!important}
#appScreen .shell-main table td button {min-height:32px!important;border-radius:6px!important;font-size:12px!important;box-shadow:none!important}
#appScreen .shell-main :is(.badge,.status-badge,.status-pill) {font-size:11px!important;font-weight:500!important;padding:3px 8px!important;box-shadow:none!important}
#appScreen .shell-main :is(.pagination,[class$="-pagination"]) {display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 16px!important}
/* Simple credential forms use a reading width; operational tables stay wide. */
#appScreen .consult-card:has(#extraFields:empty),#appScreen .consult-card:has(#extraFields>.fiscal-filters--retentions) {max-width:var(--product-form)!important;margin-inline:auto!important;width:100%!important}
:is(.payroll-modal,.accounting-modal,.bank-adjustment-dialog,.employee-shell) {font-family:Inter,system-ui,sans-serif!important;border-radius:10px!important}
:is(.payroll-modal,.accounting-modal)>:is(header,footer) {padding:16px 20px!important;background-image:none!important}
:is(.payroll-modal,.accounting-modal) :is(input,select,textarea,button) {font-family:inherit!important;border-radius:6px}
@media(max-width:720px){#appScreen .shell-main :is(.dash,.consult-view){padding-left:12px!important;padding-right:12px!important}#appScreen .shell-main :is(.card-heading,.accounting-ops>header){padding:14px!important}#appScreen .shell-main table :is(td,th){padding:10px 12px!important}}
@media(max-width:720px){#appScreen .shell-main :is(div,section):has(>table) {max-width:100%;overflow-x:auto}#appScreen .shell-main table:has(th:nth-child(4)) {min-width:620px!important}#appScreen .shell-main .card-heading {flex-wrap:wrap!important}}
@media(prefers-reduced-motion:reduce){#appScreen *,#appScreen *::before,#appScreen *::after {scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Page composition: one page heading, then the work surface. */
#appScreen .shell-main .consult-card:has(:is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.billing-center,.client-requests-shell)) {background:transparent!important;border:0!important;padding:0!important;overflow:visible!important}
#appScreen .shell-main .consult-card:has(:is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.billing-center,.client-requests-shell))>.card-heading {display:none!important}
#appScreen .shell-main :is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.client-requests-shell)>header,
#appScreen .shell-main .billing-center-hero {background:transparent!important;border:0!important;border-radius:0!important;padding:4px 0 16px!important;box-shadow:none!important}
#appScreen .shell-main :is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.client-requests-shell)>header h3 {font-size:20px!important}
#appScreen .shell-main :is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.client-requests-shell)>header small {display:none!important}
#appScreen .shell-main .consult-view:has(:is(.work-inbox-shell,.bank-reconciliation-shell)) {max-width:1600px!important}
#appScreen .shell-main .consult-view:has(.accounting-center-shell[data-finance-view="catalog"]),
#appScreen .shell-main .consult-view:has(.accounting-center-shell[data-finance-view="preferences"]),
#appScreen .shell-main .consult-view:has(.accounting-center-shell[data-finance-view="settings"]) {max-width:1080px!important}
#appScreen .shell-main :is(.work-inbox-empty,.client-requests-empty) {min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:36px 24px!important;background-image:none!important;box-shadow:none!important}
#appScreen .shell-main :is(.finance-catalog,.work-inbox-group,.client-requests-group)>footer {border-top:1px solid var(--ui-border);padding:12px 16px!important;box-shadow:none!important}
#appScreen .shell-main .finance-catalog>label {max-width:480px;padding-top:12px}
#appScreen .shell-main .finance-catalog>p {margin:8px 18px 14px;padding:0;max-width:760px}
#appScreen .shell-main :is(.work-inbox-toolbar,.client-requests-toolbar) {border-radius:8px!important;box-shadow:none!important;background-image:none!important;padding:12px 16px!important;gap:12px!important}
@media(max-width:720px){#appScreen .shell-main :is(.accounting-center-shell,.work-inbox-shell,.bank-reconciliation-shell,.client-requests-shell)>header {padding:4px 0 12px!important;flex-wrap:wrap}#appScreen .shell-main :is(.work-inbox-empty,.client-requests-empty){min-height:200px}}
/* XML manager: documents first, acquisition tools on demand. */
#appScreen .shell-main form[data-xml-manager] .xml-manager-actions {display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 14px}
#appScreen .shell-main form[data-xml-manager] .xml-manager-search {max-width:320px;margin-right:auto}
#appScreen .shell-main .xml-manager-panel {border:1px solid var(--ui-border);border-radius:8px;margin:0 0 10px;background:var(--ui-surface)}
#appScreen .shell-main .xml-manager-panel:not([open]) {display:none}
#appScreen .shell-main .xml-manager-panel>summary {padding:12px 16px;font-weight:600;cursor:pointer}
#appScreen .shell-main .xml-manager-panel>button[type=submit] {width:auto!important;margin:12px 16px!important}
#appScreen .shell-main form[data-xml-manager] .xml-repository-filters {padding:12px 16px!important;margin:12px 0!important;border-radius:8px!important;background:var(--ui-surface)!important}
#appScreen .shell-main form[data-xml-manager] .xml-repository-filters>header {display:none}
#appScreen .shell-main form[data-xml-manager] .xml-repository-filter-row {display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:10px!important}
#appScreen .shell-main form[data-xml-manager] .xml-repository-filter-row>label {flex:1 1 140px;max-width:220px}
#appScreen .shell-main form[data-xml-manager] .xml-repository-filter-row>button {width:auto!important;min-height:36px!important;padding:8px 12px!important}
#appScreen .shell-main form[data-xml-manager] .xml-summary {display:flex!important;flex-wrap:wrap;gap:0!important;border:1px solid var(--ui-border);border-radius:8px}
#appScreen .shell-main form[data-xml-manager] .xml-summary article {flex:1 1 180px;padding:10px 16px!important;border:0!important;border-radius:0!important;box-shadow:none!important}
#appScreen .shell-main form[data-xml-manager] .xml-summary article::before {display:none!important}
#appScreen .shell-main form[data-xml-manager] .xml-summary b {font-size:17px!important;font-weight:600!important}
#appScreen .shell-main form[data-xml-manager] :is(.xml-search-panel,.xml-import-panel) {box-shadow:none!important;border:0!important;margin:0!important;padding:14px!important}
#appScreen .shell-main form[data-xml-manager] .xml-search-panel :is(button,label,legend) {font-size:12px!important}
#appScreen .shell-main .consult-card:has(form[data-xml-manager]) {background:transparent!important;border:0!important;padding:0!important}
#appScreen .shell-main .consult-card:has(form[data-xml-manager])>.card-heading {padding:0 0 18px!important;border:0!important;background:transparent!important}
#appScreen .shell-main .consult-card:has(form[data-xml-manager]) .privacy {display:none!important}
#appScreen .shell-main form[data-xml-manager]>button[type=submit] {display:none!important}
#appScreen .shell-main .xml-manager-panel>button {width:auto!important;margin:12px 16px!important}
#appScreen .shell-main .policy-table-scroll {overflow:auto;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-surface)}
#appScreen .shell-main .policy-table-scroll table {width:100%;min-width:760px}
#appScreen .shell-main .policy-table-scroll td:nth-child(4) {max-width:380px;overflow-wrap:break-word}
#appScreen .shell-main .policy-table-scroll td:nth-child(6),#appScreen .shell-main .policy-table-scroll td:nth-child(7) {white-space:nowrap;text-align:right}
#appScreen .shell-main .accounting-policy-bulk {padding:10px 12px!important;gap:10px!important;background:transparent!important;border-radius:6px!important}
#appScreen .shell-main .accounting-policy-bulk:has(#accountingPolicyBulkApply:disabled)>label:has(select),#appScreen .shell-main .accounting-policy-bulk:has(#accountingPolicyBulkApply:disabled)>#accountingPolicyBulkApply {display:none!important}
#appScreen .company-start-guide {border:1px solid var(--ui-border);border-radius:8px;margin:0 0 20px;background:var(--ui-surface)}
#appScreen .company-start-guide>summary {padding:14px 18px;cursor:pointer;font-weight:600}
#appScreen .company-start-body {display:grid;grid-template-columns:240px 1fr;border-top:1px solid var(--ui-border)}
#appScreen .company-start-body>nav {padding:12px;border-right:1px solid var(--ui-border);display:grid;gap:4px}
#appScreen .company-start-body>nav button {text-align:left;padding:10px!important;border:0!important;background:transparent!important;border-radius:5px!important;font-size:12px!important}
#appScreen .company-start-body>nav button[aria-pressed=true] {background:var(--ui-primary-soft)!important;color:var(--ui-primary)!important}
#appScreen .company-start-body>section {padding:24px;align-content:center}
#appScreen #dashboardOperationalSummary>header {padding:8px 0 16px!important;background:transparent!important;border:0!important}
#appScreen #dashboardOperationalSummary .dashboard-status-grid {gap:16px!important}
#appScreen #dashboardOperationalSummary article {box-shadow:none!important;background-image:none!important;border-radius:8px!important}
@media(max-width:720px){#appScreen .company-start-body{grid-template-columns:1fr}#appScreen .company-start-body>nav{border-right:0;border-bottom:1px solid var(--ui-border)}}

#appScreen .sidebar-branding-editor {padding:20px;margin-top:20px;border:1px solid var(--ui-border,#dce3ed);border-radius:8px;background:var(--ui-surface,#fff);}
#appScreen .sidebar-branding-editor>img {display:block;width:180px;height:80px;object-fit:contain;margin:16px 0;}
#appScreen .sidebar-branding-editor>div {display:flex;flex-wrap:wrap;gap:12px;align-items:center;}

#appScreen .team-profiles-panel {margin-top:20px;padding:16px;background:var(--ui-surface,#fff);border:1px solid var(--ui-border,#dce3ed);border-radius:8px;}
#appScreen .team-profiles-panel header {display:flex;justify-content:space-between;gap:12px;align-items:center;}
#appScreen .team-profiles-panel p {font-size:13px;}
#appScreen .team-profiles-table {overflow:auto;}
#appScreen .team-profiles-table table {width:100%;border-collapse:collapse;}
#appScreen .team-profiles-table :is(td,th) {padding:10px 12px;text-align:left;border-bottom:1px solid var(--ui-border,#dce3ed);}
#appScreen .team-profiles-panel small {display:block;color:var(--ui-muted,#6b7f99);}
#appScreen .team-permissions {display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;max-height:320px;overflow:auto;margin:16px 0;}
#appScreen .team-permissions label {display:flex;gap:8px;align-items:flex-start;font-size:13px;}
#appScreen .team-permissions input {width:16px!important;height:16px!important;min-height:16px!important;}
