/* =====================================================
   Sorteios / Ganhadores (WF-11294)
   Figma "Sorteios / Ganhadores" (1:26169, desktop) e "Sorteios – Mobile" (1:29220).
   Complementa/ajusta as regras .mc-sorteios* de global.css (carregado depois
   deste arquivo, por isso os seletores comecam com "body").
   Desktop: tabela de 1087px com colunas fixas (293/234/325/235).
   Mobile (< 992px): um card por premio (.mc-sorteios__mobile).
   ===================================================== */

/* ---------- Titulos ---------- */
body .mc-sorteios {
  padding-top: calc(71 * var(--u));
}
/* Componente "Titulo de pagina": barra = largura do texto - 2 x 53px (SORTEIOS: 176 - 106 = 70) */
body .mc-sorteios .mc-pagetitulo::after {
  width: calc(70 * var(--u));
}
body .mc-sorteios .mc-secao {
  margin-top: calc(31 * var(--u));
  font-size: calc(32 * var(--u));
  line-height: calc(36 * var(--u));
}
body .mc-sorteios .mc-sorteios__card--instantaneos {
  margin-bottom: 0;
}

/* ---------- Card e tabela (desktop) ---------- */
body .mc-sorteios__mobile {
  display: none;
}
body .mc-sorteios__card {
  padding: calc(11 * var(--u)) calc(15 * var(--u)) calc(18 * var(--u)) calc(13 * var(--u));
}
body .mc-sorteios__tabela thead th {
  height: calc(56 * var(--u));
  padding: 0 calc(12 * var(--u)) 0 0;
}
body .mc-sorteios__tabela thead th:first-child {
  padding-left: calc(40 * var(--u));
}
body .mc-sorteios__th {
  gap: calc(7 * var(--u));
  line-height: calc(27 * var(--u));
}
body .mc-sorteios__col--data .mc-sorteios__th img { height: calc(20.33 * var(--u)); }
body .mc-sorteios__col--premio .mc-sorteios__th img { height: calc(21.52 * var(--u)); }
body .mc-sorteios__col--ganhador .mc-sorteios__th img { height: calc(21.7 * var(--u)); }
body .mc-sorteios__col--numero .mc-sorteios__th img { height: calc(20.27 * var(--u)); }

/* Texto das celulas alinhado ao texto do cabecalho (icone + 7px) */
body .mc-sorteios__tabela tbody td {
  padding: calc(7 * var(--u)) calc(12 * var(--u)) calc(7 * var(--u)) 0;
  color: var(--mc-roxo-texto);
}
body .mc-sorteios__tabela tbody td:first-child {
  padding-left: calc(66 * var(--u));
}
body .mc-sorteios__tabela tbody td:nth-child(2) {
  padding-left: calc(26 * var(--u));
}
body .mc-sorteios__tabela tbody td:nth-child(3) {
  padding-left: calc(29 * var(--u));
}
body .mc-sorteios__tabela--sorteios tbody td:nth-child(4) {
  padding-left: calc(37 * var(--u));
}

body .mc-sorteios__tabela--sorteios {
  table-layout: fixed;
  width: 100%;
}
body .mc-sorteios__tabela--sorteios .mc-sorteios__col--data { width: calc(293 * var(--u)); }
body .mc-sorteios__tabela--sorteios .mc-sorteios__col--premio { width: calc(234 * var(--u)); }
body .mc-sorteios__tabela--sorteios .mc-sorteios__col--ganhador { width: calc(325 * var(--u)); }
body .mc-sorteios__tabela--sorteios .mc-sorteios__col--numero { width: calc(235 * var(--u)); }
body .mc-sorteios__tabela--sorteios tbody td {
  overflow-wrap: break-word;
}

/* "1°  [trofeu] Nome: ..." (trofeu 17px depois do inicio da linha) */
body .mc-sorteios__posicao {
  min-width: calc(17 * var(--u));
}
body .mc-sorteios__trofeu {
  margin: calc(-3 * var(--u)) calc(5 * var(--u)) 0 0;
}

body .mc-sorteios__tabela .mc-sorteios__vazio,
body .mc-sorteios__tabela tbody td.mc-sorteios__vazio {
  padding: calc(16 * var(--u)) 0 !important;
  text-align: center;
}

/* =====================================================
   Mobile (Figma 414px)
   ===================================================== */
@media (max-width: 991.98px) {
  body .mc-sorteios {
    padding: calc(24 * var(--m)) calc(14 * var(--m)) calc(50 * var(--m)) calc(12 * var(--m));
  }
  body .mc-sorteios .mc-pagetitulo {
    font-size: calc(28 * var(--m));
    line-height: calc(32 * var(--m));
  }
  body .mc-sorteios .mc-pagetitulo::after {
    width: calc(115.45 * var(--m));
    height: calc(4.48 * var(--m));
    margin-top: 0;
  }
  body .mc-sorteios .mc-secao {
    margin: calc(34 * var(--m)) 0 0 calc(24 * var(--m));
    font-size: calc(24 * var(--m));
    line-height: calc(30 * var(--m));
  }

  body .mc-sorteios__desktop {
    display: none;
  }
  body .mc-sorteios__mobile {
    display: block;
    margin-top: calc(15 * var(--m));
  }

  /* Card de um premio: 388 x 195 */
  /* XD: a barra preta ocupa o topo do card sem arredondar; so a base do card e arredondada */
  body .mc-sorteios__item {
    overflow: hidden;
    margin: 0 0 calc(22 * var(--m));
    padding: 0 0 calc(25 * var(--m));
    border-radius: 0 0 calc(12 * var(--m)) calc(12 * var(--m));
  }
  body .mc-sorteios__item:last-child {
    margin-bottom: 0;
  }
  body .mc-sorteios__item-titulo {
    display: flex;
    align-items: center;
    gap: calc(7.5 * var(--m));
    min-height: calc(56 * var(--m));
    margin: 0;
    padding: calc(8 * var(--m)) calc(16 * var(--m)) calc(8 * var(--m)) calc(11.27 * var(--m));
    border-radius: 0;
    background: #000;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: calc(14 * var(--m));
    line-height: calc(18 * var(--m));
    color: #fff;
  }
  body .mc-sorteios__item-titulo span {
    display: block;
    font: inherit;
    color: #fff;
  }
  body .mc-sorteios__item-titulo img {
    flex: 0 0 auto;
    width: calc(21.23 * var(--m));
    height: calc(23 * var(--m));
  }
  body .mc-sorteios__item-dados {
    margin: calc(12 * var(--m)) 0 0;
    padding: 0 calc(12 * var(--m)) 0 calc(8 * var(--m));
    list-style: none;
    font-family: "Poppins", sans-serif;
    font-size: calc(14 * var(--m));
    line-height: calc(18 * var(--m));
    color: var(--mc-roxo-texto);
  }
  body .mc-sorteios__item-dados li {
    display: flex;
    align-items: center;
  }
  body .mc-sorteios__item-dados li + li {
    margin-top: calc(14.3 * var(--m));
  }
  body .mc-sorteios__item-dados li.mc-sorteios__item-numero {
    margin-top: calc(12.7 * var(--m));
  }
  body .mc-sorteios__item-dados li > img {
    flex: 0 0 auto;
    width: calc(28 * var(--m));
    height: auto;
    max-height: calc(24 * var(--m));
    margin-right: calc(8 * var(--m));
    object-fit: contain;
  }
  body .mc-sorteios__item-data > img {
    max-width: calc(18.3 * var(--m));
    margin-left: calc(4.96 * var(--m));
    margin-right: calc(12.75 * var(--m)) !important;
  }
  body .mc-sorteios__item-ganhador > img {
    width: calc(24 * var(--m)) !important;
    margin-left: calc(2 * var(--m));
    margin-right: calc(10 * var(--m)) !important;
  }
  body .mc-sorteios__item-numero > img {
    width: calc(30.4 * var(--m)) !important;
    margin-left: calc(0.95 * var(--m));
    margin-right: calc(10.65 * var(--m)) !important;
  }
  body .mc-sorteios__item-data b {
    font-weight: 700;
  }
  body .mc-sorteios__item-ganhador .mc-sorteios__posicao {
    min-width: calc(18 * var(--m));
  }
  body .mc-sorteios__item-ganhador .mc-sorteios__trofeu {
    width: calc(15.08 * var(--m));
    height: calc(13.4 * var(--m));
    margin: calc(-3 * var(--m)) calc(2 * var(--m)) 0 0;
  }
  body .mc-sorteios__item--vazio {
    padding: calc(20 * var(--m));
    font-family: "Poppins", sans-serif;
    font-size: calc(14 * var(--m));
    font-style: italic;
    text-align: center;
    color: var(--mc-roxo-texto);
  }

  /* Premios instantaneos (sem tela no Figma): linhas viram blocos rotulados */
  body .mc-sorteios__card--instantaneos {
    margin-top: calc(15 * var(--m));
    padding: calc(10 * var(--m)) calc(12 * var(--m)) calc(14 * var(--m));
  }
  body .mc-sorteios__tabela--instantaneos thead {
    display: none;
  }
  body .mc-sorteios__tabela--instantaneos,
  body .mc-sorteios__tabela--instantaneos tbody,
  body .mc-sorteios__tabela--instantaneos tr,
  body .mc-sorteios__tabela--instantaneos td {
    display: block;
    width: 100%;
  }
  body .mc-sorteios__tabela--instantaneos tbody tr {
    padding: calc(10 * var(--m)) calc(8 * var(--m));
  }
  body .mc-sorteios__tabela--instantaneos tbody td,
  body .mc-sorteios__tabela--instantaneos tbody td:first-child,
  body .mc-sorteios__tabela--instantaneos tbody td:nth-child(n) {
    height: auto;
    padding: calc(2 * var(--m)) 0;
    font-size: calc(14 * var(--m));
    line-height: calc(18 * var(--m));
  }
  body .mc-sorteios__tabela--instantaneos tbody td[data-rotulo]::before {
    content: attr(data-rotulo) ": ";
    font-weight: 700;
  }

  /* XD "Sorteios - Mobile": o fundo traz um iPhone grande (882px, girado -12deg) abaixo dos cards, por cima
     do roxo e por baixo da fita do footer. Ausente no Figma convertido. A altura dos cards e dinamica, entao o
     iPhone fica ancorado no fim da pagina, num espaco reservado de 693px (XD: 642px de iPhone + 51px de respiro). */
  body .mc-sorteios {
    position: relative;
    padding-bottom: calc(693 * var(--m));
    overflow-x: clip;
  }
  body .mc-sorteios::after {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: calc(-184 * var(--m));
    left: calc(50% - 403 * var(--m));
    width: calc(882 * var(--m));
    height: calc(882 * var(--m));
    background: url("../images/site/iphone.webp") center / 100% 100% no-repeat;
    transform: rotate(-12deg);
    filter: drop-shadow(calc(-10 * var(--m)) calc(20 * var(--m)) calc(30 * var(--m)) rgba(0, 0, 0, 0.19));
    pointer-events: none;
  }
  body:has(.mc-sorteios) footer.mc-footer {
    z-index: 3;
  }
}