/* Portal de Soluções Delp — tela de aplicativos. Tipografia Barlow Medium (fallback Inter/system-ui).
   Cores: padrão visual Delp. Texto sobre cada cor escolhido para contraste mínimo AA (laranja e cinza usam texto escuro). */
@font-face { font-family: 'Barlow'; font-weight: 500; font-style: normal; font-display: swap; src: url('../fonts/Barlow-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-weight: 600; font-style: normal; font-display: swap; src: url('../fonts/Barlow-SemiBold.woff2') format('woff2'); }

.portal-body { --tblr-font-sans-serif: 'Barlow', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; font-family: var(--tblr-font-sans-serif); font-weight: 500; }

.pt-cor-delp      { --pt-bg: #CC0F10; --pt-fg: #FFFFFF; }
.pt-cor-subsea    { --pt-bg: #2362D3; --pt-fg: #FFFFFF; }
.pt-cor-industria { --pt-bg: #FF6B05; --pt-fg: #000000; }
.pt-cor-servicos  { --pt-bg: #0B861D; --pt-fg: #FFFFFF; }
.pt-cor-mooring   { --pt-bg: #213D75; --pt-fg: #FFFFFF; }
.pt-cor-preto     { --pt-bg: #000000; --pt-fg: #FFFFFF; }
.pt-cor-cinza     { --pt-bg: #B0B0B0; --pt-fg: #000000; }

/* Barra superior */
.pt-topbar { background: var(--tblr-bg-surface); border-bottom: 1px solid var(--tblr-border-color); }
.pt-topbar .pt-logo { height: 36px; width: auto; max-width: 180px; object-fit: contain; }
.pt-titulo { font-weight: 600; line-height: 1.1; }
.pt-busca { max-width: 420px; }

/* Faixa de rede */
.pt-rede { white-space: nowrap; display: inline-flex; align-items: center; gap: .4rem; font-size: .8125rem; font-weight: 600; padding: .2rem .65rem; border-radius: 999px; border: 1px solid var(--tblr-border-color); }
.pt-rede::before { content: ''; width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.pt-rede-interna { color: #0B861D; }
.pt-rede-externa { color: #8A4B00; }
html[data-bs-theme="dark"] .pt-rede-interna { color: #4ADE80; }
html[data-bs-theme="dark"] .pt-rede-externa { color: #FDBA74; }

/* Seções e grade (estilo tela de aplicativos) */
.pt-secao { margin-bottom: 2rem; }
.pt-secao-titulo { font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tblr-secondary); margin-bottom: .75rem; }
.pt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(152px, 1fr)); gap: 1rem; }

.pt-tile { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .55rem; padding: 1.1rem .75rem 1rem;
  background: var(--tblr-bg-surface); border: 1px solid var(--tblr-border-color); border-radius: 18px; color: var(--tblr-body-color);
  text-decoration: none; position: relative; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
a.pt-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0, 0, 0, .12); border-color: var(--pt-bg, var(--tblr-border-color)); color: var(--tblr-body-color); }
a.pt-tile:focus-visible { outline: 3px solid var(--pt-bg, #CC0F10); outline-offset: 2px; }
.pt-icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 16px; background: var(--pt-bg, #CC0F10); color: var(--pt-fg, #fff); font-size: 32px; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .18); }
.pt-icon .ti { font-size: 32px; line-height: 1; }
.pt-nome { font-weight: 600; font-size: 1rem; line-height: 1.15; overflow-wrap: anywhere; max-width: 100%; }
.pt-desc { font-size: .8125rem; line-height: 1.25; color: var(--tblr-secondary); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.05em; overflow-wrap: anywhere; max-width: 100%; }

/* App travado (visitante externo, modo "bloquear") */
.pt-bloqueado { cursor: not-allowed; padding-top: 2.1rem; }
.pt-bloqueado .pt-icon { filter: grayscale(1); opacity: .55; }
.pt-bloqueado .pt-nome, .pt-bloqueado .pt-desc { opacity: .7; }
.pt-selo { position: absolute; top: .5rem; right: .5rem; font-size: .6875rem; font-weight: 600; padding: .1rem .45rem; border-radius: 999px; background: var(--tblr-bg-surface-secondary); color: var(--tblr-secondary); border: 1px solid var(--tblr-border-color); }

.pt-aviso { border-left: 4px solid #FF6B05; }
.pt-vazio { text-align: center; color: var(--tblr-secondary); padding: 3rem 1rem; }
.pt-rodape { color: var(--tblr-secondary); font-size: .8125rem; }

/* Admin: seletor de ícone e prévia */
.pt-icone-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: .35rem; max-height: 240px; overflow: auto; padding: .35rem; border: 1px solid var(--tblr-border-color); border-radius: 8px; }
.pt-icone-opcao { display: inline-flex; align-items: center; justify-content: center; height: 42px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--tblr-body-color); font-size: 22px; cursor: pointer; }
.pt-icone-opcao:hover { background: var(--tblr-bg-surface-secondary); }
.pt-icone-opcao.ativo { border-color: #CC0F10; background: var(--tblr-bg-surface-secondary); }
.pt-cor-opcoes { display: flex; flex-wrap: wrap; gap: .5rem; }
.pt-cor-opcao { position: relative; }
.pt-cor-opcao input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.pt-cor-opcao span { display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .6rem .25rem .3rem; border: 2px solid var(--tblr-border-color); border-radius: 999px; font-size: .8125rem; }
.pt-cor-opcao span::before { content: ''; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--pt-bg); border: 1px solid rgba(0, 0, 0, .25); }
.pt-cor-opcao input:checked + span { border-color: var(--tblr-body-color); font-weight: 600; }
.pt-cor-opcao input:focus-visible + span { outline: 3px solid #CC0F10; outline-offset: 2px; }
.pt-preview { max-width: 190px; }
.pt-mini { display: inline-flex; width: 36px; height: 36px; border-radius: 10px; font-size: 20px; align-items: center; justify-content: center; background: var(--pt-bg); color: var(--pt-fg); }
.pt-mini .ti { font-size: 20px; }