/* W4L - Widget de Atenção — dimensões, cores e estados. */
/* Personalização: --accent controla a borda e o título; --width controla a largura do painel. */
#w4l-attention-status-widget
{
--accent:#ec1435e1;
--panel:rgba(10,16,29,.90);
--text:#f8fafc;
--muted:#a1a1aa;
--width:300px;
--radius:10px;
position:fixed;
z-index:9996;
left:calc(60% - 100px);
bottom:40%;
color:var(--text);
font:600 12px/1.4 system-ui,sans-serif;
user-select:none;
touch-action:none;
filter:drop-shadow(0 0 18px #0009)
}

/* Com solicitações, o sino pulsa em amarelo. Ajuste --accent para personalizar a cor. */
#w4l-attention-status-widget[data-active="true"]{--accent:#facc15;animation:w4l-attention-pulse 1.4s ease-in-out infinite}
#w4l-attention-status-widget.is-local{--accent:#fb923c;animation:none}

/* Painel aberto. */
#w4l-attention-status-widget .w4l-attention__panel{width:var(--width);overflow:hidden;border:2px solid color-mix(in srgb,var(--accent),transparent 20%);border-radius:var(--radius);background:var(--panel);box-shadow:0 0 22px color-mix(in srgb,var(--accent),transparent 65%);backdrop-filter:blur(10px)}

/* Informações do painel. */
#w4l-attention-status-widget .w4l-attention__header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--accent);color:#111827;cursor:grab;touch-action:none}
#w4l-attention-status-widget .w4l-attention__header small{display:block;font-size:9px}
/* TÍTULO E SUBTÍTULO DO BOTÃO DE ATENÇÃO */
/* SUBTÍTULO DO WIDGET DE ATENÇÃO */
.w4l-attention__launcher {position: relative;}
.w4l-attention__subtitle {color:#fff; display: block; position: absolute; bottom: 10px; font-size: 10px; line-height: 1; text-align: center; white-space: normal;}

/* RESERVA ESPAÇO PARA O SUBTÍTULO */
.w4l-attention__label {margin-bottom: 10px;}
#w4l-attention-status-widget .w4l-attention__list{min-height:84px;max-height:190px;overflow:auto;padding:8px}
#w4l-attention-status-widget .w4l-attention__empty{margin:12px 0;color:var(--muted)}
#w4l-attention-status-widget .w4l-attention__person{display:flex;align-items:center;gap:8px;padding:7px;border-bottom:1px solid #ffffff1a}
#w4l-attention-status-widget .w4l-attention__person img{width:30px;height:30px;object-fit:cover;border-radius:50%}
#w4l-attention-status-widget .w4l-attention__person b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#w4l-attention-status-widget .w4l-attention__person button,#w4l-attention-status-widget .w4l-attention__footer button{border:2px solid #ffffff30;border-radius:6px;padding:5px 7px;background:#202938;color:var(--text);font:inherit;cursor:pointer}
#w4l-attention-status-widget .w4l-attention__footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px;padding:8px;border-top:1px solid #ffffff1a}
#w4l-attention-status-widget .w4l-attention__footer span{font-size:9px;color:var(--muted)}

/* Botão Flutuante */
#w4l-attention-status-widget [data-clear-all]{border-color:#f53030;color:#f8193b;background:#ea1708ef;}
#w4l-attention-status-widget [data-updated]{display:block;padding:0 10px 8px;color:var(--muted);font-size:9px}
#w4l-attention-status-widget .w4l-attention__launcher{display:none;position:relative;width:128px;height:128px;padding:10px;border: 2px solid #ec092b;border-radius:var(--radius);background:#ec3131c4;align-items:center;justify-content:center;cursor:grab;touch-action:none;box-shadow:0 0 26px #fb718566}

/* Botão imagem. - Estado minimizado: ícone 128 × 128 px; o puxador também aceita arraste. */
#w4l-attention-status-widget .w4l-attention__launcher img
{width:72px;height:80px;object-fit:contain;margin-bottom:40px;filter:drop-shadow(0 0 10px var(--accent));pointer-events:none;-webkit-user-drag:none;user-select:none;}

/* Bolinha de notificações. */
#w4l-attention-status-widget .w4l-attention__badge{position:absolute;top:10px;right:10px;min-width:30px;height:30px;padding:0 5px;display:flex;align-items:center;justify-content:center;border:2px solid #fff;border-radius:50%;background:#e71010;color:#fff;font-size:12px;font-weight:900}

/* Dados do elemento. */
#w4l-attention-status-widget[data-active="true"] .w4l-attention__badge{background:#eab308;color:#111827}
#w4l-attention-status-widget.is-minimized .w4l-attention__panel{display:none}
#w4l-attention-status-widget.is-minimized .w4l-attention__launcher{display:flex}
#w4l-attention-status-widget.is-expanded .w4l-attention__panel{display:block}
#w4l-attention-status-widget.is-expanded .w4l-attention__launcher{display:none}
#w4l-attention-status-widget.is-dragging{opacity:.9;cursor:grabbing}
@keyframes w4l-attention-pulse{0%,100%{filter:drop-shadow(0 0 7px #facc1570)}50%{filter:drop-shadow(0 0 22px #facc15)}}
@media(max-width:520px){#w4l-attention-status-widget{left:auto;right:10px;bottom:10px;width:min(var(--width),calc(100vw - 20px))}#w4l-attention-status-widget.is-minimized{width:128px}}

/* Texto padronizado abaixo do ícone. */
#w4l-attention-status-widget .w4l-attention__label{position:absolute;bottom:15px;left:0;right:0;text-align:center;color:#fff;font-size:12px;font-weight:800;}
/* Sem solicitações, ocultar paginação e limpeza para manter o painel limpo. */
#w4l-attention-status-widget[data-active="false"] .w4l-attention__footer{display:none}
/* Tema laranja compartilhado no modo demonstração. */
#w4l-attention-status-widget.is-local{--accent:#fb923c;border-color:var(--accent)}

/* A lista de atenção não exibe paginação: todos os jogadores ficam em uma lista rolável. */
#w4l-attention-status-widget .w4l-attention__footer [data-prev],
#w4l-attention-status-widget .w4l-attention__footer [data-next],
#w4l-attention-status-widget .w4l-attention__footer [data-page]{display:none!important}
#w4l-attention-status-widget .w4l-attention__list{max-height: min(55vh, 420px); overflow-y:auto}