#y-accessibility-bar,
#y-accessibility-bar * {
  box-sizing: border-box !important;
}

/* Botão Flutuante Lateral Direito Centralizado */
#y-accessibility-button {
  position: fixed;
  top: 65%;
  right: 0;
  transform: translateY(-50%);
  background-color: #006dd5;
  border: none;
  color: white;
  padding: 10px 8px;
  z-index: 9999;
  cursor: pointer;
  display: flex;
  flex-direction: column; /* Ícone em cima, texto em baixo */
  justify-content: center;
  align-items: center;
  border-radius: 8px 0 0 8px; /* Arredondado apenas no lado esquerdo */
  box-shadow: -2px 0px 10px rgba(0, 0, 0, 0.3);
  transition:
    background-color 0.3s ease,
    right 0.3s ease;
  min-width: 45px;
}

/* Texto do botão principal */
.y-button-text {
  writing-mode: vertical-rl; /* Texto na vertical */
  text-orientation: mixed;
  font-size: 14px;
  font-weight: bold;
  margin-top: 8px;
  font-family: Arial, sans-serif;
}

#y-accessibility-button:hover,
#y-accessibility-button:focus {
  background-color: #0056b3;
  outline: none;
}

#y-accessibility-button svg {
  color: white;
  width: 24px;
  height: 24px;
}

/* Painel Lateral (Abre da esquerda conforme solicitado) */
#y-accessibility-bar {
  font-size: 1rem;
  font-family: "Arial", sans-serif;
  position: fixed;
  top: 0;
  left: 0;
  width: 280px;
  max-width: 90%;
  height: 100vh;
  background-color: #f7fbff;
  border-right: 1px solid #ccc;
  display: flex;
  flex-direction: column;
  z-index: 9998;
  transition: transform 0.3s ease;
  overflow-y: auto;
  box-shadow: 2px 0px 15px rgba(0, 0, 0, 0.3);
}

#y-accessibility-title {
  font-size: 1.5rem;
  background-color: #006dd5;
  color: white;
  padding: 15px;
  margin: 10px;
  border-radius: 5px;
  text-align: center;
}

#y-accessibility-buttons-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 10px;
}

#y-accessibility-bar button {
  position: relative;
  padding: 10px;
  border: 2px solid #006dd5;
  border-radius: 8px;
  background-color: #fff;
  cursor: pointer;
  min-height: 100px;
  width: calc(50% - 10px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  transition: all 0.2s ease;
}

#y-accessibility-bar button:hover,
#y-accessibility-bar button:focus {
  background-color: #eef6ff;
  outline: none;
}

#y-accessibility-bar button span.y-accessibility-button-label {
  font-size: 0.8rem;
  margin-top: 8px;
  font-weight: 500;
  text-align: center;
  line-height: 1.2;
}

#y-accessibility-bar button svg {
  width: 28px;
  height: 28px;
  fill: #006dd5;
}

#y-accessibility-credits {
  font-size: 12px;
  text-align: center;
  padding: 20px;
  margin-top: auto;
  color: #666;
}

/* Utilitários de Acessibilidade no Body */
.y-accessibility-highlight-links a {
  color: yellow !important;
  outline: 3px solid red !important;
  text-decoration: underline !important;
  background-color: black !important;
}

.y-accessibility-contrast,
.y-accessibility-contrast * {
  background: none !important;
  background-color: #000 !important;
  color: white !important;
}

.y-accessibility-contrast a {
  color: yellow !important;
}
.y-accessibility-contrast button {
  background-color: yellow !important;
  color: black !important;
}

.y-accessibility-colorless * {
  filter: grayscale(100%) !important;
}

#y-accessibility-shadow-host {
  filter: none !important; /* Impede que o painel fique cinza/contraste */
}

.y-accessibility-stop-flickering * {
  animation: none !important;
  transition: none !important;
}

#y-accessibility-reset {
  width: 100% !important;
  min-height: 50px !important;
  background-color: #fdeaea !important;
  border-color: #dc3545 !important;
  color: #dc3545 !important;
}

.y-accessibility-button-active {
  background-color: #006dd5 !important;
  color: white !important;
}

.y-accessibility-button-active svg {
  fill: white !important;
}

.y-accessibility-checkmark {
  color: white !important;
  background-color: #28a745 !important;
  position: absolute;
  right: -5px;
  top: -5px;
  border-radius: 50%;
  border: 2px solid white;
  width: 22px;
  height: 22px;
  font-size: 12px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.y-accessibility-simple-font {
  font-family: "Arial", sans-serif !important;
}

body.y-accessibility-big-cursor {
  cursor:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' width='100' height='100' viewBox='0 0 48 48'%3E%3Cpath fill='%23E0E0E0' d='M27.8,39.7c-0.1,0-0.2,0-0.4-0.1c-0.2-0.1-0.4-0.3-0.6-0.5l-3.7-8.6l-4.5,4.2C18.5,34.9,18.3,35,18,35c-0.1,0-0.3,0-0.4-0.1C17.3,34.8,17,34.4,17,34l0-22c0-0.4,0.2-0.8,0.6-0.9C17.7,11,17.9,11,18,11c0.2,0,0.5,0.1,0.7,0.3l16,15c0.3,0.3,0.4,0.7,0.3,1.1c-0.1,0.4-0.5,0.6-0.9,0.7l-6.3,0.6l3.9,8.5c0.1,0.2,0.1,0.5,0,0.8c-0.1,0.2-0.3,0.5-0.5,0.6l-2.9,1.3C28.1,39.7,27.9,39.7,27.8,39.7z'/%3E%3Cpath fill='%23212121' d='M18,12l16,15l-7.7,0.7l4.5,9.8l-2.9,1.3l-4.3-9.9L18,34L18,12 M18,10c-0.3,0-0.5,0.1-0.8,0.2c-0.7,0.3-1.2,1-1.2,1.8l0,22c0,0.8,0.5,1.5,1.2,1.8C17.5,36,17.8,36,18,36c0.5,0,1-0.2,1.4-0.5l3.4-3.2l3.1,7.3c0.2,0.5,0.6,0.9,1.1,1.1c0.2,0.1,0.5,0.1,0.7,0.1c0.3,0,0.5-0.1,0.8-0.2l2.9-1.3c0.5-0.2,0.9-0.6,1.1-1.1c0.2-0.5,0.2-1.1,0-1.5l-3.3-7.2l4.9-0.4c0.8-0.1,1.5-0.6,1.7-1.3c0.3-0.7,0.1-1.6-0.5-2.1l-16-15C19,10.2,18.5,10,18,10L18,10z'/%3E%3C/svg%3E")
      0 0,
    auto;
}

@media (max-width: 600px) {
  #y-accessibility-bar {
    width: 200px; /* Largura fixa menor para não cobrir tudo */
    max-width: 80%; /* Garante que nunca cubra a tela toda em aparelhos muito pequenos */
  }

  /* Faz os botões ocuparem a linha inteira dentro do painel estreito */
  #y-accessibility-bar button {
    width: calc(100% - 20px) !important;
    min-height: 80px; /* Um pouco mais baixo no mobile */
    margin: 5px 10px;
  }

  #y-accessibility-title {
    font-size: 1.2rem;
    padding: 10px;
  }
}
