/* ============================================================
   CIUTEK 1 - VELVET NEXUS  |  ciutek-acessibilidade.css
   Medido antes: 67 de 79 controles abaixo de 44x44 na pagina inicial.
   O menor era button.close, com 11x21.
   ============================================================ */

/* ---------- 1. Area de toque ----------
   So entra em tela de toque. No desktop, com mouse, nada muda de tamanho.
   O icone continua com 16-24px: o que cresce e a area que recebe o toque,
   por uma camada invisivel, sem alterar o espaco que o botao ocupa.
   O atributo data-ck-toque="forcado" liga a mesma regra no desktop,
   para dar para conferir sem um aparelho na mao. */
@media (pointer:coarse){
  .ctk-app .ck-toque-alvo{ position:relative; }
  .ctk-app .ck-toque-alvo::after{
    content:''; position:absolute; left:50%; top:50%;
    width:max(100%, var(--ck-toque-min)); height:max(100%, var(--ck-toque-min));
    transform:translate(-50%,-50%);
    z-index:1;
  }
}
:root[data-ck-toque="forcado"] .ctk-app .ck-toque-alvo,
:root[data-ck-toque="forcado"] .ck-toque-alvo{ position:relative; }
:root[data-ck-toque="forcado"] .ck-toque-alvo::after{
  content:''; position:absolute; left:50%; top:50%;
  width:max(100%, var(--ck-toque-min)); height:max(100%, var(--ck-toque-min));
  transform:translate(-50%,-50%);
  z-index:1;
}

/* ---------- 2. Texto ampliado nao pode cortar ---------- */
.ctk-app .btn-main,
.ctk-app .btn,
.ctk-app .menu_list,
.ctk-app .dropdown-toggle{
  height:auto !important;
  min-height:0;
  white-space:normal;
  overflow-wrap:anywhere;
}

/* ---------- 3. Areas seguras do aparelho ---------- */
@media (max-width:767px){
  .ctk-app .navbar.navbar-default{
    padding-top:var(--ck-seguro-topo) !important;
    padding-left:var(--ck-seguro-esquerda) !important;
    padding-right:var(--ck-seguro-direita) !important;
  }
  .ctk-app{
    padding-bottom:var(--ck-seguro-baixo);
  }
}

/* ---------- 4. Leitores de tela ---------- */
.ctk-app [aria-hidden="true"]{ pointer-events:none; }

/* atalho para o conteudo principal, so aparece com o teclado */
.ck-pular{
  position:absolute; left:var(--ck-e-4); top:-100px; z-index:var(--ck-z-dica);
  padding:var(--ck-e-3) var(--ck-e-4);
  background:var(--ck-cor-primaria); color:var(--ck-sobre-primaria);
  border-radius:var(--ck-r-campo); font-weight:var(--ck-p-botao);
  text-decoration:none;
  transition:top var(--ck-mov-rapido) var(--ck-curva);
}
.ck-pular:focus{ top:var(--ck-e-3); }
