/* push.css — painel de notificações push em /minha-conta */
/* O dashboard zera o padding de <section> com !important (section{padding:0!important}).
   Como este card é um <section>, precisamos reafirmar o padding com !important pra
   ficar no mesmo padrão visual dos demais .mc-card (que são <a>/<div>). */
.rap-push-card { padding: 22px !important; }
.rap-push-head h3 { margin: 0 0 4px; font-size: 1.05rem; }
.rap-push-sub { margin: 0 0 14px; font-size: .85rem; color: var(--text-muted, #6b7280); }
.rap-push-warn { font-size: .85rem; color: #b45309; }
.rap-push-master {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border, #e5e7eb);
}
.rap-push-master.is-busy { opacity: .5; pointer-events: none; }
.rap-push-hint { font-size: .82rem; color: var(--text-muted, #6b7280); margin: 12px 0 0; }
.rap-push-cats { margin-top: 8px; display: flex; flex-direction: column; }
.rap-push-cat {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--border, #eef0f3);
  font-size: .92rem;
}
.rap-push-cat:last-child { border-bottom: 0; }

/* switch */
.rap-push-switch { position: relative; display: inline-block; width: 44px; height: 24px; flex: 0 0 auto; }
.rap-push-tgl { opacity: 0; width: 0; height: 0; position: absolute; }
.rap-push-slider {
  position: absolute; inset: 0; cursor: pointer; background: #cbd5e1;
  border-radius: 999px; transition: background .18s;
}
.rap-push-slider::before {
  content: ''; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px;
  background: #fff; border-radius: 50%; transition: transform .18s;
}
.rap-push-tgl:checked + .rap-push-slider { background: #25d366; }
.rap-push-tgl:checked + .rap-push-slider::before { transform: translateX(20px); }
.rap-push-tgl:focus-visible + .rap-push-slider { outline: 2px solid #4338ca; outline-offset: 2px; }