/* ==========================================================================
   Click Expert Global Translator - Enterprise CSS (v1.1.0)
   100% Responsive, Custom Colors, Directional Expansion & Zero Collisions
   ========================================================================== */

:root {
    --cegt-gold: #e5a93c;
    --cegt-gold-light: #ffd700;
    --cegt-gold-glow: rgba(229, 169, 60, 0.45);
    --cegt-dark-bg: rgba(14, 17, 27, 0.94);
    --cegt-card-bg: rgba(26, 31, 46, 0.85);
    --cegt-card-hover: rgba(38, 45, 68, 0.95);
    --cegt-border: rgba(229, 169, 60, 0.28);
    --cegt-border-hover: rgba(255, 215, 0, 0.65);
    --cegt-text-main: #f0f3fa;
    --cegt-text-muted: #9ba3b8;
    --cegt-radius-lg: 16px;
    --cegt-radius-md: 10px;
    --cegt-radius-sm: 6px;
}

/* Ocultar barra superior padrão do Google Translate */
body {
    top: 0 !important;
}
.skiptranslate,
iframe.skiptranslate,
.goog-te-banner-frame {
    display: none !important;
    visibility: hidden !important;
}
#goog-gt-tt, .goog-te-balloon-frame {
    display: none !important;
}
.goog-text-highlight {
    background: none !important;
    box-shadow: none !important;
}

/* Container Raiz Blindado */
#cegt-translator-root {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    z-index: 999990 !important;
}
#cegt-translator-root * {
    box-sizing: border-box !important;
}

/* Posicionamento Base */
#cegt-translator-root.cegt-floating {
    position: fixed !important;
}
#cegt-translator-root.cegt-inline {
    display: inline-block !important;
    position: relative !important;
    vertical-align: middle !important;
}

/* Botão do Globo / Ícone Principal - 100% Centralizado e Simétrico */
.cegt-globe-btn {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 2px solid var(--cegt-border) !important;
    border-radius: 50% !important;
    background: var(--cegt-dark-bg) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    color: var(--cegt-gold) !important;
    cursor: pointer !important;
    outline: none !important;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45) !important;
    overflow: visible !important;
    line-height: 0 !important;
}

/* Tamanhos */
.cegt-size-compact .cegt-globe-btn {
    width: 38px !important;
    height: 38px !important;
}
.cegt-size-compact .cegt-globe-icon-wrap svg,
.cegt-size-compact .cegt-custom-icon-img {
    width: 20px !important;
    height: 20px !important;
}

.cegt-size-medium .cegt-globe-btn {
    width: 48px !important;
    height: 48px !important;
}
.cegt-size-medium .cegt-globe-icon-wrap svg,
.cegt-size-medium .cegt-custom-icon-img {
    width: 24px !important;
    height: 24px !important;
}

.cegt-size-large .cegt-globe-btn {
    width: 54px !important;
    height: 54px !important;
}
.cegt-size-large .cegt-globe-icon-wrap svg,
.cegt-size-large .cegt-custom-icon-img {
    width: 28px !important;
    height: 28px !important;
}

/* Efeito Glow / Halo */
.cegt-glow .cegt-globe-btn:hover {
    border-color: var(--cegt-gold-light) !important;
    color: var(--cegt-gold-light) !important;
    box-shadow: 0 0 22px var(--cegt-gold-glow), 0 6px 20px rgba(0, 0, 0, 0.6) !important;
    transform: scale(1.08) !important;
}

/* Envoltório do Ícone: Alinhamento milimétrico ao centro */
.cegt-globe-icon-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    pointer-events: none !important;
    transition: transform 0.45s ease !important;
}

.cegt-globe-icon-wrap svg {
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
}

.cegt-custom-icon-img {
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    max-width: 60% !important;
    max-height: 60% !important;
}

.cegt-globe-btn:hover .cegt-globe-icon-wrap {
    transform: rotate(20deg) scale(1.05) !important;
}

/* Indicador de Bandeira Ativa (Mini-Badge Flutuante no Canto Superior Direito, sem deformar o botão) */
.cegt-active-flag-indicator {
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #0f172a !important;
    border: 1.5px solid var(--cegt-gold) !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    line-height: 1 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6) !important;
    z-index: 5 !important;
    pointer-events: none !important;
}

/* ==========================================================================
   Painel HUD / Gaveta de Bandeiras
   ========================================================================== */

.cegt-hud-panel {
    position: absolute !important;
    width: 320px !important;
    max-height: 480px !important;
    background: var(--cegt-dark-bg) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    border: 1px solid var(--cegt-border) !important;
    border-radius: var(--cegt-radius-lg) !important;
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.85), 0 0 25px var(--cegt-gold-glow) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.24s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.24s cubic-bezier(0.16, 1, 0.3, 1),
                visibility 0.24s !important;
    z-index: 999995 !important;
}

.cegt-hud-panel.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: scale(1) translateY(0) translateX(0) !important;
}

/* ==========================================================================
   DIREÇÕES DE EXPANSÃO CONFIGURÁVEIS (UP, DOWN, LEFT, RIGHT, CENTER, AUTO)
   ========================================================================== */

/* 1. Direção: Expandir para CIMA (UP) */
#cegt-translator-root.cegt-dir-up .cegt-hud-panel {
    bottom: calc(100% + 12px) !important;
    right: 0 !important;
    transform-origin: bottom right !important;
    transform: scale(0.92) translateY(10px) !important;
}

/* 2. Direção: Expandir para BAIXO (DOWN) */
#cegt-translator-root.cegt-dir-down .cegt-hud-panel {
    top: calc(100% + 12px) !important;
    left: 0 !important;
    transform-origin: top left !important;
    transform: scale(0.92) translateY(-10px) !important;
}

/* 3. Direção: Expandir para a ESQUERDA (LEFT) */
#cegt-translator-root.cegt-dir-left .cegt-hud-panel {
    right: calc(100% + 12px) !important;
    bottom: 0 !important;
    transform-origin: right bottom !important;
    transform: scale(0.92) translateX(10px) !important;
}

/* 4. Direção: Expandir para a DIREITA (RIGHT) */
#cegt-translator-root.cegt-dir-right .cegt-hud-panel {
    left: calc(100% + 12px) !important;
    bottom: 0 !important;
    transform-origin: left bottom !important;
    transform: scale(0.92) translateX(-10px) !important;
}

/* 5. Direção: Modal Centralizado na Tela (CENTER_MODAL) */
#cegt-translator-root.cegt-dir-center_modal .cegt-hud-panel {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 360px !important;
    max-width: 90vw !important;
    transform: translate(-50%, -50%) scale(0.92) !important;
    transform-origin: center center !important;
}
#cegt-translator-root.cegt-dir-center_modal .cegt-hud-panel.is-open {
    transform: translate(-50%, -50%) scale(1) !important;
}

/* 6. Direção: Automático inteligente baseado na posição do Globo */
#cegt-translator-root.cegt-dir-auto.cegt-pos-bottom-right .cegt-hud-panel {
    bottom: calc(100% + 12px) !important;
    right: 0 !important;
    transform-origin: bottom right !important;
    transform: scale(0.92) translateY(10px) !important;
}
#cegt-translator-root.cegt-dir-auto.cegt-pos-bottom-left .cegt-hud-panel {
    bottom: calc(100% + 12px) !important;
    left: 0 !important;
    transform-origin: bottom left !important;
    transform: scale(0.92) translateY(10px) !important;
}
#cegt-translator-root.cegt-dir-auto.cegt-pos-top-right .cegt-hud-panel {
    top: calc(100% + 12px) !important;
    right: 0 !important;
    transform-origin: top right !important;
    transform: scale(0.92) translateY(-10px) !important;
}
#cegt-translator-root.cegt-dir-auto.cegt-pos-top-left .cegt-hud-panel {
    top: calc(100% + 12px) !important;
    left: 0 !important;
    transform-origin: top left !important;
    transform: scale(0.92) translateY(-10px) !important;
}
#cegt-translator-root.cegt-dir-auto.cegt-inline .cegt-hud-panel {
    top: calc(100% + 8px) !important;
    left: 0 !important;
    transform-origin: top left !important;
    transform: scale(0.92) translateY(-8px) !important;
}

/* ==========================================================================
   CONTEÚDO INTERNO DO HUD (CABEÇALHO, BUSCA, BANDEIRAS, RODAPÉ)
   ========================================================================== */

.cegt-hud-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.cegt-hud-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}
.cegt-title-icon {
    font-size: 20px !important;
}
.cegt-title-text strong {
    display: block !important;
    font-size: 14px !important;
    color: var(--cegt-text-main) !important;
    letter-spacing: 0.3px !important;
}
.cegt-title-text small {
    display: block !important;
    font-size: 11px !important;
    color: var(--cegt-gold) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}
.cegt-hud-close {
    background: transparent !important;
    border: none !important;
    color: var(--cegt-text-muted) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    padding: 0 4px !important;
    transition: color 0.2s !important;
}
.cegt-hud-close:hover {
    color: var(--cegt-text-main) !important;
}

/* Campo de Busca Rápida */
.cegt-search-wrap {
    position: relative !important;
    padding: 10px 14px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
.cegt-search-input {
    width: 100% !important;
    padding: 7px 12px 7px 32px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: var(--cegt-radius-sm) !important;
    color: var(--cegt-text-main) !important;
    font-size: 13px !important;
    outline: none !important;
    transition: border-color 0.2s !important;
}
.cegt-search-input:focus {
    border-color: var(--cegt-gold) !important;
}
.cegt-search-input::placeholder {
    color: var(--cegt-text-muted) !important;
}
.cegt-search-icon {
    position: absolute !important;
    left: 22px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 12px !important;
    pointer-events: none !important;
}

/* Grid de Bandeiras e Idiomas */
.cegt-languages-grid {
    padding: 10px 12px !important;
    overflow-y: auto !important;
    max-height: 270px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    scrollbar-width: thin !important;
    scrollbar-color: var(--cegt-gold) transparent !important;
}
.cegt-languages-grid::-webkit-scrollbar {
    width: 5px !important;
}
.cegt-languages-grid::-webkit-scrollbar-thumb {
    background: var(--cegt-gold) !important;
    border-radius: 4px !important;
}

/* Card de Cada Idioma */
.cegt-lang-card {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 8px 12px !important;
    background: var(--cegt-card-bg) !important;
    border: 1px solid transparent !important;
    border-radius: var(--cegt-radius-md) !important;
    cursor: pointer !important;
    text-align: left !important;
    transition: all 0.2s ease !important;
    width: 100% !important;
    color: var(--cegt-text-main) !important;
}
.cegt-lang-card:hover {
    background: var(--cegt-card-hover) !important;
    border-color: var(--cegt-border) !important;
    transform: translateX(4px) !important;
}
.cegt-lang-card.is-active {
    background: rgba(229, 169, 60, 0.18) !important;
    border-color: var(--cegt-gold) !important;
}

.cegt-lang-flag {
    font-size: 22px !important;
    line-height: 1 !important;
}
.cegt-lang-meta {
    flex: 1 !important;
    min-width: 0 !important;
}
.cegt-lang-native {
    display: block !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--cegt-text-main) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.cegt-lang-name {
    display: block !important;
    font-size: 11px !important;
    color: var(--cegt-text-muted) !important;
}
.cegt-cpm-badge {
    color: var(--cegt-gold-light) !important;
    font-size: 12px !important;
}

/* Rodapé do HUD */
.cegt-hud-footer {
    padding: 10px 14px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(0, 0, 0, 0.25) !important;
}
.cegt-reset-btn {
    width: 100% !important;
    padding: 8px 10px !important;
    background: transparent !important;
    border: 1px dashed rgba(255, 255, 255, 0.2) !important;
    border-radius: var(--cegt-radius-sm) !important;
    color: var(--cegt-text-muted) !important;
    font-size: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
}
.cegt-reset-btn:hover {
    border-color: var(--cegt-gold) !important;
    color: var(--cegt-gold) !important;
    background: rgba(229, 169, 60, 0.1) !important;
}

/* Responsividade Mobile (Gaveta Inferior Bottom-Sheet) */
@media (max-width: 600px) {
    #cegt-translator-root.cegt-floating:not(.cegt-dir-center_modal) .cegt-hud-panel {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        top: auto !important;
        width: 100% !important;
        max-height: 75vh !important;
        border-radius: 20px 20px 0 0 !important;
        transform: translateY(100%) !important;
    }
    #cegt-translator-root.cegt-floating:not(.cegt-dir-center_modal) .cegt-hud-panel.is-open {
        transform: translateY(0) !important;
    }
}
/* Estilização para Ícone PNG Customizado */
.cegt-custom-icon-img {
    width: 24px !important;
    height: 24px !important;
    object-fit: contain !important;
    border-radius: 50% !important;
    display: block !important;
    transition: transform 0.45s ease !important;
}
.cegt-size-compact .cegt-custom-icon-img {
    width: 20px !important;
    height: 20px !important;
}
.cegt-size-large .cegt-custom-icon-img {
    width: 30px !important;
    height: 30px !important;
}
.cegt-globe-btn:hover .cegt-custom-icon-img {
    transform: scale(1.08) rotate(15deg) !important;
}

/* Ocultar resquício do shortcode [gtranslate] antigo no cabeçalho */
.elementor-element-e0d9c20,
.elementor-widget-shortcode:has(> .elementor-widget-container > .elementor-shortcode:empty) {
    display: none !important;
}