/* ———————————————————————————
   MODAL (termos de aceitação)
   ——————————————————————————— */

.modal-backdrop {
  position: fixed;
  inset: 0;                       /* top/right/bottom/left: 0 */
  background: rgba(0,0,0,.55);
  display: none;                  /* fica invisível por padrão  */
  align-items: center;            /* centraliza a caixa         */
  justify-content: center;
  z-index: 9999;
}

.modal-backdrop[aria-hidden="false"] {
  display: flex;                  /* JS retira aria-hidden → força flex */
}

.modal {
  position: relative;
  width: 90%;
  max-width: 640px;
  max-height: 80vh;
  overflow-y: auto;
  padding: 2rem 2.5rem;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0,0,0,.25);
  animation: modalIn .25s ease-out;
}

@keyframes modalIn {
  from { transform: translateY(-20px); opacity:.4; }
  to   { transform: translateY(0);      opacity:1; }
}

/* botão “×” */
.modal-close{
  position:absolute;
  top: .75rem;
  right:.75rem;
  width:32px;height:32px;
  border:none;border-radius:4px;
  background:#0057ff; color:#fff;
  font-size:1.25rem; line-height:1;
  cursor:pointer;
}
.modal-close:hover{background:#0043d6}

/* garante que links, texto etc. ficam legíveis */
.modal h3{margin-top:0;font-size:1.5rem}
.modal p{margin:.75rem 0;line-height:1.55}




/* ==========================================================
   Layout geral dos passos
   ========================================================== */
.wprir-step{
  margin:32px 0;                       /* espaço entre cartões-passo   */
}

.wprir-step-title{
  font-size:1.55rem;
  font-weight:600;
  margin-bottom:12px;
  padding-left:4px;
  border-left:4px solid #0a60d0;       /* linha azul como destaque     */
}

/* ==========================================================
   Cartões (Logotipo, Streaming, etc.)
   ========================================================== */
.wprir-card{
  background:#f7f8fa;                  /* cinza bem claro              */
  border:1px solid #dee2e6;
  border-radius:6px;
  padding:10px 24px;
  margin-bottom:24px;
  box-shadow:0 1px 3px rgba(0,0,0,.06);
}

/* Ajuste para grid 2 ou 3 colunas já usadas no template */
.wprir-grid-2,
.wprir-grid-3{
  display:grid;
  gap:16px 24px;                       /* row-gap | col-gap            */
}
.wprir-grid-2{ grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.wprir-grid-3{ grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }

/* ==========================================================
   Campos de formulário
   ========================================================== */
.wprir-card label{
  display:flex;
  flex-direction:column;
  font-weight:400;
  color:#333;
}

.wprir-card input[type=\"text\"],
.wprir-card input[type=\"url\"],
.wprir-card input[type=\"email\"],
.wprir-card input[type=\"file\"],
.wprir-card textarea,
.wprir-card select{
  margin-top:4px;
  padding:8px 12px;
  border:1px solid #cfd4d9;
  border-radius:4px;
  font-size:14px;
  background:#fff;
  transition:border-color .2s ease;
}

.wprir-card input:focus,
.wprir-card textarea:focus,
.wprir-card select:focus{
  outline:none;
  border-color:#0a60d0;
  box-shadow:0 0 0 2px rgba(10,96,208,.15);
}

/* Texto de ajuda abaixo dos inputs */
.wprir-help{
  font-size:12px;
  color:#6c757d;
  margin-top:4px;
}

/* ==========================================================
   Botão de envio
   ========================================================== */
.wprir-btn{
  margin-top:16px;
  background:#0a60d0;
  color:#fff;
  border:none;
  border-radius:4px;
  padding:10px 28px;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:background .2s ease;
}
.wprir-btn:hover{ background:#084fa9; }

.wprir-center{ text-align:center; }

/* ==========================================================
   Responsivo — afasta o form das bordas em telas pequenas
   ========================================================== */
@media (max-width:600px){
  .wprir-card{ padding:16px 18px; }           /* um pouco mais compacto */
}





/* =========================================================
   Gêneros – 3 colunas alinhadas (checkbox + texto na mesma linha)
   ========================================================= */
#wprir-generos .wprir-checkboxes{
  display:flex;
  flex-wrap:wrap;
  gap:6px 24px;                  /* ↑ espaço vertical | → horizontal */
}

.wprir-genre{
  /* força lado-a-lado, anulando display:block do tema */
  display:inline-flex !important;
  align-items:center;
  gap:6px;
  width:calc(40% - 35px);    /* 3 colunas; ajuste para 25% se quiser 4 */
  margin:0 !important;           /* remove margens herdadas */
  white-space:nowrap;            /* evita “Acid Jazz” quebrar em 2 linhas   */
}

.wprir-genre input[type="checkbox"]{
  flex:0 0 auto;
  accent-color:#0066d9;          /* cor do seu botão “Enviar” */
}


/* ↓↓↓ ajustes finos de tamanho ↓↓↓ */
#wprir-generos .wprir-checkboxes{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); /* colunas um pouco mais estreitas */
  gap:4px 16px;              /* 4 px entre linhas · 16 px entre colunas  */
}

.wprir-genre{
  display:flex !important;
  align-items:center;
  gap:4px;                   /* espaço entre checkbox e texto            */
  margin:0 !important;
  line-height:1.25;          /* altura da linha mais compacta           */
  font-size:12px;            /* ← diminui o texto                        */
  white-space:nowrap;
}

.wprir-genre input[type="checkbox"]{
  transform:scale(.85);      /* 0.85 = 85 % do tamanho padrão            */
  flex:0 0 auto;
  accent-color:#0066d9;
}

/* -----------------------------------------------------------
   Mobile / telas estreitas (≤ 600 px): força 2 colunas fixas
   ----------------------------------------------------------- */
@media (max-width: 600px){
  #wprir-generos .wprir-checkboxes{
    display:grid;
    grid-template-columns:repeat(2, 1fr);  /* sempre 2 colunas */
    gap:4px 16px;                          /* ajuste de espaçamento */
  }
}