/* HEPHA — catálogo semântico e mapa de componentes */
#admin .hepha-component-map-card{
  grid-column:1/-1;
  padding:16px;
}

#admin .hepha-component-map-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}

#admin .hepha-component-map-head>div>span{
  display:block;
  margin-bottom:4px;
  color:#ff7417;
  font-size:8px;
  line-height:1;
  font-weight:900;
  letter-spacing:.12em;
}

#admin .hepha-component-map-count{
  flex:0 0 auto;
  padding:6px 9px;
  border-radius:999px;
  color:#177451;
  background:#eaf6f1;
  font-size:9px;
  font-weight:900;
}

#admin .hepha-component-map-search{
  height:38px;
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px;
  padding:0 11px;
  border:1px solid #d5e0e5;
  border-radius:9px;
  background:#fff;
  color:#71858e;
}

#admin .hepha-component-map-search span{font-size:19px}
#admin .hepha-component-map-search input{
  width:100%;
  border:0;
  outline:0;
  color:#173744;
  background:transparent;
  font:600 10px Inter,Segoe UI,Arial,sans-serif;
}

#admin .hepha-component-map-legend{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:10px 0 7px;
  color:#71858e;
  font-size:8px;
  font-weight:800;
}

#admin .hepha-component-map-legend span{display:flex;align-items:center;gap:4px}
#admin .hepha-component-map-legend i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#59717c;
}
#admin .hepha-component-map-legend i.page{background:#2d7596}
#admin .hepha-component-map-legend i.tab{background:#b88722}
#admin .hepha-component-map-legend i.filter{background:#7b63b7}
#admin .hepha-component-map-legend i.card{background:#ff7417}
#admin .hepha-component-map-legend i.level{background:#179867}

#admin .hepha-component-map-tree{
  max-height:440px;
  overflow:auto;
  border:1px solid #dbe4e8;
  border-radius:10px;
  background:#f8fafb;
}

#admin .hepha-component-map-row{
  display:grid;
  grid-template-columns:minmax(210px,1.1fr) minmax(300px,1.8fr) minmax(170px,.85fr) auto;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:7px 10px;
  border-bottom:1px solid #e5ecef;
  background:#fff;
}

#admin .hepha-component-map-row:last-child{border-bottom:0}
#admin .hepha-component-map-row:hover{background:#fff8f2}

#admin .hepha-component-map-name{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
  padding-left:calc(var(--hepha-depth,0) * 10px);
}

#admin .hepha-component-map-name i{
  flex:0 0 auto;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#59717c;
}
#admin .hepha-component-map-row[data-type="page"] .hepha-component-map-name i{background:#2d7596}
#admin .hepha-component-map-row[data-type="tab"] .hepha-component-map-name i{background:#b88722}
#admin .hepha-component-map-row[data-type="filter"] .hepha-component-map-name i{background:#7b63b7}
#admin .hepha-component-map-row[data-type="card"] .hepha-component-map-name i{background:#ff7417}
#admin .hepha-component-map-row[data-type="level"] .hepha-component-map-name i{background:#179867}

#admin .hepha-component-map-name strong{
  overflow:hidden;
  color:#163643;
  font-size:10px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

#admin .hepha-component-map-path{
  overflow:hidden;
  color:#355a6a;
  font:700 8.5px Consolas,monospace;
  white-space:nowrap;
  text-overflow:ellipsis;
}

#admin .hepha-component-map-file{
  overflow:hidden;
  color:#82939a;
  font:600 8px Consolas,monospace;
  white-space:nowrap;
  text-overflow:ellipsis;
}

#admin .hepha-component-map-open{
  height:27px;
  padding:0 9px;
  border:1px solid #ff9a58;
  border-radius:7px;
  color:#c8580e;
  background:#fff;
  font-size:8px;
  font-weight:900;
  cursor:pointer;
}

#admin .hepha-component-map-empty{
  padding:30px;
  text-align:center;
  color:#71858e;
  font-size:10px;
}

.hepha-component-located{
  outline:3px solid rgba(255,116,23,.48)!important;
  outline-offset:3px;
  animation:hephaComponentLocated 1.6s ease;
}

@keyframes hephaComponentLocated{
  0%,100%{box-shadow:inherit}
  45%{box-shadow:0 0 0 8px rgba(255,116,23,.13)}
}

@media(max-width:900px){
  #admin .hepha-component-map-row{grid-template-columns:1fr auto}
  #admin .hepha-component-map-path,
  #admin .hepha-component-map-file{grid-column:1/-1}
}
