/* Support tickets (/suporte and /equipe-suporte). Site C identity: navy panels, ONE gold accent, red only for errors.
   Mobile first; loaded only on the support pages. */
.sp{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:16px;outline:none}
.sp-carregando{color:var(--txt2);text-align:center;padding:40px 0}
.sp-h2{font:400 1.55rem/1.2 "Lilita One",system-ui;letter-spacing:.01em;color:var(--txt);margin:2px 0}
.sp h3{font:400 1.2rem "Lilita One",system-ui;color:var(--ouro2)}
.sp-ic{width:40px;height:40px;flex:none}
.sp-ic-mini{width:22px;height:22px;flex:none;display:inline-block;vertical-align:-5px}
.sp-ic-grande{width:96px;height:96px}
.sp-nota{color:var(--txt2);font-size:.92rem;text-align:center}
.sp-nota a,.sp-link,.sp-lgpd a,.sp-conta a.sp-link{color:var(--ouro2);font-weight:800}
.sp-nota-esq{text-align:left}
.sp-link{background:none;border:0;padding:6px 0;font:800 .95rem "Nunito";cursor:pointer;align-self:center}
.sp-aviso{padding:12px 14px;border-radius:14px;background:rgba(246,183,60,.08);border:1px solid rgba(246,183,60,.35);font-weight:700}
.sp-aviso.erro{background:rgba(255,107,90,.08);border-color:rgba(255,107,90,.45);color:#ffb3a8}
.sp-voltar{align-self:flex-start;background:var(--bloco);border:1px solid var(--contorno);border-radius:11px;padding:7px 14px;font:800 .9rem "Nunito";color:var(--txt);cursor:pointer}
.sp-voltar:hover{background:var(--bloco2)}

/* account line */
.sp-conta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 16px;border-radius:16px;background:var(--painel2);border:1px solid var(--contorno);font-weight:700;color:#cdd5e1}
.sp-bt-mini{padding:6px 14px}

/* home cards */
.sp-cards{display:grid;gap:14px}
.sp-card{display:flex;align-items:center;gap:16px;text-align:left;padding:20px 18px;border-radius:24px;cursor:pointer;color:var(--txt);
  background:linear-gradient(180deg,rgba(24,30,46,.96),rgba(14,18,30,.96));border:1px solid var(--contorno);box-shadow:0 3px 8px rgba(0,0,0,.5);transition:transform .15s,border-color .15s,box-shadow .15s}
.sp-card:hover,.sp-card:focus-visible{transform:translateY(-2px);border-color:rgba(246,183,60,.55);box-shadow:0 0 0 1px rgba(246,183,60,.18),0 16px 40px rgba(246,183,60,.12)}
.sp-card-ouro{border-color:rgba(246,183,60,.55);background:linear-gradient(180deg,rgba(246,183,60,.16),rgba(14,18,30,.96) 70%)}
.sp-card-ic{width:64px;height:64px;flex:none;display:grid;place-items:center;clip-path:var(--oct);background:linear-gradient(180deg,var(--bloco2),var(--bloco))}
.sp-card-ouro .sp-card-ic{background:linear-gradient(180deg,#FFD678,#d98b1c)}
.sp-card-ic .sp-ic{width:42px;height:42px}
.sp-card-tx{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.sp-card-tx b{font:400 1.35rem "Lilita One",system-ui;letter-spacing:.02em}
.sp-card-tx small{color:var(--txt2);font-size:.9rem}
.sp-card-seta{font:400 2rem/1 "Lilita One";color:var(--ouro2)}

/* categories */
.sp-cats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sp-cat{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:14px 8px 12px;border-radius:18px;cursor:pointer;color:var(--txt);
  background:var(--bloco);border:2px solid transparent;transition:background .15s,border-color .15s,transform .15s}
.sp-cat:hover{background:var(--bloco2)}
.sp-cat b{font-weight:900;font-size:.98rem;line-height:1.2}
.sp-cat small{color:var(--txt2);font-size:.76rem;line-height:1.25}
.sp-cat.on{background:var(--bloco2);border-color:var(--ouro1);box-shadow:0 0 18px rgba(246,183,60,.28)}
.sp-cat.on b{color:var(--ouro2)}
.sp-cat.on::after{content:"";width:22px;height:3px;border-radius:2px;background:var(--ouro1);margin-top:4px}

/* form */
.sp-form{display:flex;flex-direction:column;gap:14px;padding:20px 16px;border-radius:24px;background:linear-gradient(180deg,rgba(24,30,46,.94),rgba(14,18,30,.94));border:1px solid var(--contorno)}
.sp-dupla{display:grid;gap:14px}
.sp .campo select,.sp .campo textarea,.sp .campo input[type=date],.sp-resp textarea,.sp-eq-resp textarea,.sp-eq-filtros select,.sp-eq-filtros input{width:100%;font:600 1rem "Nunito";color:var(--txt);background:var(--painel2);border:2px solid var(--bloco2);border-radius:12px;padding:12px 14px}
.sp .campo textarea,.sp-resp textarea,.sp-eq-resp textarea{resize:vertical;min-height:120px;line-height:1.5}
.sp .campo select:focus,.sp .campo textarea:focus,.sp .campo input[type=date]:focus,.sp-resp textarea:focus,.sp-eq-resp textarea:focus{outline:none;border-color:var(--ouro1);box-shadow:0 0 0 4px rgba(246,183,60,.18)}
.sp .campo input[type=date]{color-scheme:dark}
.sp-rot{font-weight:800;font-size:.9rem}
.sp-cont{justify-self:end;font-size:.78rem;color:var(--txt2)}
.sp-pag{border:1px solid rgba(246,183,60,.35);border-radius:18px;padding:12px 14px 14px;display:flex;flex-direction:column;gap:12px;background:rgba(246,183,60,.04)}
.sp-pag legend{padding:0 8px;font:400 1.05rem "Lilita One";color:var(--ouro2)}
.sp-radios{display:flex;gap:10px}
.sp-radio{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 10px;border-radius:12px;background:var(--painel2);border:2px solid var(--bloco2);font-weight:800;cursor:pointer}
.sp-radio input{accent-color:var(--ouro1);width:18px;height:18px}
.sp-radio:has(input:checked){border-color:var(--ouro1);color:var(--ouro2)}
.sp-alerta{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--painel2);border:1px dashed rgba(246,183,60,.45);font-size:.86rem;font-weight:700;color:#e8dcc0}
.sp-alerta-leve{border-color:var(--contorno);color:var(--txt2);font-weight:600}
.sp-lgpd{font-size:.8rem;color:var(--txt2);text-align:center}

/* images */
.sp-thumbs-linha{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.sp-thumbs{display:contents}
.sp-thumb{position:relative;width:84px;height:84px;border-radius:14px;overflow:hidden;border:1px solid var(--contorno);background:var(--painel2)}
.sp-thumb img{width:100%;height:100%;object-fit:cover}
.sp-tirar{position:absolute;top:4px;right:4px;width:26px;height:26px;border-radius:50%;background:rgba(10,14,24,.85);color:#fff;font:800 1rem/1 "Nunito";border:1px solid var(--contorno)}
.sp-add{width:84px;height:84px;border-radius:14px;border:2px dashed var(--bloco2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.72rem;font-weight:800;color:var(--txt2);cursor:pointer;text-align:center;padding:4px}
.sp-add span{font:400 1.6rem/1 "Lilita One";color:var(--ouro2)}
.sp-add:hover{border-color:var(--ouro1)}

/* list */
.sp-lista{display:flex;flex-direction:column;gap:10px}
.sp-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border-radius:18px;background:var(--bloco);border:1px solid var(--contorno);color:var(--txt);cursor:pointer}
.sp-item:hover{background:var(--bloco2)}
.sp-item-aguardando,.sp-item-respondido{border-color:rgba(246,183,60,.45)}
.sp-item-fechado{opacity:.72}
.sp-item-ic .sp-ic{width:34px;height:34px}
.sp-item-tx{flex:1;min-width:0;display:flex;flex-direction:column}
.sp-item-tx b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-item-tx small{color:var(--txt2);font-size:.8rem}
.sp-bt-novo{align-self:center;width:auto}

/* status badges: the ones that need the player glow gold (filled), the rest stay neutral */
.sp-st{flex:none;display:inline-flex;align-items:center;gap:6px;font:900 .72rem "Nunito";letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;border-radius:11px;white-space:nowrap;background:var(--bloco2);color:var(--txt);border:1px solid var(--contorno)}
.sp-st::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.sp-st-aguardando{background:linear-gradient(180deg,#FFD678,#F6B73C);color:var(--ourotxt);border-color:#5a3a0a;box-shadow:0 0 12px rgba(246,183,60,.45)}
.sp-st-respondido{color:var(--ouro2);border-color:rgba(246,183,60,.6)}
.sp-st-fechado{color:var(--txt2);background:transparent}
.sp-st-pendente{color:var(--txt2);background:transparent;border-style:dashed}

/* one ticket */
.sp-ticket{padding:18px 14px;gap:14px}
.sp-ticket-cab{display:flex;flex-wrap:wrap-reverse;gap:8px 12px;align-items:flex-start;justify-content:space-between}
.sp-ticket-cab>div{flex:1 1 260px;min-width:0}
.sp-info{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:6px}
.sp-meta{color:var(--txt2);font-size:.82rem;font-weight:700}
.sp-det{display:flex;gap:8px;align-items:center;padding:8px 12px;border-radius:12px;background:var(--painel2);font-size:.88rem;font-weight:700;color:#cdd5e1;word-break:break-word}
.sp-fio{list-style:none;display:flex;flex-direction:column;gap:12px;padding:0}
.sp-msg{max-width:92%;padding:12px 14px;border-radius:18px;background:var(--bloco);border:1px solid var(--contorno)}
.sp-msg-eu{align-self:flex-end;border-bottom-right-radius:6px;background:var(--bloco2)}
.sp-msg-eq{align-self:flex-start;border-bottom-left-radius:6px;border-color:rgba(246,183,60,.45);background:linear-gradient(180deg,rgba(246,183,60,.10),var(--bloco) 60%)}
.sp-msg-cab{display:flex;gap:10px;align-items:baseline;justify-content:space-between;margin-bottom:4px;font-size:.84rem}
.sp-msg-cab time{color:var(--txt2);font-size:.76rem;white-space:nowrap}
.sp-eq{color:var(--ouro2);display:inline-flex;gap:6px;align-items:center}
.sp-msg-tx{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}
.sp-sis{align-self:center;font-size:.78rem;color:var(--txt2);font-weight:700}
.sp-fotos{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sp-foto{width:96px;height:96px;border-radius:12px;overflow:hidden;border:1px solid var(--contorno);background:var(--painel2);padding:0;cursor:zoom-in}
.sp-foto img{width:100%;height:100%;object-fit:cover}
.sp-resp{padding:18px 14px;gap:12px}
.sp-fechar{color:var(--txt2)}
.sp-zoom{position:fixed;inset:0;z-index:200;background:rgba(5,8,14,.92);display:grid;place-items:center;padding:16px;cursor:zoom-out}
.sp-zoom img{max-width:100%;max-height:100%;border-radius:12px}
.sp-zoom-x{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;background:var(--bloco2);color:#fff;font:800 1.4rem/1 "Nunito";border:1px solid var(--contorno)}
.sp-convidado{padding:18px 16px;gap:12px}
.sp-ok h2{font:400 1.7rem "Lilita One";color:var(--ouro2)}
.sp-ok .bt-ouro{width:auto}

@media (min-width:640px){
  .sp-cards{grid-template-columns:1fr 1fr}
  .sp-cats{grid-template-columns:repeat(3,1fr)}
  .sp-dupla{grid-template-columns:160px 1fr}
  .sp-pag .sp-dupla{grid-template-columns:1fr 1fr}
  .sp-form{padding:26px 26px}
  .sp-ticket,.sp-resp{padding:24px}
  .sp-msg{max-width:80%}
}

/* ================= team page (/equipe-suporte) */
.sp-eq-app{max-width:1280px}
.sp-eq-grade{display:grid;gap:16px}
.sp-eq-fila{display:flex;flex-direction:column;gap:10px;min-width:0}
.sp-eq-abas{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.sp-eq-aba{flex:none;display:inline-flex;gap:6px;align-items:center;padding:7px 12px;border-radius:11px;background:var(--bloco);border:1px solid var(--contorno);color:var(--txt);font:800 .85rem "Nunito";cursor:pointer}
.sp-eq-aba b{min-width:20px;padding:0 6px;border-radius:8px;background:var(--painel2);font-size:.75rem;text-align:center}
.sp-eq-aba.on{border-color:var(--ouro1);color:var(--ouro2)}
.sp-eq-filtros{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sp-eq-filtros select,.sp-eq-filtros input{padding:9px 10px;font-size:.9rem}
.sp-eq-filtros label{display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:700;color:var(--txt2);white-space:nowrap}
.sp-eq-filtros label input{width:18px;height:18px;flex:none;accent-color:var(--ouro1);padding:0}
.sp-eq-item{display:grid;grid-template-columns:auto 1fr auto;gap:4px 10px;align-items:center;text-align:left;width:100%;padding:10px 12px;border-radius:14px;background:var(--bloco);border:1px solid var(--contorno);color:var(--txt);cursor:pointer}
.sp-eq-item:hover{background:var(--bloco2)}
.sp-eq-item.on{border-color:var(--ouro1);box-shadow:0 0 0 1px rgba(246,183,60,.25)}
.sp-eq-item .sp-ic{width:28px;height:28px;grid-row:span 2}
.sp-eq-item b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-eq-item small{grid-column:2/4;color:var(--txt2);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-eq-idade{font-size:.75rem;font-weight:900;color:var(--txt2)}
.sp-eq-idade.velho{color:#ffb3a8}
.sp-eq-det{display:flex;flex-direction:column;gap:12px;min-width:0}
.sp-eq-caixa{padding:14px 16px;border-radius:16px;background:var(--painel2);border:1px solid var(--contorno);display:flex;flex-direction:column;gap:6px;font-size:.9rem}
.sp-eq-caixa h4{font:900 .78rem "Nunito";letter-spacing:.08em;text-transform:uppercase;color:var(--txt2)}
.sp-eq-caixa code{font:700 .85rem ui-monospace,Consolas,monospace;background:var(--bloco);padding:1px 6px;border-radius:6px;word-break:break-all}
.sp-eq-desconfie{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:rgba(255,107,90,.07);border:1px solid rgba(255,107,90,.35);font-size:.84rem;font-weight:700;color:#ffcbc3}
.sp-msg-nota{align-self:stretch;max-width:100%;background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 10px,transparent 10px 20px),var(--painel2);border:1px dashed var(--txt2)}
.sp-msg-nota .sp-msg-cab b{color:var(--txt2)}
.sp-eq-resp{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:18px;background:linear-gradient(180deg,rgba(24,30,46,.96),rgba(14,18,30,.96));border:1px solid var(--contorno)}
.sp-eq-linha{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sp-eq-linha select{flex:1;min-width:150px;font:600 .9rem "Nunito";color:var(--txt);background:var(--painel2);border:2px solid var(--bloco2);border-radius:10px;padding:8px 10px}
.sp-eq-bt{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:11px;background:var(--bloco2);border:1px solid var(--contorno);color:var(--txt);font:800 .88rem "Nunito";cursor:pointer}
.sp-eq-bt:hover{border-color:var(--ouro1)}
.sp-eq-bt.ouro{background:linear-gradient(180deg,#FFD678,#F6B73C);color:var(--ourotxt);border-color:#5a3a0a}
.sp-eq-bt:disabled{opacity:.5;cursor:default}
.sp-eq-vazio{color:var(--txt2);text-align:center;padding:30px 10px}
@media (min-width:1000px){
  .sp-eq-grade{grid-template-columns:400px minmax(0,1fr);align-items:start}
  .sp-eq-fila{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;padding-right:4px}
  .sp-eq-voltar{display:none}
}
@media (max-width:999px){
  .sp-eq-grade.detalhe .sp-eq-fila{display:none}
  .sp-eq-grade:not(.detalhe) .sp-eq-det{display:none}
}
