/* Auto-pilot — Área do cliente. Consome os tokens do Tema Auto-pilot
   (--auto-pilot-*, --ff-head/body, raios --r-*), com fallbacks. Herda claro/escuro. */

.ap-app, .ap-auth {
	/* Tema CLARO premium — valores fixos (ganham aos tokens escuros do tema). */
	--ap-acc:     #E8C61F;
	--ap-acc-txt: #1b1408;
	--ap-acc-d:   rgba(232,198,31,.16);
	--ap-bg:      #ece9e0;
	--ap-surf:    #ffffff;
	--ap-raised:  #f6f4ee;
	--ap-bord:    #e4dfd3;
	--ap-txt:     #211f18;
	--ap-dim:     #46433a;
	--ap-muted:   #6a6557;
	--ap-gold:    #8a6b04;
	--ap-ffh:     var(--ff-head, 'Bricolage Grotesque', system-ui, sans-serif);
	--ap-ffb:     var(--ff-body, 'Open Sans', system-ui, sans-serif);
	--ap-rc:      16px;
	--ap-rb:      11px;
	--ap-rbd:     8px;
	--lemon-2:    #f2d74a;
	color: var(--ap-txt);
	font-family: var(--ap-ffb);
}
body.auto-pilot-app { background: #ece9e0; }

/* Tipografia / utilitários */
.ap-h { font-family: var(--ap-ffh); font-weight: 700; font-size: 1.3rem; margin: 0 0 .5rem; }
.ap-sub { color: var(--ap-muted); margin: 0; }
.ap-link { background: none; border: none; color: var(--ap-muted); font-weight: 600; cursor: pointer; font-size: .85rem; font-family: var(--ap-ffb); }
.ap-link:hover { color: var(--ap-acc); }
.ap-card, .ap-note, .ap-flash { background: var(--ap-surf); color: var(--ap-txt, inherit); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 16px); padding: 1.15rem 1.35rem; }
.ap-flash { margin-bottom: 1rem; }

/* Botões */
.ap-btn { display: inline-block; border-radius: var(--ap-rb); padding: .55rem 1.1rem; font-weight: 600;
	font-family: var(--ap-ffb); font-size: .9rem; text-decoration: none; border: 2px solid transparent; cursor: pointer; line-height: 1; }
.ap-btn-primary { background: var(--ap-acc); color: var(--ap-acc-txt); }
.ap-btn-primary:hover { background: var(--lemon-2); transform: translateY(-1px); }
.ap-btn-primary:disabled { opacity: .5; cursor: default; }
.ap-btn-ghost { background: transparent; border-color: var(--ap-bord); color: var(--ap-txt); }

/* App shell */
.ap-app { display: flex; gap: 0; min-height: 100vh; background: var(--ap-bg); overflow: visible; width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.ap-rail { position: fixed; top: 0; left: 0; z-index: 40; box-sizing: border-box; width: 232px; height: 100vh; background: var(--ap-surf); border-right: 1px solid var(--ap-bord); padding: 22px 14px; display: flex; flex-direction: column; gap: 20px; overflow-y: auto; }
.ap-rail-brand { padding: 6px 8px; }
.ap-rail-logo { max-height: 38px; width: auto; }
.ap-rail-logo-text { font-family: var(--ap-ffh); font-weight: 700; }
.ap-rail-nav { display: flex; flex-direction: column; gap: 4px; }
.ap-rib { display: flex; align-items: center; gap: .65rem; text-align: left; background: none; border: none; border-radius: 10px; padding: .6rem .8rem; font-size: .92rem; font-weight: 600;
	color: var(--ap-dim); cursor: pointer; font-family: var(--ap-ffb); border-left: 3px solid transparent; transition: background .15s, color .15s; }
.ap-rib-ico { flex: 0 0 auto; display: inline-flex; }
.ap-rib-ico svg { width: 19px; height: 19px; display: block; }
.ap-rib-short { display: none; }
.ap-rib:hover { background: var(--ap-raised); }
.ap-rib.is-active { color: var(--ap-txt); background: var(--ap-acc-d); border-left-color: var(--ap-acc); box-shadow: inset 0 0 0 1px rgba(232,198,31,.08); }
.ap-rib.is-active .ap-rib-ico { color: var(--ap-acc); }
.ap-rail-foot { padding-top: 12px; border-top: 1px solid var(--ap-bord); }
.ap-rail-logout { display: flex; align-items: center; gap: .55rem; color: var(--ap-muted); text-decoration: none; font-size: .9rem; font-weight: 600; padding: .6rem .8rem; border-radius: 10px; }
.ap-rail-logout:hover { color: var(--ap-acc); background: var(--ap-raised); }
.ap-rail-logout-ico { width: 18px; height: 18px; display: inline-flex; flex: 0 0 auto; }
.ap-rail-logout-ico svg { width: 18px; height: 18px; }

.ap-main { flex: 1; min-width: 0; padding: 34px 44px; margin-left: 232px; }
.ap-main > * { max-width: 1040px; margin-left: auto; margin-right: auto; }
.ap-appbar { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.ap-sec-title { font-family: var(--ap-ffh); font-weight: 700; font-size: 1.25rem; }
.ap-appbar-right { display: flex; align-items: center; gap: .6rem; }
.ap-theme-toggle { background: var(--ap-raised); border: 1px solid var(--ap-bord); border-radius: var(--ap-rb); width: 34px; height: 34px; cursor: pointer; color: var(--ap-txt); font-size: 15px; }

.ap-brands { display: flex; gap: .35rem; flex-wrap: wrap; }
.ap-brand { padding: .35rem .8rem; border-radius: var(--ap-rb); background: var(--ap-raised); color: var(--ap-txt); text-decoration: none; font-weight: 600; font-size: .82rem; }
.ap-brand.is-active { background: var(--ap-acc); color: var(--ap-acc-txt); }

/* Secções / vistas */
.ap-sec { display: none; }
.ap-sec.is-on { display: block; }
.ap-view { display: none; }
.ap-view.is-on { display: block; }

/* Início */
.ap-home-head { margin-bottom: 1.4rem; }
.ap-greet { font-family: var(--ap-ffh); font-size: 1.6rem; font-weight: 300; }
.ap-greet strong { font-weight: 700; }
.ap-qa { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 320px)); justify-content: start; gap: .8rem; margin-bottom: 1.4rem; }
.ap-qa-card { position: relative; display: flex; align-items: flex-start; gap: .7rem; text-align: left; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc);
	padding: 1rem 1.1rem; cursor: pointer; font-family: var(--ap-ffb); color: var(--ap-txt); text-decoration: none; }
.ap-qa-card:hover { border-color: var(--ap-acc); }
.ap-qa-ico { flex: 0 0 auto; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.ap-qa-ico svg { width: 22px; height: 22px; }
.ap-qa-tx { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.ap-qa-t { font-size: .95rem; font-weight: 700; }
.ap-qa-d { font-size: .8rem; font-weight: 400; color: var(--ap-muted); line-height: 1.3; }
.ap-qa-primary { background: var(--ap-acc); color: var(--ap-acc-txt); border-color: var(--ap-acc); }
.ap-qa-primary .ap-qa-d { color: var(--ap-acc-txt); opacity: .82; }
.ap-qa-badge { position: absolute; top: 10px; right: 12px; background: var(--ap-acc-txt); color: var(--ap-acc); font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: var(--ap-rb); }
.ap-qa-badge.is-soon { background: var(--ap-raised); color: var(--ap-muted); }
.ap-qa-soon { cursor: default; opacity: .72; }
.ap-qa-soon:hover { border-color: var(--ap-bord); }
@media (max-width: 640px) { .ap-qa { grid-template-columns: 1fr; } }
/* Área do Cliente dentro do tema: mantém o logo da plataforma no cabeçalho,
   esconde apenas o menu de marketing (e os botões Login/Começar) e o rodapé.
   Scripts e avisos mantêm-se (correm fora destes elementos). */
body.auto-pilot-app .site-header { display: none !important; }
body.auto-pilot-app .site-footer { display: none !important; }
/* Rodapé da Área do Cliente (copyright + legais) */
.ap-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1.2rem; margin-top: 1.6rem; padding: 1rem 0 .3rem; border-top: 1px solid var(--ap-bord); color: var(--ap-muted); font-size: .78rem; }
.ap-footer-legal { display: inline-flex; gap: 1.1rem; }
.ap-footer-legal a { color: var(--ap-muted); text-decoration: none; }
.ap-footer-legal a:hover { color: var(--ap-acc); }

/* Este CSS só carrega nas páginas da Área do Cliente (ver maybe_enqueue_assets),
   por isso esconder o ícone flutuante do Complianz aqui não afeta o site público:
   fica sempre visível/"a espreitar" por defeito, o link "Cookies" no rodapé
   acima substitui-o para reabrir as preferências. */
.cmplz-manage-consent,
.cmplz-cookiebanner-container .cmplz-manage-consent { display: none !important; }
.ap-redes-summary { display: flex; align-items: center; gap: .8rem; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc); padding: .9rem 1.1rem; margin-bottom: 1.4rem; }
.ap-redes-summary-t { font-weight: 700; font-size: .85rem; }
.ap-redes-summary-n { color: var(--ap-muted); font-size: .85rem; }
.ap-redes-dots { display: flex; gap: .3rem; margin-left: auto; }
.ap-dot { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; background: var(--ap-raised); color: var(--ap-muted); }
.ap-dot.is-on { background: var(--ap-acc-d); color: var(--ap-acc); }
.ap-home-pending-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
.ap-home-list { display: flex; flex-direction: column; gap: .5rem; }
.ap-home-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1.4rem 0; align-items: start; }
.ap-home-camp .ap-home-pending-hd, .ap-home-alerts .ap-h { margin-bottom: .6rem; }
.ap-alert-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; width: 100%; text-align: left; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); padding: .6rem .8rem; font: inherit; font-family: var(--ap-ffb); font-size: .85rem; font-weight: 600; color: var(--ap-txt); cursor: pointer; }
.ap-alert-row:hover { border-color: var(--ap-acc); }
.ap-alert-row-text { flex: 1; min-width: 0; }
.ap-alert-row-arrow { color: var(--ap-muted); flex: none; }
.ap-alert-row-dismiss { flex: none; color: var(--ap-muted); font-size: 1.1rem; line-height: 1; padding: .1rem .3rem; border-radius: 4px; }
.ap-alert-row-dismiss:hover { color: var(--ap-txt); background: var(--ap-bord); }
/* Recomendação longa no Painel (14/09): título resumido + seta para expandir o
   texto completo numa linha própria, em vez de despejar tudo sempre visível. */
.ap-alert-row-expand { flex: none; color: var(--ap-muted); font-size: .75rem; line-height: 1; padding: .1rem .35rem; border-radius: 4px; }
.ap-alert-row-expand:hover { color: var(--ap-txt); background: var(--ap-bord); }
.ap-alert-row-full { flex: 1 0 100%; color: var(--ap-muted); font-weight: 400; font-size: .8rem; margin-top: .2rem; }
@media (max-width: 720px) { .ap-home-grid { grid-template-columns: 1fr; } }

/* Linhas (home / arquivo / agenda) */
.ap-row { display: flex; align-items: center; gap: .8rem; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); padding: .6rem .8rem; cursor: pointer; }
.ap-row:hover { border-color: var(--ap-acc); }
.ap-row-thumb { width: 46px; height: 46px; border-radius: 8px; overflow: hidden; flex-shrink: 0; background: var(--ap-raised); }
.ap-row-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ap-row-info { flex: 1; min-width: 0; }
.ap-row-copy { font-size: .85rem; color: var(--ap-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 4px; }
.ap-row-meta { display: flex; align-items: center; gap: .5rem; }

/* Agenda */
.ap-agenda-month { font-family: var(--ap-ffh); font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ap-muted); margin: 1rem 0 .5rem; }

/* Vistas / filtros */
.ap-views { display: flex; gap: .4rem; margin-bottom: 1rem; border-bottom: 1px solid var(--ap-bord); }
.ap-view-tab { background: none; border: none; border-bottom: 2px solid transparent; padding: .5rem .8rem; font-weight: 600; font-size: .9rem; color: var(--ap-muted); cursor: pointer; font-family: var(--ap-ffb); margin-bottom: -1px; }
.ap-view-tab.is-active { color: var(--ap-txt); border-bottom-color: var(--ap-acc); }
.ap-pills { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 1rem; }
.ap-pill-f { background: var(--ap-raised); border: none; border-radius: var(--ap-rb); padding: .35rem .9rem; font-size: .82rem; font-weight: 600; color: var(--ap-dim); cursor: pointer; font-family: var(--ap-ffb); }
.ap-pill-f.is-active { background: var(--ap-acc); color: var(--ap-acc-txt); }

/* Grelha de cartões */
.ap-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; }
.ap-post { background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc); overflow: hidden; display: flex; flex-direction: column; cursor: pointer; transition: opacity .3s, border-color .18s; }
.ap-post:hover { border-color: var(--ap-acc); }
.ap-post.is-done { opacity: .45; }
.ap-post-img img { width: 100%; height: auto; display: block; }
.ap-post-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .5rem; }
.ap-post-meta { display: flex; align-items: center; gap: .5rem; font-size: .78rem; color: var(--ap-muted); flex-wrap: wrap; }
.ap-copy { margin: 0; color: var(--ap-txt); font-size: .9rem; }
.ap-hashtags { margin: 0; color: var(--ap-dim); font-size: .85rem; }
.ap-post-actions { display: flex; gap: .5rem; margin-top: .3rem; flex-wrap: wrap; }
.ap-post-status { margin: .2rem 0 0; font-size: .82rem; color: var(--ap-muted); min-height: 1em; }

/* Botão "Dar feedback das leads" — colado ao cartão de campanha mas visualmente
   separado (borda no topo), sempre visível em campanhas de Leads. Bolinha vermelha
   com "!" quando o motor recomenda mesmo dar feedback (pedir_feedback_leads). */
.ap-camp-feedback { padding: .6rem 1.1rem .8rem; border-top: 1px solid var(--ap-bord); }
.ap-camp-feedback-btn { position: relative; width: 100%; text-align: center; }
.ap-camp-feedback-dot { position: absolute; top: -7px; right: -7px; width: 18px; height: 18px; border-radius: 50%; background: #d92d2d; color: #fff; font-size: .68rem; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--ap-surf); }

/* Marca virtual "GERAL" no seletor + resumo agregado do Painel nesse estado. */
.ap-rail-logo-geral { font-family: var(--ap-ffh); }
.ap-brandsw-geral { font-weight: 700; border-bottom: 1px solid var(--ap-bord); }
.ap-resumo-periodo { display: flex; gap: .5rem; margin-bottom: .8rem; }
.ap-resumo-marcas { display: flex; flex-direction: column; gap: .6rem; margin-top: .6rem; }
.ap-resumo-marca { display: block; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 14px); padding: .8rem 1rem; text-decoration: none; color: inherit; position: relative; transition: border-color .15s ease; }
.ap-resumo-marca:hover { border-color: var(--ap-acc); }
.ap-resumo-marca.has-pend { border-color: rgba(217,45,45,.35); }
.ap-resumo-marca-nome { font-weight: 700; font-family: var(--ap-ffh); font-size: .95rem; margin-bottom: .3rem; }
.ap-resumo-marca-nums { display: flex; gap: 1.4rem; }
.ap-resumo-marca-v { font-weight: 700; font-variant-numeric: tabular-nums; font-size: .88rem; }
.ap-resumo-marca-l { font-size: .7rem; color: var(--ap-muted); text-transform: uppercase; letter-spacing: .03em; }
.ap-resumo-marca-semdados { font-size: .82rem; color: var(--ap-muted); }
/* O selo de pendencias e VERMELHO — le-se como alarme. Um "—" (nao consegui
   contar) nesse vermelho afirmava urgencia a partir de uma falha de leitura, que
   e o mesmo defeito que este fix veio corrigir, so que em CSS. Cinzento: e uma
   ausencia de informacao, nao um estado do negocio do cliente. */
.ap-resumo-pend.is-incerto { background: #9aa0a6; font-weight: 600; }
.ap-resumo-pend { position: absolute; top: -8px; right: 14px; background: #d92d2d; color: #fff; font-size: .68rem; font-weight: 700; border-radius: 999px; padding: .15rem .55rem; }

/* Estados */
.ap-stat { font-size: .72rem; font-weight: 700; padding: 2px 8px; border-radius: var(--ap-rb); }
.ap-stat.is-pend { background: var(--ap-acc-d); color: var(--ap-acc); }
.ap-stat.is-appr { background: rgba(96,165,250,.16); color: #93c5fd; }
.ap-stat.is-pub { background: rgba(74,222,128,.15); color: #86efac; }
.ap-stat.is-adj { background: rgba(251,146,60,.16); color: #fdba74; }
.ap-stat.is-rej { background: rgba(248,113,113,.16); color: #fca5a5; }
.ap-stat.is-cancel { background: rgba(148,163,184,.16); color: #94a3b8; }

/* Cancelar publicação agendada */
.ap-btn-ghost.ap-cancel { color: #fca5a5; border-color: rgba(248,113,113,.35); }
.ap-btn-ghost.ap-cancel:hover { background: rgba(248,113,113,.10); }

/* Redes */
.ap-redes-list { display: flex; gap: .8rem; flex-wrap: wrap; }
.ap-rede { display: flex; align-items: center; gap: .6rem; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); padding: .7rem 1rem; }
.ap-rede-nome { font-weight: 600; }
.ap-pill { font-size: .8rem; padding: .15rem .6rem; border-radius: var(--ap-rb); }
.ap-pill.is-on { background: var(--ap-acc-d); color: var(--ap-acc); }
.ap-pill.is-off { background: var(--ap-raised); color: var(--ap-muted); }
.ap-pill-funil { font-size: .72rem; padding: .15rem .55rem; border-radius: var(--ap-rb); font-weight: 600; }
.ap-pill-funil--tofu { background: rgba(59,130,246,.14); color: #3b82f6; }
.ap-pill-funil--mofu { background: rgba(245,158,11,.14); color: #f59e0b; }
.ap-pill-funil--bofu { background: rgba(34,197,94,.14); color: #16a34a; }
.ap-log-otim { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.ap-log-otim li { font-size: .78rem; color: var(--ap-muted); padding: .4rem .6rem; background: var(--ap-raised); border-radius: 8px; line-height: 1.4; }

/* Conta */
.ap-conta-row { display: flex; justify-content: space-between; padding: .5rem 0; border-bottom: 1px solid var(--ap-bord); }
.ap-conta-row:last-child { border-bottom: none; }
.ap-conta-k { color: var(--ap-muted); }
.ap-conta-v { font-weight: 600; }

.ap-conta-layout { display: grid; grid-template-columns: 176px minmax(0,1fr); gap: 2.2rem; align-items: start; margin-top: 1.3rem; }
@media (max-width: 860px) { .ap-conta-layout { grid-template-columns: 1fr; } }

.ap-conta-rail { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: .15rem; }
@media (max-width: 860px) { .ap-conta-rail { position: static; flex-direction: row; overflow-x: auto; gap: .4rem; padding-bottom: .6rem; margin-bottom: -.2rem; } }
.ap-conta-rail-link { display: flex; align-items: center; gap: .55rem; padding: .5rem .65rem; border-radius: 10px; color: var(--ap-muted); text-decoration: none; font-weight: 600; font-size: .85rem; border: 1px solid transparent; white-space: nowrap; transition: background .18s ease, border-color .18s ease, color .18s ease; }
.ap-conta-rail-link svg { flex: none; opacity: .75; transition: opacity .18s ease, color .18s ease; }
.ap-conta-rail-link:hover { background: var(--ap-raised); color: var(--ap-txt); }
.ap-conta-rail-link.is-active { background: var(--ap-surf); border-color: var(--ap-bord); color: var(--ap-txt); box-shadow: 0 1px 3px rgba(20,16,8,.05); }
.ap-conta-rail-link.is-active svg { opacity: 1; color: var(--ap-gold); }
@media (max-width: 860px) { .ap-conta-rail-link.is-active { background: var(--ap-acc-d); border-color: transparent; } }

.ap-conta-col { display: flex; flex-direction: column; gap: 2.4rem; min-width: 0; }
.ap-conta-sect { scroll-margin-top: 1rem; display: flex; flex-direction: column; gap: .85rem; }
.ap-conta-sect-h { font-family: var(--ap-ffh); font-weight: 700; font-size: 1.05rem; margin: 0; }
.ap-conta-sub-h { margin-top: .6rem; font-size: .92rem; }

.ap-conta-profile { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.ap-conta-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--ap-acc-d); color: var(--ap-gold); display: flex; align-items: center; justify-content: center; font-family: var(--ap-ffh); font-weight: 700; font-size: 1.05rem; flex: none; }
.ap-conta-profile-nome { font-family: var(--ap-ffh); font-weight: 700; font-size: 1.05rem; margin: 0; }
.ap-conta-profile-marca { color: var(--ap-muted); font-size: .85rem; margin: .1rem 0 0; }
.ap-conta-profile-meta { display: flex; flex-direction: column; gap: .3rem; margin-left: auto; }
.ap-conta-profile-meta .ap-conta-row { padding: 0; border-bottom: none; gap: .6rem; justify-content: flex-start; font-size: .85rem; }
.ap-conta-profile-meta .ap-conta-k { min-width: 4.6rem; }
@media (max-width: 560px) { .ap-conta-profile-meta { margin-left: 0; } }

.ap-conta-theme-row { display: flex; align-items: center; justify-content: space-between; }
.ap-conta-theme-row .ap-card-h { margin: 0; }
.ap-conta-theme-btn { background: var(--ap-raised); border: 1px solid var(--ap-bord); border-radius: var(--ap-rb); width: 38px; height: 38px; cursor: pointer; color: var(--ap-txt); display: flex; align-items: center; justify-content: center; flex: none; }
.ap-conta-theme-btn:hover { border-color: var(--ap-acc); }

.ap-conta-grid2 { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.1rem; align-items: stretch; }
@media (max-width: 700px) { .ap-conta-grid2 { grid-template-columns: 1fr; } }

.ap-conta-plan-top { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.ap-conta-plan-name { font-family: var(--ap-ffh); font-weight: 700; font-size: 1.05rem; margin: 0; }

.ap-status-pill { display: inline-flex; align-items: center; gap: .4rem; font-size: .76rem; font-weight: 700; padding: .28rem .65rem; border-radius: 99px; background: var(--ap-raised); color: var(--ap-muted); flex: none; }
.ap-status-pill .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ap-status-pill.is-active { background: rgba(91,122,82,.14); color: #5b7a52; }
.ap-status-pill.is-trial { background: var(--ap-acc-d); color: var(--ap-gold); }
.ap-status-pill.is-warn { background: rgba(179,70,50,.12); color: #b34632; }

.ap-conta-renew-notice { display: flex; align-items: flex-start; gap: .55rem; background: var(--ap-raised); border-radius: var(--ap-rbd); padding: .7rem .85rem; margin-top: .9rem; font-size: .82rem; color: var(--ap-dim); line-height: 1.4; }
.ap-conta-renew-notice svg { margin-top: .1rem; color: var(--ap-muted); }

/* Sobre o negócio: textarea preenche o cartão, não fica curta com margem vazia à volta */
.ap-negocio-card { display: flex; flex-direction: column; height: 100%; }
.ap-negocio-form { flex: 1; min-height: 0; }
.ap-negocio-form textarea.ap-input { flex: 1; min-height: 160px; }

/* As minhas marcas */
.ap-marcas-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.ap-marcas-item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .55rem .3rem .55rem .8rem; border-radius: var(--ap-rbd); background: var(--ap-raised); font-weight: 600; font-size: .9rem; }
.ap-remove-brand { flex: none; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: none; border-radius: 50%; color: var(--ap-muted); font-size: 1rem; line-height: 1; cursor: pointer; transition: background .15s, color .15s; }
.ap-remove-brand:hover { background: rgba(179,70,50,.12); color: #b34632; }

/* Equipa: mais respiro entre pessoas e checkboxes como chips, não caixas azuis nativas */
.ap-equipa-card { display: flex; flex-direction: column; gap: 1.1rem; }
.ap-equipa-list { display: flex; flex-direction: column; gap: .7rem; }
.ap-equipa-pessoa { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem .9rem; padding: .8rem .9rem; border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); background: var(--ap-raised); }
.ap-equipa-pendente { flex-direction: column; align-items: flex-start; }
.ap-equipa-nome { font-weight: 700; font-size: .88rem; flex: none; min-width: 9rem; }
.ap-equipa-checks { display: flex; flex-wrap: wrap; gap: .4rem; flex: 1; }
.ap-equipa-check { display: inline-flex; align-items: center; gap: .4rem; font-size: .78rem; font-weight: 600; color: var(--ap-dim); background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: 99px; padding: .32rem .7rem .32rem .55rem; cursor: pointer; transition: border-color .15s, background .15s, color .15s; user-select: none; }
.ap-equipa-check:has(input:checked) { background: var(--ap-acc-d); border-color: transparent; color: var(--ap-gold); }
.ap-equipa-check input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 13px; height: 13px; border-radius: 4px; border: 1.5px solid var(--ap-bord); background: var(--ap-surf); position: relative; margin: 0; flex: none; cursor: pointer; }
.ap-equipa-check input[type="checkbox"]:checked { background: var(--ap-gold); border-color: var(--ap-gold); }
.ap-equipa-check input[type="checkbox"]:checked::after { content: ""; position: absolute; left: 3px; top: 0px; width: 4px; height: 8px; border: solid var(--ap-surf); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ap-equipa-pessoa .ap-btn { flex: none; padding: .4rem .8rem; font-size: .8rem; }
.ap-equipa-status { flex-basis: 100%; font-size: .78rem; color: var(--ap-muted); min-height: 1em; }
.ap-equipa-convidar { border-top: 1px solid var(--ap-bord); padding-top: 1rem; }
.ap-equipa-convidar-h { font-family: var(--ap-ffh); font-weight: 700; font-size: .85rem; margin: 0; }
.ap-equipa-convidar .ap-equipa-checks { margin: .2rem 0 .3rem; }
.ap-equipa-convidar-status { display: block; font-size: .78rem; color: var(--ap-muted); min-height: 1em; margin-top: .4rem; }

/* Drawer */
.ap-drawer { position: fixed; inset: 0; z-index: 9999; }
.ap-drawer[hidden] { display: none; }
.ap-drawer-bg { position: absolute; inset: 0; background: rgba(0,0,0,.45); opacity: 0; transition: opacity .2s; }
.ap-drawer.is-open .ap-drawer-bg { opacity: 1; }
.ap-drawer-panel { position: absolute; top: 0; right: 0; height: 100%; width: min(460px, 92vw); background: var(--ap-surf); border-left: 1px solid var(--ap-bord);
	transform: translateX(100%); transition: transform .25s ease; overflow-y: auto; display: flex; flex-direction: column; }
.ap-drawer.is-open .ap-drawer-panel { transform: translateX(0); }
.ap-drawer-x { position: absolute; top: 12px; right: 14px; background: var(--ap-raised); border: none; border-radius: 50%; width: 32px; height: 32px; font-size: 18px; cursor: pointer; color: var(--ap-txt); }
.ap-drawer-img img { width: 100%; height: auto; display: block; }
.ap-drawer-body { padding: 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .7rem; }
.ap-drawer-meta { font-size: .8rem; color: var(--ap-muted); }
.ap-drawer-copy { margin: 0; white-space: pre-wrap; }
.ap-drawer-actions { display: flex; gap: .5rem; margin-top: .4rem; flex-wrap: wrap; }

/* Toast */
.ap-toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(20px); background: var(--ap-txt); color: var(--ap-bg);
	padding: .7rem 1.2rem; border-radius: var(--ap-rb); font-size: .88rem; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 10000; }
.ap-toast.is-on { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Chatbot de IA (widget flutuante, canto inferior direito) */
.ap-chatbot { position: fixed; right: 20px; bottom: 20px; z-index: 9500; }
.ap-chatbot-fab { width: 76px; height: 76px; border-radius: 0; border: 0; background: none; cursor: pointer; padding: 0; transition: transform .15s; overflow: visible; }
.ap-chatbot-fab:hover { transform: translateY(-2px) scale(1.03); }
.ap-chatbot-fab img { width: 100%; height: 100%; object-fit: contain; display: block; filter: drop-shadow(0 6px 14px rgba(20,16,8,.28)); }
.ap-chatbot-hint { position: absolute; right: calc(100% + 10px); bottom: 22px; max-width: 150px; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: 12px; padding: .4rem .65rem; font-size: .74rem; line-height: 1.3; color: var(--ap-txt); box-shadow: 0 6px 16px rgba(20,16,8,.16); white-space: normal; }
.ap-chatbot-hint::after { content: ""; position: absolute; left: 100%; bottom: 14px; border-style: solid; border-width: 6px 0 6px 7px; border-color: transparent transparent transparent var(--ap-surf); }
.ap-chatbot-hint[hidden] { display: none; }
.ap-chatbot-panel[hidden] { display: none; }
.ap-chatbot-panel { position: absolute; right: 0; bottom: 88px; width: min(340px, calc(100vw - 40px)); max-height: min(480px, calc(100vh - 120px)); background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 16px); box-shadow: 0 20px 50px rgba(0,0,0,.28); display: flex; flex-direction: column; overflow: hidden; }
.ap-chatbot-head { display: flex; align-items: center; gap: .6rem; padding: .8rem .9rem; border-bottom: 1px solid var(--ap-bord); background: var(--ap-raised); }
.ap-chatbot-head-img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; }
.ap-chatbot-head-txt { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.ap-chatbot-head-txt strong { font-size: .88rem; }
.ap-chatbot-head-txt span { font-size: .74rem; color: var(--ap-muted); }
.ap-chatbot-close { background: none; border: 0; font-size: 1.2rem; line-height: 1; color: var(--ap-muted); cursor: pointer; padding: .2rem .3rem; flex: none; }
.ap-chatbot-close:hover { color: var(--ap-txt); }
.ap-chatbot-messages { flex: 1; overflow-y: auto; padding: .8rem .9rem; display: flex; flex-direction: column; gap: .5rem; min-height: 160px; }
.ap-chatbot-msg { max-width: 88%; padding: .5rem .7rem; border-radius: 12px; font-size: .85rem; line-height: 1.4; white-space: pre-wrap; animation: ap-msg-in .22s ease-out; }
.ap-chatbot-msg.is-bot { align-self: flex-start; background: var(--ap-raised); color: var(--ap-txt); border-bottom-left-radius: 4px; }
.ap-chatbot-msg.is-user { align-self: flex-end; background: var(--ap-acc); color: var(--ap-acc-txt); border-bottom-right-radius: 4px; }
.ap-chatbot-msg.is-typing { opacity: .6; font-style: italic; }
/* Bolha de resposta editável (reutilizável por outros chats deste género — ver
   campChatAppend()/campChatEditTo() em dashboard.js): texto + lápis pequeno,
   só visível/focável quando o rato passa por cima ou por teclado. */
.ap-chatbot-msg.is-user.has-edit { display: flex; align-items: center; gap: .4rem; }
.ap-chatbot-msg-text { white-space: pre-wrap; }
.ap-campchat-edit-btn { flex: none; border: 0; background: transparent; color: inherit; opacity: .55; cursor: pointer; font-size: .85rem; line-height: 1; padding: .1rem .15rem; border-radius: 4px; transition: opacity .15s; }
.ap-campchat-edit-btn:hover, .ap-campchat-edit-btn:focus-visible { opacity: 1; }
@keyframes ap-msg-in { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ap-chatbot-msg { animation: none; } }

/* Bolha "a escrever…" estilo WhatsApp/Messenger — 3 pontos a saltar em sequência. */
.ap-chatbot-msg.ap-typing-bubble { display: flex; align-items: center; gap: 3px; padding: .65rem .8rem; }
.ap-chatbot-msg.ap-typing-bubble span { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .4; animation: ap-typing-dot 1.1s infinite ease-in-out; }
.ap-chatbot-msg.ap-typing-bubble span:nth-child(2) { animation-delay: .15s; }
.ap-chatbot-msg.ap-typing-bubble span:nth-child(3) { animation-delay: .3s; }
@keyframes ap-typing-dot { 0%, 60%, 100% { opacity: .4; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .ap-chatbot-msg.ap-typing-bubble span { animation: none; opacity: .7; } }
.ap-chatbot-escalate[hidden] { display: none; }
.ap-chatbot-escalate { padding: .5rem .9rem; border-top: 1px solid var(--ap-bord); background: var(--ap-raised); display: flex; flex-direction: column; gap: .4rem; }
.ap-chatbot-escalate p { margin: 0; font-size: .8rem; color: var(--ap-muted); }
.ap-chatbot-form { display: flex; gap: .5rem; padding: .7rem .9rem; border-top: 1px solid var(--ap-bord); }
.ap-chatbot-form input { flex: 1; padding: .5rem .7rem; font-size: .85rem; }
.ap-chatbot-form button { padding: .5rem .9rem; font-size: .85rem; white-space: nowrap; }
@media (max-width: 640px) { .ap-chatbot { right: 12px; bottom: 12px; } .ap-chatbot-fab { width: 64px; height: 64px; } .ap-chatbot-panel { bottom: 76px; } .ap-chatbot-hint { display: none; } }

/* Login */
.ap-auth { max-width: 440px; margin: 3rem auto; padding: 1.5rem 1rem; }
.ap-auth-card { background: var(--ap-raised); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 16px); padding: 2rem 1.8rem; }
.ap-auth .ap-h { text-align: center; font-size: 1.45rem; margin-bottom: .35rem; }
.ap-auth .ap-sub { text-align: center; margin-bottom: 1.4rem; }
.ap-form { display: flex; flex-direction: column; gap: .7rem; }
.ap-input { width: 100%; box-sizing: border-box; background: var(--ap-surf); color: var(--ap-txt); border: 2px solid var(--ap-bord); border-radius: var(--r-input, 8px); padding: .7rem .9rem; font-size: 1rem; }
.ap-input:focus { outline: none; border-color: var(--ap-acc); }
.ap-form .ap-btn { width: 100%; justify-content: center; }
.ap-remember { justify-content: flex-start; margin: .1rem 0 .3rem; }

/* Responsivo — padrão de app: barra de marca no topo + barra de separadores em baixo */
@media (max-width: 760px) {
	/* A rail "dissolve-se" em barras independentes. */
	.ap-app { display: block; border: none; border-radius: 0; background: transparent; min-height: 0; width: auto; max-width: none; margin-left: 0; margin-right: 0; }
	.ap-rail { display: contents; position: static; height: auto; }
	.ap-rail-bottom { display: contents; }

	/* Barra superior fixa: marca à esquerda, terminar sessão à direita. */
	.ap-rail-brand { position: fixed; top: 0; left: 0; right: 0; z-index: 60; display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 16px; background: var(--ap-surf); border-bottom: 1px solid var(--ap-bord); }
	.ap-rail-foot { position: fixed; top: 0; right: 6px; z-index: 61; height: 52px; display: flex; align-items: center; border-top: none; padding: 0; }
	.ap-rail-logout { padding: .4rem .55rem; }
	.ap-rail-logout span:last-child { display: none; }

	/* Barra de separadores fixa em baixo (ao alcance do polegar). */
	.ap-rail-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 60; flex-direction: row; gap: 0; justify-content: space-around; align-items: flex-end; background: var(--ap-surf); border-top: 1px solid var(--ap-bord); padding: 7px 6px calc(7px + env(safe-area-inset-bottom)); }
	.ap-rib { flex: 1; flex-direction: column; align-items: center; gap: 4px; border-left: none; border-radius: 12px; padding: 5px 4px; font-size: 0; background: none; color: var(--ap-muted); min-height: 44px; }
	.ap-rib:hover { background: none; }
	.ap-rib .ap-rib-label { display: none; }
	.ap-rib .ap-rib-short { display: block; font-size: 10.5px; font-weight: 600; line-height: 1; }
	.ap-rib-ico { padding: 4px 16px; border-radius: 999px; transition: background .18s, color .18s; }
	.ap-rib-ico svg { width: 23px; height: 23px; }
	.ap-rib.is-active { background: none; box-shadow: none; border-left-color: transparent; }
	.ap-rib.is-active .ap-rib-ico { color: var(--ap-acc); background: var(--ap-acc-d); }
	.ap-rib.is-active .ap-rib-short { color: var(--ap-acc); }

	/* Conteúdo: folga para as barras fixas (topo e fundo). */
	.ap-main { padding: 64px 14px 88px; margin-left: 0; }
	.ap-form { flex-direction: column; }
}

/* Estado sem marca (utilizador registado, ainda sem marca associada) */
.ap-app--solo { display: block; background: var(--ap-bg); border-radius: var(--ap-rc); }
.ap-app--solo .ap-main { max-width: 640px; margin: 0 auto; }

/* Refinos de mensagens / estados */
.ap-note { color: var(--ap-dim); border: 1px solid var(--ap-bord); }
.ap-flash { border-left: 3px solid var(--ap-acc); }
.ap-app--solo .ap-main { padding-top: 32px; }
.ap-app--solo .ap-greet { margin-bottom: .6rem; }

/* ---- Bloco de Insights (mascote + balão de fala) ---- */
.ap-rail-bottom { margin-top: auto; display: flex; flex-direction: column; gap: 14px; }
.ap-ib { text-align: center; }
.ap-ib-mascote { width: 72px; height: 72px; object-fit: contain; }
.ap-ib-bubble { position: relative; margin-top: 10px; background: var(--ap-raised, #f0e8e0); border: 1px solid var(--ap-bord, #e6ddd3); border-radius: 14px; padding: .7rem .85rem; text-align: left; }
.ap-ib-bubble::before { content: ""; position: absolute; left: 50%; top: -9px; transform: translateX(-50%); border-style: solid; border-width: 0 9px 9px 9px; border-color: transparent transparent var(--ap-bord, #e6ddd3) transparent; }
.ap-ib-bubble::after { content: ""; position: absolute; left: 50%; top: -8px; transform: translateX(-50%); border-style: solid; border-width: 0 8px 8px 8px; border-color: transparent transparent var(--ap-raised, #f0e8e0) transparent; }
.ap-ib-eyebrow { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ap-acc, #E2C720); margin-bottom: .25rem; }
.ap-ib-text { margin: 0; color: var(--ap-txt, inherit); line-height: 1.45; font-size: .9rem; }
.ap-ib-fresh { margin: .5rem 0 0; font-size: .76rem; color: var(--ap-muted, #8a7f74); }
.ap-ib-rail .ap-ib-bubble { max-height: 42vh; overflow: auto; }
/* Métricas (por baixo dos pendentes) */
.ap-insight-metrics { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; }
.ap-insight-metric { background: var(--ap-raised, #f0e8e0); border: 1px solid var(--ap-bord, #e6ddd3); border-radius: 12px; padding: .5rem .8rem; min-width: 96px; }
.ap-insight-metric-v { display: block; font-size: 1.15rem; font-weight: 700; color: var(--ap-txt, inherit); }
.ap-insight-metric-l { display: block; font-size: .72rem; color: var(--ap-muted, #8a7f74); text-transform: uppercase; letter-spacing: .03em; }
/* Mascote: barra no PC, home no mobile */
.ap-ib-home { display: none; }
@media (max-width: 760px) {
	.ap-ib-rail { display: none; }
	.ap-ib-home { display: block; margin-top: 1.2rem; }
}

/* ---- Carrossel (galeria de publicações) ---- */
.ap-carrossel { position: relative; }
.ap-carrossel-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ap-carrossel-track::-webkit-scrollbar { display: none; }
.ap-carrossel-slide { flex: 0 0 100%; scroll-snap-align: center; }
.ap-carrossel-slide img { display: block; width: 100%; height: auto; }
.ap-carrossel-count { position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,.68); color: #fff; font-size: .8rem; font-weight: 600; line-height: 1; padding: 5px 10px; border-radius: 999px; pointer-events: none; z-index: 2; }
.ap-carrossel-dots { position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; gap: 6px; }
.ap-carrossel-dot { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.55); cursor: pointer; }
.ap-carrossel-dot.is-active { background: #fff; }
.ap-carrossel-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: 1.5rem; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; transition: background .15s; }
.ap-carrossel-nav:hover { background: rgba(0,0,0,.78); }
.ap-carrossel-prev { left: 8px; }
.ap-carrossel-next { right: 8px; }
.ap-row-thumb { position: relative; }
.ap-row-multi { position: absolute; right: 3px; bottom: 3px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: rgba(0,0,0,.65); color: #fff; font-size: .64rem; line-height: 16px; text-align: center; }

/* ---- Alterar data (date picker sob post pendente) ---- */
.ap-reschedule { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--ap-bord, #e6ddd3); }
.ap-resched-label { display: block; font-size: .76rem; color: var(--ap-muted, #8a7f74); margin-bottom: 6px; }
.ap-resched-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ap-resched-date { flex: 1 1 150px; min-width: 140px; padding: .45rem .6rem; border: 1px solid var(--ap-bord, #e6ddd3); border-radius: 10px; background: var(--ap-raised, #fff); color: inherit; font: inherit; }
.ap-resched-status { margin: .4rem 0 0; font-size: .76rem; color: var(--ap-muted, #8a7f74); min-height: 1em; }

/* ---- Modal "Pedir ajustes" ---- */
.ap-modal { position: fixed; inset: 0; z-index: 10000 !important; display: flex; align-items: center; justify-content: center; padding: 16px; }
.ap-modal[hidden] { display: none; }
.ap-modal-bg { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.ap-modal-panel { position: relative; z-index: 1; width: 100%; max-width: 380px; background: var(--ap-surf, #fff); color: var(--ap-txt, inherit); border: 1px solid var(--ap-bord, #e0d5cb); border-radius: var(--ap-rc, 16px); padding: 20px; box-shadow: 0 20px 50px rgba(0,0,0,.28); }
.ap-modal-x { position: absolute; top: 8px; right: 10px; border: 0; background: transparent; font-size: 1.4rem; line-height: 1; cursor: pointer; color: inherit; }
.ap-modal-title { margin: 0 0 .25rem; font-size: 1.1rem; }
.ap-modal-lead { margin: .25rem 0 1rem; color: var(--ap-muted); }
.ap-adj-choices { display: flex; flex-direction: column; gap: 10px; }
.ap-adj-pick { width: 100%; }
.ap-adj-datebox .ap-resched-label { display: block; margin-bottom: .4rem; font-weight: 600; }
.ap-adj-when { width: 100%; padding: .55rem .7rem; border: 1px solid var(--ap-bord); border-radius: 10px; background: var(--ap-raised); color: var(--ap-txt); font: inherit; }
.ap-adj-actions { display: flex; gap: 10px; margin-top: 12px; }
.ap-adj-actions .ap-btn { flex: 1; }
.ap-adj-status { margin: .6rem 0 0; min-height: 1em; font-size: .82rem; color: var(--ap-muted); }

/* ---- Editor de rascunho de Redes Sociais ---- */
.ap-rascunho-tipo { display: flex; gap: 14px; margin: .3rem 0 .8rem; flex-wrap: wrap; }
.ap-rascunho-tipo label { display: flex; align-items: center; gap: 6px; font-size: .88rem; cursor: pointer; }
.ap-rascunho-preview { list-style: none; margin: .5rem 0; padding: 0; font-size: .8rem; color: var(--ap-muted); display: flex; flex-wrap: wrap; gap: .5rem; }
.ap-rascunho-preview li { padding: .2rem 0; }
/* Preview a sério do criativo (14/09, pedido do dono) — antes só mostrava o
   nome do ficheiro em texto. */
.ap-rascunho-preview-item { padding: 0 !important; }
.ap-rascunho-preview-media { max-width: 140px; max-height: 140px; border-radius: 6px; display: block; object-fit: cover; }
.ap-rascunho-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.ap-rascunho-actions .ap-btn { flex: 1; min-width: 140px; }
.ap-rascunho-status { margin: .6rem 0 0; min-height: 1em; font-size: .82rem; color: var(--ap-muted); }

/* ---- Opção "Manter sessão iniciada" (login) ---- */
.ap-remember { display: flex; align-items: center; gap: .5rem; font-size: .88rem; color: var(--ap-muted); cursor: pointer; margin: -.2rem 0 .2rem; }
.ap-remember input { width: auto; margin: 0; }

/* ---- Briefing ---- */
.ap-h3 { font-size: 1rem; margin: 1.6rem 0 .6rem; }
.ap-brief { background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 16px); margin-bottom: .8rem; overflow: hidden; }
.ap-brief-sum { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .9rem 1.1rem; cursor: pointer; list-style: none; font-family: var(--ap-ffb); font-weight: 600; color: var(--ap-txt); }
.ap-brief-sum::-webkit-details-marker { display: none; }
.ap-brief-mes { font-size: 1rem; }
.ap-brief-status { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--ap-muted); background: var(--ap-raised); border-radius: 999px; padding: 3px 10px; }
.ap-brief-body { padding: 0 1.1rem 1.1rem; }
.ap-brief-meta { color: var(--ap-muted); font-size: .8rem; margin: 0 0 .8rem; }
.ap-brief-block { margin: 0 0 1rem; }
.ap-brief-block h4 { margin: 0 0 .3rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ap-muted); }
.ap-brief-block p { margin: 0; line-height: 1.5; }
.ap-brief-imgs { display: flex; flex-wrap: wrap; gap: .6rem; }
.ap-brief-imgs a { display: block; width: 96px; height: 96px; border-radius: 10px; overflow: hidden; border: 1px solid var(--ap-bord); }
.ap-brief-imgs img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---- Calendário (vista Publicações) ---- */
.ap-cal-nav { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: .9rem; }
.ap-cal-title { font-family: var(--ap-ffb); font-weight: 600; min-width: 11rem; text-align: center; }
.ap-cal-prev, .ap-cal-next { width: 32px; height: 32px; border: 1px solid var(--ap-bord); background: var(--ap-surf); color: var(--ap-txt); border-radius: 50%; cursor: pointer; font-size: 1.2rem; line-height: 1; }
.ap-cal-prev[disabled], .ap-cal-next[disabled] { opacity: .35; cursor: default; }
.ap-cal-dows { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 6px; }
.ap-cal-dows span { text-align: center; font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ap-muted); }
.ap-cal { display: none; }
.ap-cal.is-on { display: block; }
.ap-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.ap-cal-day { min-height: 84px; border: 1px solid var(--ap-bord); border-radius: 10px; padding: 4px; background: var(--ap-surf); display: flex; flex-direction: column; gap: 3px; overflow: hidden; }
.ap-cal-day.is-empty { border: 0; background: transparent; }
.ap-cal-d { font-size: .72rem; color: var(--ap-muted); }
.ap-cal-post { text-align: left; border: 0; border-left: 3px solid var(--ap-acc); background: var(--ap-raised); color: var(--ap-txt); border-radius: 4px; padding: 3px 6px; font-size: .72rem; line-height: 1.2; cursor: pointer; max-width: 100%; display: flex; align-items: center; gap: 5px; }
/* Miniatura + hora na grelha do calendário (14/09, pedido do dono) — sem
   precisar de abrir o post para reconhecer o quê/quando. */
.ap-cal-post-thumb { width: 20px; height: 20px; border-radius: 3px; object-fit: cover; flex: 0 0 auto; }
.ap-cal-post-tx { display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.ap-cal-post-hora { font-size: .62rem; opacity: .7; line-height: 1; }
.ap-cal-post-tit { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-cal-post:hover { filter: brightness(1.06); }
.ap-cal-post[draggable="true"] { cursor: grab; }
.ap-cal-post.is-dragging { opacity: .45; cursor: grabbing; }
.ap-cal-post.is-saving { opacity: .6; pointer-events: none; }
.ap-cal-day.is-dragover { border-color: var(--ap-acc); box-shadow: inset 0 0 0 2px var(--ap-acc); }
.ap-cal-post.is-draft { border-left-style: dashed; background: transparent; color: var(--ap-muted); font-style: italic; }
.ap-cal-add { align-self: flex-start; border: 1px dashed var(--ap-bord); background: transparent; color: var(--ap-muted); border-radius: 4px; width: 18px; height: 18px; line-height: 1; font-size: .8rem; cursor: pointer; padding: 0; opacity: 0; transition: opacity .12s; }
.ap-cal-day:hover .ap-cal-add, .ap-cal-add:focus-visible { opacity: 1; }
.ap-cal-draft-form { display: flex; flex-direction: column; gap: 3px; }
.ap-cal-draft-form input { font-size: .72rem; padding: 2px 4px; border-radius: 4px; border: 1px solid var(--ap-bord); background: var(--ap-surf); color: var(--ap-txt); width: 100%; box-sizing: border-box; }
.ap-cal-draft-form-row { display: flex; gap: 3px; }
.ap-cal-draft-form-row button { font-size: .68rem; padding: 1px 5px; border-radius: 4px; border: 0; cursor: pointer; }
.ap-cal-draft-save { background: var(--ap-acc); color: var(--ap-acc-txt); }
.ap-cal-draft-cancel { background: transparent; color: var(--ap-muted); }
.ap-brief-empty { color: var(--ap-muted); font-size: .85rem; font-style: italic; margin: .2rem 0 0; }
@media (max-width: 760px) {
	.ap-cal-day { min-height: 54px; border-radius: 8px; }
	.ap-cal-post { font-size: .62rem; padding: 2px 4px; border-left-width: 2px; }
	.ap-cal-post-thumb { width: 14px; height: 14px; }
	.ap-cal-d { font-size: .62rem; }
	.ap-cal-dows span { font-size: .6rem; }
}

/* ---- Edição manual de Copy/Hashtags (detalhe do post pendente) ---- */
.ap-drawer-edit { display: none; margin: .2rem 0 1rem; }
.ap-edit-label { display: block; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ap-muted); margin: .8rem 0 .3rem; }
.ap-edit-copy, .ap-edit-tags { display: block; width: 100%; box-sizing: border-box; background: var(--ap-surf); color: var(--ap-txt); border: 1px solid var(--ap-bord); border-radius: 10px; padding: .6rem .75rem; font: inherit; font-size: .92rem; line-height: 1.5; resize: vertical; }
.ap-edit-copy:focus, .ap-edit-tags:focus { outline: none; border-color: var(--ap-acc); }
.ap-edit-actions { margin-top: .8rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.ap-edit-status { margin: .5rem 0 0; font-size: .8rem; color: var(--ap-muted); min-height: 1em; }

/* ---- Headline visual no detalhe + CTA briefing ---- */
.ap-drawer-headline { margin: .2rem 0 .5rem; font-family: var(--ap-ffb); font-weight: 700; font-size: 1.15rem; line-height: 1.2; color: var(--ap-txt); }
.ap-brief-cta { margin: 0 0 1.1rem; }

/* ---- Seletor de marca (multimarca por conta — opcional, ativável no backoffice) ---- */
.ap-brandsw { margin: 0 0 .7rem; }
.ap-brandsw-sum { display: flex; align-items: center; justify-content: space-between; gap: .5rem; cursor: pointer; list-style: none; padding: .4rem .6rem; border: 1px solid var(--ap-bord); border-radius: 10px; font-size: .82rem; }
.ap-brandsw-sum::-webkit-details-marker { display: none; }
.ap-brandsw-cur { font-weight: 600; color: var(--ap-txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-brandsw-cta { color: var(--ap-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .03em; flex: 0 0 auto; }
.ap-brandsw-list { margin-top: .35rem; display: flex; flex-direction: column; gap: 2px; }
.ap-brandsw-search { position: relative; display: flex; align-items: center; margin: 2px 0 .4rem; }
.ap-brandsw-search svg { position: absolute; left: .55rem; width: 14px; height: 14px; color: var(--ap-muted); pointer-events: none; }
.ap-brandsw-search input { width: 100%; padding: .4rem .6rem .4rem 1.9rem; border: 1px solid var(--ap-bord); border-radius: 8px; background: var(--ap-surf); color: var(--ap-txt); font-size: .82rem; }
.ap-brandsw-search input:focus { outline: none; border-color: var(--ap-acc); }
.ap-brandsw-results { display: flex; flex-direction: column; gap: 2px; max-height: 45vh; overflow-y: auto; }
.ap-brandsw-item { display: block; padding: .45rem .6rem; border-radius: 8px; color: var(--ap-txt); text-decoration: none; font-size: .85rem; }
.ap-brandsw-item:hover { background: var(--ap-raised); }
.ap-brandsw-item.is-active { background: var(--ap-raised); font-weight: 600; }
.ap-brandsw-item[hidden] { display: none; }
.ap-brandsw-empty { margin: .4rem .6rem 0; color: var(--ap-muted); font-size: .82rem; }
.ap-brandsw-empty[hidden] { display: none; }

/* ---- Painel de formulário Tally (secção dedicada) ---- */
.ap-tally-head { margin-bottom: .8rem; }
.ap-tally-back { display: inline-flex; align-items: center; gap: .25rem; }
.ap-tally-frame { width: 100%; }
.ap-tally-iframe { width: 100%; min-height: 70vh; border: 0; display: block; background: transparent; }
.ap-tally-fallback { margin: .8rem 0 0; text-align: center; font-size: .8rem; }
.ap-tally-fallback a { color: var(--ap-muted); }
/* Envolvente estilo "conversa" à volta do formulário Tally: balão de boas-vindas da
   mascote seguido do formulário, como se fosse a próxima mensagem na mesma conversa
   (sem alterar o Tally em si — só a apresentação à volta). */
.ap-tally-chat { background: var(--ap-raised, #f0e8e0); border-radius: 18px; padding: 1rem; }
.ap-tally-chatmsg { display: flex; align-items: flex-start; gap: .6rem; margin-bottom: .75rem; }
.ap-tally-chatmsg-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: contain; background: var(--ap-surf, #fff); flex: 0 0 auto; }
.ap-tally-chatmsg-bubble { background: var(--ap-surf, #fff); border: 1px solid var(--ap-bord, #e6ddd3); border-radius: 4px 14px 14px 14px; padding: .6rem .8rem; font-size: .88rem; line-height: 1.4; color: var(--ap-txt, inherit); }
.ap-tally-chat .ap-tally-frame { background: var(--ap-surf, #fff); border-radius: 14px 14px 14px 4px; overflow: hidden; margin-left: 44px; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.ap-tally-chat .ap-tally-iframe { min-height: 60vh; }
.ap-campchat-messages { display: flex; flex-direction: column; gap: .5rem; max-height: 50vh; overflow-y: auto; margin: 0 0 .8rem 44px; padding-right: .2rem; }
.ap-campchat-input { margin-left: 44px; }
.ap-campchat-choices { display: flex; flex-wrap: wrap; gap: .5rem; }
.ap-campchat-choice-btn { background: var(--ap-surf); border: 2px solid var(--ap-bord); border-radius: 999px; padding: .5rem 1rem; font-size: .85rem; font-weight: 600; cursor: pointer; color: var(--ap-txt); transition: border-color .15s; }
.ap-campchat-choice-btn:hover { border-color: var(--ap-acc); }
.ap-campchat-row { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.ap-campchat-row .ap-campchat-field { flex: 1; min-width: 200px; }
/* Seletor "promover publicação existente do Instagram" (10/09). Cartão desativado até
   a elegibilidade confirmar (ver campChatIgCarregarElegibilidade em dashboard.js) —
   opacidade + cursor refletem esse estado "ainda não sei", nunca assumido elegível. */
.ap-campchat-ig-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: .6rem; max-width: 460px; }
.ap-campchat-ig-card { position: relative; border: 2px solid var(--ap-bord); border-radius: 10px; padding: 0; overflow: hidden; background: var(--ap-surf); cursor: pointer; aspect-ratio: 1; transition: border-color .15s, opacity .15s; }
.ap-campchat-ig-card:hover:not(:disabled) { border-color: var(--ap-acc); }
.ap-campchat-ig-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ap-campchat-ig-card:disabled { cursor: default; opacity: .45; }
.ap-campchat-ig-card.is-inelegivel { opacity: .35; }
.ap-campchat-ig-badge { position: absolute; top: 4px; left: 4px; background: rgba(0,0,0,.6); color: #fff; font-size: .68rem; font-weight: 600; padding: .1rem .4rem; border-radius: 6px; }
.ap-campchat-ig-status { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.6); color: #fff; font-size: .65rem; text-align: center; padding: .2rem; line-height: 1.2; }
.ap-campchat-ig-status:empty { display: none; }
@media (max-width: 640px) { .ap-campchat-messages, .ap-campchat-input { margin-left: 0; } }
@media (max-width: 480px) {
	.ap-tally-chat .ap-tally-frame { margin-left: 0; }
}

/* ---- Palavra-passe (conta) + login ---- */
.ap-pass-card { margin-top: 1rem; }
/* Passo de 1º acesso: definir palavra-passe (destacado). */
/* --- Início Rápido (onboarding guiado) --- */
.ap-qs-head { margin-bottom: 1rem; }
.ap-qs-steps { display: flex; align-items: center; gap: .4rem; list-style: none; margin: 0 0 1.4rem; padding: 0; }
.ap-qs-step { display: flex; align-items: center; gap: .5rem; flex: 0 0 auto; color: var(--ap-muted); font-size: .85rem; font-weight: 600; }
.ap-qs-step:not(:last-child)::after { content: ""; width: 22px; height: 2px; background: var(--ap-bord); margin: 0 .3rem; }
.ap-qs-num { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700; background: var(--ap-raised); color: var(--ap-muted); border: 1px solid var(--ap-bord); }
.ap-qs-step.is-current .ap-qs-num { background: var(--ap-acc); color: var(--ap-acc-txt); border-color: var(--ap-acc); }
.ap-qs-step.is-current { color: var(--ap-txt); }
.ap-qs-step.is-done .ap-qs-num { background: var(--ap-acc-d); color: var(--ap-acc); border-color: transparent; }
.ap-qs-card { margin-bottom: 1rem; }
.ap-qs-card .ap-h3 { margin-top: 0; }
.ap-qs-preparing { border-left: 3px solid var(--ap-acc); }
.ap-qs-processing .ap-btn { opacity: .6; cursor: default; pointer-events: none; }
.ap-qs-hint { color: var(--ap-muted); font-size: .85rem; margin: .6rem 0 0; }

.ap-firstrun { border-left: 3px solid var(--ap-acc); margin-bottom: 1rem; }
.ap-firstrun .ap-pw-dismiss { display: inline-block; margin-top: .5rem; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; color: var(--ap-muted); text-decoration: underline; }
/* Mostrar/ocultar palavra-passe. */
.ap-pw-wrap { position: relative; display: block; }
.ap-pw-wrap .ap-input { width: 100%; padding-right: 2.6rem; }
.ap-pw-toggle { position: absolute; right: .4rem; top: 50%; transform: translateY(-50%); background: none; border: 0; padding: .2rem .3rem; cursor: pointer; font-size: 1.05rem; line-height: 1; opacity: .75; }
.ap-pw-toggle:hover { opacity: 1; }
.ap-card-h { margin: 0 0 .3rem; font-size: 1rem; }
.ap-pass-form { display: flex; flex-direction: column; gap: .5rem; max-width: 360px; }
.ap-pass-status { margin: .2rem 0 0; font-size: .85rem; color: var(--ap-muted); }
.ap-login-hint { margin: .8rem 0 0; font-size: .82rem; color: var(--ap-muted); text-align: center; }
.ap-login-link { margin-top: .2rem; }

/* ---- Login com Google (Site Kit) ---- */
.ap-or { display: flex; align-items: center; gap: .75rem; color: var(--ap-muted); font-size: .8rem; margin: 1rem 0; }
.ap-or::before, .ap-or::after { content: ""; flex: 1; height: 1px; background: var(--ap-bord); }
.ap-google-login { display: flex; justify-content: center; }
.ap-google-note { margin-top: 1rem; }

/* ---- Avisos aos clientes (escritos no backoffice) ---- */
.ap-alerts { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.2rem; }
.ap-alert { display: flex; align-items: flex-start; gap: .6rem; padding: .8rem 1rem; border-radius: var(--ap-rc, 12px); border-left: 4px solid var(--ap-acc); background: var(--ap-raised); color: var(--ap-txt); font-size: .9rem; }
.ap-alert-msg { line-height: 1.5; }
.ap-alert--info { border-left-color: #3b82f6; }
.ap-alert--sucesso { border-left-color: #22c55e; }
.ap-alert--aviso { border-left-color: #f59e0b; }

/* ---- Aviso de NPS (discreto, não bloqueante) ---- */
.ap-nps { position: relative; margin-bottom: 1.2rem; padding: .9rem 2.4rem .9rem 1rem; border-radius: var(--ap-rc, 12px); border: 1px solid var(--ap-bord); background: var(--ap-raised); }
.ap-nps-close { position: absolute; top: .5rem; right: .5rem; width: 1.6rem; height: 1.6rem; line-height: 1; font-size: 1.2rem; color: var(--ap-muted); background: transparent; border: 0; border-radius: 4px; cursor: pointer; }
.ap-nps-close:hover { color: var(--ap-txt); background: var(--ap-bord); }
.ap-nps-q-text { font-size: .9rem; font-weight: 600; color: var(--ap-txt); margin-bottom: .6rem; }
.ap-nps-scale { display: flex; flex-wrap: wrap; gap: .4rem; }
.ap-nps-pill { min-width: 2.1rem; padding: .4rem .3rem; text-align: center; font: inherit; font-family: var(--ap-ffb); font-size: .85rem; font-weight: 600; color: var(--ap-txt); background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); cursor: pointer; }
.ap-nps-pill:hover { border-color: var(--ap-acc); }
.ap-nps-pill.is-selected { background: var(--ap-acc); color: var(--ap-acc-txt); border-color: var(--ap-acc); }
.ap-nps-scale-labels { display: flex; justify-content: space-between; margin-top: .35rem; font-size: .75rem; color: var(--ap-muted); }
.ap-nps-followup { margin-top: .8rem; }
.ap-nps-comment { width: 100%; min-height: 4.5rem; padding: .6rem .7rem; font: inherit; font-family: var(--ap-ffb); font-size: .85rem; color: var(--ap-txt); background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); resize: vertical; }
.ap-nps-actions { margin-top: .6rem; display: flex; justify-content: flex-end; }
.ap-nps-thanks { font-size: .9rem; font-weight: 600; color: var(--ap-txt); }

/* ---- Swipe de estilo visual ---- */
.ap-estilo-visual-atual { display: flex; flex-wrap: wrap; gap: .4rem; margin: .6rem 0; }
.ap-estilo-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.55); padding: 1rem; }
.ap-estilo-modal-inner { position: relative; width: 100%; max-width: 420px; background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rc, 16px); padding: 1.5rem; text-align: center; }
.ap-estilo-modal-close { position: absolute; top: .6rem; right: .6rem; width: 1.8rem; height: 1.8rem; font-size: 1.3rem; line-height: 1; color: var(--ap-muted); background: transparent; border: 0; border-radius: 4px; cursor: pointer; }
.ap-estilo-modal-close:hover { color: var(--ap-txt); background: var(--ap-bord); }
.ap-estilo-stack { position: relative; width: 100%; max-width: 320px; height: 320px; margin: 1rem auto; }
.ap-estilo-card { position: absolute; inset: 0; display: flex; flex-direction: column; border-radius: var(--ap-rc, 16px); border: 1px solid var(--ap-bord); background: var(--ap-surf); overflow: hidden; cursor: grab; touch-action: pan-y; transition: transform .38s cubic-bezier(.2,.8,.2,1), opacity .38s ease; will-change: transform, opacity; }
.ap-estilo-card:active { cursor: grabbing; }
.ap-estilo-card[data-ap-behind="0"] { transform: translate(0,0) rotate(0deg) scale(1); z-index: 3; opacity: 1; }
.ap-estilo-card[data-ap-behind="1"] { transform: translateY(10px) scale(.95); z-index: 2; opacity: 1; }
.ap-estilo-card[data-ap-behind="2"] { transform: translateY(18px) scale(.9); z-index: 1; opacity: .7; }
.ap-estilo-card.ap-is-dragging { transition: none; }
.ap-estilo-card.ap-swipe-out-right { transform: translate(160%, -8%) rotate(28deg) !important; opacity: 0 !important; }
.ap-estilo-card.ap-swipe-out-left { transform: translate(-160%, -8%) rotate(-28deg) !important; opacity: 0 !important; }
.ap-estilo-card-visual { width: 100%; flex: 1 1 auto; min-height: 0; object-fit: cover; background: var(--ap-raised); display: block; pointer-events: none; -webkit-user-drag: none; user-select: none; }
.ap-estilo-card-label { flex: 0 0 auto; padding: .7rem .9rem .3rem; font-size: .95rem; font-weight: 700; color: var(--ap-txt); text-align: left; pointer-events: none; }
.ap-estilo-card-objetivo { flex: 0 0 auto; margin: 0 .9rem .8rem; padding: .4rem .6rem; font-size: .78rem; font-weight: 600; line-height: 1.3; color: #78350f; background: #fef9c3; border: 1px solid #eab308; border-radius: 3px; transform: rotate(-1.5deg); text-align: left; pointer-events: none; box-shadow: 1px 2px 3px rgba(0,0,0,.15); }
.ap-estilo-card-stamp { position: absolute; top: 1rem; padding: .3rem .8rem; border: 3px solid; border-radius: 8px; font-weight: 800; font-size: 1.05rem; text-transform: uppercase; letter-spacing: .05em; opacity: 0; transition: opacity .12s ease; pointer-events: none; background: rgba(255,255,255,.85); }
.ap-estilo-card-stamp--like { right: 1rem; color: #22c55e; border-color: #22c55e; transform: rotate(10deg); }
.ap-estilo-card-stamp--nope { left: 1rem; color: #ef4444; border-color: #ef4444; transform: rotate(-10deg); }
.ap-estilo-actions { display: flex; gap: .8rem; justify-content: center; margin-top: .4rem; }
.ap-estilo-dislike, .ap-estilo-like { flex: 1; max-width: 160px; padding: .7rem 1rem; border-radius: 9999px; font-weight: 700; font-size: .95rem; cursor: pointer; border: 1px solid var(--ap-bord); background: var(--ap-raised); color: var(--ap-txt); }
.ap-estilo-like { border-color: #ef4444; color: #ef4444; }
.ap-estilo-dislike:hover { background: var(--ap-bord); }
.ap-estilo-like:hover { background: rgba(239,68,68,.1); }
.ap-estilo-progress { margin-top: .8rem; font-size: .8rem; color: var(--ap-muted); }
.ap-estilo-result-chips { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin: .8rem 0; }
.ap-estilo-result-actions { display: flex; gap: .8rem; justify-content: center; align-items: center; margin-top: .6rem; }

/* ---------------------------------------------------------- Ficha da Marca */
.ap-brand-state { border-left: 4px solid var(--ap-acc); }
.ap-brand-state-t { font-weight: 600; color: var(--ap-txt); margin: 0 0 .25rem; }
.ap-brand-state-d { color: var(--ap-muted); font-size: .9rem; margin: 0; line-height: 1.6; }
.ap-brand-logos .ap-logo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.ap-logo-box { margin: 0; border-radius: 10px; overflow: hidden; border: 1px solid var(--ap-bord); }
.ap-logo-box img { display: block; width: 100%; height: 110px; object-fit: contain; padding: .75rem; }
.ap-logo-light img { background: #FAF1EA; }
.ap-logo-dark img { background: #13100E; }
.ap-logo-box figcaption { font-size: .78rem; color: var(--ap-muted); text-align: center; padding: .4rem; border-top: 1px solid var(--ap-bord); }
.ap-swatches { display: flex; flex-wrap: wrap; gap: .6rem; }
.ap-swatch { display: flex; flex-direction: column; align-items: center; gap: .35rem; }
.ap-swatch-c { width: 48px; height: 48px; border-radius: 8px; border: 1px solid var(--ap-bord); }
.ap-swatch-h { font-family: var(--ap-ffb); font-size: .72rem; color: var(--ap-muted); }
.ap-brand-txt { color: var(--ap-txt); line-height: 1.7; font-size: .92rem; margin: 0 0 .5rem; }
.ap-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .5rem; }
.ap-chip { font-size: .8rem; padding: .25rem .7rem; border-radius: 9999px; border: 1px solid var(--ap-bord); color: var(--ap-muted); background: var(--ap-surf); }
.ap-chip-accent { color: var(--ap-acc-txt); background: var(--ap-acc); border-color: var(--ap-acc); }
.ap-brand-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 1.5rem; }
.ap-brand-actions .ap-btn { flex: 1 1 auto; text-align: center; }

/* --- Feedback imediato: aprovar post + ligar redes (sem F5) --- */
.ap-post.is-leaving {
	transition: opacity .35s ease, transform .35s ease;
	opacity: 0;
	transform: scale(.97);
	pointer-events: none;
}
.ap-post.is-done .ap-post-actions { display: none; }
.ap-rede-state { font-size: .85rem; opacity: .85; margin: 0 .4rem; }
.ap-rede-state.is-connecting::before {
	content: "";
	display: inline-block;
	width: .8em; height: .8em;
	margin-right: .4em;
	vertical-align: -.1em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: ap-spin .7s linear infinite;
}
@keyframes ap-spin { to { transform: rotate(360deg); } }
.ap-rede.is-justconnected { animation: ap-flash 1.3s ease; }
@keyframes ap-flash {
	0% { background: rgba(120, 220, 150, .28); }
	100% { background: transparent; }
}

/* --- Seletor de paginas (Headless connect, marca Auto-pilot) --- */
.ap-picker-ov {
	position: fixed; inset: 0; z-index: 9999;
	background: rgba(0,0,0,.6);
	display: flex; align-items: center; justify-content: center;
	padding: 1rem;
}
.ap-picker {
	background: #1a1a1a; color: #fff;
	border-radius: 16px; padding: 1.5rem;
	width: 100%; max-width: 420px;
	max-height: 80vh; overflow-y: auto;
	box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.ap-picker-h { margin: 0 0 1rem; font-size: 1.1rem; }
.ap-picker-list { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; min-height: 2rem; }
.ap-picker-item {
	display: flex; align-items: center; gap: .7rem;
	width: 100%; text-align: left;
	background: rgba(255,255,255,.06); color: #fff;
	border: 1px solid rgba(255,255,255,.12); border-radius: 12px;
	padding: .7rem .9rem; cursor: pointer; font: inherit;
	transition: background .15s;
}
.ap-picker-item:hover { background: rgba(255,255,255,.14); }
.ap-picker-pic { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.ap-picker-name { font-weight: 600; }

/* ---- Posts de exemplo (revisão do sistema visual) ---- */
.ap-exemplos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:8px}
.ap-exemplo{margin:0}
.ap-exemplo img{width:100%;height:auto;border-radius:12px;display:block;box-shadow:0 2px 12px rgba(0,0,0,.25)}

/* ---- Subscrição (Stripe Customer Portal) ---- */
.ap-sub-summary { margin-bottom: 1rem; }
.ap-sub-dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1rem; margin: 0; }
.ap-sub-dl div { display: flex; flex-direction: column; gap: .2rem; }
.ap-sub-dl dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ap-muted); }
.ap-sub-dl dd { margin: 0; font-weight: 600; color: var(--ap-txt); }
.ap-sub-manage { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.ap-sub-hint { margin: 0; color: var(--ap-dim); font-size: .92rem; line-height: 1.6; }
.ap-sub-status { margin: 0; font-size: .85rem; color: var(--ap-dim); min-height: 1em; }

/* =========================================================
   Ajustes de contraste — TEMA CLARO
   ========================================================= */
/* Amarelo como TEXTO é ilegível em fundo claro → dourado escuro. */
.ap-stat.is-pend, .ap-pill.is-on, .ap-dot.is-on, .ap-ib-eyebrow { color: var(--ap-gold); }
.ap-rib.is-active .ap-rib-ico, .ap-rib.is-active .ap-rib-short { color: var(--ap-gold); }
/* Pílulas de estado das publicações: texto escurecido para ler em claro. */
.ap-stat.is-appr { color: #1e5fa8; }
.ap-stat.is-pub  { color: #1c7a3c; }
.ap-stat.is-adj  { color: #a35a12; }
.ap-stat.is-rej  { color: #a32d2d; }
.ap-stat.is-cancel { color: #55606f; }
.ap-btn-ghost.ap-cancel { color: #a32d2d; border-color: rgba(163,45,45,.30); }
/* Seletor de páginas (estava fixo escuro) → claro. */
.ap-picker { background: var(--ap-surf); color: var(--ap-txt); box-shadow: 0 20px 60px rgba(0,0,0,.16); }
.ap-picker-h { color: var(--ap-txt); }
.ap-picker-item { background: var(--ap-raised); color: var(--ap-txt); border-color: var(--ap-bord); }
.ap-picker-item:hover { background: #efece4; }
/* Sombras subtis para dar profundidade premium (em vez de peso). */
.ap-qa-card, .ap-post, .ap-brief, .ap-rede { box-shadow: 0 1px 2px rgba(30,26,18,.03); }

/* =========================================================
   Tema ESCURO — alternável pelo cliente em "A minha conta".
   O JS põe data-theme="dark" em <html>; sem esta variante o
   botão não fazia nada (o tema claro estava fixo).
   ========================================================= */
:root[data-theme="dark"] .ap-app,
:root[data-theme="dark"] .ap-auth {
	--ap-bg:      #13100e;
	--ap-surf:    #1c1813;
	--ap-raised:  #241f18;
	--ap-bord:    #352e25;
	--ap-txt:     #f3efe6;
	--ap-dim:     #d8d0c2;
	--ap-muted:   #a89e8d;
	--ap-gold:    #E8C61F;
	--ap-acc:     #E8C61F;
	--ap-acc-txt: #1b1408;
	--ap-acc-d:   rgba(232,198,31,.18);
}
:root[data-theme="dark"] body.auto-pilot-app { background: #13100e; }
:root[data-theme="dark"] .ap-stat.is-appr { color: #93c5fd; }
:root[data-theme="dark"] .ap-stat.is-pub  { color: #86efac; }
:root[data-theme="dark"] .ap-stat.is-adj  { color: #fdba74; }
:root[data-theme="dark"] .ap-stat.is-rej  { color: #fca5a5; }
:root[data-theme="dark"] .ap-stat.is-cancel { color: #94a3b8; }
:root[data-theme="dark"] .ap-btn-ghost.ap-cancel { color: #fca5a5; border-color: rgba(248,113,113,.35); }
:root[data-theme="dark"] .ap-qa-card,
:root[data-theme="dark"] .ap-post,
:root[data-theme="dark"] .ap-brief,
:root[data-theme="dark"] .ap-rede { box-shadow: 0 1px 3px rgba(0,0,0,.4); }

/* Barra lateral: "A minha conta" colada ao terminar sessão, no fundo. */
.ap-rail-foot .ap-rib-account { width: 100%; margin-bottom: 4px; }
@media (max-width: 760px) {
	/* No topo (a par do terminar sessão): só o ícone, compacto. */
	.ap-rail-foot .ap-rib-account { width: auto; min-height: 0; padding: .35rem .5rem; background: none; }
	.ap-rail-foot .ap-rib-account .ap-rib-short { display: none; }
	.ap-rail-foot .ap-rib-account .ap-rib-ico { padding: 0; }
	.ap-rail-foot .ap-rib-account.is-active .ap-rib-ico { color: var(--ap-gold); background: none; }
}

/* ---- Popup de detalhe de campanha (Meta Ads — mais largo que o modal padrão) ---- */
.ap-modal-panel--wide { max-width: 680px; max-height: 88vh; overflow-y: auto; }

/* ---- Bolinha de estado (campanhas) — mais rápida de ler que texto "Ativa/Pausada" ---- */
.ap-status-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: none; }
.ap-status-dot.is-on { background: #22c55e; box-shadow: 0 0 0 2px rgba(34,197,94,.18); }
.ap-status-dot.is-off { background: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,.14); }

/* =========================================================
   Aprovação de criativos (Meta Ads › Por aprovar)
   Separador por campanha + cartão com media, título e as três
   decisões do cliente. Usa os tokens do tema, por isso segue
   claro/escuro sem cores fixas.
   ========================================================= */
.ap-cr-group { margin: 0 0 1.7rem; }
.ap-cr-group:last-child { margin-bottom: 0; }
.ap-cr-group-t {
	display: flex; align-items: baseline; flex-wrap: wrap; gap: .45rem;
	margin: 0 0 .9rem; padding: 0 0 .6rem; width: 100%;
	border: none; border-bottom: 1px solid var(--ap-bord); border-radius: 0;
	background: none; cursor: pointer; text-align: left;
	font-family: var(--ap-ffh); font-size: 1rem; font-weight: 700; color: var(--ap-txt);
}
.ap-cr-group-chev { color: var(--ap-muted); font-size: .8em; transition: transform .15s ease; transform: rotate(0deg); }
.ap-cr-group.is-collapsed .ap-cr-group-chev { transform: rotate(-90deg); }
.ap-cr-group-k { font-family: var(--ap-ffb); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ap-muted); }
.ap-cr-group-sep { color: var(--ap-muted); font-weight: 400; }
.ap-cr-group-count { margin-left: auto; font-family: var(--ap-ffb); font-size: .78rem; font-weight: 600; color: var(--ap-muted); }
.ap-cr-group.is-collapsed [data-ap-cr-group-body] { display: none; }

/* O cartão não abre detalhe — não deve fingir que é clicável. */
.ap-cr-card { cursor: default; }
.ap-cr-title { margin: 0; font-family: var(--ap-ffb); font-size: .95rem; font-weight: 700; line-height: 1.3; color: var(--ap-txt); }

/* Media em caixa preta: imagens verticais e vídeos ficam contidos, sem distorcer. */
.ap-cr-media { background: #000; }
.ap-cr-media > img, .ap-cr-media > video,
.ap-cr-media .ap-carrossel-slide > img, .ap-cr-media .ap-carrossel-slide > video {
	display: block; width: 100%; height: auto; max-height: 420px; object-fit: contain; background: #000;
}

/* Caixa de motivo (ajustes / rejeição). */
.ap-cr-fb { margin-top: .6rem; }
.ap-cr-fb-label { margin: 0 0 .4rem; font-size: .82rem; font-weight: 600; color: var(--ap-dim); }
.ap-cr-fb-switch { margin: .4rem 0 0; }

/* Três decisões — minimalista: fundo igual ao cartão, contorno leve por tipo;
   "Aprovar" destaca-se com o dourado da marca em vez de uma cor sólida. */
.ap-cr-card .ap-post-actions .ap-btn { flex: 1 1 auto; text-align: center; padding: .5rem .8rem; font-size: .85rem; }
.ap-btn-approve, .ap-btn-adjust, .ap-btn-reject { background: var(--ap-surf); color: var(--ap-txt); border: 2px solid var(--ap-bord); }
.ap-btn-approve { border-color: var(--ap-acc); color: var(--ap-gold); font-weight: 700; }
.ap-btn-approve:hover { background: var(--ap-acc-d); }
.ap-btn-adjust { border-color: rgba(224,138,23,.45); }
.ap-btn-adjust:hover { background: rgba(224,138,23,.08); }
.ap-btn-reject { border-color: rgba(209,64,58,.4); }
.ap-btn-reject:hover { background: rgba(209,64,58,.08); }
.ap-btn-approve:disabled, .ap-btn-adjust:disabled, .ap-btn-reject:disabled { opacity: .5; cursor: default; }
:root[data-theme="dark"] .ap-btn-adjust { border-color: rgba(255,159,67,.5); }
:root[data-theme="dark"] .ap-btn-adjust:hover { background: rgba(255,159,67,.10); }
:root[data-theme="dark"] .ap-btn-reject { border-color: rgba(255,92,92,.5); }
:root[data-theme="dark"] .ap-btn-reject:hover { background: rgba(255,92,92,.10); }

/* =========================================================
   Campanhas por lançar (Meta Ads › Campanhas)
   Cartão de revisão + detalhe no modal largo, antes de gastar
   dinheiro. Fica no topo, acima das campanhas já no ar.
   ========================================================= */
.ap-camp-pend { margin: 0 0 1.6rem; }
.ap-camp-card { border-left: 4px solid var(--ap-acc); margin-bottom: .8rem; }
.ap-camp-card-top { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.ap-camp-card-t { margin: 0; font-family: var(--ap-ffh); font-size: 1.05rem; font-weight: 700; color: var(--ap-txt); }
.ap-camp-card-top-r { display: flex; align-items: center; gap: .5rem; }
.ap-camp-delete-btn { padding: .3rem .6rem; font-size: .9rem; line-height: 1; }

.ap-camp-meta { display: flex; flex-wrap: wrap; gap: .6rem; margin: .9rem 0 1rem; }
.ap-camp-metric { background: var(--ap-raised); border: 1px solid var(--ap-bord); border-radius: 12px; padding: .5rem .8rem; min-width: 104px; }
.ap-camp-metric-v { display: block; font-size: 1.05rem; font-weight: 700; color: var(--ap-txt); }
.ap-camp-metric-l { display: block; font-size: .72rem; color: var(--ap-muted); text-transform: uppercase; letter-spacing: .03em; }

/* Detalhe no modal */
.ap-camp-dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .8rem; margin: 0 0 1.1rem; }
.ap-camp-dl div { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.ap-camp-dl dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ap-muted); }
.ap-camp-dl dd { margin: 0; font-weight: 600; color: var(--ap-txt); overflow-wrap: anywhere; }
.ap-camp-sub { margin: 1.1rem 0 .4rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ap-muted); }
.ap-camp-bloco .ap-copy { margin: 0; line-height: 1.55; }
.ap-camp-note { margin: .9rem 0 0; padding: .6rem .75rem; background: var(--ap-raised); border-radius: 8px; font-size: .82rem; color: var(--ap-dim); line-height: 1.5; }
.ap-camp-warn { margin: .6rem 0 0; padding: .6rem .75rem; border-left: 3px solid #e08a17; background: var(--ap-raised); border-radius: 8px; font-size: .84rem; color: var(--ap-txt); line-height: 1.5; }

.ap-camp-crs { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .7rem; }
.ap-camp-cr { margin: 0; border: 1px solid var(--ap-bord); border-radius: 10px; overflow: hidden; background: var(--ap-raised); }
.ap-camp-cr img { display: block; width: 100%; height: 120px; object-fit: cover; background: #000; }
.ap-camp-cr figcaption { padding: .4rem .5rem; font-size: .72rem; line-height: 1.3; color: var(--ap-muted); }
/* Eliminar criativo (07/09): reaproveita o botão de eliminar campanha; só precisa de
   caber dentro do cartão pequeno, que tem overflow:hidden e 120px de imagem. */
.ap-camp-cr-del { display: block; width: calc(100% - 1rem); margin: 0 .5rem .5rem; }
.ap-camp-cr .ap-camp-confirm { margin: 0 .5rem .5rem; }

.ap-camp-faltas { margin: 1rem 0 0; padding: .7rem .8rem .7rem 1.9rem; background: var(--ap-raised); border-left: 3px solid #d1403a; border-radius: 8px; color: var(--ap-txt); font-size: .86rem; line-height: 1.6; }
.ap-camp-confirm { margin: 1rem 0 .6rem; padding: .75rem .85rem; border-radius: 10px; border: 1px solid var(--ap-bord); background: var(--ap-raised); font-size: .88rem; line-height: 1.55; color: var(--ap-txt); }

/* ---- CRM / Funil de leads (01/09) ---- */
.ap-crm-fases { display: flex; flex-direction: column; gap: .5rem; }
.ap-crm-fase-row { display: flex; align-items: center; gap: .7rem; padding: .5rem .2rem; border-bottom: 1px solid var(--ap-bord); }
.ap-crm-fase-row:last-child { border-bottom: none; }
.ap-crm-fase-nome { flex: 1; min-width: 140px; }
.ap-crm-fase-show { display: flex; align-items: center; gap: .35rem; font-size: .82rem; color: var(--ap-muted); white-space: nowrap; }
.ap-crm-fase-order { display: flex; gap: .3rem; }
.ap-crm-fase-order .ap-link { font-size: 1rem; padding: 0 .2rem; }

/* ---- CRM: cabeçalho com "Editar fases" recolhido (04/09) ---- */
.ap-crm-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem; }
.ap-crm-fases-toggle { white-space: nowrap; flex-shrink: 0; margin-top: .2rem; }
.ap-crm-fases-panel { margin-bottom: 1rem; }

/* ---- CRM: lista compacta, expande ao clicar (04/09) ---- */
.ap-crm-lead-row { border-bottom: 1px solid var(--ap-bord); }
.ap-crm-lead-row:last-child { border-bottom: none; }
.ap-crm-lead-compact { display: flex; align-items: center; gap: .6rem; padding: .5rem .3rem; cursor: pointer; border-radius: var(--ap-rbd); }
.ap-crm-lead-compact:hover { background: var(--ap-raised); }
.ap-crm-lead-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.ap-crm-lead-nome-txt { font-weight: 700; font-size: .86rem; color: var(--ap-txt); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px; }
.ap-crm-lead-contacto-txt { font-size: .78rem; color: var(--ap-muted); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ap-crm-lead-valor-txt { font-size: .78rem; color: var(--ap-dim); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ap-crm-lead-fase-pill { font-size: .7rem; font-weight: 700; padding: .18rem .55rem; border-radius: 99px; white-space: nowrap; flex-shrink: 0; }
/* Ganho/Perdido é um estado à parte da fase — daí um pill próprio, mais pequeno. */
.ap-crm-lead-res-pill { font-size: .66rem; font-weight: 700; padding: .14rem .45rem; border-radius: 99px; white-space: nowrap; flex-shrink: 0; text-transform: uppercase; letter-spacing: .02em; }
/* Lead aberto e sem mexer há 14+ dias: aviso discreto, não alarme. */
.ap-crm-parado { color: #b0691f; font-weight: 600; }
.ap-crm-lead-acoes { display: flex; justify-content: flex-end; margin-top: .6rem; }
/* Ligar / WhatsApp / Email — as ações que se usam todos os dias, por isso ficam
   logo abaixo dos campos e não escondidas num menu. */
.ap-crm-contacto-acoes { display: flex; gap: .4rem; flex-wrap: wrap; margin: .5rem 0 .2rem; }
.ap-crm-acao { text-decoration: none; font-size: .78rem; padding: .32rem .7rem; }

/* Próxima ação: data + o que é para fazer, lado a lado. */
.ap-crm-proxima-acao { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin: .6rem 0 .2rem; }
.ap-crm-proxima-acao .ap-sub { flex-shrink: 0; }
.ap-crm-proxima-acao input[type="text"] { flex: 1; min-width: 160px; }

/* Sinais na linha compacta: "atrasada 3d" pesa mais do que "parado", por isso
   só se mostra um dos dois (ver crmLeadRow). */
.ap-crm-lead-acao-pill,
.ap-crm-lead-parado-pill { font-size: .66rem; font-weight: 700; padding: .14rem .45rem; border-radius: 99px; white-space: nowrap; flex-shrink: 0; }
.ap-crm-lead-acao-pill { background: #d1403a22; color: #d1403a; }
.ap-crm-lead-parado-pill { background: #b0691f22; color: #b0691f; }

/* Bloco "Para fazer" — a lista de trabalho do dia, no topo. */
.ap-crm-parafazer { margin-bottom: 1rem; border-left: 3px solid var(--ap-acc, #E8C61F); }
.ap-crm-pf-row { display: flex; align-items: center; gap: .6rem; padding: .4rem .2rem; border-bottom: 1px solid var(--ap-bord); }
.ap-crm-pf-row:last-child { border-bottom: none; }
.ap-crm-pf-nome { background: none; border: none; padding: 0; font: inherit; font-weight: 700; color: var(--ap-txt); cursor: pointer; text-align: left; white-space: nowrap; }
.ap-crm-pf-nome:hover { text-decoration: underline; }
.ap-crm-pf-nota { flex: 1; font-size: .8rem; color: var(--ap-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ap-crm-pf-quando { font-size: .72rem; font-weight: 700; color: var(--ap-dim); white-space: nowrap; }
.ap-crm-pf-quando.is-atrasada { color: #d1403a; }
.ap-crm-pf-wa { font-size: .75rem; white-space: nowrap; }
.ap-crm-arquivados-bar { margin-top: .8rem; }
.ap-crm-arquivados-bar:empty { display: none; }
.ap-crm-lead-chev { color: var(--ap-muted); font-size: .7rem; flex-shrink: 0; transition: transform .15s; }
.ap-crm-lead-row.is-expanded .ap-crm-lead-chev { transform: rotate(90deg); }
.ap-crm-lead-detail { display: none; padding: .2rem .3rem .8rem; }
.ap-crm-lead-row.is-expanded .ap-crm-lead-detail { display: block; }
.ap-crm-lead-fields { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.ap-crm-lead-fields .ap-input { flex: 1; min-width: 130px; width: auto; }
.ap-crm-lead-fase-select { max-width: 180px; }
.ap-crm-lead-notas { margin-top: .5rem; }
.ap-crm-notas-hist { display: flex; flex-direction: column; gap: .2rem; max-height: 140px; overflow-y: auto; }
.ap-crm-nota-linha { font-size: .82rem; color: var(--ap-dim); padding: .3rem .5rem; background: var(--ap-raised); border-radius: 8px; }
.ap-crm-nota-form { display: flex; gap: .4rem; margin-top: .4rem; }
.ap-crm-nota-form .ap-input { flex: 1; width: auto; }

/* ---- CRM: importação de leads via CSV (03/09) ---- */
.ap-crm-import-cols { display: flex; flex-wrap: wrap; gap: .8rem; }
.ap-crm-import-col { min-width: 160px; }
.ap-crm-import-col .ap-sub { margin-bottom: .25rem; overflow-wrap: anywhere; }
.ap-crm-import-preview-rows { display: flex; flex-direction: column; gap: .2rem; max-height: 200px; overflow-y: auto; }
.ap-crm-import-preview-row { display: flex; gap: .8rem; padding: .3rem .5rem; background: var(--ap-bord); border-radius: 8px; }
.ap-crm-import-preview-row span:first-child { flex: 1; }

/* ---- CRM: pesquisa + board/kanban + estatísticas (03/09) ---- */
.ap-crm-toolbar { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; margin: .8rem 0; }
.ap-crm-search { flex: 1; min-width: 220px; width: auto; }
.ap-crm-views { margin: 0; border-bottom: none; }

.ap-crm-board-cols { display: flex; gap: .8rem; overflow-x: auto; padding-bottom: .4rem; }
.ap-crm-col { flex: 0 0 220px; width: 220px; background: var(--ap-raised); border-radius: var(--ap-rb); padding: .6rem; max-height: 60vh; display: flex; flex-direction: column; }
.ap-crm-col-head { display: flex; align-items: center; gap: .4rem; margin-bottom: .5rem; }
.ap-crm-col-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.ap-crm-col-title { flex: 1; font-weight: 600; font-size: .85rem; color: var(--ap-txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-crm-col-count { font-size: .75rem; color: var(--ap-muted); background: var(--ap-surf); border-radius: 8px; padding: .1rem .45rem; }
.ap-crm-col-body { display: flex; flex-direction: column; gap: .5rem; overflow-y: auto; }
.ap-crm-bcard { background: var(--ap-surf); border: 1px solid var(--ap-bord); border-radius: var(--ap-rbd); padding: .55rem .6rem; }
.ap-crm-bcard-nome { font-weight: 600; font-size: .85rem; color: var(--ap-txt); }
.ap-crm-bcard .ap-crm-lead-fase-select { margin-top: .4rem; max-width: none; width: 100%; }

.ap-crm-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: .6rem; margin-bottom: 1rem; }
.ap-crm-kpi { background: var(--ap-raised); border-radius: var(--ap-rb); padding: .7rem .8rem; text-align: center; }
.ap-crm-kpi-v { display: block; font-size: 1.3rem; font-weight: 700; color: var(--ap-txt); font-family: var(--ap-ffh); }
.ap-crm-kpi-l { display: block; font-size: .74rem; color: var(--ap-muted); text-transform: uppercase; letter-spacing: .03em; margin-top: .15rem; }
.ap-crm-funil { margin-top: .5rem; }

.ap-home-funil { margin: 1.4rem 0; }
.ap-funil-bar-row { display: flex; align-items: center; gap: .7rem; margin: .5rem 0; }
.ap-funil-bar-label { min-width: 96px; font-size: .82rem; color: var(--ap-dim); }
.ap-funil-bar-track { flex: 1; height: 10px; border-radius: 6px; background: var(--ap-raised); overflow: hidden; }
.ap-funil-bar-fill { height: 100%; background: var(--ap-acc); border-radius: 6px; transition: width .25s; }
.ap-funil-bar-count { min-width: 24px; text-align: right; font-weight: 700; font-size: .85rem; color: var(--ap-txt); }
.ap-funil-carrossel { display: flex; align-items: center; justify-content: center; gap: .8rem; margin: .6rem 0 1rem; }
.ap-funil-carrossel .ap-carrossel-nav { position: static; transform: none; width: 28px; height: 28px; font-size: 1.1rem; }
.ap-funil-carrossel-label { font-weight: 600; color: var(--ap-txt); min-width: 140px; text-align: center; }

/* Alvo de negócio (06/09): as duas perguntas que dizem ao motor o que é um custo
   bom. Quando entra como AVISO no painel Meta Ads leva um risco de acento à
   esquerda — é um pedido ao cliente no meio de cartões informativos, e sem essa
   marca passava despercebido; como PASSO do onboarding (.ap-qs-card) fica
   igual aos outros passos, que já têm o destaque todo do painel guiado. */
.ap-alvo-negocio { margin-bottom: 1rem; }
.ap-alvo-negocio[data-ap-alvo-negocio="aviso"] { border-left: 3px solid var(--ap-acc); background: var(--ap-raised); }
.ap-alvo-q { display: flex; flex-direction: column; gap: .3rem; }
.ap-alvo-q > span { font-weight: 600; font-size: .92rem; color: var(--ap-txt); }
.ap-alvo-q .ap-input { max-width: 220px; }
.ap-alvo-q small { font-size: .78rem; line-height: 1.45; }
.ap-alvo-negocio-status { margin: 0; font-size: .85rem; color: var(--ap-gold); }