/*
 * Eleon Recently Updated 2.0
 * Matches Eleon Most Viewed visual language.
 */

[data-eleon-recently-updated-plugin]{
  padding:15px 16px;
  border:1px solid var(--eleon-card-border,var(--helios-border,#303640));
  border-radius:12px;
  background:var(--eleon-card-bg,var(--helios-card,#17191e));
  color:var(--eleon-text,inherit);
  box-shadow:none;
}

.eru-head{
  display:flex;
  align-items:center;
  min-height:30px;
  margin-bottom:3px;
  padding:0 0 10px;
  border-bottom:1px solid var(--eleon-soft,rgba(225,229,236,.08));
}

.eru-head strong{
  color:var(--eleon-text,inherit);
  font-size:14px;
  font-weight:800;
}

.eru-list{
  display:grid;
}

.eru-row{
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:8px 0;
  border-top:1px solid var(--eleon-soft,rgba(225,229,236,.08));
  background:transparent;
}

.eru-row:first-child{
  border-top:0;
}

.eru-rank{
  color:var(--eleon-accent,var(--helios-accent,#78a6ff));
  font-size:12px;
  font-weight:800;
  pointer-events:none;
}

.eru-title-link{
  min-width:0;
  overflow:hidden;
  color:var(--eleon-text,inherit)!important;
  text-decoration:none!important;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:600;
  transition:color .14s ease;
}

.eru-title-link:hover,
.eru-title-link:focus,
.eru-title-link:active{
  color:var(--eleon-accent,var(--helios-accent,#78a6ff))!important;
  text-decoration:none!important;
}

.eru-date{
  color:var(--eleon-muted,rgba(225,229,236,.48));
  font-size:10px;
  white-space:nowrap;
  pointer-events:none;
}

/*
 * Requested Home placement:
 *
 * LEFT:
 *   Most Viewed spanning both rows.
 *
 * RIGHT:
 *   Version Timeline
 *   Recently Updated
 */
.ech-home-grid.eleon-home-widgets-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  gap:14px!important;
  align-items:stretch!important;
}

.ech-home-grid.eleon-home-widgets-layout
[data-eleon-most-viewed]{
  grid-column:1!important;
  grid-row:1 / span 2!important;
}

.ech-home-grid.eleon-home-widgets-layout
.ech-timeline-card{
  grid-column:2!important;
  grid-row:1!important;
}

.ech-home-grid.eleon-home-widgets-layout
[data-eleon-recently-updated-plugin]{
  grid-column:2!important;
  grid-row:2!important;
}

/* Dark/light variables matching Most Viewed. */
:root{
  --eru-card-bg:var(--eleon-card-bg,var(--helios-card,#17191e));
  --eru-card-border:var(--eleon-card-border,var(--helios-border,#303640));
}

html[data-theme="light"]
[data-eleon-recently-updated-plugin],
html.light
[data-eleon-recently-updated-plugin],
body.light
[data-eleon-recently-updated-plugin],
[data-theme="light"]
[data-eleon-recently-updated-plugin]{
  background:#fff!important;
  border-color:#d9dee7!important;
  color:#20242c!important;
}

html[data-theme="light"] .eru-title-link,
html.light .eru-title-link,
body.light .eru-title-link,
[data-theme="light"] .eru-title-link{
  color:#20242c!important;
}

html[data-theme="light"] .eru-title-link:hover,
html.light .eru-title-link:hover,
body.light .eru-title-link:hover,
[data-theme="light"] .eru-title-link:hover{
  color:#3f76d8!important;
}

html[data-theme="light"] .eru-date,
html.light .eru-date,
body.light .eru-date,
[data-theme="light"] .eru-date{
  color:#7a8493!important;
}

html[data-theme="light"] .eru-row,
html.light .eru-row,
body.light .eru-row,
[data-theme="light"] .eru-row,
html[data-theme="light"] .eru-head,
html.light .eru-head,
body.light .eru-head,
[data-theme="light"] .eru-head{
  border-color:rgba(35,45,60,.08)!important;
}

@media(max-width:900px){
  .ech-home-grid.eleon-home-widgets-layout{
    grid-template-columns:1fr!important;
    grid-template-rows:auto!important;
  }

  .ech-home-grid.eleon-home-widgets-layout
  [data-eleon-most-viewed],
  .ech-home-grid.eleon-home-widgets-layout
  .ech-timeline-card,
  .ech-home-grid.eleon-home-widgets-layout
  [data-eleon-recently-updated-plugin]{
    grid-column:1!important;
    grid-row:auto!important;
  }
}


/* =========================================================
   RECENTLY UPDATED 2.1 — bottom-right in Home 2x2 grid
   Changelog History top-left, Timeline top-right,
   Most Viewed bottom-left, Recently Updated bottom-right.
   ========================================================= */

.ech-home-grid.eleon-home-widgets-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  gap:14px!important;
  align-items:stretch!important;
}

.ech-home-grid.eleon-home-widgets-layout .ech-recent-card{
  grid-column:1!important;
  grid-row:1!important;
}

.ech-home-grid.eleon-home-widgets-layout .ech-timeline-card{
  grid-column:2!important;
  grid-row:1!important;
}

.ech-home-grid.eleon-home-widgets-layout [data-eleon-most-viewed]{
  grid-column:1!important;
  grid-row:2!important;
  height:auto!important;
}

.ech-home-grid.eleon-home-widgets-layout [data-eleon-recently-updated-plugin]{
  grid-column:2!important;
  grid-row:2!important;
}

@media(max-width:900px){
  .ech-home-grid.eleon-home-widgets-layout{
    grid-template-columns:1fr!important;
  }

  .ech-home-grid.eleon-home-widgets-layout .ech-recent-card,
  .ech-home-grid.eleon-home-widgets-layout .ech-timeline-card,
  .ech-home-grid.eleon-home-widgets-layout [data-eleon-most-viewed],
  .ech-home-grid.eleon-home-widgets-layout [data-eleon-recently-updated-plugin]{
    grid-column:1!important;
    grid-row:auto!important;
  }
}