/* Portal 0.7 — estilos da tela apps (carregado depois de portal-ux.css). Tela 19 — Aplicativos.
   Prefixo .ap-. Cores e espaços pelas variáveis de portal-ux.css; as que o documento dá para esta tela e não têm
   variável ficam aqui em cima. */
:root{
 /* Fundo da letra inicial (sem ícone da central): cor estável por pacote, contraste para letra branca. */
 --ap-c0:#2f5fb3;--ap-c1:#1f7a6d;--ap-c2:#8a4bb0;--ap-c3:#b0563a;--ap-c4:#3b7f2f;--ap-c5:#a23a62;--ap-c6:#4b5bb8;--ap-c7:#8a6d1f;
 /* Botão que confirma apagado até "Entendo o risco" (documento: fundo #2A1C20, texto #7A5A60). */
 --ap-off-bg:#2a1c20;--ap-off-text:#7a5a60;
 --ap-pill-h:36px;--ap-fade:32px;--ap-bar:6px;
}

/* ---- lista ---- */
.ap .ux-page-head{margin-bottom:var(--space-16)}
.ap-install{margin:0}
.ap-install svg{flex:0 0 auto}
.ap-offline{margin-top:var(--space-16)}
.ap-offline[hidden]{display:none}
.ap-age{display:inline-block;margin-top:var(--space-4);color:var(--ux-label)}
.ap-pull{height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:13px;line-height:20px;color:var(--ux-muted);transition:height .18s ease}
.ap-pull.is-on{transition:none}
.ap-search{display:block;margin-top:var(--space-24)}
.ap-search input{-webkit-appearance:none;appearance:none}
.ap-search input::-webkit-search-cancel-button{-webkit-appearance:none}

/* Filtros em pílulas de 36 px com contagem em Space Mono. A fileira vai até a borda da tela e rola para o lado,
   com um degradê de 32 px no fim indicando que há mais. */
.ap-pills-wrap{position:relative;margin:var(--space-12) calc(var(--ux-side,16px) * -1) 0 0}
.ap-pills{display:flex;gap:var(--space-8);overflow-x:auto;overflow-y:hidden;padding:4px var(--ap-fade) 4px 0;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.ap-pills::-webkit-scrollbar{display:none}
.ap-pills-wrap::after{content:"";position:absolute;top:0;right:0;bottom:0;width:var(--ap-fade);background:linear-gradient(90deg,transparent,var(--ux-bg));pointer-events:none;transition:opacity .15s}
.ap-pills-wrap.is-end::after{opacity:0}
.ap-pill{position:relative;flex:0 0 auto;height:var(--ap-pill-h);min-height:var(--ap-pill-h);padding:0 var(--space-12);display:inline-flex;align-items:center;gap:var(--space-8);border:1px solid var(--ux-control-line);border-radius:18px;background:var(--ux-control);color:var(--ux-text);font:400 14px/20px var(--font-display);white-space:nowrap;cursor:pointer}
/* Área de toque de 44 px sem mudar o desenho de 36 px. */
.ap-pill::after{content:"";position:absolute;left:0;right:0;top:-4px;bottom:-4px}
.ap-pill[aria-pressed="true"]{background:var(--ux-blue-deep);border-color:var(--ux-blue);color:var(--ux-blue-soft)}
.ap-pill-count{font:400 12px/16px var(--font-mono);color:var(--ux-muted)}
.ap-pill[aria-pressed="true"] .ap-pill-count{color:var(--ux-blue-soft)}

.ap-list{margin-top:var(--space-12)}
.ap-list .ux-list-row{min-height:64px}
.ap-list .ux-list-row .ux-row-name>span:first-child{font-size:14px;line-height:20px;overflow-wrap:anywhere}
.ap-list .ux-list-row .ux-help{font-size:12px;line-height:18px}
.ap-empty{margin:0;padding:var(--space-24) 0;text-align:center;font-size:14px;line-height:20px;color:var(--ux-muted)}
.ap-empty .ux-link{margin-top:var(--space-8)}
.ap-st-amber{color:var(--ux-amber)}
.ap-st-red{color:var(--ux-red)}
.ap-st-blue{color:var(--ux-link)}

/* Ícone do app: quadrado de 40 px, cantos de 10 px. Sem ícone, a letra inicial sobre a cor do pacote. */
.ap-list .ux-ico-box,.ap-head-ico{flex:0 0 40px;width:40px;height:40px;border-radius:var(--radius-10);overflow:hidden;background:var(--ux-control);display:grid;place-items:center}
.ap-img{display:block;width:40px;height:40px;object-fit:cover}
.ap-letter{display:grid;place-items:center;width:40px;height:40px;font:500 17px/1 var(--font-display);color:#fff}
.ap-c0{background:var(--ap-c0)}.ap-c1{background:var(--ap-c1)}.ap-c2{background:var(--ap-c2)}.ap-c3{background:var(--ap-c3)}
.ap-c4{background:var(--ap-c4)}.ap-c5{background:var(--ap-c5)}.ap-c6{background:var(--ap-c6)}.ap-c7{background:var(--ap-c7)}

/* ---- painel do app (painel alto) ---- */
.ap-sheet .ux-sheet-head{gap:var(--space-12)}
.ap-sheet .ux-sheet-head h2{min-width:0}
.ap-head-name{display:block;overflow-wrap:anywhere}
.ap-head-sub{display:block}
.ap-head-sub .ux-tag{margin-left:var(--space-8);vertical-align:1px;min-height:20px;padding:0 6px;font-size:10px;letter-spacing:1px}
.ap-sheet .ux-sheet-body>.ux-band{margin:var(--space-8) 0 var(--space-16)}
.ap-sec:first-child{margin-top:var(--space-8)}
.ap-sec{margin-bottom:var(--space-24)}
.ap-act{min-height:56px}
.ap-act .ux-col{color:var(--ux-label)}
.ap-act.is-amber .ux-col{color:var(--ux-amber)}
.ap-act.is-danger .ux-col,.ap-act.is-danger .ux-row-name>span:first-child{color:var(--ux-red)}
.ap-act.is-danger .ux-help{color:var(--ux-muted)}
.ap-act.is-busy{opacity:.6;cursor:progress}
.ap-act.is-busy .ux-col svg{animation:ux-pulse 1s ease-in-out infinite}
.ap-tech{margin:0;padding:0 0 var(--space-16)}
.ap-tech dt{margin:var(--space-12) 0 var(--space-4);font:500 10px/16px var(--font-mono);letter-spacing:1.4px;text-transform:uppercase;color:var(--ux-eyebrow)}
.ap-tech dt:first-child{margin-top:0}
.ap-tech dd{margin:0;font:400 12px/18px var(--font-mono);color:var(--ux-label);overflow-wrap:anywhere;-webkit-user-select:text;user-select:text}

/* ---- confirmações ---- */
.ap-confirm-extra>.ap-gate{margin-top:var(--space-16)}
.ap-confirm .ux-primary:disabled,.ap-confirm .ux-danger:disabled{opacity:1;background:var(--ap-off-bg);border-color:var(--ap-off-bg);color:var(--ap-off-text)}

/* ---- Instalar um app ---- */
.ap-choose{margin-top:var(--space-8)}
.ap-choose[hidden],.ap-file[hidden]{display:none}
.ap-file{margin-top:var(--space-8)}
.ap-file-row{display:flex;align-items:center;gap:var(--space-12);min-height:64px;padding:var(--space-12) 0}
.ap-file-ico{flex:0 0 40px}
.ap-file-text{flex:1 1 auto;min-width:0}
.ap-file-name{display:block;font-size:15px;line-height:22px;color:var(--ux-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-file-text .ux-help{margin-top:var(--space-4)}
.ap-swap{flex:0 0 auto;min-width:44px;min-height:44px;margin-right:calc(var(--space-4) * -1);padding:0 var(--space-4);border:0;background:none;color:var(--ux-link);font:500 13px var(--font-display);cursor:pointer}
.ap-swap:disabled{opacity:.45;cursor:default}
.ap-prog{padding:var(--space-12) 0 var(--space-16);border-top:1px solid var(--ux-divider)}
.ap-prog-line{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-12)}
.ap-prog-label{font-size:14px;line-height:20px;color:var(--ux-text)}
.ap-prog-label.is-fail{color:var(--ux-red)}
.ap-pct{flex:0 0 auto;font:400 13px/20px var(--font-mono);color:var(--ux-label)}
.ap-bar{height:var(--ap-bar);margin-top:var(--space-8);border-radius:3px;background:var(--ux-control-line);overflow:hidden}
.ap-bar>span{display:block;height:100%;width:0;border-radius:3px;background:var(--ux-blue);transition:width .2s ease}
.ap-bar.is-wait>span{min-width:24%;animation:ux-pulse 1.2s ease-in-out infinite}
.ap-bar.is-fail>span{background:var(--ux-red)}
.ap-steps{list-style:none;margin:var(--space-16) 0 0;padding:0;display:grid;gap:var(--space-12)}
.ap-step{display:flex;align-items:flex-start;gap:var(--space-12);font-size:14px;line-height:20px;color:var(--ux-placeholder)}
.ap-step-ico{flex:0 0 20px;width:20px;height:20px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center}
.ap-step-text{min-width:0}
.ap-step-detail{display:block;margin-top:var(--space-4);font-size:12px;line-height:18px;color:var(--ux-muted);overflow-wrap:anywhere}
.ap-step.is-done{color:var(--ux-blue-soft)}
.ap-step.is-done .ap-step-ico{background:var(--ux-blue-deep);border-color:var(--ux-blue-soft)}
.ap-step.is-now{color:var(--ux-text)}
.ap-step.is-now .ap-step-ico::after{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;animation:ux-pulse 1s ease-in-out infinite}
.ap-step.is-fail{color:var(--ux-red)}
.ap-step.is-fail .ap-step-detail{color:var(--ux-red-text)}
.ap-adv{margin-top:var(--space-24)}
.ap-adv .ux-expand-body .ux-switch-row{border-top:1px solid var(--ux-divider)}

@media (prefers-reduced-motion:reduce){.ap-bar.is-wait>span,.ap-step.is-now .ap-step-ico::after,.ap-act.is-busy .ux-col svg{animation:none}}

/* Intermediária: a fileira de filtros termina na borda da coluna (640 px), não da janela. */
@media (min-width:600px){
 .ap-pills-wrap{margin-right:0}
}
/* Computador: as pílulas quebram em mais de uma linha, sem degradê; mouse no lugar do toque. */
@media (min-width:1024px){
 .ap-pills{flex-wrap:wrap;overflow:visible;padding-right:0}
 .ap-pills-wrap::after{display:none}
}
.ap-sheet:focus-visible{outline:none}
.ap-install-off{margin:var(--space-8) 0 var(--space-16)}
.ap-install-off[hidden]{display:none}