/**
 * Footer mobile - layout igual ao mockup
 * Secção superior: patrocinadores (centrados, empilhados)
 * Secção inferior: redes sociais + links (fundo azul, alinhados à esquerda)
 *
 * @package Blocksy Child
 * @author Hugo Antunes - Brandit
 */

/* ==========================================
   HASHTAG #decruzaopeito (PC: ao lado | Telemóvel: por cima)
   ========================================== */

/* Coluna dos ícones: flex para hashtag + botões */
.ct-footer [data-row="bottom"] .stk-8e26446 .stk-8e26446-inner-blocks {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 25px;
}

/* Hashtag (PC: à direita dos ícones) */
.ct-footer [data-row="bottom"] .stk-8e26446 .stk-8e26446-inner-blocks::after {
  content: "#decruzaopeito";
  color: #00378f;
  font-size: 16px;
  font-weight: 800;
  flex-shrink: 0;
}

/* ==========================================
   FOOTER MOBILE (até 768px)
   ========================================== */

   @media screen and (max-width: 768px) {

    /* Secção dos patrocinadores: fundo azul muito claro (top + middle) */
    .ct-footer [data-row="top"],
    .ct-footer [data-row="middle"] {
      background-color: #e8eef7 !important;
    }
  
    /* --- Secção TOP: Main Sponsor --- */
    .ct-footer [data-row="top"] .ct-container-fluid {
      text-align: center;
    }
  
    .ct-footer [data-row="top"] [data-column="widget-area-1"] {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: -60px;
      width: 100%;
    }
  
    .ct-footer [data-row="top"] .stk-block-heading__text {
      color: #849ec9 !important;
    }
  
    .ct-footer [data-row="top"] .stk-block-image .stk-img-wrapper {
      width: 80% !important;
      margin-left: auto;
      margin-right: auto;
    }
  
    /* --- Secção MIDDLE: Premium Sponsors (3 logos em coluna, centrados) --- */
    .ct-footer [data-row="middle"] .ct-container-fluid {
      text-align: center;
    }
  
    .ct-footer [data-row="middle"] .stk-row.stk-inner-blocks {
      flex-direction: column;
      align-items: center;
      gap: 3rem;
    }
  
    /* Ordem: primeiro o título "PREMIUM SPONSORS" (coluna do meio), depois os 3 logos */
    .ct-footer [data-row="middle"] .stk-block-column.stk-a8c71c1 {
      order: 2;
      align-self: center !important;
    }
  
    .ct-footer [data-row="middle"] .stk-block-column.stk-f96e2f4 {
      order: 1;
    }
  
    .ct-footer [data-row="middle"] .stk-block-column.stk-14d21c6 {
      order: 3;
      align-self: center !important;
    }
  
    .ct-footer [data-row="middle"] .stk-block-heading__text {
      color: #849ec9 !important;
    }
  
    .ct-footer [data-row="middle"] .stk-block-image .stk-img-wrapper {
      width: 50% !important;
      margin-left: auto;
      margin-right: auto;
    }
  
    .ct-footer [data-row="middle"] .stk-adf9553 {
      margin-bottom: 50px !important;
      font-size: 16px;
    }
  
    .ct-footer [data-row="bottom"] .stk-row.stk-inner-blocks {
      flex-direction: row;
      display: flex;
      gap: 1.5rem;
    }
  
    .ct-footer [data-row="bottom"] .stk-block-column.stk-8e26446,
    .ct-footer [data-row="bottom"] .stk-block-column.stk-b1c9bad,
    .ct-footer [data-row="bottom"] .stk-block-column.stk-c2661a9 {
      flex: 1 1 100% !important;
      max-width: 100%;
    }
  
    /* Telemóvel: hashtag por cima dos ícones sociais (::after fica em baixo no column, por isso usamos order) */
    .ct-footer [data-row="bottom"] .stk-8e26446 .stk-8e26446-inner-blocks {
      flex-direction: column;
      align-items: flex-start;
    }

    .ct-footer [data-row="bottom"] .stk-8e26446 .stk-8e26446-inner-blocks::after {
      order: -1;
    }

    /* Coluna dos ícones sociais: alinhar à esquerda */
    .ct-footer [data-row="bottom"] .stk-8e26446 .stk-block-button-group {
      justify-content: flex-start;
    }
  
    /* Botões sociais: círculo azul escuro, ícone branco */
    .ct-footer [data-row="bottom"] .stk-block-icon-button .stk-button {
      background: #00378f !important;
      color: #fff !important;
    }
  
    .ct-footer [data-row="bottom"] .stk-block-icon-button .stk-button .stk--inner-svg path {
      fill: #fff;
    }
  
    /* Coluna dos links: dois blocos de texto à esquerda */
    .ct-footer [data-row="bottom"] .stk-c2661a9 .stk-row.stk-inner-blocks {
      flex-direction: column;
      align-items: flex-start;
    }
  
    .ct-footer [data-row="bottom"] .stk-block-text__text {
      color: #00378f !important;
      text-align: left !important;
      line-height: 2em !important;
    }
  
    .ct-footer [data-row="bottom"] .stk-block-text__text a {
      color: #00378f;
    }
  }