/* ------------------------------------------------------------------------------------------ */
/* Modais de bloqueio de assinatura — telas de Teste/Aguardando/Efetuado vencido, Bloqueado e -- */
/* Cancelado (inc/modals/prompts/assinatura.php). Mesma paleta semântica do systemBanner.css -- */
/* (css/elements/systemBanner.css), mas com tratamento mais rico — é o momento de maior peso -- */
/* de conversão do produto (o cliente decide ali se paga ou perde o acesso). ------------------ */
/* ------------------------------------------------------------------------------------------ */

.subBlockModal {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 20px;
  padding: 8px 8px 4px;
}

.subBlockModal_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  width: 72px;
  border-radius: 50%;
  flex-shrink: 0;
}

.subBlockModal_icon img {
  height: 34px;
  width: 34px;
}

.subBlockModal_title {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
}

.subBlockModal_description {
  font-size: 14.5px;
  line-height: 1.6;
  opacity: 0.82;
  max-width: 38ch;
  margin: 0;
}

.subBlockModal_description a {
  font-weight: 600;
  text-decoration-thickness: 1.5px;
}

.subBlockModal_reason {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 100px;
  max-width: 100%;
}

.subBlockModal_reason img {
  height: 15px;
  width: 15px;
  flex-shrink: 0;
}

.subBlockModal_reason span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subBlockModal_days {
  font-size: 13px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 100px;
}

.subBlockModal_cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  font-size: 14.5px;
  font-weight: 700;
  text-decoration: none;
  padding: 13px 20px;
  border-radius: var(--default-border-radius);
  transition: 150ms;
  box-sizing: border-box;
}

.subBlockModal_cta:hover {
  filter: brightness(0.94);
}

.subBlockModal_cta:active {
  scale: 0.98;
}

.subBlockModal_cta img {
  height: 17px;
  width: 17px;
}

/* -------------------------------------------------------------------- */
/* Tipo: info (período de teste em andamento) --------------------------- */
/* -------------------------------------------------------------------- */

.subBlockModal.info .subBlockModal_icon { background-color: #d3e4fc; }
.subBlockModal.info .subBlockModal_icon img { filter: invert(22%) sepia(37%) saturate(2248%) hue-rotate(200deg) brightness(97%) contrast(86%); }
.subBlockModal.info .subBlockModal_days { background-color: #d3e4fc; color: #1a3a63; }
.subBlockModal.info .subBlockModal_cta { background-color: #2f6fd6; color: #fff; }

body.darkmode .subBlockModal.info .subBlockModal_icon { background-color: #1f345a; }
body.darkmode .subBlockModal.info .subBlockModal_icon img { filter: invert(70%) sepia(20%) saturate(1200%) hue-rotate(190deg) brightness(105%) contrast(100%); }
body.darkmode .subBlockModal.info .subBlockModal_days { background-color: #1f345a; color: #cfe0fb; }

/* -------------------------------------------------------------------- */
/* Tipo: danger (teste acabou / pagamento vencido / bloqueado) ----------- */
/* -------------------------------------------------------------------- */

.subBlockModal.danger .subBlockModal_icon { background-color: #f8d4d4; }
.subBlockModal.danger .subBlockModal_icon img { filter: invert(23%) sepia(74%) saturate(2848%) hue-rotate(347deg) brightness(90%) contrast(96%); }
.subBlockModal.danger .subBlockModal_reason { background-color: #fdecec; color: #6e1a1a; }
.subBlockModal.danger .subBlockModal_reason img { filter: invert(23%) sepia(74%) saturate(2848%) hue-rotate(347deg) brightness(90%) contrast(96%); }
.subBlockModal.danger .subBlockModal_cta { background-color: #d63a3a; color: #fff; }

body.darkmode .subBlockModal.danger .subBlockModal_icon { background-color: #5a1f1f; }
body.darkmode .subBlockModal.danger .subBlockModal_icon img { filter: invert(70%) sepia(40%) saturate(2000%) hue-rotate(320deg) brightness(105%) contrast(100%); }
body.darkmode .subBlockModal.danger .subBlockModal_reason { background-color: #3a1414; color: #fbd6d6; }
body.darkmode .subBlockModal.danger .subBlockModal_reason img { filter: invert(70%) sepia(40%) saturate(2000%) hue-rotate(320deg) brightness(105%) contrast(100%); }

/* -------------------------------------------------------------------- */
/* Tipo: aguardando (contrato aguardando primeiro pagamento) ------------- */
/* -------------------------------------------------------------------- */

.subBlockModal.aguardando .subBlockModal_icon { background-color: #faeacb; }
.subBlockModal.aguardando .subBlockModal_icon img { filter: invert(60%) sepia(60%) saturate(1200%) hue-rotate(357deg) brightness(95%) contrast(92%); }
.subBlockModal.aguardando .subBlockModal_cta { background-color: #b8862f; color: #fff; }

body.darkmode .subBlockModal.aguardando .subBlockModal_icon { background-color: #4a3a1a; }
body.darkmode .subBlockModal.aguardando .subBlockModal_icon img { filter: invert(80%) sepia(30%) saturate(900%) hue-rotate(340deg) brightness(105%) contrast(95%); }

/* -------------------------------------------------------------------- */
/* Tipo: neutral (cancelado — decisão já tomada, sem urgência de cor) --- */
/* -------------------------------------------------------------------- */

.subBlockModal.neutral .subBlockModal_icon { background-color: var(--box-border-light, #e4e6ea); }
.subBlockModal.neutral .subBlockModal_icon img { opacity: 0.6; }
.subBlockModal.neutral .subBlockModal_cta { background-color: var(--ink, #1f2430); color: #fff; }

body.darkmode .subBlockModal.neutral .subBlockModal_icon { background-color: #2c3242; }

@media only all and (max-width: 480px) {
  .subBlockModal_title { font-size: 18px; }
  .subBlockModal_description { max-width: 32ch; }
}