/** ./src/css/intranet-dashboard.css */

/* =====================================================
   19. TABLAS Y CARDS DE DASHBOARD
===================================================== */
.dashboard-subtitle {
  margin: 0 0 4px;
  font-size: var(--font-size-sm);
  font-weight: 600;
}

/* =====================================================
   24. DASHBOARD SHELL / ASIDE / NAVEGACIÓN INTERNA
===================================================== */
.ena-dash-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ena-dash-shell .page-wrapper {
  margin: 0;
  padding: 0;
}

.ena-dash-shell .ena-dashboard-split-layout .ena-dashboard-split-layout__aside .doc-grid,
.ena-dash-shell .home-two-column .home-col-right .doc-grid {
  grid-template-columns: 1fr;
}

.ena-dash-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ena-dash-title {
  margin: 0;
  font-size: var(--font-size-2xl);
  font-weight: 650;
}

.ena-dash-subtitle {
  max-width: 820px;
  font-size: var(--font-size-sm);
  color: var(--text-muted);
}

.ena-dash-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.ena-dash-aside {
  position: sticky;
  top: 76px;
  align-self: start;
}

.ena-dash-main {
  min-width: 0;
}

.ena-dash-nav {
  padding: 12px;
  border-radius: var(--border-radius-md);
  background: var(--bg-surface);
}

.ena-dash-nav__group + .ena-dash-nav__group {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-soft-2);
}

.ena-dash-nav__title {
  margin-bottom: 8px;
  font-size: var(--font-size-2xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ena-dash-nav__list {
  list-style: none;
  display: grid;
  gap: 0;
  padding: 0;
  margin: 0;
}

.ena-dash-nav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px;
  border-radius: 6px;
  background: var(--bg-surface);
  font-size: var(--font-size-sm);
  text-decoration: none;
}

.ena-dash-nav__link:hover span {
  border-color: var(--border-color);
  color: var(--en-green);
}

.ena-dash-nav__link.is-active {
  border-color: var(--en-green);
  background: var(--en-green);
  color: var(--en-white);
}

.ena-dash-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  font-size: var(--font-size-2xs);
  background: var(--bg-surface);
  color: var(--en-black);
}

.ena-dash-nav__link.is-active .ena-dash-badge {
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.18);
  color: var(--en-white);
}

.ena-dash-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex: 0 0 18px;
}

.ena-dash-nav__icon-img {
  display: block;
  width: 32px;
  height: 32px;
}

.ena-dash-nav__label {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 600;
  color: var(--text-muted);
}

.ena-dash-nav__link.is-active .ena-dash-nav__label {
  color: var(--en-white);
}
/* =====================================================
   SIDEBAR ACCORDION
   Scoped to .ena-dash-nav.
===================================================== */

.ena-dash-nav .enernav-sidebar-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
  padding: 0 0 8px;
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: var(--font-size-2xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  appearance: none;
}

.ena-dash-nav .enernav-sidebar-accordion__trigger:hover {
  color: var(--en-green);
}
.ena-dash-nav .enernav-sidebar-accordion.is-open .enernav-sidebar-accordion__trigger {
  color: var(--en-green);
}

.ena-dash-nav .enernav-sidebar-accordion__trigger:focus-visible {
  outline: 2px solid var(--en-blue);
  outline-offset: 2px;
  border-radius: 4px;
}

.ena-dash-nav .enernav-sidebar-accordion__label {
  min-width: 0;
}

.ena-dash-nav .enernav-sidebar-accordion__indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  font-size: 10px;
  line-height: 1;
}

.ena-dash-nav .enernav-sidebar-accordion__indicator::after {
  content: '▾';
}

.ena-dash-nav .enernav-sidebar-accordion.is-open .enernav-sidebar-accordion__indicator {
  transform: rotate(180deg);
}

.ena-dash-nav .enernav-sidebar-accordion__panel {
  display: block;
}

.ena-dash-nav .enernav-sidebar-accordion__panel[hidden] {
  display: none !important;
}

.ena-dash-nav .enernav-sidebar-accordion:not(.is-open) .enernav-sidebar-accordion__panel {
  display: none;
}

.ena-dash-nav .enernav-sidebar-accordion.is-open .enernav-sidebar-accordion__panel {
  display: block;
}

.ena-dash-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 0;
}

.ena-dash-tab {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--border-color);
  font-size: var(--font-size-xs);
  background: var(--bg-surface);
}

.ena-dash-tab.is-active {
  background: var(--en-blue);
  border-color: var(--en-blue);
  color: var(--en-white);
}


/* Mi Panel module page layout helpers.
   Scoped to dashboard module pages only. */
.ena-dash-content{
  display: grid;
  gap: 1rem;
}
.ena-dash-content .ena-dashboard-module {
  display: grid;
  gap: 18px;

}
.ena-dashboard-module {
  background-color: var(--en-white);
  padding: 1rem;
  border-radius: var(--border-radius-md);
}

@media (max-width: 860px) {
  .ena-dash-content .ena-dashboard-module {
    gap: 14px;
  }
}

/* Mi Panel requests layout helpers.
   Scoped to the requests dashboard module only. */
.ena-dash-content .ena-requests__section-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}

.ena-dash-content .ena-requests__section-actions,
.ena-dash-content .ena-requests__row-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ena-dash-content .ena-requests__table-wrap {
  margin-top: 14px;
}

.ena-dash-content .ena-requests__field-change {
  margin-bottom: 6px;
}

@media (max-width: 860px) {
  .ena-dash-content .ena-requests__section-header,
  .ena-dash-content .ena-requests__section-actions,
  .ena-dash-content .ena-requests__section-actions .button {
    width: 100%;
  }

  .ena-dash-content .ena-requests__section-actions .button {
    justify-content: center;
  }
}

/* ─────────────────────────────────────────────────────────
   Dashboard notices
   Scoped to .ena-notices.
   ───────────────────────────────────────────────────────── */

.ena-dash-content .ena-notices {
  display: grid;
  gap: 1rem;
}

.ena-dash-content .ena-dashboard-module .enernav-view-switch {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border-soft-2);
}

.ena-dash-content .ena-dashboard-module .enernav-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 13px;
  border: 1px solid var(--border-soft-3);
  border-radius: 999px;
  background: var(--bg-surface-muted);
  color: var(--text-muted-strong);
  font-size: var(--font-size-xs);
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

.ena-dash-content .ena-dashboard-module .enernav-pill:hover {
  border-color: var(--en-blue);
  background: rgba(0, 123, 188, 0.06);
  color: var(--en-blue);
}

.ena-dash-content .ena-dashboard-module .enernav-pill.is-active {
  border-color: var(--en-blue);
  background: var(--en-blue);
  color: var(--en-white);
}

.ena-dash-content .ena-dashboard-module .enernav-pill .ena-dash-badge {
  min-width: 20px;
  height: 18px;
  padding: 0 6px;
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.18);
  color: inherit;
}

.ena-dash-content .ena-notices__item-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ena-dash-content .ena-notices__panel {
  gap: 0;
  background: var(--bg-surface);
  border-color: var(--border-soft);
  box-shadow: var(--shadow-soft);
}

.ena-dash-content .ena-notices__panel.is-empty {
  padding: 10px 14px;
  border-style: dashed;
  background: var(--bg-surface-muted);
  box-shadow: none;
}

.ena-dash-content .ena-notices__panel .ena-hero-panel-kicker {
  margin: 0 0 8px;
  font-weight: 700;
}

.ena-dash-content .ena-notices__panel .ena-hero-news-item {
  padding: 10px 0;
  border-top: 1px solid var(--border-soft-2);
}

.ena-dash-content .ena-notices__panel .ena-hero-news-item:first-of-type {
  padding-top: 0;
  border-top: none;
}

.ena-dash-content .ena-notices__panel .ena-hero-news-item.is-unread .ena-hero-news-title {
  font-weight: 700;
}

.ena-dash-content .ena-notices__panel .ena-hero-news-item form {
  display: inline-block;
  margin: 5px 0 0;
  padding: 0;
}

.ena-dash-content .ena-notices__pending {
  border-color: var(--status-yellow-border);
  background: var(--status-yellow-bg);
  color: var(--status-yellow-text);
}

.ena-dash-content .ena-notices__button {
  display: inline-block;
  padding: 4px 11px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: var(--bg-surface);
  color: var(--text-soft);
  cursor: pointer;
  font-family: inherit;
  font-size: var(--font-size-2xs);
  line-height: 1.4;
  appearance: none;
  -webkit-appearance: none;
}

.ena-dash-content .ena-notices__button:hover {
  border-color: var(--en-blue);
  background: var(--en-blue);
  color: var(--en-white);
}

.ena-dash-content .ena-notices__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border-soft-2);
}

.ena-dash-content .ena-notices__pagination-link {
  display: inline-block;
  padding: 4px 11px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: var(--bg-surface);
  color: var(--en-blue);
  font-size: var(--font-size-2xs);
  line-height: 1.4;
  text-decoration: none;
}

.ena-dash-content .ena-notices__pagination-link:hover {
  border-color: var(--en-blue);
  background: var(--en-blue);
  color: var(--en-white);
}

.ena-dash-content .ena-notices__pagination-link.is-disabled {
  opacity: 0.4;
  pointer-events: none;
  cursor: default;
  color: var(--text-muted);
}

.ena-dash-content .ena-notices__pagination-info {
  font-size: var(--font-size-2xs);
  color: var(--text-muted);
}

@media (max-width: 600px) {
  .ena-dash-content .ena-dashboard-module .enernav-view-switch {
    gap: 6px;
  }

  .ena-dash-content .ena-dashboard-module .enernav-pill {
    min-height: 32px;
    padding: 7px 11px;
  }

  .ena-dash-content .ena-notices__button {
    display: block;
    width: max-content;
    margin-top: 6px;
  }

  .ena-dash-content .ena-notices__panel {
    padding: 10px 12px;
  }

  .ena-dash-content .ena-notices__pagination {
    gap: 8px;
  }
}

/* Mi Panel vacations layout helpers.
   Scoped to the dashboard vacations module only. */
.ena-dash-content .ena-vacations__history-source-note {
  margin-top: 12px;
}

/* Mi Panel profile layout helpers.
   Scoped to the profile dashboard module only. */
.ena-dash-content .ena-profile__current-box {
  margin-bottom: 14px;
}

.ena-dash-content .ena-profile__current-actions {
  margin-top: 10px;
}

.ena-dash-content .ena-profile__request-form {
  max-width: 980px;
}

.ena-dash-content .ena-profile__request-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.ena-dash-content .ena-profile__request-field--full {
  grid-column: 1 / -1;
}

.ena-dash-content .ena-profile__request-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
}

@media (max-width: 860px) {
  .ena-dash-content .ena-profile__request-grid {
    grid-template-columns: 1fr;
  }

  .ena-dash-content .ena-profile__request-actions,
  .ena-dash-content .ena-profile__request-actions .button {
    width: 100%;
  }

  .ena-dash-content .ena-profile__request-actions .button {
    justify-content: center;
  }
}

/* Mi Panel IT support layout helpers.
   Scoped to the IT support dashboard module only. */
.ena-dash-content .ena-it-support__template-box,
.ena-dash-content .ena-it-support__template-empty {
  margin-top: 14px;
}

.ena-dash-content .ena-it-support__template-actions {
  margin-top: 10px;
}

.ena-dash-content .ena-it-support__template-type {
  margin-top: 8px;
}

.ena-dash-content .ena-it-support__form-panel-header,
.ena-dash-content .ena-it-support__tickets-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}

.ena-dash-content .ena-it-support__form-panel-header {
  align-items: flex-start;
}

.ena-dash-content .ena-it-support__form-panel-actions,
.ena-dash-content .ena-it-support__tickets-header-actions,
.ena-dash-content .ena-it-support__scope-filters,
.ena-dash-content .ena-it-support__status-filters,
.ena-dash-content .ena-it-support__ticket-row-actions,
.ena-dash-content .ena-it-support__panel-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ena-dash-content .ena-it-support__ticket-form {
  margin-top: 14px;
}

.ena-dash-content .ena-it-support__ticket-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  max-width: 980px;
}

.ena-dash-content .ena-it-support__ticket-form-field--full {
  grid-column: 1 / -1;
}

.ena-dash-content .ena-it-support__inline-note,
.ena-dash-content .ena-it-support__panel-actions {
  margin-top: 12px;
}

.ena-dash-content .ena-it-support__tickets-table-wrap {
  margin-top: 14px;
}

.ena-dash-content .ena-it-support__scope-filters {
  margin-top: 14px;
  margin-bottom: 14px;
}

.ena-dash-content .ena-it-support__status-filters {
  margin-bottom: 14px;
}

/* Ticket table: fixed layout with explicit column widths.
   8-column view (no Gestión): 1485 px total.
   9-column management view: 1735 px total.
   The wrapper's overflow-x: auto handles scrolling on narrower viewports. */
.ena-dash-content .ena-it-support__tickets-table {
  table-layout: fixed;
  width: 1485px;
}

.ena-dash-content .ena-it-support__tickets-table--manageable {
  width: 1735px;
}

/* Column widths via <colgroup> + <col> classes. */
.ena-dash-content .ena-it-support__col-date       { width: 105px; }
.ena-dash-content .ena-it-support__col-requester  { width: 210px; }
.ena-dash-content .ena-it-support__col-ticket     { width: 340px; }
.ena-dash-content .ena-it-support__col-type       { width: 185px; }
.ena-dash-content .ena-it-support__col-priority   { width: 100px; }
.ena-dash-content .ena-it-support__col-status     { width: 125px; }
.ena-dash-content .ena-it-support__col-evidence   { width: 135px; }
.ena-dash-content .ena-it-support__col-response   { width: 285px; }
.ena-dash-content .ena-it-support__col-management { width: 250px; }

/* Body cells: top-aligned. overflow-wrap: anywhere prevents unbreakable
   content (long URLs, filenames) from escaping fixed-width cell boundaries. */
.ena-dash-content .ena-it-support__tickets-table tbody td {
  vertical-align: top;
  overflow-wrap: anywhere;
}

/* Requester email displayed as a block so it wraps on its own line. */
.ena-dash-content .ena-it-support__col-requester .enernav-table-meta {
  display: block;
}

/* Gestión cell form: grid stack so select, input, and button each fill the
   full column width and are never clipped. Overrides the shared flex rule. */
.ena-dash-content .ena-it-support__ticket-row-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.ena-dash-content .ena-it-support__ticket-row-actions .enernav-form-inline-select,
.ena-dash-content .ena-it-support__ticket-row-actions .enernav-form-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

@media (max-width: 860px) {
  .ena-dash-content .ena-it-support__ticket-form-grid {
    grid-template-columns: 1fr;
  }

  .ena-dash-content .ena-it-support__form-panel-header,
  .ena-dash-content .ena-it-support__tickets-header,
  .ena-dash-content .ena-it-support__form-panel-actions,
  .ena-dash-content .ena-it-support__tickets-header-actions,
  .ena-dash-content .ena-it-support__scope-filters,
  .ena-dash-content .ena-it-support__status-filters,
  .ena-dash-content .ena-it-support__panel-actions,
  .ena-dash-content .ena-it-support__form-panel-actions .button,
  .ena-dash-content .ena-it-support__tickets-header-actions .button,
  .ena-dash-content .ena-it-support__scope-filters .button,
  .ena-dash-content .ena-it-support__status-filters .button,
  .ena-dash-content .ena-it-support__panel-actions .button {
    width: 100%;
  }

  .ena-dash-content .ena-it-support__form-panel-actions .button,
  .ena-dash-content .ena-it-support__tickets-header-actions .button,
  .ena-dash-content .ena-it-support__scope-filters .button,
  .ena-dash-content .ena-it-support__status-filters .button,
  .ena-dash-content .ena-it-support__panel-actions .button {
    justify-content: center;
  }
}

/* Mi Panel overview layout helpers.
   Scoped to the dashboard overview/router only. */
.ena-dash-content .ena-dashboard-overview__intro-note {
  margin-top: 6px;
}

.ena-dash-content .ena-dashboard-overview__quick-grid,
.ena-dash-content .ena-dashboard-overview__pending-panel {
  margin-top: 14px;
}

.ena-dash-content .ena-dashboard-overview__quick-actions,
.ena-dash-content .ena-dashboard-overview__pending-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ena-dash-content .ena-dashboard-overview__pending-actions {
  margin-top: 12px;
}

@media (max-width: 860px) {
  .ena-dash-content .ena-dashboard-overview__quick-actions,
  .ena-dash-content .ena-dashboard-overview__pending-actions,
  .ena-dash-content .ena-dashboard-overview__quick-actions .button,
  .ena-dash-content .ena-dashboard-overview__pending-actions .button {
    width: 100%;
  }

  .ena-dash-content .ena-dashboard-overview__quick-actions .button,
  .ena-dash-content .ena-dashboard-overview__pending-actions .button {
    justify-content: center;
  }
}

/* Mi Panel IT support inline controls.
   Scoped to the IT support dashboard module only. */
.ena-dash-content .ena-it-support__inline-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Dashboard KPI row.
   Scoped to dashboard modules only. */
.ena-dash-content .ena-dashboard-kpi-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

/* Dashboard split layout.
   Scoped to dashboard modules only. */
.ena-dash-content .ena-dashboard-split-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
  gap: 20px;
}

.ena-dash-content .ena-dashboard-split-layout--stack {
  padding-bottom: 1rem;
  align-items: flex-start;
}

.ena-dash-content .ena-dashboard-split-layout__main {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ena-dash-content .ena-dashboard-split-layout__aside {
  padding-left: 19px;
  border-left: 1px solid var(--en-gray);
}

/* =====================================================
   PHASE 13 RESPONSIVE CONTAINMENT - DASHBOARD SHELL

   Prevents dashboard module cards from inheriting the min-content width
   of wide tables when the dashboard layout collapses on tablet/mobile.
===================================================== */

.ena-dash-shell,
.ena-dash-layout,
.ena-dash-main,
.ena-dash-content,
.ena-dash-content > *,
.ena-dashboard-module,
.ena-dash-content .ena-dashboard-module,
.ena-dash-content .ena-dashboard-split-layout,
.ena-dash-content .ena-dashboard-split-layout__main,
.ena-dash-content .ena-dashboard-split-layout__aside,
.ena-dash-content .ena-dashboard-kpi-row {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.ena-dash-content,
.ena-dashboard-module,
.ena-dash-content .ena-dashboard-module {
  width: 100%;
}

.ena-dash-content .enernav-table-wrap,
.ena-dash-content .enernav-table-wrap--plain {
  max-width: 100%;
}

@media (max-width: 960px) {
  .ena-dash-content {
    min-width: 0;
    max-width: 100%;
  }

  .ena-dash-content > * {
    min-width: 0;
    max-width: 100%;
  }
}