/* ============================================================
   AGENDA PSI — SOLICITAÇÕES 3.0
   Fila das solicitações de agendamento recebidas pela página pública
   (docs/product/agenda-psi-4/AGENDA.md, 4º destino do menu da Agenda:
   Calendário · Solicitações · Meus horários · Cancelamentos).
   Reaproveita o shell/tokens (--dd-*) de dashboard-2.0.css e o mesmo
   padrão visual de filtro/lista já usado em cancelamentos-3.0.css
   (.filter-bar/.filter-button, .occurrence-like list). Toda a lógica
   vive em loadSolicitacoes() (painel-2.0-runtime.js) — reaproveita
   SOLICITACAO_STATUS_LABEL/SOLICITACAO_FINALIZADA já usadas por
   loadSolicitacao() (tela de detalhe), sem duplicar nem inventar
   tradução/cor nova.
   ============================================================ */

.aps-kicker{color:var(--dd-violet);font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.aps-avatar{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--dd-blue-soft);color:#1f4f96;font-weight:700;font-size:12.5px;flex:none}
.aps-card{background:var(--dd-surface);border:1px solid var(--dd-border);border-radius:var(--dd-radius-lg);box-shadow:var(--dd-shadow-sm)}
.aps-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:13.5px;padding:10px 18px;border-radius:var(--dd-radius-md);border:1px solid transparent;cursor:pointer;transition:background var(--dd-fast) var(--dd-ease),border-color var(--dd-fast) var(--dd-ease);white-space:nowrap}
.aps-btn--primary{background:var(--dd-violet);color:#fff;box-shadow:var(--dd-shadow-sm)}
.aps-btn--primary:hover{background:var(--dd-violet-dark)}
.aps-btn--secondary{background:var(--dd-surface);color:var(--dd-ink);border-color:var(--dd-border-strong)}
.aps-btn--secondary:hover{border-color:var(--dd-violet);background:var(--dd-violet-soft)}
.aps-btn:focus-visible{box-shadow:var(--dd-shadow-focus)}

/* Badges de status — mesmas 4 variantes já usadas em agenda-3.0.css/
   cancelamentos-3.0.css/prontuarios-3.0.css/financeiro-3.0.css (cada
   tela redeclara localmente, convenção já estabelecida no projeto).
   --success/--warning já existem em agenda-psi-design-system-2.0.css
   (global); --danger/--neutral não, por isso as 4 são redeclaradas
   aqui igual às demais telas, sem inventar cor nova. */
.aps-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:700}
.aps-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.aps-badge--success{color:#0b6b47;background:var(--dd-green-soft)}
.aps-badge--warning{color:#8a5a09;background:var(--dd-amber-soft)}
.aps-badge--danger{color:#a32a20;background:var(--dd-red-soft)}
.aps-badge--neutral{color:var(--dd-ink-soft);background:var(--dd-bg)}

/* ============================================================
   CABEÇALHO
   ============================================================ */
.solreq-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.solreq-summary{margin-top:10px;color:var(--dd-ink-soft);font-size:13px;font-weight:600}

/* ============================================================
   FILTRO — mesmo padrão de cancelamentos-3.0.css (.filter-bar/.filter-button)
   ============================================================ */
.filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.filter-button{padding:8px 14px;border:1px solid var(--dd-border);border-radius:999px;color:var(--dd-ink-soft);background:var(--dd-surface);font-size:12.5px;font-weight:600;cursor:pointer;transition:background var(--dd-fast) var(--dd-ease),border-color var(--dd-fast) var(--dd-ease),color var(--dd-fast) var(--dd-ease)}
.filter-button:hover{border-color:var(--dd-border-strong)}
.filter-button.active{border-color:var(--dd-violet);color:var(--dd-violet-dark);background:var(--dd-violet-soft)}

/* ============================================================
   ESTADO DE CARREGAMENTO/ERRO
   ============================================================ */
.solreq-state{padding:12px 14px;margin-bottom:14px;border-radius:var(--dd-radius-md);color:var(--dd-ink-soft);background:var(--dd-bg);font-size:13px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.solreq-state.error{color:#a32a20;background:#fbeae8}
.solreq-state[hidden]{display:none}

/* ============================================================
   LISTA — cartão inteiro é o link para solicitacao.html?id=
   ============================================================ */
.solreq-list{display:grid;gap:9px}
.solreq-item{display:grid;grid-template-columns:auto minmax(0,1.4fr) auto;align-items:center;gap:14px;padding:15px;border:1px solid var(--dd-border);border-radius:var(--dd-radius-lg);background:var(--dd-surface);text-decoration:none;color:inherit;transition:transform var(--dd-fast) var(--dd-ease),box-shadow var(--dd-fast) var(--dd-ease),border-color var(--dd-fast) var(--dd-ease)}
.solreq-item:hover,.solreq-item:focus-visible{transform:translateY(-1px);box-shadow:var(--dd-shadow-md);border-color:var(--dd-border-strong)}
.solreq-item:focus-visible{box-shadow:var(--dd-shadow-focus)}
.solreq-main{min-width:0}
.solreq-main strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dd-ink);font-size:14.5px;font-weight:700}
.solreq-main span{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--dd-ink-mute);font-size:12.5px}
.solreq-meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;text-align:right}
.solreq-meta small{color:var(--dd-ink-mute);font-size:11.5px;white-space:nowrap}

/* Skeleton de carregamento — v2-skel-row/v2-skel-avatar/v2-skel-bar já
   globais em painel-2.0-runtime.css; aqui só o grid do item skeleton
   precisa das mesmas 3 colunas do item real, senão o layout "pula" na
   troca do skeleton pro conteúdo real. */
.solreq-item.v2-skel-row{grid-template-columns:auto 1fr;cursor:default;pointer-events:none}

@media(max-width:780px){
  .solreq-item{grid-template-columns:auto minmax(0,1fr);row-gap:8px}
  .solreq-meta{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center;text-align:left}
}
@media(max-width:560px){
  .solreq-head{flex-direction:column;align-items:flex-start}
}