/* Sino de notificações, painel/folha, convite do Web Push e a seção Notificações do painel administrativo. */
:root{--nt-bg:#121316;--nt-raised:#17191d;--nt-high:#1f2126;--nt-line:#25272c;--nt-line2:#34373e;--nt-text:#f4f5f2;--nt-text2:#c3c6cc;--nt-muted:#9a9ea7;--nt-lime:#c8f53a;--nt-lime-soft:rgba(200,245,58,.12);--nt-lime-line:rgba(200,245,58,.38);--nt-red:#ff6b6b;--nt-amber:#ffc35a;--nt-blue:#7cc4ff;--nt-violet:#b9a6ff}

/* ---------- Sino e contador ---------- */
.nt-bell{position:relative}
.nt-badge{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--nt-lime);color:#10140a;font:800 10.5px/18px Inter,Arial,sans-serif;text-align:center;letter-spacing:-.2px;box-shadow:0 0 0 2px #0b0c0e;pointer-events:none;animation:nt-pop .32s cubic-bezier(.3,1.6,.5,1)}
.nt-bell.nt-ring svg{transform-origin:50% 8%;animation:nt-ring 1.1s ease-in-out}
.nt-bell.nt-ring .nt-badge{animation:nt-pop .42s cubic-bezier(.3,1.6,.5,1)}
@keyframes nt-ring{0%,100%{transform:rotate(0)}12%{transform:rotate(14deg)}26%{transform:rotate(-12deg)}40%{transform:rotate(9deg)}54%{transform:rotate(-6deg)}68%{transform:rotate(3deg)}}
@keyframes nt-pop{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}

/* ---------- Camada, painel (computador) e folha (celular) ---------- */
.nt-layer{position:fixed;inset:0;z-index:950;pointer-events:none}
.nt-backdrop{position:absolute;inset:0;background:transparent;pointer-events:auto}
.nt-panel{position:absolute;top:64px;right:16px;width:min(400px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 90px));display:flex;flex-direction:column;background:var(--nt-bg);border:1px solid var(--nt-line2);border-radius:18px;box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 28px 70px -20px rgba(0,0,0,.85),0 0 0 1px rgba(0,0,0,.3);pointer-events:auto;overflow:hidden;opacity:0;transform:translateY(-6px) scale(.985);transform-origin:top right;transition:opacity .18s ease,transform .2s cubic-bezier(.2,.8,.2,1);outline:none;color:var(--nt-text)}
.nt-layer.show .nt-panel{opacity:1;transform:none}
.nt-grab{display:none}
.nt-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 16px 12px 18px;border-bottom:1px solid var(--nt-line)}
.nt-head>div:first-child{display:flex;align-items:center;gap:10px;min-width:0}
.nt-head h2{margin:0;font-size:16.5px;font-weight:750;letter-spacing:-.2px}
.nt-count{padding:3px 8px;border-radius:999px;background:var(--nt-lime-soft);border:1px solid var(--nt-lime-line);color:var(--nt-lime);font-size:11.5px;font-weight:700;white-space:nowrap}
.nt-head-actions{display:flex;align-items:center;gap:4px}
.nt-link{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--nt-lime);font:600 12.5px/1 Inter,Arial,sans-serif;padding:8px;border-radius:9px;cursor:pointer;white-space:nowrap}
.nt-link:hover:not(:disabled){background:var(--nt-lime-soft)}
.nt-link:disabled{color:var(--nt-muted);opacity:.55;cursor:default}
.nt-link .nt-svg{width:15px;height:15px}
.nt-l-short{display:none}
.nt-x{display:none;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--nt-line2);background:var(--nt-raised);color:var(--nt-text2);cursor:pointer}
.nt-x .nt-svg{width:16px;height:16px}
.nt-scroll{overflow:auto;overscroll-behavior:contain;flex:1;min-height:120px}
.nt-list{list-style:none;margin:0;padding:6px}
.nt-li{position:relative;border-radius:13px}
.nt-li+.nt-li{margin-top:2px}
.nt-item{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;border:0;background:transparent;color:inherit;padding:12px 12px 12px 10px;border-radius:13px;cursor:pointer;font:inherit;transition:background .15s}
.nt-item:hover,.nt-item:focus-visible{background:var(--nt-raised)}
.nt-item:focus-visible{outline:2px solid var(--nt-lime-line);outline-offset:-2px}
.nt-item.unread{background:linear-gradient(90deg,rgba(200,245,58,.06),transparent 70%)}
.nt-item.unread:hover{background:linear-gradient(90deg,rgba(200,245,58,.1),var(--nt-raised) 70%)}
.nt-ico{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--nt-high);border:1px solid var(--nt-line2);color:var(--nt-text2)}
.nt-ico .nt-svg{width:18px;height:18px}
.nt-ico.tone-ok{background:var(--nt-lime-soft);border-color:var(--nt-lime-line);color:var(--nt-lime)}
.nt-ico.tone-bad{background:rgba(255,107,107,.1);border-color:rgba(255,107,107,.35);color:var(--nt-red)}
.nt-ico.tone-warn{background:rgba(255,195,90,.1);border-color:rgba(255,195,90,.35);color:var(--nt-amber)}
.nt-ico.tone-info{background:rgba(124,196,255,.09);border-color:rgba(124,196,255,.3);color:var(--nt-blue)}
.nt-ico.tone-brand{background:linear-gradient(140deg,rgba(200,245,58,.2),rgba(185,166,255,.14));border-color:var(--nt-lime-line);color:var(--nt-lime)}
.nt-txt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.nt-txt strong{font-size:14px;line-height:1.3;font-weight:650;color:var(--nt-text)}
.nt-item:not(.unread) .nt-txt strong{font-weight:550;color:var(--nt-text2)}
.nt-body{font-size:13px;line-height:1.42;color:var(--nt-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nt-time{font-size:11.5px;color:var(--nt-muted);opacity:.85;margin-top:2px}
.nt-time em{font-style:normal;color:var(--nt-lime);opacity:.9}
.nt-dot{flex:none;width:9px;height:9px;margin-top:6px;border-radius:50%;background:var(--nt-lime);box-shadow:0 0 0 3px rgba(200,245,58,.16)}
.nt-help{display:inline-flex;align-items:center;gap:6px;margin:-4px 0 8px 60px;padding:7px 11px;border-radius:9px;border:1px solid var(--nt-line2);background:var(--nt-raised);color:var(--nt-text);font:600 12.5px/1 Inter,Arial,sans-serif;cursor:pointer}
.nt-help:hover{border-color:var(--nt-lime-line);color:var(--nt-lime)}
.nt-help .nt-svg{width:14px;height:14px}
.nt-fresh{animation:nt-in .5s cubic-bezier(.2,.8,.2,1) both}
.nt-fresh .nt-item{box-shadow:inset 3px 0 0 var(--nt-lime)}
@keyframes nt-in{0%{opacity:0;transform:translateY(-8px)}100%{opacity:1;transform:none}}
.nt-more{display:block;width:calc(100% - 24px);margin:4px 12px 14px;padding:11px;border-radius:11px;border:1px solid var(--nt-line2);background:var(--nt-raised);color:var(--nt-text);font:600 13px/1 Inter,Arial,sans-serif;cursor:pointer}
.nt-more:hover:not(:disabled){border-color:var(--nt-lime-line)}
.nt-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:42px 28px 46px;gap:8px}
.nt-empty-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:radial-gradient(circle at 50% 30%,rgba(200,245,58,.18),rgba(200,245,58,.03) 70%);border:1px solid var(--nt-lime-line);color:var(--nt-lime);margin-bottom:6px}
.nt-empty-ico .nt-svg{width:26px;height:26px}
.nt-empty strong{font-size:15px}
.nt-empty p{margin:0;color:var(--nt-muted);font-size:13px;line-height:1.5;max-width:280px}
.nt-skel{padding:14px 16px;display:grid;gap:12px}
.nt-skel i{display:block;height:54px;border-radius:12px;background:linear-gradient(90deg,var(--nt-raised),var(--nt-high),var(--nt-raised));background-size:200% 100%;animation:nt-sh 1.2s linear infinite}
@keyframes nt-sh{to{background-position:-200% 0}}
html.nt-lock,html.nt-lock body{overflow:hidden}

@media (max-width:640px){
  .nt-layer.is-sheet .nt-backdrop{background:rgba(4,5,6,.62);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .2s}
  .nt-layer.is-sheet.show .nt-backdrop{opacity:1}
  .nt-layer.is-sheet .nt-panel{top:auto!important;right:0!important;left:0;bottom:0;width:100%;max-height:min(84vh,calc(100vh - 56px));border-radius:22px 22px 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(102%);opacity:1;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
  .nt-layer.is-sheet.show .nt-panel{transform:none}
  .nt-layer.is-sheet .nt-grab{display:block;width:40px;height:4.5px;border-radius:9px;background:var(--nt-line2);margin:9px auto 0}
  .nt-layer.is-sheet .nt-head{padding:10px 12px 12px 18px}
  .nt-layer.is-sheet .nt-x{display:grid}
  .nt-layer.is-sheet .nt-l-long{display:none}
  .nt-layer.is-sheet .nt-l-short{display:inline}
  .nt-item{padding:13px 10px}
}
@media (prefers-reduced-motion:reduce){
  .nt-panel,.nt-layer.is-sheet .nt-panel,.nt-backdrop,.nt-optin{transition:none!important}
  .nt-badge,.nt-bell.nt-ring svg,.nt-bell.nt-ring .nt-badge,.nt-fresh,.nt-skel i,.nt-optin-ico.ring .nt-svg{animation:none!important}
}

/* ---------- Convite do Web Push ---------- */
.nt-optin{position:fixed;z-index:1200;right:20px;bottom:20px;width:min(400px,calc(100vw - 32px));display:flex;gap:14px;padding:18px 18px 16px;background:linear-gradient(160deg,#181b14,#121316 55%);border:1px solid var(--nt-lime-line);border-radius:18px;box-shadow:0 30px 70px -24px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.35);color:var(--nt-text);opacity:0;transform:translateY(14px);transition:opacity .22s,transform .26s cubic-bezier(.2,.8,.2,1)}
.nt-optin.show{opacity:1;transform:none}
.nt-optin-ico{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--nt-lime);color:#10140a}
.nt-optin-ico .nt-svg{width:22px;height:22px}
.nt-optin-ico.ring .nt-svg{transform-origin:50% 8%;animation:nt-ring 1.2s .5s ease-in-out 2}
.nt-optin-txt strong{display:block;font-size:15.5px;line-height:1.3;margin:1px 0 6px}
.nt-optin-txt p{margin:0 0 14px;color:var(--nt-text2);font-size:13.5px;line-height:1.5}
.nt-optin-actions{display:flex;gap:8px;flex-wrap:wrap}
.nt-optin-actions .btn .nt-svg{width:16px;height:16px}
@media (max-width:640px){.nt-optin{left:12px;right:12px;width:auto;bottom:calc(84px + env(safe-area-inset-bottom))}}

/* ---------- Meu perfil ---------- */
.nt-device{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:4px 0 14px;border-radius:14px;background:var(--nt-raised);border:1px solid var(--nt-line2)}
.nt-device-ico{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--nt-high);color:var(--nt-text2)}
.nt-device-ico.on{background:var(--nt-lime-soft);color:var(--nt-lime);border:1px solid var(--nt-lime-line)}
.nt-device-ico .nt-svg{width:18px;height:18px}
.nt-device-txt{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.nt-device-txt strong{font-size:14px}
.nt-device-txt small{color:var(--nt-muted);font-size:12.5px;line-height:1.4}
.nt-test{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:-4px 0 14px}
.nt-test[hidden]{display:none}
.nt-test .nt-svg{width:16px;height:16px;margin-right:6px}
.nt-test-result{margin:0;font-size:13px;line-height:1.45;flex:1 1 220px;min-width:0}
.nt-test-result:empty{display:none}

/* ---------- Painel administrativo: Notificações ---------- */
.ntadm-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.9fr);gap:18px;align-items:start}
.ntadm-card{background:var(--nt-bg);border:1px solid var(--nt-line);border-radius:18px;padding:20px}
.ntadm-card h2{margin:0 0 4px;font-size:16px}
.ntadm-card>p.ntadm-sub{margin:0 0 16px;color:var(--nt-muted);font-size:13px}
.ntadm-kinds{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.ntadm-kind{position:relative}
.ntadm-kind input{position:absolute;opacity:0;pointer-events:none}
.ntadm-kind span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:12px;border:1px solid var(--nt-line2);background:var(--nt-raised);color:var(--nt-text2);font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.ntadm-kind .nt-svg{width:18px;height:18px}
.ntadm-kind input:checked+span{border-color:var(--nt-lime-line);background:var(--nt-lime-soft);color:var(--nt-lime)}
.ntadm-kind input:focus-visible+span{outline:2px solid var(--nt-lime-line);outline-offset:2px}
.ntadm-field{margin-bottom:14px}
.ntadm-field .label{display:flex;justify-content:space-between;align-items:baseline}
.ntadm-field .label small{color:var(--nt-muted);font-weight:500}
.ntadm-field small.ntadm-over{color:var(--nt-red)}
.ntadm-field textarea{min-height:92px;resize:vertical}
.ntadm-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ntadm-aud{display:grid;gap:6px;margin-bottom:14px}
.ntadm-aud label{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;border:1px solid var(--nt-line2);background:var(--nt-raised);cursor:pointer;font-size:13.5px}
.ntadm-aud label:has(input:checked){border-color:var(--nt-lime-line);background:var(--nt-lime-soft)}
.ntadm-aud input[type=radio]{width:18px!important;height:18px!important;min-height:0!important;flex:none;margin:0;padding:0;border:0;box-shadow:none;background:none;accent-color:#c8f53a}
.ntadm-aud b{margin-left:auto;font-size:12px;color:var(--nt-muted);font-weight:600}
.ntadm-opts{display:grid;gap:10px;margin:4px 0 16px}
.ntadm-check{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;cursor:pointer}
.ntadm-check input{margin-top:3px;accent-color:#c8f53a}
.ntadm-check small{display:block;color:var(--nt-muted);font-size:12.5px}
.ntadm-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ntadm-actions .btn .nt-svg{width:16px;height:16px}
.ntadm-preview{position:sticky;top:84px;display:grid;gap:14px}
.ntadm-prev-label{font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--nt-muted);font-weight:700;margin:0 0 8px}
.ntadm-mock{border-radius:16px;border:1px solid var(--nt-line2);background:var(--nt-bg);overflow:hidden;box-shadow:0 24px 50px -28px rgba(0,0,0,.9)}
.ntadm-mock .nt-head{padding:12px 14px}
.ntadm-mock .nt-head h2{font-size:14.5px}
.ntadm-mock .nt-list{padding:6px}
.ntadm-mock .nt-item{cursor:default}
.ntadm-mock .nt-li.ghost{opacity:.42}
.ntadm-push{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:rgba(40,42,48,.92);border:1px solid rgba(255,255,255,.08);box-shadow:0 16px 40px -18px rgba(0,0,0,.9)}
.ntadm-push img{width:36px;height:36px;border-radius:9px;flex:none}
.ntadm-push div{min-width:0;flex:1}
.ntadm-push b{display:flex;justify-content:space-between;font-size:12px;color:var(--nt-muted);font-weight:600;margin-bottom:2px}
.ntadm-push strong{display:block;font-size:13.5px;line-height:1.3}
.ntadm-push p{margin:2px 0 0;font-size:13px;line-height:1.4;color:var(--nt-text2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ntadm-who{font-size:12.5px;color:var(--nt-muted);margin:0}
.ntadm-who strong{color:var(--nt-text)}
.ntadm-hist{margin-top:22px}
.ntadm-hist-title{display:flex;align-items:baseline;justify-content:space-between;margin:0 0 10px}
.ntadm-hist-title h2{margin:0;font-size:16px}
.ntadm-t{display:flex;gap:10px;align-items:flex-start;min-width:0}
.ntadm-t .nt-ico{width:32px;height:32px;border-radius:10px}
.ntadm-t .nt-ico .nt-svg{width:16px;height:16px}
.ntadm-t strong{display:block;font-size:13.5px}
.ntadm-t small{display:block;color:var(--nt-muted);font-size:12px;max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ntadm-rate{display:flex;align-items:center;gap:8px;min-width:120px}
.ntadm-rate i{flex:1;height:6px;border-radius:9px;background:var(--nt-high);overflow:hidden}
.ntadm-rate i b{display:block;height:100%;background:var(--nt-lime);border-radius:9px}
.ntadm-rate span{font-size:12.5px;font-weight:650;min-width:38px;text-align:right}
.ntadm-acts{display:flex;gap:6px;justify-content:flex-end}
@media (max-width:980px){.ntadm-grid{grid-template-columns:1fr}.ntadm-preview{position:static}}
@media (max-width:640px){.ntadm-kinds{grid-template-columns:repeat(2,1fr)}.ntadm-row{grid-template-columns:1fr}.ntadm-card{padding:16px}.ntadm-acts{justify-content:flex-start}}
/* O sino continua no topo no celular (o resto dos ícones do topo some nessa largura). */
@media(max-width:800px),(orientation:landscape) and (max-height:520px) and (max-width:1000px){.top-actions .icon-btn.nt-bell{display:inline-grid!important;width:38px;height:38px}}
body.is-installed-app .app-header-button.nt-bell{position:relative}
/* Cabeçalho do app instalado com o sino: mais compacto para caber em 360–430 px. */
@media (max-width:430px){
  body.is-installed-app .mobile-app-header{gap:8px}
  body.is-installed-app .mobile-app-actions{gap:6px}
  body.is-installed-app .mobile-app-brand{gap:7px}
  body.is-installed-app .mobile-app-brand img{width:28px;height:28px}
  body.is-installed-app .mobile-app-brand strong{font-size:17px}
  body.is-installed-app .app-header-button,body.is-installed-app .app-bx-pill{width:36px;height:36px;min-height:36px}
  body.is-installed-app .app-credit-pill{min-height:36px;padding:0 10px;gap:5px}
}
@media (max-width:370px){body.is-installed-app .app-bx-pill{display:none}}
.ntadm-confirm{margin-bottom:14px;box-shadow:none}
.nt-body.nt-body-full{-webkit-line-clamp:unset;display:block}
.ntadm-t>span:last-child{min-width:0}
@media (max-width:640px){.ntadm-t small{max-width:none;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}
