/* Dashboard analítico: lectura rápida, color por significado y buen contraste. */
.dashboard-page .portal-heading { margin-bottom: var(--ft-space-5); }
.dashboard-page .portal-heading-split > form { min-width: 14rem; }
.dashboard-page .portal-heading-split > form .form-select { font-weight: 600; }
.dashboard-filter-bar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto auto; gap: var(--ft-space-3); align-items: end; margin-bottom: var(--ft-space-3); padding: var(--ft-space-4); border: 1px solid var(--ft-border); border-radius: var(--ft-radius-md); background: rgba(255,255,255,.84); box-shadow: var(--ft-shadow-soft); }
.dashboard-filter-bar label { display: block; margin-bottom: .3rem; color: var(--ft-text-muted); font-size: var(--ft-font-xs); font-weight: 650; text-transform: uppercase; }
.dashboard-filter-bar .form-control, .dashboard-filter-bar .form-select { min-height: 2.55rem; font-size: var(--ft-font-sm); }
.dashboard-filter-bar .btn-app, .dashboard-filter-bar .btn-app-ghost { white-space: nowrap; }
.dashboard-generated { margin: 0 0 var(--ft-space-4); color: var(--ft-text-muted); font-size: var(--ft-font-xs); text-align: right; }
.dashboard-error { display: grid; gap: .25rem; margin-bottom: var(--ft-space-4); padding: var(--ft-space-4); border: 1px solid #f1c5bd; border-radius: var(--ft-radius-md); color: #8c3f36; background: var(--ft-peach-100); }
.dynamic-dashboard-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--ft-space-4); align-items: stretch; }
.dynamic-widget { grid-column: span min(var(--widget-width), 12); min-width: 0; animation: portal-fade-up .42s ease both; }
.dynamic-widget:nth-child(2) { animation-delay: .05s; }
.dynamic-widget:nth-child(3) { animation-delay: .1s; }
.dynamic-widget:nth-child(4) { animation-delay: .15s; }
.dynamic-widget:nth-child(5) { animation-delay: .2s; }
.dynamic-widget:nth-child(6) { animation-delay: .25s; }
.dashboard-kpi, .dashboard-chart-card, .dashboard-table-card, .dashboard-alert-card { height: 100%; margin: 0; padding: var(--ft-space-5); border: 1px solid var(--ft-border); border-radius: var(--ft-radius-md); background: rgba(255,255,255,.92); box-shadow: var(--ft-shadow-soft); }
.dashboard-kpi, .dashboard-chart-card, .dashboard-table-card, .dashboard-alert-card { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.dashboard-kpi:hover, .dashboard-chart-card:hover, .dashboard-table-card:hover, .dashboard-alert-card:hover { border-color: rgba(52,120,189,.25); box-shadow: var(--ft-shadow-raised); transform: translateY(-3px); }
.dashboard-kpi { position: relative; display: flex; min-height: 9.2rem; flex-direction: column; border-top: 4px solid var(--ft-blue-500); background: linear-gradient(145deg, #fff, var(--ft-sky-100)); overflow: hidden; }
.dashboard-kpi::after { position: absolute; right: -2.5rem; bottom: -3.5rem; width: 8rem; height: 8rem; border-radius: 50%; background: rgba(52,120,189,.08); content: ""; transition: transform .25s ease; }
.dashboard-kpi:hover::after { transform: scale(1.28); }
.dashboard-kpi > span { color: var(--ft-text-secondary); font-size: var(--ft-font-xs); font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.dashboard-kpi > strong { margin: auto 0 .35rem; color: var(--ft-brown-900); font-size: 2.25rem; line-height: 1; }
.dashboard-kpi > strong small { font-size: .8rem; }
.dashboard-status-success { border-top-color: var(--ft-green-600); background: linear-gradient(145deg, #fff, var(--ft-green-100)); }
.dashboard-status-warning { border-top-color: var(--ft-warning-600); background: linear-gradient(145deg, #fff, var(--ft-gold-100)); }
.dashboard-status-danger { border-top-color: var(--ft-red-600); background: linear-gradient(145deg, #fff, var(--ft-peach-100)); }
.dashboard-kpi > small { color: var(--ft-text-muted); font-size: var(--ft-font-xs); }
.dashboard-chart-card h2, .dashboard-table-card h2, .dashboard-alert-card h2 { margin: 0 0 var(--ft-space-4); color: var(--ft-brown-900); font-size: var(--ft-font-md); font-weight: 650; }
.dashboard-horizontal-bars { display: grid; gap: var(--ft-space-4); }
.dashboard-horizontal-bar { position: relative; display: grid; gap: .4rem; }
.dashboard-horizontal-bar-label { display: flex; justify-content: space-between; gap: 1rem; color: var(--ft-text); font-size: var(--ft-font-sm); }
.dashboard-horizontal-bar-label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-horizontal-bar-label strong { flex: none; font-size: var(--ft-font-xs); }
.dashboard-horizontal-bar-track { height: .6rem; overflow: hidden; border-radius: 999px; background: #edf1f7; }
.dashboard-horizontal-bar-track i { display: block; height: 100%; min-width: .25rem; border-radius: inherit; background: linear-gradient(90deg, var(--ft-blue-500), #72c2d2); transform-origin: left center; animation: portal-bar-grow .65s cubic-bezier(.2,.8,.2,1) both; }
.dashboard-horizontal-bar > a { justify-self: start; color: var(--ft-blue-600); font-size: var(--ft-font-xs); font-weight: 650; text-decoration: none; }
.dashboard-empty { margin: 1.5rem 0; color: var(--ft-text-muted); text-align: center; }
.dashboard-trend { display: grid; grid-template-columns: repeat(var(--points), minmax(1.8rem, 1fr)); gap: .4rem; min-height: 13rem; overflow-x: auto; }
.dashboard-trend-point { display: grid; grid-template-rows: 11rem auto; gap: .4rem; min-width: 1.8rem; text-align: center; }
.dashboard-trend-bars { display: flex; align-items: end; justify-content: center; gap: 3px; border-bottom: 1px solid var(--ft-border); }
.dashboard-trend-bars i { display: block; width: 38%; min-height: 2px; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #72c2d2, var(--ft-blue-600)); transform-origin: bottom center; animation: portal-bar-grow .7s cubic-bezier(.2,.8,.2,1) both; }
.dashboard-trend-bars .series-1 { background: linear-gradient(180deg, #a8d993, var(--ft-green-600)); }
.dashboard-trend-point small { color: var(--ft-text-muted); font-size: .67rem; }
.dashboard-legend { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: var(--ft-space-3); color: var(--ft-text-muted); font-size: var(--ft-font-xs); }
.dashboard-legend span::before { display: inline-block; width: .65rem; height: .65rem; margin-right: .3rem; border-radius: 2px; background: var(--ft-blue-500); content: ""; }
.dashboard-legend .series-1::before { background: var(--ft-green-600); }
.dashboard-distribution { display: grid; gap: var(--ft-space-3); }
.dashboard-distribution > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .65rem; align-items: center; color: var(--ft-text-secondary); font-size: var(--ft-font-sm); }
.dashboard-distribution > div > div { grid-column: 1 / -1; height: .55rem; overflow: hidden; border-radius: 99px; background: #edf1f7; }
.dashboard-distribution b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #8f78df, #c5a9ed); }
.dashboard-table-card { overflow: hidden; }
.dashboard-table-card table { margin: 0; color: var(--ft-text); font-size: var(--ft-font-xs); }
.dashboard-table-card th { color: var(--ft-text-secondary); font-weight: 650; white-space: nowrap; }
.dashboard-table-card th small { display: block; color: var(--ft-text-muted); font-weight: 500; }
.dashboard-table-card th a { color: var(--ft-brown-900); text-decoration: none; }
.dashboard-table-card th a:hover { color: var(--ft-blue-600); }
.dashboard-alert-list { display: grid; gap: var(--ft-space-3); }
.dashboard-alert { display: grid; grid-template-columns: auto 1fr; gap: var(--ft-space-3); padding: var(--ft-space-3); border-radius: var(--ft-radius-sm); background: var(--ft-surface-soft); }
.dashboard-alert > span { width: .65rem; height: .65rem; margin-top: .25rem; border-radius: 50%; background: var(--ft-blue-500); box-shadow: 0 0 0 4px rgba(52,120,189,.12); }
.dashboard-alert-warning > span { background: var(--ft-warning-600); box-shadow: 0 0 0 4px rgba(169,108,30,.12); }
.dashboard-alert-danger > span { background: var(--ft-red-600); box-shadow: 0 0 0 4px rgba(185,74,72,.12); }
.dashboard-alert-success > span { background: var(--ft-green-600); box-shadow: 0 0 0 4px rgba(55,132,90,.12); }
.dashboard-alert strong { color: var(--ft-text); font-size: var(--ft-font-sm); }
.dashboard-alert strong b { padding: .1rem .35rem; border-radius: 99px; background: var(--ft-gold-100); }
.dashboard-alert p { margin: .2rem 0 0; color: var(--ft-text-muted); font-size: var(--ft-font-xs); line-height: 1.45; }
@keyframes portal-fade-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes portal-bar-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes portal-soft-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(169,108,30,.12); } 50% { box-shadow: 0 0 0 5px rgba(169,108,30,0); } }
.dashboard-status-warning { animation: portal-fade-up .42s ease both, portal-soft-pulse 2.8s ease-in-out 1.1s 2; }
@media (max-width: 1100px) { .dashboard-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dynamic-widget { grid-column: span 6; } .dynamic-widget-kpi { grid-column: span 4; } }
@media (max-width: 767.98px) { .dashboard-page .portal-heading-split { display: grid; gap: var(--ft-space-4); } .dashboard-page .portal-heading-split > form { min-width: 0; } .dashboard-filter-bar { grid-template-columns: 1fr; } .dynamic-widget, .dynamic-widget-kpi { grid-column: 1 / -1; } .dashboard-generated { text-align: left; } .dashboard-kpi { min-height: 8rem; } }
@media (prefers-reduced-motion: reduce) { .dynamic-widget, .dashboard-status-warning, .dashboard-horizontal-bar-track i, .dashboard-trend-bars i { animation: none; } .dashboard-kpi, .dashboard-chart-card, .dashboard-table-card, .dashboard-alert-card { transition: none; } }