|
|
| Line 4: |
Line 4: |
| @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap'); | | @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap'); |
|
| |
|
| /* Container do Seletor */ | | /* Ajuste de Espaçamento do Container */ |
| .gtranslate_wrapper#custom-lang-selector { | | .gtranslate_wrapper { |
| position: relative; | | padding: 8px 0 !important; |
| width: 100%;
| | margin-bottom: 12px !important; |
| margin-bottom: 12px; | | display: block !important; |
| font-family: inherit; | |
| user-select: none;
| |
| } | | } |
|
| |
|
| /* Botão Principal */ | | /* Garante ajuste de largura na barra lateral */ |
| .custom-lang-trigger {
| | .gtranslate_wrapper select { |
| display: flex;
| | width: 100% !important; |
| align-items: center;
| | max-width: 100% !important; |
| justify-content: space-between;
| | box-sizing: border-box !important; |
| height: 38px;
| |
| padding: 0 14px;
| |
| background-color: #ffffff;
| |
| border: 1px solid #a2a9b1;
| |
| border-radius: 6px;
| |
| cursor: pointer;
| |
| box-sizing: border-box;
| |
| transition: border-color 0.2s ease, box-shadow 0.2s ease;
| |
| }
| |
| | |
| .custom-lang-trigger:hover,
| |
| .gtranslate_wrapper#custom-lang-selector.open .custom-lang-trigger { | |
| border-color: #1B2826;
| |
| box-shadow: 0 0 0 1px #1B2826;
| |
| }
| |
| | |
| .custom-lang-current {
| |
| font-size: 0.875rem;
| |
| font-weight: 500;
| |
| color: #1B2826;
| |
| }
| |
| | |
| /* Seta / Chevron com Animação de Rotação Smooth */
| |
| .custom-lang-arrow {
| |
| width: 12px; | |
| height: 12px;
| |
| background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><path fill="%231B2826" d="M2.22 4.47a.75.75 0 011.06 0L6 7.19l2.72-2.72a.75.75 0 111.06 1.06l-3.25 3.25a.75.75 0 01-1.06 0L2.22 5.53a.75.75 0 010-1.06z"/></svg>'); | |
| background-repeat: no-repeat;
| |
| background-position: center;
| |
| transition: transform 0.25s ease;
| |
| }
| |
| | |
| /* Rotação do Chevron ao Abrir */
| |
| .gtranslate_wrapper#custom-lang-selector.open .custom-lang-arrow {
| |
| transform: rotate(180deg);
| |
| }
| |
| | |
| /* Menu Dropdown Suspenso */
| |
| .custom-lang-menu {
| |
| display: none;
| |
| position: absolute;
| |
| top: calc(100% + 4px);
| |
| left: 0; | |
| right: 0;
| |
| background: #ffffff;
| |
| border: 1px solid #1B2826;
| |
| border-radius: 6px;
| |
| box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
| |
| z-index: 9999;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .gtranslate_wrapper#custom-lang-selector.open .custom-lang-menu {
| |
| display: block;
| |
| }
| |
| | |
| /* Opções de Idioma */
| |
| .custom-lang-option {
| |
| padding: 8px 14px;
| |
| font-size: 0.875rem;
| |
| color: #1B2826;
| |
| cursor: pointer;
| |
| transition: background-color 0.15s ease, color 0.15s ease;
| |
| }
| |
| | |
| /* Hover e Item Selecionado em Verde Escuro (#1B2826) */
| |
| .custom-lang-option:hover {
| |
| background-color: #1B2826;
| |
| color: #ffffff;
| |
| }
| |
| | |
| .custom-lang-option.selected {
| |
| background-color: #1B2826;
| |
| color: #BFFF00; /* Texto em Verde Lima para a linguagem ativa */
| |
| font-weight: 600;
| |
| } | | } |
|
| |
|