/* ==========================================================================
   com_emserportal · views.css — vistas internas propias (FRONT-INTERIOR)
   Transparencia, Participa, Datos abiertos, Trámites, Sedes, Alertas,
   páginas sectoriales, Atención y Mapa del sitio. Usa los tokens de tpl_emser2026.
   ========================================================================== */

.em-view { min-width: 0; }

/* ------------------------------------------------------------ Transparencia */
.em-ita { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .em-ita { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.em-ita__cat { background: #fff; border-radius: 18px; padding: 18px 20px; box-shadow: var(--em-shadow-xs); }
.em-ita__cat.is-na { background: #f6f8f7; box-shadow: inset 0 0 0 1px var(--em-line-2); }
.em-ita__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.em-ita__icon {
  width: 42px; height: 42px; border-radius: 12px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--em-soft); color: var(--em-brand);
}
.em-ita__title { margin: 0; flex: 1 1 200px; font-size: 1.125rem; line-height: 1.3; }
.em-ita__title a { color: var(--em-ink); text-decoration: none; }
.em-ita__title a:hover { color: var(--em-brand); text-decoration: underline; }
.em-ita__num { font-family: var(--em-font-mono); font-weight: 400; color: var(--em-teal); margin-right: .35em; font-size: .9em; }
.em-ita__na { margin: 10px 0 0; font-size: var(--em-fs-sm); color: var(--em-ink-3); }
.em-ita__subs { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.em-ita__subs--deep { margin: 4px 0 4px 18px; border-left: 2px solid var(--em-line-2); padding-left: 8px; }
.em-ita__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; }
.em-ita__sub > a {
  flex: 1 1 220px; display: flex; gap: 8px; align-items: baseline; min-height: 40px; padding: 8px 10px;
  border-radius: 10px; color: var(--em-nav-ink); text-decoration: none; font-weight: 600; line-height: 1.35;
}
.em-ita__sub > a:hover { background: var(--em-soft); color: var(--em-brand); }
.em-ita__sub .em-ita__num { flex: none; min-width: 2.6em; }
.em-ita__meta { font-size: var(--em-fs-xs); color: var(--em-muted); font-weight: 700; }
.em-ita__sub.is-na > a { color: var(--em-ink-3); }

.em-tnode.is-na .em-pagehead__title { color: var(--em-ink-2); }
.em-tnode__desc { margin-bottom: 24px; }
.em-tnode__go { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; }
.em-tnode__more { margin-top: 14px; }
.em-na { flex-direction: column; gap: 6px; }
.em-na__title { display: flex; align-items: center; gap: 8px; }

.em-nodecards { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.em-nodecard {
  position: relative; display: flex; flex-direction: column; gap: 6px;
  background: #fff; border-radius: 14px; padding: 14px 16px; box-shadow: var(--em-shadow-xs);
}
.em-nodecard:focus-within { outline: 3px solid var(--em-focus); outline-offset: 2px; }
.em-nodecard.is-na { background: #f6f8f7; }
.em-nodecard__link { display: flex; gap: 8px; align-items: baseline; color: var(--em-ink); font-weight: 800; text-decoration: none; line-height: 1.3; }
.em-nodecard__link::after { content: ""; position: absolute; inset: 0; }
.em-nodecard__link:focus-visible { outline: none; }
.em-nodecard__link:hover .em-nodecard__title { color: var(--em-brand); text-decoration: underline; }
.em-nodecard__num { font-family: var(--em-font-mono); font-weight: 400; color: var(--em-teal); flex: none; }
.em-nodecard__meta { font-size: var(--em-fs-xs); font-weight: 700; color: var(--em-muted); }

.em-vigencias { margin: 0 0 22px; }
.em-vigencias__title { font-size: .78125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--em-muted); margin: 0 0 8px; }
.em-vigencias__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.em-vigencias__list .em-chip { min-width: 64px; justify-content: center; font-size: .8125rem; letter-spacing: .02em; }
.em-chip--history { background: #fff; box-shadow: inset 0 0 0 2px var(--em-line-2); }

.em-doclist__year { font-size: 1.0625rem; margin: 18px 0 8px; color: var(--em-ink-2); }
.em-doclist__item { align-items: flex-start; }
.em-doclist__item.is-featured { box-shadow: inset 4px 0 0 var(--em-brand), var(--em-shadow-xs); }
.em-doclist__title { text-decoration: none; }
a.em-doclist__title:hover { color: var(--em-brand); text-decoration: underline; }
.em-doclist__meta { display: flex; flex-wrap: wrap; gap: 2px 12px; margin: 4px 0 0; }
.em-doclist__note { margin: 6px 0 0; font-size: var(--em-fs-sm); color: var(--em-ink-3); }
.em-doclist__files { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.em-doclist__files a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: var(--em-fs-sm); }
.em-doclist__fmt { color: var(--em-ink-3); font-weight: 600; }

/* ---------------------------------------------------------------- Participa */
.em-areas { list-style: none; margin: 0; padding: 0; }
.em-area { padding: 18px 20px; gap: 8px; }
.em-area:focus-within { outline: 3px solid var(--em-focus); outline-offset: 3px; }
.em-area__icon {
  width: 46px; height: 46px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--pal-tint); color: var(--pal-ink);
}
.em-card__link { color: var(--em-ink); text-decoration: none; }
.em-card__link::after { content: ""; position: absolute; inset: 0; }
.em-card__link:focus-visible { outline: none; }
.em-area:hover .em-card__link { color: var(--pal-ink); }
.em-area__count { margin: auto 0 0; font-size: var(--em-fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--pal-ink); }
.em-participa__intro { margin-bottom: 28px; }

.em-proclist { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.em-proc { background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: var(--em-shadow-xs); border-top: 4px solid var(--pal-solid); display: flex; flex-direction: column; gap: 6px; }
.em-proc__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.em-proc__icon { color: var(--pal-ink); display: inline-flex; }
.em-proc__modality { font-size: var(--em-fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--pal-ink); flex: 1; }
.em-proc__title { margin: 0; font-size: 1.0625rem; line-height: 1.3; }
.em-proc__title a { color: var(--em-ink); }
.em-proc__summary { margin: 0; color: var(--em-ink-3); font-size: var(--em-fs-base); }
.em-proc__meta { margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: var(--em-fs-s); }
.em-proc__meta dt { font-weight: 800; color: var(--em-muted); }
.em-proc__meta dd { margin: 0; color: var(--em-ink); }

.em-pstatus {
  display: inline-flex; align-items: center; gap: 6px; border-radius: var(--em-pill); padding: 3px 10px;
  font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
}
.em-pstatus::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.em-pstatus--abierto { background: #e9f6ee; color: #04693c; }
.em-pstatus--cerrado { background: #eef1ef; color: #4f5f56; }
.em-pstatus--historico { background: #eaf1f6; color: #3a556b; }
.em-note .em-icon, .em-proceso .em-note .em-icon { vertical-align: -.2em; }
.em-figure { margin: 0 0 24px; }
.em-figure img { width: 100%; height: auto; border-radius: 18px; display: block; }

/* ----------------------------------------------------------------- Trámites */
.em-tramitecards { list-style: none; margin: 0; padding: 0; }
.em-tcard {
  position: relative; display: flex; gap: 14px; align-items: flex-start;
  background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: var(--em-shadow-xs);
  transition: transform .2s ease, box-shadow .2s ease;
}
.em-tcard:hover { transform: translateY(-2px); box-shadow: var(--em-shadow-m); }
.em-tcard:focus-within { outline: 3px solid var(--em-focus); outline-offset: 2px; }
.em-tcard__icon {
  width: 46px; height: 46px; border-radius: 13px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  background: var(--pal-tint); color: var(--pal-ink);
}
.em-tcard__body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.em-tcard__title { margin: 0; font-size: 1.03125rem; line-height: 1.3; }
.em-tcard__link { color: var(--em-ink); text-decoration: none; }
.em-tcard__link::after { content: ""; position: absolute; inset: 0; }
.em-tcard__link:focus-visible { outline: none; }
.em-tcard:hover .em-tcard__link { color: var(--pal-ink); }
.em-tcard__desc { margin: 0; color: var(--em-ink-3); font-size: var(--em-fs-base); line-height: 1.45; }
.em-tcard__meta { margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--em-fs-xs); font-weight: 800; color: var(--pal-ink); text-transform: uppercase; letter-spacing: .05em; }

/* ---------------------------------------------------------- Sedes y canales */
.em-emerg-box {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px;
  background: #fdeae5; border-radius: 18px; padding: 18px 22px; margin: 0 0 28px; border-left: 6px solid #a3311d;
}
.em-emerg-box > div { flex: 1 1 240px; }
.em-emerg-box__icon { color: #a3311d; display: inline-flex; }
.em-emerg-box__title { margin: 0 0 4px; font-size: 1.125rem; color: #5b1c10; }
.em-emerg-box p { margin: 0; color: #5b1c10; }
.em-emerg-box__call { font-size: 1.0625rem; }
.em-sede .em-card__body { gap: 10px; }
.em-sede.is-emergency { border-top: 4px solid #a3311d; }
.em-contactlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.em-contactlist li { display: flex; gap: 10px; align-items: flex-start; color: var(--em-ink-2); line-height: 1.45; }
.em-contactlist li > .em-icon { color: var(--em-brand); margin-top: .15em; }
.em-sede__notes { margin: 0; font-size: var(--em-fs-sm); color: var(--em-ink-3); }
.em-lines { list-style: none; margin: 0 0 20px; padding: 0; }
.em-line { display: flex; flex-direction: column; gap: 4px; background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: var(--em-shadow-xs); }
.em-line__icon { color: var(--em-brand); }
.em-line__label { font-size: var(--em-fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--em-muted); }
.em-line__value { font-weight: 800; font-size: 1.0625rem; overflow-wrap: anywhere; }
.em-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.em-social__link {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px;
  border-radius: var(--em-pill); background: #fff; box-shadow: var(--em-shadow-xs); font-weight: 700; text-decoration: none; color: var(--em-ink);
}
.em-social__link:hover { background: var(--em-soft); color: var(--em-brand); }

/* ------------------------------------------------------------------ Alertas */
.em-alertlist { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.em-alert {
  background: var(--al-bg, #fff); color: var(--al-ink, var(--em-ink));
  border-radius: 16px; padding: 16px 18px; border-left: 6px solid var(--al-chip, var(--em-brand));
}
.em-alert.is-resuelto, .em-alert.is-vencido { background: #fff; box-shadow: var(--em-shadow-xs); }
.em-alert__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 8px; }
.em-alert__chip {
  display: inline-flex; align-items: center; gap: 6px; border-radius: var(--em-pill); padding: 4px 10px;
  background: var(--al-chip, var(--em-brand)); color: #fff; font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
}
.em-alert__service { font-weight: 800; font-size: var(--em-fs-sm); }
.em-alert__status { margin-left: auto; font-size: var(--em-fs-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.em-alert__title { margin: 0 0 6px; font-size: 1.125rem; line-height: 1.3; }
.em-alert__title a { color: inherit; }
.em-alert__body { margin: 0 0 8px; }
.em-alert__meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: var(--em-fs-sm); }
.em-alert__meta dt { font-weight: 800; display: inline; }
.em-alert__meta dt::after { content: ": "; }
.em-alert__meta dd { margin: 0; display: inline; }
.em-alert__cta { margin: 12px 0 0; }
.em-alerta__more { margin-top: 18px; }

/* -------------------------------------------------------- Página sectorial */
.em-status { display: block; background: #fff; border-radius: 18px; padding: 20px 22px; margin: 0 0 28px; box-shadow: var(--em-shadow-xs); border-left: 6px solid currentColor; }
.em-status__title { margin: 0 0 8px; font-size: .78125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--em-muted); }
.em-status__state { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-size: 1.25rem; }
.em-status__detail { margin: 0 0 6px; color: var(--em-ink-2); font-weight: 500; }
.em-status__updated, .em-status__report { margin: 0; font-size: var(--em-fs-sm); color: var(--em-ink-3); font-weight: 500; }
.em-status__report { margin-top: 6px; }
.em-servicio__desc { margin-bottom: 28px; }
.em-newscards { list-style: none; margin: 0 0 14px; padding: 0; }
.em-card__pic, .em-figure picture { display: block; }
.em-newscard .em-card__media { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.em-newscard:focus-within { outline: 3px solid var(--em-focus); outline-offset: 3px; }
.em-newscard p { margin: 0; color: var(--em-ink-3); font-size: var(--em-fs-base); }

/* ---------------------------------------------------------------- Atención */
.em-actioncards { list-style: none; margin: 0; padding: 0; }
.em-actioncard {
  position: relative; display: flex; flex-direction: column; gap: 8px;
  background: var(--pal-tint); border-radius: 18px; padding: 18px 20px; min-height: 160px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.em-actioncard:hover { transform: translateY(-3px); box-shadow: 0 14px 30px var(--pal-glow, rgba(0, 0, 0, .12)); }
.em-actioncard:focus-within { outline: 3px solid var(--em-focus); outline-offset: 3px; }
.em-actioncard__icon {
  width: 48px; height: 48px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--pal-deep); color: #fff;
}
.em-actioncard__title { margin: 0; font-size: 1.125rem; line-height: 1.25; }
.em-actioncard__link { color: var(--pal-ink); text-decoration: none; }
.em-actioncard__link::after { content: ""; position: absolute; inset: 0; }
.em-actioncard__link:focus-visible { outline: none; }
.em-actioncard__desc { margin: 0; color: var(--em-ink-2); font-size: var(--em-fs-base); }
.em-actioncard__cta { margin: auto 0 0; font-weight: 800; color: var(--pal-ink); font-size: var(--em-fs-sm); }
.em-pqrsd { list-style: none; margin: 0; padding: 0; }
.em-pqrsd .em-card__title { display: flex; align-items: center; gap: 8px; }
.em-pqrsd .em-card__title .em-icon { color: var(--em-brand); }
.em-menugroups { align-items: start; }
.em-menugroup { background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: var(--em-shadow-xs); margin: 0; }
.em-menugroup__title { margin: 0 0 8px; font-size: .78125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--em-brand); }
.em-menugroup ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.em-menugroup li a { display: flex; align-items: center; min-height: 40px; padding: 6px 4px; font-weight: 600; }
.em-at-search .em-tsearch { margin-bottom: 14px; }

/* ---------------------------------------------------------- Mapa del sitio */
.em-sitemap__grid { display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .em-sitemap__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.em-sitemap__block { background: #fff; border-radius: 18px; padding: 18px 22px; box-shadow: var(--em-shadow-xs); }
.em-sitemap__block > h2 { font-family: var(--em-font-display); font-size: 1.375rem; margin: 0 0 12px; }
.em-sitemap__list { list-style: none; margin: 0; padding: 0; }
.em-sitemap__list li { margin: 4px 0; }
.em-sitemap__list a { display: inline-flex; min-height: 32px; align-items: center; font-weight: 600; }
.em-sitemap__list .em-sitemap__list { margin: 2px 0 6px 14px; padding-left: 12px; border-left: 2px solid var(--em-line-2); }
.em-sitemap__list--d0 > li > a, .em-sitemap__list--d0 > li > .em-sitemap__heading { font-weight: 800; }
.em-sitemap__heading { display: inline-block; margin-top: 6px; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--em-muted); }
.em-sitemap__list--ita { list-style: none; }

/* ------------------------------------------------------------ preferencias */
html[data-em-contrast="high"] .em-ita__cat, html[data-em-contrast="high"] .em-tcard, html[data-em-contrast="high"] .em-proc,
html[data-em-contrast="high"] .em-alert, html[data-em-contrast="high"] .em-nodecard, html[data-em-contrast="high"] .em-sitemap__block,
html[data-em-contrast="high"] .em-line, html[data-em-contrast="high"] .em-actioncard, html[data-em-contrast="high"] .em-menugroup {
  border: 2px solid currentColor; box-shadow: none;
}
@media (prefers-reduced-motion: reduce) { .em-tcard, .em-actioncard { transition: none; } .em-tcard:hover, .em-actioncard:hover { transform: none; } }
html[data-em-motion="off"] .em-tcard:hover, html[data-em-motion="off"] .em-actioncard:hover { transform: none; }

/* Alto contraste: chip activo (filtros de trámites, vigencias) en blanco sobre negro; supera la regla de enlaces de a11y.css. */
html[data-em-contrast="high"] main a.em-chip:is(.is-active, [aria-current]):not(#em-cx):not(#em-cy) { background: #000 !important; color: #fff !important; }
html[data-em-contrast="high"] main a.em-chip:is(.is-active, [aria-current]):not(#em-cx):not(#em-cy) .em-chip__n { background: #fff !important; color: #000 !important; }