:root {
    --navy: #17243f;
    --navy-2: #21304f;
    --blue: #356ae6;
    --blue-dark: #2857c7;
    --accent: #4361ee;
    --accent-subtle: #edf2fe;
    --accent-border: #cad8fa;
    --ink: #0f172a;
    --muted: #526079;
    --line: #d1d9e6;
    --surface: #ffffff;
    --surface-subtle: #f5f7fb;
    --canvas: #eef2f7;
    --green: #1a9e6c;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--ink);
    background: var(--canvas);
    font-synthesis: none;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--canvas); }
body { font-size: 14px; }
a { color: inherit; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
h1, h2, p { margin-top: 0; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 248px; min-width: 248px; position: fixed; inset: 0 auto 0 0; overflow-x: hidden; color: #fff; background: var(--navy); z-index: 20; transition: width .2s ease, min-width .2s ease; }
.workspace { min-width: 0; min-height: 100vh; margin-left: 248px; flex: 1; transition: margin-left .2s ease; }
.topbar { height: 70px; padding: 0 38px; display: flex; align-items: center; justify-content: space-between; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 1px 3px rgba(15,23,42,.04); position: sticky; top: 0; z-index: 15; }
.main-content { padding: 34px 38px 46px; max-width: 1600px; margin: 0 auto; }
.topbar-context { display: flex; align-items: center; gap: 10px; }
.environment-badge { color: #475569; background: var(--surface-subtle); border: 1px solid var(--line); border-radius: 20px; padding: 6px 11px; font-size: 12px; font-weight: 600; }
.environment-badge span { display: inline-block; width: 7px; height: 7px; margin-right: 6px; background: var(--green); border-radius: 50%; }
.topbar-actions, .user-menu { display: flex; align-items: center; }
.topbar-actions { gap: 6px; }
.icon-button, .logout-button { width: 36px; height: 36px; border: 0; color: #69738a; background: transparent; border-radius: 9px; display: grid; place-items: center; cursor: pointer; position: relative; }
.icon-button:hover, .logout-button:hover { background: #f3f5f8; color: var(--accent); }
.icon-button svg, .logout-button svg { width: 19px; height: 19px; }
.notification-dot { position: absolute; width: 7px; height: 7px; border: 2px solid white; border-radius: 50%; background: #f15b6c; top: 7px; right: 7px; }
.user-divider { width: 1px; height: 30px; background: var(--line); margin: 0 12px; }
.user-menu { gap: 10px; }
.user-menu form { margin: 0 0 0 3px; }
.avatar { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 10px; background: var(--accent-subtle); color: var(--accent); font-size: 12px; font-weight: 800; border: 1px solid var(--accent-border); }
.user-copy { display: flex; flex-direction: column; min-width: 124px; }
.user-copy strong { font-size: 12px; line-height: 1.5; color: var(--ink); }
.user-copy span { color: var(--muted); font-size: 11px; }

.brand { height: 70px; padding: 0 23px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
.brand-link { display: flex; align-items: center; gap: 11px; color: #fff; text-decoration: none; }
.brand-name { font-weight: 750; font-size: 20px; letter-spacing: -.4px; }
.brand-version { font-size: 9px; padding: 3px 6px; border-radius: 5px; color: #adb8d0; background: rgba(255,255,255,.08); }
.brand-mark { position: relative; display: inline-block; width: 27px; height: 27px; transform: rotate(45deg); }
.brand-mark > span { position: absolute; width: 11px; height: 11px; border-radius: 2px; background: #6291ff; }
.brand-mark > span:nth-child(1) { left: 0; top: 0; background: #82a7ff; }
.brand-mark > span:nth-child(2) { right: 0; top: 0; }
.brand-mark > span:nth-child(3) { left: 0; bottom: 0; background: #4378ef; }
.brand-mark > span:nth-child(4) { right: 0; bottom: 0; background: #315fd0; }
.nav-content { height: calc(100vh - 70px); display: flex; flex-direction: column; overflow-y: auto; }
.nav-content nav { flex: 1; padding: 19px 13px; }
.nav-section { margin-bottom: 22px; }
.nav-eyebrow { display: block; padding: 0 12px 9px; color: #7f8ba6; text-transform: uppercase; letter-spacing: .11em; font-size: 10px; font-weight: 700; }
.nav-link { display: flex; align-items: center; height: 43px; gap: 12px; padding: 0 12px; margin-bottom: 3px; border-radius: 8px; color: #acb7cf; text-decoration: none; font-size: 14px; font-weight: 500; transition: .15s ease; }
.nav-link svg { width: 18px; height: 18px; }
.nav-link:hover { color: #fff; background: rgba(255,255,255,.06); }
.nav-link.active { color: #fff; background: #315bba; box-shadow: 0 5px 16px rgba(0,0,0,.12); }
.nav-count { margin-left: auto; color: #b3c7f6; background: rgba(255,255,255,.1); border-radius: 10px; font-size: 11px; padding: 2px 7px; }
.nav-link-muted { opacity: .84; }
.dynamic-menu-group { margin: 3px 0; }
.menu-group-toggle { width: 100%; min-height: 43px; padding: 8px 11px; display: grid; grid-template-columns: 18px minmax(0, 1fr) auto 14px; align-items: center; gap: 9px; border: 0; border-radius: 8px; color: #c4ccdc; background: transparent; text-align: left; font-size: 13px; font-weight: 650; cursor: pointer; }
.menu-group-toggle:hover, .menu-group-toggle[aria-expanded="true"] { color: #fff; background: rgba(255,255,255,.055); }
.group-icon { width: 18px; height: 18px; color: #8192b5; }
.menu-group-toggle[aria-expanded="true"] .group-icon { color: #80a4f4; }
.group-count { min-width: 21px; padding: 2px 6px; border-radius: 9px; color: #9cabc7; background: rgba(255,255,255,.07); text-align: center; font-size: 10px; }
.group-chevron { width: 13px; height: 13px; color: #75829d; transition: transform .16s ease; }
.group-chevron.expanded { transform: rotate(90deg); }
.menu-group-items { margin: 3px 0 9px 19px; padding-left: 9px; border-left: 1px solid rgba(255,255,255,.09); }
.dynamic-nav-link { height: 36px; padding: 0 10px; gap: 9px; font-size: 12px; }
.dynamic-nav-link > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.menu-item-dot { width: 5px; min-width: 5px; height: 5px; border-radius: 50%; background: #60708f; }
.dynamic-nav-link.active .menu-item-dot { background: #a9c2ff; box-shadow: 0 0 0 3px rgba(169,194,255,.12); }
.menu-loading { padding: 8px 12px; display: grid; gap: 10px; }
.menu-loading span { height: 36px; display: block; border-radius: 7px; background: linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.1),rgba(255,255,255,.04)); background-size: 200% 100%; animation: menu-pulse 1.3s infinite; }
.menu-loading span:nth-child(2) { width: 86%; }.menu-loading span:nth-child(3) { width: 92%; }.menu-loading span:nth-child(4) { width: 78%; }
@keyframes menu-pulse { to { background-position: -200% 0; } }
.menu-error { margin: 10px 6px; padding: 13px 11px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; border: 1px solid rgba(255,160,160,.14); border-radius: 8px; color: #d3d9e7; background: rgba(156,55,67,.12); font-size: 10px; }
.menu-error svg { width: 18px; color: #ee97a1; }.menu-error button { padding: 0; border: 0; color: #91b2fb; background: transparent; font-size: 10px; cursor: pointer; }
.sidebar-footer { margin: 0 14px 16px; padding: 14px; display: flex; align-items: center; gap: 11px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; background: rgba(255,255,255,.035); }
.support-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: #83a6f4; background: rgba(93,137,237,.14); }
.support-icon svg { width: 16px; height: 16px; }
.sidebar-footer div { display: flex; flex-direction: column; line-height: 1.5; }
.sidebar-footer strong { font-size: 10px; }
.sidebar-footer span { color: #8996b1; font-size: 9px; }
.sidebar-toggle { flex: 0 0 auto; }
.sidebar-toggle:focus-visible { outline: 3px solid rgba(53,106,230,.28); outline-offset: 2px; }
.sidebar-backdrop { position: fixed; inset: 0; background: rgba(11, 14, 20, 0.62); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); z-index: 90; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.sidebar-close-btn { display: none; width: 34px; height: 34px; border: 0; border-radius: 8px; color: #a0aec0; background: rgba(255, 255, 255, 0.08); cursor: pointer; place-items: center; transition: background .16s ease, color .16s ease; }
.sidebar-close-btn:hover { color: #fff; background: rgba(255, 255, 255, 0.18); }
.sidebar-close-btn svg { width: 18px; height: 18px; }

[data-sidebar="collapsed"] .sidebar { width: 68px; min-width: 68px; }
[data-sidebar="collapsed"] .workspace { margin-left: 68px; }
[data-sidebar="collapsed"] .brand { padding: 0; justify-content: center; }
[data-sidebar="collapsed"] .brand-name,
[data-sidebar="collapsed"] .brand-version,
[data-sidebar="collapsed"] .nav-eyebrow,
[data-sidebar="collapsed"] .nav-link span,
[data-sidebar="collapsed"] .sidebar-footer { display: none; }
[data-sidebar="collapsed"] .nav-content nav { padding: 18px 8px; }
[data-sidebar="collapsed"] .nav-link { justify-content: center; padding: 0; }
[data-sidebar="collapsed"] .menu-group-toggle { display: flex; justify-content: center; padding: 0; }
[data-sidebar="collapsed"] .menu-group-toggle > span,
[data-sidebar="collapsed"] .group-chevron { display: none; }
[data-sidebar="collapsed"] .menu-group-items { margin: 2px 0 8px; padding: 0; border: 0; }
[data-sidebar="collapsed"] .dynamic-nav-link { height: 32px; }
[data-sidebar="collapsed"] .dynamic-nav-link .menu-item-dot { display: block; }
[data-sidebar="collapsed"] .menu-error { align-items: center; padding: 10px 4px; }
[data-sidebar="collapsed"] .menu-error span { display: none; }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.page-heading h1 { margin: 4px 0 5px; color: var(--ink); font-size: 28px; line-height: 1.15; letter-spacing: -.65px; }
.page-heading p { margin-bottom: 0; color: var(--muted); font-size: 13px; }
.eyebrow { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.button { height: 40px; border: 1px solid transparent; border-radius: 8px; padding: 0 15px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; font-weight: 650; text-decoration: none; cursor: pointer; transition: .15s ease; }
.button svg { width: 17px; height: 17px; }
.button-primary { color: white; background: var(--accent); box-shadow: 0 4px 12px rgba(67,97,238,.24); }
.button-primary:hover { color: white; background: #3553dc; transform: translateY(-1px); }
.button-secondary { color: #334155; background: #fff; border-color: var(--line); }
.button-secondary:hover { border-color: #9cb2d6; background: #f8fafd; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin-bottom: 19px; }
.metric-card, .panel, .table-panel, .entity-summary { background: #fff; border: 1px solid var(--line); border-radius: 11px; box-shadow: 0 2px 4px rgba(15,23,42,.04), 0 1px 2px rgba(15,23,42,.02); }
.metric-card { padding: 19px 20px 18px; display: flex; flex-direction: column; }
.metric-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 17px; }
.metric-icon { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 9px; }
.metric-icon svg { width: 18px; height: 18px; }
.metric-icon-blue { color: var(--accent); background: var(--accent-subtle); }.metric-icon-purple { color: #7658d7; background: #f1edff; }.metric-icon-green { color: #14966a; background: #e7f7f1; }.metric-icon-orange { color: #de812d; background: #fff1e4; }
.trend { padding: 4px 7px; border-radius: 10px; font-size: 9px; font-weight: 700; }
.trend-up { color: #159269; background: #eaf8f3; }.trend-down { color: #da704c; background: #fff0ea; }.trend-neutral { color: #68748a; background: #f1f3f6; }
.metric-value { font-size: 25px; letter-spacing: -.5px; line-height: 1.1; color: var(--ink); }
.metric-label { color: #334155; font-size: 11px; font-weight: 650; margin-top: 5px; }
.metric-caption { color: var(--muted); font-size: 9px; margin-top: 7px; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(290px, .75fr); gap: 19px; }
.panel-heading { min-height: 70px; padding: 18px 20px 14px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); background: var(--surface-subtle); border-top-left-radius: 11px; border-top-right-radius: 11px; }
.panel-heading h2 { margin-bottom: 4px; font-size: 14px; color: var(--ink); }.panel-heading p { margin: 0; color: var(--muted); font-size: 10px; }.panel-heading a { color: var(--accent); font-size: 10px; font-weight: 650; text-decoration: none; }
.activity-item { min-height: 67px; padding: 12px 20px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }.activity-item:last-child { border: 0; }
.activity-avatar, .client-avatar { display: grid; place-items: center; border-radius: 9px; font-size: 10px; font-weight: 750; }.activity-avatar { width: 35px; height: 35px; }
.avatar-blue { color: #315fbf; background: #e7eeff; }.avatar-purple { color: #7251bf; background: #efeaff; }.avatar-green { color: #168568; background: #e6f5ef; }.avatar-orange { color: #c47430; background: #fff0e2; }
.activity-item p { margin: 0 0 4px; color: #475569; font-size: 10px; }.activity-item p strong { color: var(--ink); }.activity-item > div > span { color: var(--muted); font-size: 9px; }
.activity-status, .entity-status { border-radius: 12px; font-weight: 650; }.activity-status { padding: 4px 8px; font-size: 8px; }.status-updated { color: #3564be; background: #edf2ff; }.status-created { color: #7251b5; background: #f1edff; }.status-imported { color: #168a65; background: #e9f7f2; }.status-archived { color: #7c8494; background: #f0f2f5; }
.quick-links { padding: 10px 13px; }.quick-links a { min-height: 64px; padding: 10px 8px; display: grid; grid-template-columns: 38px 1fr 18px; align-items: center; gap: 11px; text-decoration: none; border-radius: 8px; }.quick-links a:hover { background: #f1f5fa; }
.quick-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 9px; }.quick-icon svg { width: 17px; height: 17px; }.quick-blue { color: var(--accent); background: var(--accent-subtle); }.quick-purple { color: #7252ca; background: #f0ebff; }.quick-green { color: #198b68; background: #e8f7f1; }
.quick-links strong, .quick-links small { display: block; }.quick-links strong { color: var(--ink); font-size: 11px; }.quick-links small { color: var(--muted); font-size: 9px; margin-top: 3px; }.chevron { width: 15px; color: #b0b6c2; }

.breadcrumbs { display: flex; gap: 8px; margin-bottom: 17px; color: var(--muted); font-size: 10px; }.breadcrumbs a { text-decoration: none; color: inherit; }.breadcrumbs a:hover { color: var(--accent); }.breadcrumbs strong { color: var(--ink); }.entity-heading { align-items: center; margin-bottom: 20px; }
.entity-summary { display: flex; margin-bottom: 18px; padding: 16px 21px; }.entity-summary > div { min-width: 170px; display: flex; align-items: center; gap: 11px; padding-right: 35px; margin-right: 35px; border-right: 1px solid var(--line); }.entity-summary > div:last-child { border: 0; margin: 0; }
.summary-dot { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 5px currentColor; opacity: .75; }.summary-blue { color: #dce7ff; background: var(--accent); }.summary-green { color: #d9f1e9; background: #20a874; }.summary-orange { color: #ffead7; background: #e58c37; }.summary-gray { color: #e8eaee; background: #8991a0; }
.entity-summary strong, .entity-summary small { display: block; }.entity-summary strong { font-size: 16px; color: var(--ink); }.entity-summary small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.table-panel { overflow: hidden; }.table-toolbar { min-height: 69px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.search-box { width: min(360px, 50%); position: relative; }.search-box svg { position: absolute; left: 12px; top: 11px; width: 17px; color: #939cad; }.search-box input { width: 100%; height: 40px; padding: 0 13px 0 38px; border: 1px solid #adb5c2; outline: none; border-radius: 8px; color: #343e53; font-size: 11px; }.search-box input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-subtle); }.search-box input::placeholder { color: #a8afbc; }
.toolbar-actions { display: flex; gap: 8px; }.filter-count { min-width: 17px; height: 17px; display: inline-grid; place-items: center; border-radius: 9px; color: white; background: var(--accent); font-size: 8px; }.icon-only { width: 40px; padding: 0; }
.data-table-wrapper { overflow-x: auto; }.data-table { width: 100%; min-width: 940px; border-collapse: collapse; }.data-table th { height: 42px; padding: 0 12px; color: #475569; background: var(--surface-subtle); border-bottom: 1px solid var(--line); text-align: left; text-transform: uppercase; letter-spacing: .06em; font-size: 8px; }.data-table th:first-child, .data-table td:first-child { width: 42px; padding-left: 18px; }
.data-table td { height: 66px; padding: 0 12px; color: #334155; border-bottom: 1px solid var(--line); font-size: 10px; white-space: nowrap; }.data-table tbody tr:hover { background: #f5f8fc; }.data-table input[type=checkbox] { appearance: none; width: 14px; height: 14px; border: 1px solid #cbd1dc; border-radius: 4px; background: white; }
.client-cell { display: flex; align-items: center; gap: 10px; }.client-avatar { width: 34px; height: 34px; }.client-cell strong, .client-cell small, .contact-cell span, .contact-cell small, .activity-date span, .activity-date small { display: block; }.client-cell strong { color: var(--ink); font-size: 10px; }.client-cell small, .contact-cell small, .activity-date small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.avatar-indigo { color:#405fc0;background:#e7edff }.avatar-pink { color:#b84e7a;background:#fce9f1 }.avatar-cyan { color:#26849d;background:#e6f6fa }.avatar-orange { color:#be6b2f;background:#fff0e4 }.avatar-green { color:#238361;background:#e5f5ee }.avatar-purple { color:#7153b5;background:#eeeaff }
.mono-id { color: #4b5d7a; font: 600 9px ui-monospace, SFMono-Regular, Consolas, monospace; }.entity-status { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; font-size: 8px; }.entity-status i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }.status-active { color: #17865f; background: #e9f7f2; }.status-pending { color: #c7772b; background: #fff2e5; }.status-inactive { color: #788090; background: #eef0f3; }.row-menu { border: 0; background: transparent; color: #8b93a3; letter-spacing: 2px; cursor: pointer; }
.table-footer { min-height: 62px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 9px; border-top: 1px solid var(--line); background: var(--surface-subtle); }.table-footer strong { color: var(--ink); }.pagination { display: flex; align-items: center; gap: 4px; }.pagination button { min-width: 29px; height: 29px; padding: 0 7px; border: 1px solid var(--line); border-radius: 6px; color: #475569; background: white; font-size: 9px; }.pagination button.active { border-color: var(--accent); color: white; background: var(--accent); }.pagination button:disabled { color: #c2c7d0; }
.model-placeholder, .empty-state { min-height: 390px; padding: 60px 20px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }.placeholder-icon { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 16px; color: #547ee0; background: #eaf0ff; }.placeholder-icon svg { width: 27px; }.model-placeholder h2 { margin: 20px 0 7px; font-size: 18px; }.model-placeholder p, .empty-state p { color: var(--muted); }.empty-code { color: #b8c5e4; font-size: 58px; font-weight: 800; }
.legacy-route { max-width: 720px; margin-top: 14px; padding: 9px 12px; overflow-wrap: anywhere; border: 1px solid #e1e5ed; border-radius: 7px; color: #68738a; background: #f7f8fa; font-size: 11px; }
.module-spinner { width: 34px; height: 34px; border: 3px solid #dce5fa; border-top-color: var(--blue); border-radius: 50%; animation: module-spin .8s linear infinite; }
@keyframes module-spin { to { transform: rotate(360deg); } }

/* ABM dinamico */
.dynamic-abm-heading { align-items: center; }
.dynamic-heading-actions, .dynamic-form-actions > div, .dynamic-confirmation > div:last-child { display: flex; align-items: center; gap: 9px; }
.button:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.button-spinner { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,.38); border-top-color: currentColor; border-radius: 50%; animation: module-spin .7s linear infinite; }
.button-danger-outline { color: #b34653; border-color: #efcbd0; background: #fff; }
.button-danger-outline:hover { color: #a33845; border-color: #dfaab1; background: #fff8f9; }
.button-danger { color: #fff; background: #bd4857; }
.button-danger:hover { background: #a93c49; }
.dynamic-alert { min-height: 46px; margin-bottom: 16px; padding: 10px 13px; display: grid; grid-template-columns: 20px minmax(0,1fr) 24px; align-items: center; gap: 10px; border: 1px solid; border-radius: 9px; font-size: 12px; }
.dynamic-alert svg { width: 19px; }
.dynamic-alert button { width: 24px; height: 24px; border: 0; border-radius: 6px; color: inherit; background: transparent; cursor: pointer; font-size: 18px; }
.dynamic-alert-success { color: #187457; border-color: #cfe9df; background: #edf9f4; }
.dynamic-alert-error { color: #9f3f4b; border-color: #f0ccd1; background: #fff2f4; }
.dynamic-confirmation { margin-bottom: 16px; padding: 15px 17px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid #f0d497; border-radius: 10px; color: #74551b; background: #fff9eb; }
.dynamic-confirmation > div:first-child { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dynamic-confirmation strong { font-size: 13px; }
.dynamic-confirmation span { font-size: 12px; line-height: 1.45; }
.dynamic-record-toolbar { min-height: 76px; margin-bottom: 17px; padding: 13px 17px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.dynamic-record-state { display: flex; align-items: center; gap: 12px; }
.record-state-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; color: #5e75a7; background: #eef2f8; }
.record-state-icon.is-existing { color: #2d63d0; background: #eaf0ff; }
.record-state-icon svg { width: 19px; }
.dynamic-record-state strong, .dynamic-record-state span { display: block; }
.dynamic-record-state strong { margin-bottom: 3px; color: #30394c; font-size: 13px; }
.dynamic-record-state span { color: #8a93a5; font-size: 11px; }
.dynamic-record-controls { display: flex; align-items: flex-end; gap: 14px; }
.dynamic-record-navigator { display: flex; flex-direction: column; gap: 5px; }
.dynamic-record-navigator > span { color: #616b80; font-size: 11px; font-weight: 650; }
.dynamic-record-navigator > div { height: 40px; display: flex; align-items: stretch; overflow: hidden; border: 1px solid #dfe3ea; border-radius: 8px; background: #fff; }
.dynamic-record-navigator button { width: 38px; padding: 0; display: grid; place-items: center; border: 0; border-right: 1px solid #e5e8ee; color: #637087; background: transparent; cursor: pointer; }
.dynamic-record-navigator button:last-child { border-right: 0; border-left: 1px solid #e5e8ee; }
.dynamic-record-navigator button:hover:not(:disabled) { color: var(--accent); background: var(--accent-subtle); }
.dynamic-record-navigator button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: -2px; }
.dynamic-record-navigator button:disabled { color: #bdc3ce; background: #f8f9fb; cursor: not-allowed; }
.dynamic-record-navigator svg { width: 17px; height: 17px; }
.dynamic-record-position { min-width: 68px; padding: 0 9px; display: grid; place-items: center; color: var(--ink); background: var(--surface-subtle); font-size: 12px; font-weight: 750; font-variant-numeric: tabular-nums; }
.dynamic-id-search { display: grid; grid-template-columns: auto 125px auto auto; align-items: center; gap: 8px; }
.dynamic-id-search label { color: #616b80; font-size: 11px; font-weight: 650; }
.dynamic-id-search input { width: 125px; height: 40px; padding: 0 11px; outline: none; border: 1px solid #adb5c2; border-radius: 8px; color: #30394c; background: #fff; }
.dynamic-id-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-subtle); }
.dynamic-form-panel { overflow: hidden; }
.dynamic-form-heading { min-height: 79px; padding: 18px 21px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); border-top-left-radius: 11px; border-top-right-radius: 11px; }
.dynamic-form-heading h2 { margin: 5px 0 0; color: var(--ink); font-size: 17px; }
.dynamic-form-heading > span { color: var(--muted); font-size: 11px; }
.dynamic-form-heading b, .dynamic-field-label b, .dynamic-collection h3 b { color: #c74c59; }
.dynamic-fields-grid { padding: 23px 21px 26px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px 24px; }
.dynamic-field { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.dynamic-field-label { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #424c61; font-size: 12px; font-weight: 650; }
.dynamic-field-label small { color: #9ba3b2; font-size: 9px; font-weight: 550; letter-spacing: .02em; text-transform: uppercase; }
.dynamic-control { width: 100%; height: 42px; padding: 0 12px; outline: none; border: 1px solid #adb5c2; border-radius: 8px; color: #303a4f; background: #fff; font: inherit; font-size: 13px; transition: border-color .15s, box-shadow .15s; }
.dynamic-control:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-subtle); }
.dynamic-control:read-only, .dynamic-control:disabled { color: #6f7889; background: #f5f6f8; cursor: default; }
.dynamic-textarea { min-height: 92px; height: auto; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.dynamic-memo { min-height: 150px; white-space: pre-wrap; }
.dynamic-control-with-icon, .dynamic-select-wrap { position: relative; }
.dynamic-control-with-icon svg { width: 17px; position: absolute; z-index: 1; top: 12px; left: 12px; color: #8791a4; pointer-events: none; }
.dynamic-control-with-icon .dynamic-control { padding-left: 39px; }
.dynamic-select-wrap select { padding-right: 36px; appearance: none; cursor: pointer; }
.dynamic-select-wrap > svg { width: 16px; position: absolute; top: 13px; right: 12px; color: #8690a3; pointer-events: none; }
.dynamic-file-control { min-height: 74px; padding: 10px 11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid #adb5c2; border-radius: 8px; background: #fff; }
.dynamic-file-summary { min-width: 0; display: flex; align-items: center; gap: 10px; }
.dynamic-file-summary > span:last-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.dynamic-file-summary strong { overflow: hidden; color: #3b465b; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.dynamic-file-summary small { color: #8992a3; font-size: 10px; }
.dynamic-file-icon { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--accent); background: var(--accent-subtle); }
.dynamic-file-icon svg { width: 19px; }
.dynamic-file-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; }
.dynamic-file-actions .button { height: 36px; }
.dynamic-file-actions label.is-disabled { opacity: .65; cursor: wait; pointer-events: none; }
.dynamic-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.dynamic-switch { width: fit-content; min-height: 42px; display: flex; align-items: center; gap: 9px; color: #586277; cursor: pointer; font-size: 12px; }
.dynamic-switch input { position: absolute; opacity: 0; pointer-events: none; }
.dynamic-switch-track { width: 38px; height: 22px; padding: 3px; display: inline-flex; align-items: center; border-radius: 12px; background: #cbd1dc; transition: background .15s; }
.dynamic-switch-track i { width: 16px; height: 16px; display: block; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(25,35,55,.25); transition: transform .15s; }
.dynamic-switch input:checked + .dynamic-switch-track { background: var(--accent); }
.dynamic-switch input:checked + .dynamic-switch-track i { transform: translateX(16px); }
.dynamic-switch input:focus-visible + .dynamic-switch-track { outline: 3px solid var(--accent-subtle); }
.dynamic-switch input:disabled + .dynamic-switch-track { opacity: .55; }
.dynamic-field.has-error .dynamic-control, .dynamic-collection.has-error { border-color: #dc8994; }
.dynamic-field-error { color: #b34250; font-size: 11px; line-height: 1.35; }
.dynamic-collection { margin: 0 21px 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.dynamic-collection > header { min-height: 68px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.dynamic-collection > header > div { display: flex; align-items: center; gap: 11px; }
.collection-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; color: var(--accent); background: var(--accent-subtle); }
.collection-icon svg { width: 18px; }
.dynamic-collection h3 { margin: 0 0 3px; color: var(--ink); font-size: 13px; }
.dynamic-collection header p { margin: 0; color: var(--muted); font-size: 10px; }
.dynamic-collection-empty { min-height: 94px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #7e8798; font-size: 12px; }
.dynamic-collection-empty small { color: #a0a7b4; font-size: 10px; }
.dynamic-collection-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.dynamic-collection-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.dynamic-collection-table thead { position: sticky; top: 0; z-index: 1; }
.dynamic-collection-table th { padding: 9px 12px; text-align: left; font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; color: #475569; background: var(--surface-subtle); border-bottom: 1px solid var(--line); white-space: nowrap; }
.dynamic-collection-table td { padding: 8px 12px; vertical-align: middle; border-bottom: 1px solid var(--line); color: #334155; }
.dynamic-collection-table tbody tr:last-child td { border-bottom: 0; }
.dynamic-collection-table tbody tr:hover { background: #f3f7fd; }
.dynamic-collection-table .col-id { width: 56px; min-width: 56px; font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace; font-size: 11px; color: #8993a5; text-align: center; }
.dynamic-collection-table th.col-id { text-align: center; }
.dynamic-collection-table .col-actions { width: 88px; min-width: 88px; text-align: center; }
.collection-row-editing { background: var(--accent-subtle) !important; }
.collection-row-editing td { border-bottom-color: var(--accent-border); }
.cell-value { display: block; padding: 4px 0; min-height: 28px; line-height: 1.6; word-break: break-word; }
.collection-row-actions { display: flex; align-items: center; justify-content: center; gap: 4px; }
.row-action-btn { width: 30px; height: 30px; display: inline-grid; place-items: center; border: 0; border-radius: 7px; background: transparent; cursor: pointer; transition: background .15s, color .15s; }
.row-action-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.row-action-edit { color: var(--accent); }
.row-action-edit:hover { background: var(--accent-subtle); color: #2847c2; }
.row-action-delete { color: #a04a56; }
.row-action-delete:hover { background: #fff0f2; color: #8e3344; }
.dynamic-collection-table .dynamic-field { margin: 0; }
.dynamic-collection-table .dynamic-field-label { display: none; }
.dynamic-collection-table .dynamic-control { height: 36px; font-size: 12px; }
.dynamic-collection-table .dynamic-textarea { height: auto; min-height: 36px; }
.dynamic-collection-table .dynamic-switch { justify-content: flex-start; }
.dynamic-collection-rows { padding: 13px; display: grid; gap: 12px; }
.dynamic-collection-row { overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.collection-row-heading { min-height: 43px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.collection-row-heading strong { color: #475569; font-size: 11px; }
.collection-row-heading button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 7px; color: #a04a56; background: transparent; cursor: pointer; }
.collection-row-heading button:hover { background: #fff0f2; }
.collection-row-heading svg { width: 15px; }
.dynamic-fields-grid-nested { padding: 15px; gap: 14px 18px; }
.dynamic-field-compact .dynamic-field-label { font-size: 11px; }
.dynamic-field-compact .dynamic-control { height: 38px; font-size: 12px; }
.dynamic-form-actions { min-height: 75px; padding: 14px 21px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid var(--line); background: var(--surface-subtle); }
.delete-confirmation { min-height: 40px; display: flex; align-items: center; gap: 8px; }
.delete-confirmation > span { margin-right: 3px; color: #8e3e49; font-size: 11px; font-weight: 650; }
.dynamic-load-error { min-height: 260px; padding: 32px; display: flex; align-items: center; gap: 22px; }
.dynamic-load-error .placeholder-icon { flex: 0 0 auto; }
.dynamic-load-error h1 { margin: 5px 0 7px; font-size: 22px; }
.dynamic-load-error p { max-width: 700px; color: var(--muted); line-height: 1.5; }

.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(430px, 46%) 1fr; background: #fff; }
.login-brand-panel { min-height: 100vh; padding: 42px 58px; display: flex; flex-direction: column; position: relative; overflow: hidden; color: white; background: radial-gradient(circle at 15% 85%, rgba(58,98,185,.35), transparent 35%), linear-gradient(145deg,#17243f 0%,#1f3158 100%); }
.login-brand-panel::before, .login-brand-panel::after { content:""; position:absolute; border:1px solid rgba(255,255,255,.045); transform:rotate(45deg); }.login-brand-panel::before { width:430px;height:430px;right:-270px;top:-130px; }.login-brand-panel::after { width:300px;height:300px;left:-210px;bottom:-130px; }
.login-brand { display: flex; align-items: center; gap: 15px; font-size: 25px; font-weight: 750; z-index: 1; }.brand-mark-large { width: 34px; height: 34px; }.brand-mark-large > span { width: 14px; height: 14px; }
.login-message { max-width: 500px; margin: auto 0; z-index: 1; }.login-kicker { color: #8daffb; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; }.login-message h1 { margin: 19px 0 18px; font-size: clamp(38px,4vw,55px); line-height: 1.08; letter-spacing: -2px; }.login-message > p { max-width: 430px; color: #b8c3da; font-size: 14px; line-height: 1.7; margin-bottom: 32px; }
.login-feature { display: flex; align-items: center; gap: 12px; color: #d2d9e9; margin: 15px 0; font-size: 11px; }.login-feature > span { width: 23px; height: 23px; display: grid; place-items: center; color: #8aacf5; background: rgba(99,139,225,.14); border-radius: 50%; }.login-feature svg { width: 12px; }.login-copyright { color: #71809f; font-size: 9px; z-index: 1; }
.login-form-panel { display: grid; place-items: center; padding: 45px; }.login-card { width: min(100%, 380px); }.login-card-heading h2 { margin: 0 0 8px; font-size: 27px; letter-spacing: -.6px; }.login-card-heading p { color: #7c8597; font-size: 12px; margin-bottom: 31px; }.mobile-logo { display: none; }
.login-form { display: flex; flex-direction: column; }.login-form > label { color: #414a5f; font-size: 10px; font-weight: 700; margin: 0 0 7px; }.input-with-icon { position: relative; margin-bottom: 18px; }.input-with-icon svg { position: absolute; width: 17px; left: 13px; top: 13px; color: #8b95a9; }.input-with-icon input { width: 100%; height: 44px; padding: 0 14px 0 42px; border: 1px solid #adb5c2; outline: none; border-radius: 8px; color: #2e374b; font-size: 11px; }.input-with-icon input:focus { border-color: #7f9fe8; box-shadow: 0 0 0 3px #eef3ff; }
.login-options { display: flex; align-items: center; justify-content: flex-start; margin: 1px 0 22px; font-size: 9px; }.login-help a { color: var(--blue); font-weight: 650; text-decoration: none; }.check-label { display: flex; align-items: center; gap: 7px; color: #6e778a; cursor: pointer; }.check-label input { position: absolute; opacity: 0; }.check-label span { width: 14px; height: 14px; border: 1px solid #cbd2df; border-radius: 4px; }.check-label input:checked + span { background: var(--blue); box-shadow: inset 0 0 0 3px white; }
.login-submit { height: 45px; display: flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 8px; color: white; background: var(--blue); font-size: 11px; font-weight: 700; cursor: pointer; box-shadow: 0 6px 15px rgba(53,106,230,.22); }.login-submit:hover { background: var(--blue-dark); }.login-submit svg { width: 16px; }
.demo-access { margin-top: 18px; padding: 11px 13px; display: flex; flex-direction: column; gap: 4px; border: 1px solid #e2e8f4; border-radius: 8px; color: #667187; background: #f7f9fd; font-size: 9px; }.demo-access strong { color: #405276; }.login-help { margin: 24px 0 0; color: #9199a8; text-align: center; font-size: 9px; }.login-error { margin: -17px 0 18px; padding: 10px 12px; border-radius: 7px; color: #a33f4c; background: #fff0f2; font-size: 10px; }

/* Escala de lectura para uso diario en pantallas de escritorio. */
.page-heading p { font-size: 15px; }
.eyebrow, .breadcrumbs { font-size: 12px; }
.metric-label { font-size: 14px; }
.metric-caption { font-size: 12px; }
.trend { font-size: 12px; }
.panel-heading h2 { font-size: 17px; }
.panel-heading p, .panel-heading a { font-size: 13px; }
.activity-item p { font-size: 14px; }
.activity-item > div > span { font-size: 12px; }
.activity-status { font-size: 11px; }
.quick-links strong { font-size: 14px; }
.quick-links small { font-size: 12px; }
.entity-summary strong { font-size: 19px; }
.entity-summary small { font-size: 12px; }
.search-box input { font-size: 14px; }
.data-table { min-width: 900px; table-layout: fixed; }
.data-table th:nth-child(1) { width: 50px; }
.data-table th:nth-child(2) { width: 210px; }
.data-table th:nth-child(3) { width: 80px; }
.data-table th:nth-child(4) { width: 90px; }
.data-table th:nth-child(5) { width: 220px; }
.data-table th:nth-child(6) { width: 110px; }
.data-table th:nth-child(7) { width: 125px; }
.data-table th:nth-child(8) { width: 45px; }
.client-cell, .client-cell > span:last-child, .contact-cell { min-width: 0; }
.client-cell > span:last-child, .contact-cell { overflow: hidden; }
.client-cell strong, .client-cell small, .contact-cell span, .contact-cell small { overflow: hidden; text-overflow: ellipsis; }
.data-table th { font-size: 11px; }
.data-table td { height: 72px; font-size: 14px; }
.client-cell strong { font-size: 14px; }
.client-cell small, .contact-cell small, .activity-date small { font-size: 12px; }
.mono-id { font-size: 12px; }
.entity-status { font-size: 11px; }
.table-footer { font-size: 12px; }
.pagination button { font-size: 12px; }
.login-form > label { font-size: 13px; }
.input-with-icon input { font-size: 14px; }
.login-options { font-size: 12px; }
.login-submit { font-size: 14px; }
.demo-access, .login-help { font-size: 12px; }
.login-error { font-size: 13px; }

#blazor-error-ui { display: none; position: fixed; z-index: 1000; left: 20px; right: 20px; bottom: 18px; padding: 12px 45px 12px 16px; color: #fff; background: #a43c49; border-radius: 8px; box-shadow: 0 8px 25px rgba(0,0,0,.2); }.dismiss { position: absolute; right: 15px; cursor: pointer; }
h1:focus { outline: none; }

/* Listados dinamicos */
.listing-page-heading { margin-bottom: 20px; }
.listing-selector-panel { min-height: 86px; margin-bottom: 18px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.listing-selector-copy { min-width: 0; display: flex; align-items: center; gap: 12px; }
.listing-selector-copy > div { min-width: 0; }
.listing-selector-copy strong, .listing-selector-copy span { display: block; }
.listing-selector-copy strong { margin-bottom: 3px; color: var(--ink); font-size: 13px; }
.listing-selector-copy span { color: var(--muted); font-size: 11px; }
.listing-selector-icon { width: 40px; height: 40px; flex: 0 0 auto; display: grid !important; place-items: center; border-radius: 10px; color: var(--accent) !important; background: var(--accent-subtle); border: 1px solid var(--accent-border); }
.listing-selector-icon svg { width: 19px; }
.listing-select-wrap { width: min(100%, 430px); display: grid; grid-template-columns: auto minmax(220px,1fr); align-items: center; gap: 10px; }
.listing-select-wrap > label { color: #475569; font-size: 11px; font-weight: 650; }
.listing-filters-panel { margin-bottom: 18px; overflow: hidden; }
.listing-panel-heading, .listing-results-heading { min-height: 72px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); border-top-left-radius: 11px; border-top-right-radius: 11px; }
.listing-panel-heading h2, .listing-results-heading h2 { margin: 4px 0 0; color: var(--ink); font-size: 16px; }
.listing-panel-heading > span { color: var(--muted); font-size: 11px; }
.listing-filter-grid { padding: 21px 20px 24px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px 20px; }
.listing-filter { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.listing-filter > label { color: #424c61; font-size: 12px; font-weight: 650; }
.listing-date-range { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.listing-date-range > div { min-width: 0; position: relative; }
.listing-date-range span { position: absolute; z-index: 1; top: -6px; left: 9px; padding: 0 4px; color: #858fa2; background: #fff; font-size: 9px; }
.listing-no-filters { min-height: 92px; padding: 20px; display: flex; align-items: center; justify-content: center; gap: 9px; color: #747e91; font-size: 12px; }
.listing-no-filters svg { width: 18px; color: #748bc0; }
.listing-filter-actions { min-height: 68px; padding: 13px 20px; display: flex; align-items: center; justify-content: flex-end; gap: 9px; border-top: 1px solid var(--line); background: var(--surface-subtle); }
.listing-results-panel { overflow: hidden; }
.listing-result-count { padding: 5px 10px; border-radius: 999px; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); font-size: 10px; font-weight: 700; }
.listing-result-state { min-height: 230px; padding: 34px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.listing-result-state > strong { margin: 13px 0 5px; color: var(--ink); font-size: 14px; }
.listing-result-state > p { margin: 0; color: var(--muted); font-size: 12px; }
.listing-state-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); }
.listing-state-icon svg { width: 23px; }
.listing-table-scroll { width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.listing-table { width: 100%; min-width: 780px; border-collapse: collapse; table-layout: auto; }
.listing-table th { height: 46px; padding: 0; border-bottom: 1px solid var(--line); color: #475569; background: var(--surface-subtle); text-align: left; white-space: nowrap; }
.listing-table th button { width: 100%; min-width: 110px; height: 46px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 0; color: inherit; background: transparent; font: inherit; font-size: 10px; font-weight: 750; letter-spacing: .025em; text-transform: uppercase; cursor: pointer; }
.listing-table th button:hover { color: var(--accent); background: #f0f3f9; }
.listing-table th svg { width: 14px; flex: 0 0 auto; opacity: .35; }
.listing-table th svg.is-active { color: var(--accent); opacity: 1; }
.listing-table th svg.is-descending { transform: rotate(180deg); }
.listing-table .listing-link-column { width: 58px; min-width: 58px; padding: 0 12px; text-align: center; }
.listing-table .listing-link-column span { font-size: 10px; font-weight: 750; letter-spacing: .025em; text-transform: uppercase; }
.listing-table td { min-width: 140px; height: auto; min-height: 52px; padding: 9px 14px; overflow: visible; border-bottom: 1px solid var(--line); color: #334155; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; text-overflow: clip; vertical-align: middle; white-space: pre-wrap; word-break: break-word; }
.listing-table .listing-link-cell { width: 58px; min-width: 58px; padding: 8px 12px; text-align: center; }
.listing-link-cell a { width: 31px; height: 31px; margin: auto; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; color: var(--accent); background: #fff; }
.listing-link-cell a:hover { border-color: var(--accent-border); color: #2847c2; background: var(--accent-subtle); }
.listing-link-cell a svg { width: 15px; }
.listing-table tbody tr:nth-child(even) td { background: #fbfcfd; }
.listing-table tbody tr:hover td { background: #f3f7fd; }
.listing-table tbody tr:last-child td { border-bottom: 0; }
.listing-table-footer { min-height: 64px; padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); background: var(--surface-subtle); font-size: 11px; }
.listing-pagination { display: flex; align-items: center; gap: 10px; }
.listing-pagination button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; color: #475569; background: #fff; cursor: pointer; }
.listing-pagination button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); background: var(--accent-subtle); }
.listing-pagination button:disabled { opacity: .45; cursor: default; }
.listing-pagination svg { width: 15px; }

/* Conmutador de vistas (Tabla / Tarjetas) */
.listing-view-switcher { display: flex; align-items: center; gap: 6px; }
.listing-view-switcher .button { height: 34px; padding: 0 12px; font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; gap: 7px; text-decoration: none; border-radius: 8px; }
.listing-view-switcher .button svg { width: 15px; height: 15px; }
.listing-view-switcher .button.is-active { color: var(--accent); background: var(--accent-subtle); border-color: var(--accent-border); cursor: default; }

/* Barra superior de resultados en tarjetas */
.listing-cards-heading { flex-wrap: wrap; gap: 14px; padding: 14px 20px; }
.listing-cards-title-block { display: flex; flex-direction: column; gap: 2px; }
.listing-cards-badge-group { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.listing-card-filtered-count { font-size: 11px; color: var(--muted); font-weight: 500; }
.listing-cards-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-left: auto; }
.listing-cards-search { position: relative; width: 220px; min-width: 180px; }
.listing-cards-search svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; color: #94a3b8; pointer-events: none; }
.listing-cards-search input { width: 100%; height: 32px; padding: 0 28px 0 30px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); font-size: 12px; outline: none; transition: border-color .15s ease, box-shadow .15s ease; }
.listing-cards-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(67,97,238,.12); }
.listing-cards-search button { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; border: 0; background: transparent; color: #94a3b8; font-size: 14px; line-height: 1; display: grid; place-items: center; cursor: pointer; border-radius: 4px; }
.listing-cards-search button:hover { color: var(--ink); background: rgba(0,0,0,.06); }
.listing-cards-sort-group, .listing-cards-pagesize-group { display: flex; align-items: center; gap: 7px; }
.listing-cards-sort-group label, .listing-cards-pagesize-group label { font-size: 11px; font-weight: 600; color: #64748b; white-space: nowrap; }
.listing-cards-sort-group .dynamic-select-wrap, .listing-cards-pagesize-group .dynamic-select-wrap { min-width: 130px; }
.listing-cards-sort-group .dynamic-control, .listing-cards-pagesize-group .dynamic-control { height: 32px; font-size: 12px; padding: 0 26px 0 10px; }
.listing-sort-direction-btn { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: #475569; cursor: pointer; transition: all .15s ease; }
.listing-sort-direction-btn:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-subtle); }
.listing-sort-direction-btn svg { width: 15px; height: 15px; }
.listing-sort-direction-btn svg.is-descending { transform: rotate(180deg); }

/* Pila de tarjetas (Una abajo de la otra, cada una a ancho completo) */
.listing-cards-stack { padding: 20px; display: flex; flex-direction: column; gap: 16px; background: var(--canvas); }
.listing-card-item { width: 100%; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 2px 5px rgba(15,23,42,.03), 0 1px 2px rgba(15,23,42,.02); transition: border-color .18s ease, box-shadow .18s ease; overflow: hidden; }
.listing-card-item:hover { border-color: #b8c7e0; box-shadow: 0 6px 18px rgba(15,23,42,.06); }

/* Encabezado de la tarjeta */
.card-item-header { min-height: 48px; padding: 10px 18px; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--surface-subtle); border-bottom: 1px solid var(--line); }
.card-header-main { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.card-index-badge { padding: 2px 7px; border-radius: 5px; font-size: 11px; font-weight: 750; color: #475569; background: #e2e8f0; letter-spacing: .02em; }
.card-id-tag { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 6px; font-size: 12px; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); }
.card-tag-label { font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; opacity: .85; }
.card-title { margin: 0; font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 500px; }
.card-header-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.card-action-btn { height: 30px; padding: 0 11px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--accent); background: #fff; font-size: 11px; font-weight: 650; text-decoration: none; cursor: pointer; transition: all .15s ease; }
.card-action-btn:hover { border-color: var(--accent-border); color: #2847c2; background: var(--accent-subtle); }
.card-action-btn svg { width: 14px; height: 14px; }
.card-action-icon-btn { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 6px; color: #64748b; background: #fff; cursor: pointer; transition: all .15s ease; }
.card-action-icon-btn:hover { border-color: var(--accent-border); color: var(--accent); background: var(--accent-subtle); }
.card-action-icon-btn.is-copied { color: #16a34a; border-color: #86efac; background: #f0fdf4; }
.card-action-icon-btn svg { width: 14px; height: 14px; }

/* Cuerpo de la tarjeta */
.card-item-body { padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }

/* Grupo 1: Campos compactos / cortos (<= 45 caracteres) */
.card-metadata-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px 18px; }
.card-meta-item { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.card-meta-label { font-size: 10px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-meta-value { font-size: 13px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; line-height: 1.4; }
.card-meta-value.card-meta-status { display: inline-flex; align-items: center; width: fit-content; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #1e40af; background: #dbeafe; }

/* Grupo 2: Campos medios (45 a 250 caracteres) */
.card-medium-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px 20px; padding-top: 14px; border-top: 1px dashed var(--line); }
.card-medium-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.card-medium-label { font-size: 11px; font-weight: 650; color: #475569; }
.card-medium-value { margin: 0; font-size: 13px; color: var(--ink); line-height: 1.5; white-space: pre-line; word-break: break-word; }

/* Grupo 3: Campos largos y muy largos (> 250 hasta 10.000+ caracteres) */
.card-long-section { display: flex; flex-direction: column; gap: 14px; }
.card-long-block { width: 100%; display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.card-long-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.card-long-label { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: #334155; }
.card-long-label svg { width: 15px; height: 15px; color: var(--accent); flex-shrink: 0; }
.card-char-badge { padding: 2px 7px; border-radius: 999px; font-size: 10px; font-weight: 700; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); white-space: nowrap; }
.card-long-actions { display: flex; align-items: center; gap: 6px; }
.card-copy-btn { height: 26px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 6px; font-size: 11px; font-weight: 600; color: #475569; background: #fff; cursor: pointer; transition: all .15s ease; }
.card-copy-btn:hover { border-color: var(--accent-border); color: var(--accent); background: var(--accent-subtle); }
.card-copy-btn.is-copied { color: #16a34a; border-color: #86efac; background: #f0fdf4; }
.card-copy-btn svg { width: 13px; height: 13px; }
.card-copy-btn svg.success-icon { stroke: #16a34a; stroke-width: 2.2; }

/* Contenedor scrollable para texto extenso con altura maxima y scroll visible */
.card-long-scrollable { width: 100%; max-height: 240px; overflow-y: auto; overflow-x: hidden; padding: 12px 16px; background: var(--surface-subtle); border: 1px solid var(--line); border-radius: 8px; font-size: 13px; line-height: 1.6; color: var(--ink); outline: none; overscroll-behavior-y: contain; }
.card-long-scrollable:focus-visible { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(67,97,238,.15); }
.card-long-body { white-space: pre-wrap; word-break: break-word; font-family: inherit; margin: 0; }

/* Scrollbar personalizado para el texto largo */
.card-long-scrollable::-webkit-scrollbar { width: 6px; }
.card-long-scrollable::-webkit-scrollbar-track { background: transparent; }
.card-long-scrollable::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
.card-long-scrollable::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.listing-cards-footer { border-top: 1px solid var(--line); }

/* Lupa de entidades para ABM */
.entity-lookup-backdrop { position: fixed; z-index: 120; inset: 0; padding: 28px; display: grid; place-items: center; background: rgba(12,20,34,.58); backdrop-filter: blur(3px); }
.entity-lookup-dialog { width: min(1120px, 100%); max-height: calc(100vh - 56px); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: #fff; box-shadow: 0 25px 70px rgba(12,20,34,.28); }
.entity-lookup-header { min-height: 92px; padding: 20px 22px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.entity-lookup-header h2 { margin: 4px 0 5px; color: var(--ink); font-size: 20px; }
.entity-lookup-header p { margin: 0; color: var(--muted); font-size: 12px; }
.entity-lookup-header > button { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 8px; color: #778196; background: transparent; cursor: pointer; }
.entity-lookup-header > button:hover { color: #b24350; background: #fff1f3; }
.entity-lookup-header > button svg { width: 19px; }
.entity-lookup-loading { min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; color: var(--muted); }
.entity-lookup-loading strong { margin-top: 8px; color: var(--ink); font-size: 14px; }
.entity-lookup-loading > span:last-child { font-size: 12px; }
.entity-lookup-message { margin: 22px; padding: 17px; display: grid; grid-template-columns: 24px minmax(0,1fr) auto; align-items: center; gap: 13px; border: 1px solid; border-radius: 10px; }
.entity-lookup-message svg { width: 22px; }.entity-lookup-message div { display: flex; flex-direction: column; gap: 3px; }.entity-lookup-message span { font-size: 12px; }
.entity-lookup-message-error { color: #a44250; border-color: #efcdd2; background: #fff4f5; }
.entity-lookup-filter-form { padding: 17px 21px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 16px; border-bottom: 1px solid var(--line); background: var(--surface-subtle); }
.entity-lookup-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(130px,1fr)); gap: 12px; }
.entity-lookup-filter { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.entity-lookup-filter > label { overflow: hidden; color: #475569; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.entity-lookup-date-range { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.entity-lookup-date-range .dynamic-control { min-width: 0; padding: 0 8px; }
.entity-lookup-filter-actions { display: flex; align-items: center; gap: 8px; }
.entity-lookup-no-filters { min-height: 42px; display: flex; align-items: center; gap: 9px; color: #747f92; font-size: 12px; }
.entity-lookup-no-filters svg { width: 19px; color: #8495b8; }
.entity-lookup-inline-error { margin: 12px 21px 0; padding: 9px 12px; border: 1px solid #efcdd2; border-radius: 8px; color: #a44250; background: #fff4f5; font-size: 12px; }
.entity-lookup-results { min-height: 270px; overflow: auto; display: flex; flex-direction: column; }
.entity-lookup-empty { min-height: 270px; padding: 35px 20px; display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--muted); text-align: center; }
.entity-lookup-empty-icon { width: 48px; height: 48px; margin-bottom: 7px; display: grid; place-items: center; border-radius: 13px; color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); }
.entity-lookup-empty-icon svg { width: 23px; }.entity-lookup-empty strong { color: var(--ink); font-size: 14px; }.entity-lookup-empty > span:last-child { font-size: 12px; }
.entity-lookup-table-wrap { overflow: auto; flex: 1; }
.entity-lookup-table { width: 100%; min-width: 720px; border-collapse: collapse; table-layout: auto; }
.entity-lookup-table th { height: 42px; padding: 0 13px; overflow: hidden; border-bottom: 1px solid var(--line); color: #475569; background: var(--surface-subtle); font-size: 10px; font-weight: 750; letter-spacing: .04em; text-align: left; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.entity-lookup-table th:first-child, .entity-lookup-table td:first-child { width: 54px; min-width: 54px; max-width: 54px; padding: 0 9px 0 14px; }
.entity-lookup-table td { min-width: 130px; max-width: 360px; height: 51px; padding: 8px 13px; overflow: visible; border-bottom: 1px solid var(--line); color: #334155; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; text-overflow: clip; vertical-align: middle; white-space: pre-wrap; word-break: break-word; }
.entity-lookup-table tbody tr:hover td { background: #f3f7fd; }
.entity-lookup-table td button { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; color: var(--accent); background: #fff; cursor: pointer; }
.entity-lookup-table td button:hover { border-color: var(--accent-border); color: #2847c2; background: var(--accent-subtle); }
.entity-lookup-table td button svg { width: 15px; }
.entity-lookup-footer { min-height: 58px; padding: 10px 18px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid var(--line); color: var(--muted); background: var(--surface-subtle); font-size: 11px; }
.entity-lookup-footer strong { color: var(--ink); }
.entity-lookup-pagination { display: flex; align-items: center; gap: 10px; }
.entity-lookup-pagination button { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; color: #475569; background: #fff; cursor: pointer; }
.entity-lookup-pagination button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); background: var(--accent-subtle); }.entity-lookup-pagination button:disabled { opacity: .4; cursor: default; }.entity-lookup-pagination svg { width: 15px; }

/* Modal de ABM (Error y Exito) */
.abm-modal-backdrop, .abm-error-backdrop { position: fixed; z-index: 130; inset: 0; padding: 24px; display: grid; place-items: center; background: rgba(12,20,34,.62); backdrop-filter: blur(4px); animation: abm-fade-in .15s ease-out; }
.abm-modal-dialog, .abm-error-dialog { width: min(480px, 100%); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: #fff; box-shadow: 0 24px 64px rgba(15,23,42,.32); animation: abm-modal-pop .2s cubic-bezier(0.16, 1, 0.3, 1); }
.abm-modal-dialog.modal-error, .abm-error-dialog { border-color: #f2d1d6; box-shadow: 0 24px 64px rgba(15,23,42,.32), 0 4px 16px rgba(190,40,60,.08); }
.abm-modal-dialog.modal-success { border-color: #cdeada; box-shadow: 0 24px 64px rgba(15,23,42,.32), 0 4px 16px rgba(32,168,116,.08); }
.abm-modal-header, .abm-error-header { padding: 20px 22px 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.abm-modal-title-wrap, .abm-error-title-wrap { display: flex; align-items: center; gap: 12px; }
.abm-modal-icon, .abm-error-icon { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; }
.abm-modal-icon svg, .abm-error-icon svg { width: 20px; height: 20px; }
.abm-modal-icon.modal-icon-error, .abm-error-icon { color: #cf3341; background: #fde8ea; border: 1px solid #fad2d7; }
.abm-modal-icon.modal-icon-success { color: #187457; background: #eaf8f1; border: 1px solid #c9ecdc; }
.abm-modal-title-wrap h3, .abm-error-title-wrap h3 { margin: 0; color: #263147; font-size: 17px; font-weight: 700; }
.abm-modal-close, .abm-error-close { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 8px; color: #8c96ab; background: transparent; cursor: pointer; transition: color .15s, background .15s; }
.abm-modal-close:hover, .abm-error-close:hover { color: #263147; background: #f1f3f7; }
.abm-modal-close.modal-close-error:hover, .abm-error-close:hover { color: #cf3341; background: #fde8ea; }
.abm-modal-close.modal-close-success:hover { color: #187457; background: #eaf8f1; }
.abm-modal-close svg, .abm-error-close svg { width: 18px; height: 18px; }
.abm-modal-body, .abm-error-body { padding: 6px 24px 22px; color: #4b5568; font-size: 13.5px; line-height: 1.55; word-break: break-word; }
.abm-modal-body p, .abm-error-body p { margin: 0; }
.abm-modal-footer, .abm-error-footer { padding: 14px 22px; display: flex; justify-content: flex-end; gap: 10px; background: var(--surface-subtle); border-top: 1px solid var(--line); }
@keyframes abm-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes abm-modal-pop { from { opacity: 0; transform: scale(.95) translateY(-8px); } to { opacity: 1; transform: scale(1) translateY(0); } }

@media (max-width: 1100px) {
    .metric-grid { grid-template-columns: repeat(2, 1fr); }.dashboard-grid { grid-template-columns: 1fr; }.entity-summary > div { min-width: 0; flex: 1; margin-right: 20px; padding-right: 20px; }.login-brand-panel { padding: 38px; }
    .dynamic-record-toolbar { align-items: flex-start; flex-direction: column; }.dynamic-record-controls { width: 100%; flex-wrap: wrap; }.dynamic-id-search { flex: 1; grid-template-columns: auto minmax(120px,1fr) auto auto; }.dynamic-id-search input { width: 100%; }
    .listing-filter-grid, .entity-lookup-filter-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 760px) {
    body.mobile-sidebar-active { overflow: hidden; }
    .sidebar-backdrop { display: block; }
    [data-mobile-sidebar="open"] .sidebar-backdrop { opacity: 1; pointer-events: auto; }
    .sidebar-close-btn { display: grid; margin-left: auto; }
    .workspace { margin-left: 0 !important; width: 100%; }
    .sidebar {
        width: 280px !important;
        min-width: 0 !important;
        max-width: 85vw;
        position: fixed;
        inset: 0 auto 0 0;
        height: 100vh;
        height: 100dvh;
        z-index: 100;
        transform: translateX(-105%);
        visibility: hidden;
        box-shadow: none;
        transition: transform .28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .28s ease, visibility .28s ease;
    }
    [data-mobile-sidebar="open"] .sidebar {
        transform: translateX(0) !important;
        visibility: visible !important;
        box-shadow: 4px 0 35px rgba(0,0,0,.5) !important;
    }
    [data-sidebar="collapsed"] .workspace { margin-left: 0 !important; }
    [data-sidebar="collapsed"] .sidebar { width: 280px !important; min-width: 0 !important; }
    [data-sidebar="collapsed"] .brand { padding: 0 20px; justify-content: space-between; }
    [data-sidebar="collapsed"] .brand-name,
    [data-sidebar="collapsed"] .brand-version { display: inline-block; }
    [data-sidebar="collapsed"] .nav-eyebrow { display: block; }
    [data-sidebar="collapsed"] .nav-link span { display: inline; }
    [data-sidebar="collapsed"] .nav-link { justify-content: flex-start; padding: 0 12px; }
    [data-sidebar="collapsed"] .menu-group-toggle { display: grid; padding: 8px 11px; }
    [data-sidebar="collapsed"] .menu-group-toggle > span,
    [data-sidebar="collapsed"] .group-chevron { display: block; }
    [data-sidebar="collapsed"] .menu-group-items { margin: 3px 0 9px 19px; padding-left: 9px; border-left: 1px solid rgba(255,255,255,.09); }
    [data-sidebar="collapsed"] .dynamic-nav-link { height: 36px; padding: 0 10px; }
    [data-sidebar="collapsed"] .sidebar-footer { display: flex; }
    [data-sidebar="collapsed"] .menu-error span { display: inline; }
    .brand { padding: 0 20px; justify-content: space-between; }
    .nav-content nav { padding: 18px 12px; }
    .nav-link { justify-content: flex-start; padding: 0 12px; }
    .topbar { padding: 0 18px; }
    .environment-badge, .user-copy { display: none; }
    .main-content { padding: 25px 18px; }
    .entity-summary { overflow-x: auto; }
    .entity-summary > div { min-width: 130px; }
    .login-shell { grid-template-columns: 1fr; }
    .login-brand-panel { display: none; }
    .login-form-panel { min-height: 100vh; padding: 28px; }
    .mobile-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 45px; font-size: 19px; font-weight: 750; }
    .mobile-logo .brand-mark { width: 24px; height: 24px; }
    .mobile-logo .brand-mark > span { width: 10px; height: 10px; }
    .search-box { width: 100%; }
    .table-toolbar { gap: 10px; }
    .button { padding: 0 11px; }
    .dynamic-fields-grid { grid-template-columns: 1fr; }
    .dynamic-confirmation { align-items: flex-start; flex-direction: column; }
    .dynamic-form-actions { align-items: stretch; flex-direction: column; }
    .dynamic-form-actions > div { justify-content: flex-end; }
    .delete-confirmation { align-items: flex-start; flex-wrap: wrap; }
    .delete-confirmation > span { width: 100%; }
    .listing-selector-panel { align-items: stretch; flex-direction: column; }
    .listing-select-wrap { width: 100%; }
    .listing-filter-grid, .entity-lookup-filter-grid { grid-template-columns: 1fr; }
    .entity-lookup-filter-form { grid-template-columns: 1fr; }
    .entity-lookup-filter-actions { justify-content: flex-end; }
    .sidebar-toggle { display: grid !important; }
}
@media (max-width: 520px) {
    .metric-grid { grid-template-columns: 1fr; }.page-heading { align-items: flex-start; flex-direction: column; }.page-heading .button { width: 100%; }.activity-status { display: none; }.activity-item { grid-template-columns: 36px 1fr; }.table-toolbar { align-items: stretch; flex-direction: column; }.toolbar-actions .button:first-child { flex: 1; }.table-footer { gap: 15px; align-items: flex-start; flex-direction: column; padding: 16px; }
    .entity-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; overflow: visible; }
    .entity-summary > div { min-width: 0; margin: 0; padding: 8px; border: 0; }
    .dynamic-heading-actions { width: 100%; }.dynamic-heading-actions .button { flex: 1; }.dynamic-record-controls, .dynamic-record-navigator { width: 100%; }.dynamic-record-navigator > div { width: 100%; }.dynamic-record-navigator button { flex: 1; }.dynamic-id-search { width: 100%; grid-template-columns: 1fr auto; }.dynamic-id-search label { grid-column: 1/-1; }.dynamic-id-search .entity-lookup-trigger { grid-column: 1/-1; }.dynamic-form-heading { align-items: flex-start; flex-direction: column; }.dynamic-collection > header { align-items: flex-start; flex-direction: column; }.dynamic-collection > header .button { width: 100%; }.dynamic-form-actions > div { width: 100%; }.dynamic-form-actions > div .button { flex: 1; }.dynamic-load-error { align-items: flex-start; flex-direction: column; }
    .entity-lookup-backdrop { padding: 10px; }.entity-lookup-dialog { max-height: calc(100vh - 20px); }.entity-lookup-header { padding: 17px; }.entity-lookup-filter-form { padding: 15px 17px; }.entity-lookup-footer { align-items: flex-start; flex-direction: column; }.entity-lookup-pagination { width: 100%; justify-content: space-between; }
    .listing-select-wrap { grid-template-columns: 1fr; }.listing-filter-actions .button { flex: 1; }.listing-table-footer { align-items: flex-start; flex-direction: column; }.listing-pagination { width: 100%; justify-content: space-between; }
}

/* Selector de tema */
.theme-toggle { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid transparent; border-radius: 9px; color: #69738a; background: transparent; cursor: pointer; transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease; }
.theme-toggle:hover { color: var(--blue); background: #f3f5f8; }
.theme-toggle:active { transform: scale(.94); }
.theme-toggle:focus-visible { outline: 3px solid rgba(53,106,230,.28); outline-offset: 2px; }
.theme-toggle svg { width: 19px; height: 19px; }
.login-theme-toggle { position: fixed; z-index: 20; top: 24px; right: 28px; }
.login-theme-toggle .theme-toggle { color: #536078; border-color: rgba(214,220,231,.9); background: rgba(255,255,255,.88); box-shadow: 0 5px 18px rgba(23,36,63,.09); backdrop-filter: blur(10px); }
.login-theme-toggle .theme-toggle:hover { color: var(--blue); border-color: #b9c8eb; background: #fff; }

/* Tema oscuro global */
:root[data-theme="dark"] {
    color-scheme: dark;
    --navy: #0c1017;
    --navy-2: #131b28;
    --blue: #4f80f7;
    --blue-dark: #3b6fd4;
    --accent: #5b8cff;
    --accent-subtle: rgba(91, 140, 255, 0.15);
    --accent-border: rgba(91, 140, 255, 0.35);
    --ink: #f8fafc;
    --muted: #94a3b8;
    --line: #26344d;
    --surface: #151d2c;
    --surface-subtle: #1a2538;
    --canvas: #0b0e14;
    --green: #2ecc71;
}

[data-theme="dark"] body { color: var(--ink); background: var(--canvas); }
[data-theme="dark"] ::selection { color: #fff; background: #29447d; }
[data-theme="dark"] * { scrollbar-color: #2e3f5e #0c1017; }
[data-theme="dark"] .sidebar { background: #090d14; border-right: 1px solid var(--line); }
[data-theme="dark"] .brand { border-bottom: 1px solid var(--line); }
[data-theme="dark"] .sidebar-footer { color: #8e9bb0; border-top: 1px solid var(--line); }
[data-theme="dark"] .nav-link:hover,
[data-theme="dark"] .menu-group-toggle:hover { color: #f8fafc; background: #172132; }
[data-theme="dark"] .nav-link.active,
[data-theme="dark"] .dynamic-nav-link.active { color: #fff; background: #284a8c; box-shadow: 0 4px 14px rgba(40,74,140,.4); }
[data-theme="dark"] .menu-group-items { border-left-color: #26344d; }
[data-theme="dark"] .menu-item-dot { border-color: #607394; }
[data-theme="dark"] .topbar { background: #101622; border-bottom: 1px solid var(--line); box-shadow: 0 2px 14px rgba(0,0,0,.45); }
[data-theme="dark"] .environment-badge { color: #c8d3e2; background: #192334; border: 1px solid var(--line); }
[data-theme="dark"] .user-copy strong { color: #f8fafc; }
[data-theme="dark"] .user-copy span { color: #8e9bb0; }
[data-theme="dark"] .topbar-divider,
[data-theme="dark"] .user-divider { background: var(--line); }
[data-theme="dark"] .notification-dot { border-color: #101622; }
[data-theme="dark"] .theme-toggle { color: #a4b2c7; }
[data-theme="dark"] .theme-toggle:hover { color: #f8fafc; background: #1c273a; }

[data-theme="dark"] .metric-card,
[data-theme="dark"] .panel,
[data-theme="dark"] .table-panel,
[data-theme="dark"] .entity-summary,
[data-theme="dark"] .dynamic-collection > header,
[data-theme="dark"] .dynamic-collection-row,
[data-theme="dark"] .login-shell,
[data-theme="dark"] .login-form-panel { color: var(--ink); background: var(--surface); border-color: var(--line); box-shadow: 0 4px 22px rgba(0,0,0,.35); }

[data-theme="dark"] .dynamic-form-actions,
[data-theme="dark"] .listing-filter-actions,
[data-theme="dark"] .listing-table-footer,
[data-theme="dark"] .collection-row-heading,
[data-theme="dark"] .data-table th,
[data-theme="dark"] .listing-table th,
[data-theme="dark"] .dynamic-collection-table th,
[data-theme="dark"] .dynamic-collection { color: #cbd5e1; background: var(--surface-subtle); border-color: var(--line); }

[data-theme="dark"] .dynamic-collection-table td { color: #cbd5e1; border-bottom-color: var(--line); }
[data-theme="dark"] .dynamic-collection-table tbody tr:hover { background: #1d293d; }
[data-theme="dark"] .dynamic-collection-table .col-id { color: #7f8fa8; }
[data-theme="dark"] .collection-row-editing { background: #1a2742 !important; }
[data-theme="dark"] .collection-row-editing td { border-bottom-color: #31446b; }
[data-theme="dark"] .row-action-edit { color: #8eb0f7; }
[data-theme="dark"] .row-action-edit:hover { background: #1e2c4a; color: #b2cbfa; }
[data-theme="dark"] .row-action-delete { color: #e0727f; }
[data-theme="dark"] .row-action-delete:hover { background: #33181c; color: #f0959f; }

[data-theme="dark"] .page-heading h1,
[data-theme="dark"] .panel-heading h2,
[data-theme="dark"] .metric-value,
[data-theme="dark"] .quick-links strong,
[data-theme="dark"] .breadcrumbs strong,
[data-theme="dark"] .client-cell strong,
[data-theme="dark"] .table-footer strong,
[data-theme="dark"] .dynamic-record-state strong,
[data-theme="dark"] .dynamic-form-heading h2,
[data-theme="dark"] .dynamic-collection h3,
[data-theme="dark"] .listing-selector-copy strong,
[data-theme="dark"] .listing-panel-heading h2,
[data-theme="dark"] .listing-results-heading h2,
[data-theme="dark"] .listing-result-state > strong,
[data-theme="dark"] .login-card-heading h2,
[data-theme="dark"] .dynamic-load-error h1 { color: #f8fafc; }

[data-theme="dark"] .page-heading p,
[data-theme="dark"] .panel-heading p,
[data-theme="dark"] .metric-caption,
[data-theme="dark"] .activity-item > div > span,
[data-theme="dark"] .quick-links small,
[data-theme="dark"] .entity-summary small,
[data-theme="dark"] .table-footer,
[data-theme="dark"] .listing-selector-copy span,
[data-theme="dark"] .listing-panel-heading > span,
[data-theme="dark"] .listing-result-state > p,
[data-theme="dark"] .listing-table-footer,
[data-theme="dark"] .login-card-heading p,
[data-theme="dark"] .login-help { color: #94a3b8; }

[data-theme="dark"] .metric-label,
[data-theme="dark"] .activity-item p,
[data-theme="dark"] .activity-item p strong,
[data-theme="dark"] .data-table td,
[data-theme="dark"] .listing-table td,
[data-theme="dark"] .dynamic-field-label,
[data-theme="dark"] .listing-filter > label,
[data-theme="dark"] .dynamic-id-search label,
[data-theme="dark"] .listing-select-wrap > label,
[data-theme="dark"] .dynamic-switch,
[data-theme="dark"] .collection-row-heading strong,
[data-theme="dark"] .login-form > label { color: #cbd5e1; }

[data-theme="dark"] .button-secondary,
[data-theme="dark"] .dynamic-control,
[data-theme="dark"] .dynamic-id-search input,
[data-theme="dark"] .search-box input,
[data-theme="dark"] .input-with-icon input,
[data-theme="dark"] .pagination button,
[data-theme="dark"] .listing-pagination button { color: #e2e8f0; background: #111722; border-color: #2d3c56; }
[data-theme="dark"] .dynamic-record-navigator > div { background: #111722; border-color: #2d3c56; }
[data-theme="dark"] .dynamic-record-navigator button { color: #94a3b8; border-color: #2d3c56; }
[data-theme="dark"] .dynamic-record-navigator button:hover:not(:disabled) { color: #f8fafc; background: #1c273a; }
[data-theme="dark"] .dynamic-record-navigator button:disabled { color: #475569; background: #0c1017; }
[data-theme="dark"] .dynamic-record-position { color: #e2e8f0; background: #162030; }
[data-theme="dark"] .entity-lookup-dialog { color: var(--ink); background: var(--surface); border-color: var(--line); box-shadow: 0 25px 75px rgba(0,0,0,.75); }
[data-theme="dark"] .entity-lookup-header,
[data-theme="dark"] .entity-lookup-filter-form,
[data-theme="dark"] .entity-lookup-footer { border-color: var(--line); }
[data-theme="dark"] .entity-lookup-header h2,
[data-theme="dark"] .entity-lookup-loading strong,
[data-theme="dark"] .entity-lookup-empty strong,
[data-theme="dark"] .entity-lookup-footer strong { color: #f8fafc; }
[data-theme="dark"] .entity-lookup-header p,
[data-theme="dark"] .entity-lookup-loading,
[data-theme="dark"] .entity-lookup-empty,
[data-theme="dark"] .entity-lookup-footer { color: #94a3b8; }
[data-theme="dark"] .entity-lookup-header > button { color: #a4b2c7; }
[data-theme="dark"] .entity-lookup-header > button:hover { color: #ffabb5; background: rgba(220,53,69,.15); }
[data-theme="dark"] .entity-lookup-filter-form,
[data-theme="dark"] .entity-lookup-footer { background: var(--surface-subtle); }
[data-theme="dark"] .entity-lookup-filter > label { color: #cbd5e1; }
[data-theme="dark"] .entity-lookup-empty-icon { color: var(--accent); background: var(--accent-subtle); border: 1px solid var(--accent-border); }
[data-theme="dark"] .entity-lookup-table th { color: #94a3b8; background: var(--surface-subtle); border-color: var(--line); }
[data-theme="dark"] .entity-lookup-table td { color: #cbd5e1; border-color: var(--line); }
[data-theme="dark"] .entity-lookup-table tbody tr:hover td { background: #1c2638; }
[data-theme="dark"] .entity-lookup-table td button,
[data-theme="dark"] .entity-lookup-pagination button { color: #e2e8f0; background: #141c28; border-color: #2d3c56; }
[data-theme="dark"] .entity-lookup-table td button:hover,
[data-theme="dark"] .entity-lookup-pagination button:hover:not(:disabled) { color: #fff; background: #223046; border-color: #4a638c; }
[data-theme="dark"] .entity-lookup-message-error,
[data-theme="dark"] .entity-lookup-inline-error { color: #ffabb5; background: rgba(220,53,69,.15); border-color: rgba(222,83,101,.35); }
[data-theme="dark"] .abm-modal-dialog, [data-theme="dark"] .abm-error-dialog { background: var(--surface); border-color: var(--line); box-shadow: 0 25px 75px rgba(0,0,0,.75); }
[data-theme="dark"] .abm-modal-dialog.modal-error, [data-theme="dark"] .abm-error-dialog { border-color: rgba(220,53,69,.35); }
[data-theme="dark"] .abm-modal-dialog.modal-success { border-color: rgba(46,204,113,.35); }
[data-theme="dark"] .abm-modal-title-wrap h3, [data-theme="dark"] .abm-error-title-wrap h3 { color: #f8fafc; }
[data-theme="dark"] .abm-modal-icon.modal-icon-error, [data-theme="dark"] .abm-error-icon { color: #ff8591; background: rgba(220,53,69,.16); border-color: rgba(220,53,69,.3); }
[data-theme="dark"] .abm-modal-icon.modal-icon-success { color: #34d399; background: rgba(46,204,113,.16); border-color: rgba(46,204,113,.3); }
[data-theme="dark"] .abm-modal-body, [data-theme="dark"] .abm-error-body { color: #cbd5e1; }
[data-theme="dark"] .abm-modal-close, [data-theme="dark"] .abm-error-close { color: #a4b2c7; }
[data-theme="dark"] .abm-modal-close:hover, [data-theme="dark"] .abm-error-close:hover { color: #f8fafc; background: #1c273a; }
[data-theme="dark"] .abm-modal-close.modal-close-error:hover { color: #ffabb5; background: rgba(220,53,69,.15); }
[data-theme="dark"] .abm-modal-close.modal-close-success:hover { color: #6ee7b7; background: rgba(46,204,113,.15); }
[data-theme="dark"] .abm-modal-footer, [data-theme="dark"] .abm-error-footer { background: var(--surface-subtle); border-top-color: var(--line); }
[data-theme="dark"] .dynamic-control::placeholder,
[data-theme="dark"] .dynamic-id-search input::placeholder,
[data-theme="dark"] .search-box input::placeholder,
[data-theme="dark"] .input-with-icon input::placeholder { color: #64748b; }
[data-theme="dark"] .dynamic-control:focus,
[data-theme="dark"] .dynamic-id-search input:focus,
[data-theme="dark"] .search-box input:focus,
[data-theme="dark"] .input-with-icon input:focus { color: #f8fafc; background: #141b27; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(91,140,255,.25); }
[data-theme="dark"] .dynamic-control:disabled,
[data-theme="dark"] .dynamic-control:read-only { color: #64748b; background: #0c1017; }
[data-theme="dark"] .dynamic-control option { color: #e2e8f0; background: #151d2c; }
[data-theme="dark"] .listing-date-range span { color: #94a3b8; background: var(--surface); }
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.8); }

[data-theme="dark"] .button-primary,
[data-theme="dark"] .login-submit { color: #fff; background: #3b74f6; box-shadow: 0 6px 18px rgba(0,0,0,.45); }
[data-theme="dark"] .button-primary:hover,
[data-theme="dark"] .login-submit:hover { background: #4f85ff; }
[data-theme="dark"] .button-secondary:hover,
[data-theme="dark"] .pagination button:hover:not(:disabled),
[data-theme="dark"] .listing-pagination button:hover:not(:disabled) { color: #f8fafc; background: #1c273a; border-color: #4a638c; }

[data-theme="dark"] .data-table th,
[data-theme="dark"] .listing-table th { color: #94a3b8; background: var(--surface-subtle); border-bottom-color: var(--line); }
[data-theme="dark"] .data-table td,
[data-theme="dark"] .listing-table td { border-bottom-color: var(--line); color: #cbd5e1; }
[data-theme="dark"] .data-table tbody tr:hover td,
[data-theme="dark"] .quick-links a:hover { background: #1c2638; }
[data-theme="dark"] .listing-table tbody tr:nth-child(even) td { background: #131a26; }
[data-theme="dark"] .listing-table tbody tr:hover td { background: #1c2638; }
[data-theme="dark"] .listing-table th button:hover { color: #f8fafc; background: #1c2638; }
[data-theme="dark"] .listing-link-cell a { color: #8eb0f7; background: #141c28; border-color: #2d3c56; }
[data-theme="dark"] .listing-link-cell a:hover { color: #fff; background: #223046; border-color: #4a638c; }
[data-theme="dark"] .table-toolbar,
[data-theme="dark"] .table-footer { border-color: var(--line); }
[data-theme="dark"] .quick-links a { border-bottom-color: var(--line); }

[data-theme="dark"] .listing-selector-icon,
[data-theme="dark"] .listing-state-icon,
[data-theme="dark"] .listing-result-count { color: #8caef7 !important; background: rgba(91,140,255,.16); }
[data-theme="dark"] .metric-icon.blue,
[data-theme="dark"] .entity-status.blue { color: #8caef7; background: rgba(91,140,255,.16); }
[data-theme="dark"] .metric-icon.green,
[data-theme="dark"] .entity-status.green { color: #5ad8a2; background: rgba(46,204,113,.16); }
[data-theme="dark"] .metric-icon.orange,
[data-theme="dark"] .entity-status.orange { color: #f5b86d; background: rgba(218,133,42,.16); }
[data-theme="dark"] .metric-icon.purple,
[data-theme="dark"] .entity-status.purple { color: #bca4ff; background: rgba(134,94,224,.18); }
[data-theme="dark"] .entity-status.neutral,
[data-theme="dark"] .activity-status { color: #a4b2c7; background: #1c2638; }

[data-theme="dark"] .dynamic-confirmation,
[data-theme="dark"] .success-message { color: #83dbb7; background: rgba(30,137,95,.18); border-color: rgba(60,185,134,.34); }
[data-theme="dark"] .dynamic-error,
[data-theme="dark"] .login-error { color: #ffabb5; background: rgba(220,53,69,.15); border-color: rgba(222,83,101,.35); }
[data-theme="dark"] .delete-confirmation { color: #f0c47d; background: rgba(169,103,25,.16); border-color: rgba(211,144,61,.34); }
[data-theme="dark"] .demo-access { color: #94a3b8; background: #111722; border-color: #26344d; }
[data-theme="dark"] .demo-access strong { color: #e2e5eb; }
[data-theme="dark"] .check-label { color: #94a3b8; }
[data-theme="dark"] .check-label span { border-color: #2d3c56; background: #111722; }
[data-theme="dark"] .check-label input:checked + span { background: #3b74f6; box-shadow: inset 0 0 0 3px #111722; }

[data-theme="dark"] .login-brand-panel { background: linear-gradient(145deg, #090c12 0%, #111724 58%, #192234 100%); }
[data-theme="dark"] .login-theme-toggle .theme-toggle { color: #a4b2c7; border-color: #26344d; background: rgba(17,23,34,.88); box-shadow: 0 5px 20px rgba(0,0,0,.4); }
[data-theme="dark"] .login-theme-toggle .theme-toggle:hover { color: #f8fafc; border-color: #3b5074; background: #172132; }

/* Soporte tema oscuro para tarjetas de listado */
[data-theme="dark"] .listing-cards-stack { background: #0c121d; }
[data-theme="dark"] .listing-card-item { background: #131a26; border-color: #243248; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
[data-theme="dark"] .listing-card-item:hover { border-color: #3b4f73; box-shadow: 0 8px 24px rgba(0,0,0,.35); }
[data-theme="dark"] .card-item-header { background: #182233; border-bottom-color: #243248; }
[data-theme="dark"] .card-index-badge { color: #cbd5e1; background: #26354f; }
[data-theme="dark"] .card-title { color: #f1f5f9; }
[data-theme="dark"] .card-action-btn,
[data-theme="dark"] .card-action-icon-btn,
[data-theme="dark"] .card-copy-btn,
[data-theme="dark"] .listing-sort-direction-btn { background: #182233; border-color: #2d3e5b; color: #cbd5e1; }
[data-theme="dark"] .card-action-btn:hover,
[data-theme="dark"] .card-action-icon-btn:hover,
[data-theme="dark"] .card-copy-btn:hover,
[data-theme="dark"] .listing-sort-direction-btn:hover { color: #fff; background: #24344e; border-color: #4f6897; }
[data-theme="dark"] .card-meta-label,
[data-theme="dark"] .card-medium-label { color: #94a3b8; }
[data-theme="dark"] .card-meta-value,
[data-theme="dark"] .card-medium-value { color: #e2e8f0; }
[data-theme="dark"] .card-meta-value.card-meta-status { color: #93c5fd; background: rgba(59,130,246,.2); }
[data-theme="dark"] .card-medium-grid,
[data-theme="dark"] .card-long-block { border-top-color: #243248; }
[data-theme="dark"] .card-long-label { color: #e2e8f0; }
[data-theme="dark"] .card-long-scrollable { background: #101620; border-color: #243248; color: #cbd5e1; }
[data-theme="dark"] .card-long-scrollable::-webkit-scrollbar-thumb { background: #2d3e5b; }
[data-theme="dark"] .card-long-scrollable::-webkit-scrollbar-thumb:hover { background: #455d85; }
[data-theme="dark"] .listing-cards-search input { background: #131a26; border-color: #243248; color: #f1f5f9; }
[data-theme="dark"] .listing-cards-search input:focus { border-color: var(--accent); }
[data-theme="dark"] .listing-cards-search button:hover { background: rgba(255,255,255,.1); color: #fff; }
[data-theme="dark"] .listing-cards-sort-group label,
[data-theme="dark"] .listing-cards-pagesize-group label { color: #94a3b8; }

@media (max-width: 760px) {
    .login-theme-toggle { top: 18px; right: 18px; }
}