/* Okul Araçları — hap düğmeler (üst çubuk, kartlar) */
.pill{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  padding:.6em 1.2em;border-radius:999px;min-height:var(--tap);
  font-family:var(--sans);font-size:.85rem;font-weight:500;letter-spacing:0;
  text-decoration:none;border:1px solid var(--kenar);cursor:pointer;
  transition:background-color .2s var(--ease-out),color .2s var(--ease-out),
             border-color .2s var(--ease-out),box-shadow .2s var(--ease-out),
             transform .2s var(--ease-out);
}
.pill--solid{
  background:var(--brand);border-color:var(--brand);color:var(--on-brand);
  box-shadow:var(--sh-1);
}
.pill--ghost{background:transparent;color:var(--ink)}
.pill--wa{background:#128C4A;border-color:#128C4A;color:#fff}
.pill--sm{padding:.5em 1em;font-size:.8rem;min-height:2.25rem}
@media (hover:hover){
  .pill--solid:hover{background:var(--brand-hover);border-color:var(--brand-hover);
    box-shadow:var(--sh-2);transform:translateY(-1px)}
  .pill--ghost:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
  .pill--wa:hover{background:#0F7740;border-color:#0F7740;transform:translateY(-1px)}
}
@media (prefers-reduced-motion:reduce){ .pill:hover{transform:none} }
.pill svg{flex:none}