/* 
Theme Name: Hello Elementor Child
Template: hello-elementor
*/

/* -----------------------------------------------------
   KOMENTARI: grid + "zlatna pilula" + ispravan avatar
   (Gutenberg Comments unutar Elementor Post Content)
------------------------------------------------------*/

/* Lista komentara (bez bullet-a, kao grid) */
.elementor-widget-theme-post-content .wp-block-comments ol.wp-block-comment-template{
  list-style:none!important;
  margin:1rem 0 0!important;
  padding:0!important;
  display:grid!important;
  gap:1rem!important;
}

/* Kartica komentara (zlatna pilula) */
.elementor-widget-theme-post-content .wp-block-comments ol.wp-block-comment-template>li.comment{
  background:#A7990F!important;
  color:#fff!important;
  border-radius:2rem!important;
  padding:1rem!important;
  overflow:hidden!important;
}

/* Raspored: avatar lijevo, sadržaj desno */
.elementor-widget-theme-post-content .wp-block-comments li.comment>.wp-block-columns.is-layout-flex{
  display:flex!important;
  align-items:center!important;
  gap:1rem!important;
  flex-wrap:nowrap!important;
}

/* ===== AVATAR — jedini potreban set pravila (fix "jaje") ===== */
.elementor-widget-theme-post-content .wp-block-comments li.comment img.avatar,
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-avatar img,
.wp-block-comments li.comment img.avatar,
.wp-block-comments li.comment .wp-block-avatar img{
  width:48px!important;
  height:48px!important;
  aspect-ratio:1/1!important;     /* drži pravi kvadrat */
  object-fit:cover!important;     /* bez deformacije */
  border-radius:50%!important;    /* krug */
  display:block!important;
  border:4px solid rgba(255,255,255,.18)!important; /* diskretan obrub */
}

/* Autor + datum */
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-comment-author-name{
  font-weight:800!important;
  margin:0 .5rem 0 0!important;
  font-size:1.1rem!important;
}
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-comment-date{
  opacity:.9!important;
  font-size:.9rem!important;
  font-weight:600!important;
}

/* Tekst */
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-comment-content p{
  margin:.35rem 0 0!important;
  line-height:1.45!important;
  color:#fff!important;
}

/* Linkovi */
.elementor-widget-theme-post-content .wp-block-comments li.comment a{
  color:#fff!important;
  text-decoration:none!important;
}
.elementor-widget-theme-post-content .wp-block-comments li.comment a:hover{
  text-decoration:underline!important;
}

/* "Odgovori" dugme */
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-comment-reply-link a,
.elementor-widget-theme-post-content .wp-block-comments li.comment .reply a{
  display:inline-block!important;
  margin-top:.5rem!important;
  background:rgba(0,0,0,.18)!important;
  padding:.35em .7em!important;
  border-radius:8px!important;
  font-weight:600!important;
  color:#fff!important;
}
.elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-comment-reply-link a:hover,
.elementor-widget-theme-post-content .wp-block-comments li.comment .reply a:hover{
  background:rgba(0,0,0,.28)!important;
}

/* Ugniježđeni odgovori */
.elementor-widget-theme-post-content .wp-block-comments .children{
  list-style:none!important;
  margin:12px 0 0 24px!important;
  padding:0!important;
}
.elementor-widget-theme-post-content .wp-block-comments .children>li.comment{
  background:#9a9140!important;
  border-radius:36px!important;
  padding:16px!important;
  margin-top:12px!important;
}

/* Mobilno */
@media (max-width:480px){
  .elementor-widget-theme-post-content .wp-block-comments ol.wp-block-comment-template>li.comment{
    border-radius:1.75rem!important;
    padding:14px!important;
  }
  .elementor-widget-theme-post-content .wp-block-comments li.comment .wp-block-avatar img{
    width:48px!important;
    height:48px!important;
  }
}

/* === Popravi izgled avatara u komentarima (WordPress + Elementor) === */

.wp-block-comments .wp-block-avatar,
.comment .wp-block-avatar,
.wp-block-comment-author__avatar {
  flex: 0 0 48px !important; /* sprječava rastezanje */
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.wp-block-comments .wp-block-avatar img,
.comment .wp-block-avatar img,
.comment img.avatar,
.wp-block-comment-author__avatar img {
  width: 48px !important;
  height: 48px !important;
  aspect-ratio: 1 / 1 !important; /* garantuje savršen krug */
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
  border: 2px solid rgba(255,255,255,0.2) !important;
}

/* Ispravi Elementor/Gutenberg flex ponašanje */
.wp-block-columns.is-layout-flex > .wp-block-column[style*="flex-basis"] {
  flex-basis: 48px !important;
  max-width: 48px !important;
  min-width: 48px !important;
}