/* ============================================================
 * FFB Admin Patch v4 — modernizacao visual (pills, botoes, bordas)
 * 2026-04-23
 * Remove chrome legado Interspire 2009 (bordas cinza, gradientes,
 * imagens de tabs) e substitui por pill/chip moderno estilo Stripe/Linear.
 * ============================================================ */

/* ============================================================
 * 1. MENU SUPERIOR (Inicio | Modelos | Forms HTML | ...)
 *    Remove borda/caixa/bg legado dos PopDownMenu triggers
 * ============================================================ */

.Header .PopDownMenu,
.Header a.PopDownMenu,
.Header .MenuText .PopDownMenu,
.Header .MenuText a.PopDownMenu,
.Header .textlinks .PopDownMenu {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 4px 10px !important;
    margin: 0 2px !important;
    border-radius: 6px !important;
    display: inline-block !important;
    line-height: 1.4 !important;
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
}

.Header .PopDownMenu:hover,
.Header a.PopDownMenu:hover {
    background: rgba(35, 81, 229, 0.08) !important;
}

.Header .PopDownMenu table,
.Header .PopDownMenu td,
.Header .PopDownMenu tr,
.Header .PopDownMenu tbody {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Esconde imagens de corners/middle/bg do menu legado no topo */
.Header .PopDownMenu img[src*='mnu_'],
.Header .PopDownMenu img[src*='menu_'],
.Header .PopDownMenu img[src*='tab_'],
.Header .PopDownMenu img[src*='tab-'],
.Header .PopDownMenu img[src*='corner'],
.Header .PopDownMenu img[src*='_left'],
.Header .PopDownMenu img[src*='_right'],
.Header .PopDownMenu img[src*='_middle'] {
    display: none !important;
}

/* Setinha down do dropdown — mantida (apenas arrow_down*) */
.Header .PopDownMenu img[src*='arrow_down'] {
    display: inline-block !important;
    vertical-align: middle !important;
    margin-left: 4px;
    width: 10px;
    height: 10px;
}

/* ============================================================
 * 2. BARRA DE ABAS PRINCIPAL (.menuBar)
 *    Lista de Contatos / Contatos / Minhas Campanhas / Enquetes ...
 *    Kill chrome Interspire, vira pills modernas
 * ============================================================ */

.menuBar {
    background: #ffffff !important;
    background-image: none !important;
    border: none !important;
    border-bottom: 1px solid #E5E7EB !important;
    padding: 10px 24px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
}

.menuBar > div {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
}

/* Zerar TODAS as estruturas table das abas legadas */
.menuBar table,
.menuBar tbody,
.menuBar tr,
.menuBar td {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    vertical-align: middle !important;
    height: auto !important;
    width: auto !important;
}

/* Esconde imagens de corner/tab 3-part legadas */
.menuBar img[src*='mnu_'],
.menuBar img[src*='menu_on_'],
.menuBar img[src*='menu_off_'],
.menuBar img[src*='tab-'],
.menuBar img[src*='tab_'],
.menuBar img[src*='_corner'],
.menuBar img[src*='_left.gif'],
.menuBar img[src*='_right.gif'],
.menuBar img[src*='_middle.gif'],
.menuBar img[src*='_middle.png'] {
    display: none !important;
}

/* Links e triggers de dropdown das abas — pill moderno */
.menuBar a,
.menuBar .PopDownMenu,
.menuBar a.PopDownMenu,
.menuBar td > a {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 10px 16px !important;
    margin: 0 2px !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #374151 !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    min-height: 40px !important;
    transition: background 0.15s ease, color 0.15s ease !important;
}

.menuBar a:hover,
.menuBar .PopDownMenu:hover,
.menuBar td > a:hover {
    background: rgba(35, 81, 229, 0.08) !important;
    color: #2351E5 !important;
    text-decoration: none !important;
}

/* Aba ativa */
.menuBar a.active,
.menuBar a.selected,
.menuBar .dropselected,
.menuBar td.dropselected,
.menuBar td.dropselected > a,
.menuBar td.dropselected > .PopDownMenu,
.menuBar .dropselected .PopDownMenu {
    background: rgba(35, 81, 229, 0.10) !important;
    color: #2351E5 !important;
    font-weight: 600 !important;
}

/* Icones temáticos das abas (envelope, lista, grafico) — preservar */
.menuBar img:not([src*='arrow']):not([src*='mnu_']):not([src*='menu_']):not([src*='tab']):not([src*='corner']) {
    display: inline-block !important;
    vertical-align: middle !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    opacity: 0.85;
}

/* Setinha down das abas - discreta */
.menuBar img[src*='arrow_down'] {
    width: 10px !important;
    height: 10px !important;
    opacity: 0.5;
    margin-left: 4px !important;
}

/* ============================================================
 * 3. BOTOES "Gerenciar listas" / "Criar um e-mail"
 *    (caixa introdutoria do dashboard)
 * ============================================================ */

.introbox a,
.introbox .actionlink,
.BigIconLinks a,
.BigIconLinks td > a,
a.BigIconButton,
a.heading3,
a.Heading3 {
    background: #F9FAFB !important;
    background-image: none !important;
    border: 1px solid #E5E7EB !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    padding: 16px 20px !important;
    color: #111827 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    transition: all 0.15s ease !important;
}

.introbox a:hover,
.BigIconLinks a:hover,
a.BigIconButton:hover {
    background: #F3F4F6 !important;
    border-color: #2351E5 !important;
    color: #2351E5 !important;
    box-shadow: 0 4px 8px rgba(35,81,229,0.10) !important;
    transform: translateY(-1px);
}

/* ============================================================
 * 4. BOTOES DE ACAO — Ver mais campanhas / Ver Todas as Listas
 *    (as "pills" amarelas/laranja com setinha)
 * ============================================================ */

a.bigactionbutton,
a.actionbutton,
a.ActionButton,
a.SmallActionButton,
a[class*='ctionButton'],
button.bigactionbutton,
button.actionbutton,
input.bigactionbutton,
input.actionbutton,
input.SubmitButton,
input.Button2 {
    background: #2351E5 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 9px 18px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    box-shadow: 0 1px 2px rgba(35,81,229,0.20) !important;
    cursor: pointer !important;
    transition: background 0.15s ease, box-shadow 0.15s ease !important;
}

a.bigactionbutton:hover,
a.actionbutton:hover,
button.bigactionbutton:hover,
input.SubmitButton:hover,
input.Button2:hover {
    background: #1E45C2 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(35,81,229,0.30) !important;
}

/* Icone redondo laranja dentro do action button — branco */
a.bigactionbutton img,
a.actionbutton img {
    filter: brightness(0) invert(1) !important;
    width: 14px !important;
    height: 14px !important;
    opacity: 0.9;
}

/* Cancel/secondary button */
a.cancelbutton,
input.cancelbutton,
button.cancelbutton,
a[class*='CancelButton'] {
    background: #ffffff !important;
    background-image: none !important;
    color: #374151 !important;
    border: 1px solid #E5E7EB !important;
    border-radius: 8px !important;
    padding: 9px 18px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    box-shadow: none !important;
}

a.cancelbutton:hover,
input.cancelbutton:hover {
    background: #F9FAFB !important;
    color: #111827 !important;
    border-color: #9CA3AF !important;
}

/* ============================================================
 * 5. CAIXAS DE CONTEUDO — cards "Iniciando o uso", "Campanhas Editadas"...
 * ============================================================ */

.contentbox,
.introbox,
.GroupedBox,
.RoundBox,
div[id^='DashboardBox'],
.DashboardBox {
    background: #ffffff !important;
    background-image: none !important;
    border: 1px solid #E5E7EB !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
}

/* Titulo dentro dos cards */
.contentbox h1,
.contentbox h2,
.contentbox h3,
.introbox h1,
.introbox h2,
.DashboardBox h3 {
    color: #111827 !important;
    font-weight: 600 !important;
    margin-top: 0 !important;
}

/* ============================================================
 * 6. TABELAS DE LISTAS (linhas "Informativo Mazzolli XXX")
 * ============================================================ */

.DashboardBox table tr,
.contentbox table tr,
.GroupedBox table tr {
    background: transparent !important;
}

.DashboardBox table tr:hover,
.contentbox table tr:hover {
    background: #F9FAFB !important;
}

/* Tabs secundarias MOSTRAR: Todas/Agendada/Enviada/Arquivada */
.tabstrip a,
.tabstrip .tab,
.SubTabs a {
    padding: 6px 12px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    color: #6B7280 !important;
    font-weight: 500 !important;
    background: transparent !important;
    border: none !important;
}

.tabstrip a:hover {
    background: #F3F4F6 !important;
    color: #111827 !important;
}

.tabstrip a.active,
.tabstrip .tab.active,
.SubTabs a.active {
    background: #EFF6FF !important;
    color: #2351E5 !important;
}

/* ============================================================
 * 7. Diversos: inputs, selects com estilo modernizado leve
 * ============================================================ */

input[type='text'],
input[type='email'],
input[type='password'],
input[type='number'],
select,
textarea {
    border: 1px solid #D1D5DB !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    color: #111827 !important;
    background: #ffffff !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

input[type='text']:focus,
input[type='email']:focus,
input[type='password']:focus,
select:focus,
textarea:focus {
    outline: none !important;
    border-color: #2351E5 !important;
    box-shadow: 0 0 0 3px rgba(35,81,229,0.12) !important;
}