/**
 * ACCOUNT WIDGET - CSS
 * Mantém apenas o essencial:
 * 1. Forçar renderização imediata do .ast-header-account-wrap (evita delay de 26s)
 * 2. Estilos do botão "Entrar" (deslogado)
 * 3. Responsivo
 *
 * O dropdown, avatar e overlay são controlados pelo account-widget-v2.php
 *
 * @package Blue_Concursos
 */

/* ============================================================
   VARIÁVEIS
============================================================ */
:root {
    --bc-primary:      #2563eb;
    --bc-primary-dark: #1d4ed8;
    --bc-white:        #ffffff;
    --bc-gray-200:     #e5e7eb;
    --bc-shadow-sm:    0 2px 8px rgba(37,99,235,0.15);
    --bc-shadow-md:    0 4px 12px rgba(37,99,235,0.25);
    --bc-transition:   all 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ============================================================
   WRAP — forçar renderização CSS imediata
   SEM isso o Astra inicializa via JS causando delay de 26s
============================================================ */
.ast-header-account-wrap {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    margin-left: 15px;
    visibility: visible !important;
}

/* Remove dropdown padrão do Astra */
.ast-header-account-wrap .ast-account-submenu,
.ast-header-account-wrap .sub-menu {
    display: none !important;
}

/* ============================================================
   BOTÃO "ENTRAR" — estado deslogado
============================================================ */
.ast-header-account-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 30px !important;
    min-width: 120px;
    background: transparent !important;
    color: var(--bc-white) !important;
    border: 3px solid var(--bc-white) !important;
    border-radius: 8px;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2;
    cursor: pointer;
    transition: var(--bc-transition);
    text-decoration: none !important;
    position: relative;
    overflow: hidden;
}
.ast-header-account-link:hover {
    background: var(--bc-primary) !important;
    color: var(--bc-white) !important;
    border-color: var(--bc-primary) !important;
    transform: translateY(-2px);
    box-shadow: var(--bc-shadow-md);
}
.ast-header-account-link:active {
    transform: translateY(0);
    box-shadow: var(--bc-shadow-sm);
}

/* ============================================================
   MENU SECUNDÁRIO (barra abaixo do header)
============================================================ */
.below-header-bar,
.ast-below-header,
.ast-below-header-bar {
    background: var(--bc-white) !important;
    border-top: 1px solid var(--bc-gray-200);
}
.below-header-bar .menu-link,
.ast-below-header .menu-link {
    color: #1f2937 !important;
    transition: color 0.2s ease;
}
.below-header-bar .menu-link:hover,
.ast-below-header .menu-link:hover {
    color: var(--bc-primary) !important;
}

/* ============================================================
   RESPONSIVO — TABLET
============================================================ */
@media (max-width: 921px) {
    .ast-header-account-link {
        padding: 10px 24px !important;
        min-width: 100px;
        font-size: 15px !important;
    }
    .ast-header-account-wrap {
        margin-left: 12px;
    }
}

/* ============================================================
   RESPONSIVO — MOBILE
============================================================ */
@media (max-width: 768px) {
    .ast-header-account-link {
        padding: 10px 20px !important;
        min-width: 90px;
        font-size: 14px !important;
    }
    .ast-header-account-wrap {
        margin-left: 10px;
    }
}

/* ============================================================
   RESPONSIVO — MOBILE PEQUENO
   SUBSTITUIR o bloco existente @media (max-width: 544px)
   no arquivo: astra-child/assets/css/components/account-widget.css
============================================================ */
@media (max-width: 544px) {
    .ast-header-account-link {
        padding: 10px 18px !important;
        min-width: auto !important;
        width: auto !important;       /* remove largura fixa que causava o círculo */
        height: auto !important;      /* remove altura fixa que causava o círculo */
        border-radius: 8px !important; /* mantém borda retangular igual ao desktop */
        font-size: 13px !important;
    }

    /* Mantém o texto "Entrar" VISÍVEL no mobile pequeno */
    .ast-header-account-text {
        position: static !important;  /* cancela o ocultamento por clip */
        width: auto !important;
        height: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        border: 0 !important;
    }

    .ast-header-account-icon {
        display: none !important;     /* esconde o ícone, mostra só o texto */
    }
}

/* ============================================================
   PRINT
============================================================ */
@media print {
    .ast-header-account-wrap { display: none !important; }
}