/* ==================================================================
   SLZ7 V46 - Item: metatags do tipo do item (.slz7-im)
   ------------------------------------------------------------------
   Escopo unico: .slz7-im. Nenhuma regra do tema e sobrescrita.

   Variaveis (definidas pelo CSS dinamico de
   inc/customizer/customizer-item-meta.php):
     --im-cols --im-gap --im-size --im-label-size --im-radius --im-pad
     --im-bg --im-border --im-color --im-label-color --im-icon
     --im-top --im-bottom

   Modelos:
     slz7-im--s-*  -> modelo do COMPUTADOR (vale acima de 760px)
     slz7-im--m-*  -> modelo do CELULAR    (vale ate 760px)
   O ponto de troca (760px) e fixo e igual no CSS dinamico.
   ================================================================== */

.slz7-im{
  --im-cols:3; --im-gap:12px; --im-size:.88rem; --im-label-size:.72rem;
  --im-radius:12px; --im-pad:12px;
  --im-bg:transparent; --im-border:transparent;
  --im-color:inherit; --im-label-color:var(--c-muted,#6b7280);
  --im-icon:var(--c-accent,#7c3aed);
  --im-top:14px; --im-bottom:6px;
  margin:var(--im-top) 0 var(--im-bottom);
}
.slz7-im__title{
  margin:0 0 .6rem; font-size:1rem; font-weight:800; line-height:1.2;
}
.slz7-im__list{ display:flex; flex-wrap:wrap; gap:var(--im-gap); }
.slz7-im__item{
  display:inline-flex; align-items:center; gap:.5rem;
  color:var(--im-color); font-size:var(--im-size); line-height:1.25;
  min-width:0;
}
.slz7-im__icon{ color:var(--im-icon); flex:0 0 auto; }
.slz7-im.no-icons .slz7-im__icon{ display:none; }
.slz7-im__body{ display:flex; flex-direction:column; gap:.1rem; min-width:0; }
.slz7-im__label{
  font-size:var(--im-label-size); font-weight:700; letter-spacing:.02em;
  text-transform:uppercase; color:var(--im-label-color); line-height:1.15;
}
.slz7-im__value{ font-weight:600; overflow-wrap:anywhere; }
.slz7-im:not(.has-labels) .slz7-im__body{ flex-direction:row; }

/* ---------- Ativacao por viewport --------------------------------- */
@media (min-width:761px){
  .slz7-im--s-chips  > .slz7-im__list{ display:flex; flex-wrap:wrap; }
  .slz7-im--s-chips  .slz7-im__item{
    background:var(--im-bg); border:1px solid var(--im-border);
    border-radius:var(--im-radius); padding:calc(var(--im-pad) * .55) var(--im-pad);
  }
  .slz7-im--s-inline > .slz7-im__list{ display:block; }
  .slz7-im--s-inline .slz7-im__item{ display:inline-flex; }
  .slz7-im--s-inline .slz7-im__item + .slz7-im__item::before{
    content:"\00b7"; margin:0 .55rem 0 0; opacity:.6; font-weight:700;
  }
  .slz7-im--s-list   > .slz7-im__list{ display:flex; flex-direction:column; }
  .slz7-im--s-list   .slz7-im__item{ display:flex; align-items:flex-start; }
  .slz7-im--s-list   .slz7-im__icon{ margin-top:.15rem; }
  .slz7-im--s-cards  > .slz7-im__list{
    display:grid; grid-template-columns:repeat(var(--im-cols),minmax(0,1fr));
  }
  .slz7-im--s-cards  .slz7-im__item{
    display:flex; align-items:flex-start;
    background:var(--im-bg); border:1px solid var(--im-border);
    border-radius:var(--im-radius); padding:var(--im-pad);
  }
  .slz7-im--s-grid   > .slz7-im__list{
    display:grid; grid-template-columns:repeat(var(--im-cols),minmax(0,1fr));
  }
  .slz7-im--s-grid   .slz7-im__item{ display:flex; align-items:flex-start; }
  .slz7-im--s-table  > .slz7-im__list{
    display:grid; grid-template-columns:auto minmax(0,1fr); gap:0;
    border:1px solid var(--im-border); border-radius:var(--im-radius); overflow:hidden;
  }
  .slz7-im--s-table  .slz7-im__item{ display:contents; }
  .slz7-im--s-table  .slz7-im__icon{
    padding:calc(var(--im-pad) * .7) var(--im-pad);
    background:var(--im-bg); display:flex; align-items:center;
  }
  .slz7-im--s-table.no-icons .slz7-im__icon{ display:none; }
  .slz7-im--s-table  .slz7-im__body{
    flex-direction:row; align-items:baseline; gap:.6rem; flex-wrap:wrap;
    padding:calc(var(--im-pad) * .7) var(--im-pad);
    border-bottom:1px solid var(--im-border);
  }
  .slz7-im--s-table  .slz7-im__item:last-child .slz7-im__body{ border-bottom:0; }
  .slz7-im--s-table  .slz7-im__label{ min-width:9rem; }
}

@media (max-width:760px){
  .slz7-im--m-chips  > .slz7-im__list{ display:flex; flex-wrap:wrap; }
  .slz7-im--m-chips  .slz7-im__item{
    background:var(--im-bg); border:1px solid var(--im-border);
    border-radius:var(--im-radius); padding:calc(var(--im-pad) * .55) var(--im-pad);
  }
  .slz7-im--m-inline > .slz7-im__list{ display:block; }
  .slz7-im--m-inline .slz7-im__item{ display:inline-flex; }
  .slz7-im--m-inline .slz7-im__item + .slz7-im__item::before{
    content:"\00b7"; margin:0 .55rem 0 0; opacity:.6; font-weight:700;
  }
  .slz7-im--m-list   > .slz7-im__list{ display:flex; flex-direction:column; }
  .slz7-im--m-list   .slz7-im__item{ display:flex; align-items:flex-start; }
  .slz7-im--m-list   .slz7-im__icon{ margin-top:.15rem; }
  .slz7-im--m-cards  > .slz7-im__list{
    display:grid; grid-template-columns:repeat(var(--im-cols),minmax(0,1fr));
  }
  .slz7-im--m-cards  .slz7-im__item{
    display:flex; align-items:flex-start;
    background:var(--im-bg); border:1px solid var(--im-border);
    border-radius:var(--im-radius); padding:var(--im-pad);
  }
  .slz7-im--m-grid   > .slz7-im__list{
    display:grid; grid-template-columns:repeat(var(--im-cols),minmax(0,1fr));
  }
  .slz7-im--m-grid   .slz7-im__item{ display:flex; align-items:flex-start; }
  .slz7-im--m-table  > .slz7-im__list{
    display:grid; grid-template-columns:auto minmax(0,1fr); gap:0;
    border:1px solid var(--im-border); border-radius:var(--im-radius); overflow:hidden;
  }
  .slz7-im--m-table  .slz7-im__item{ display:contents; }
  .slz7-im--m-table  .slz7-im__icon{
    padding:calc(var(--im-pad) * .7) var(--im-pad);
    background:var(--im-bg); display:flex; align-items:center;
  }
  .slz7-im--m-table.no-icons .slz7-im__icon{ display:none; }
  .slz7-im--m-table  .slz7-im__body{
    flex-direction:row; align-items:baseline; gap:.6rem; flex-wrap:wrap;
    padding:calc(var(--im-pad) * .7) var(--im-pad);
    border-bottom:1px solid var(--im-border);
  }
  .slz7-im--m-table  .slz7-im__item:last-child .slz7-im__body{ border-bottom:0; }
  .slz7-im--m-table  .slz7-im__label{ min-width:7rem; }
}

/* ---------- Ajustes por contexto ---------------------------------- */
/* Topo (cabecalho colorido do item): herda as cores claras do hero. */
.offer-hero-meta .slz7-im--hero{ margin:0; width:100%; }
.offer-hero-meta .slz7-im--hero .slz7-im__label{ opacity:.85; }
/* Dentro do cartao de descricao. */
.offer-details .slz7-im--desc:first-child{ margin-top:0; }