/* ============================
   BUTTONS & BADGES — GuideGuru
============================ */

/* Base button class */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;

  padding:.55rem .9rem;

  border-radius:12px;
  border:1px solid var(--line);

  background:var(--card);
  color:var(--ink);

  font-size:.9rem;
  font-weight:700;

  cursor:pointer;
  text-decoration:none;

  transition:transform .02s ease-in-out;
}

.btn.active,
.btn.pro,
.btn.promo,
.primary-btn,
.active-btn{
  background:var(--brand);
  border-color:var(--brand);
  color:var(--ink-inv);
}

.btn-sm{
  padding:.35rem .7rem;
  font-size:.8rem;
}

.btn.disabled,
.btn:disabled,
button:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.secondary-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:52px;
  padding:.55rem .9rem;

  border-radius:12px;
  border:1px solid var(--line);

  background:var(--card);
  color:var(--ink);

  font-size:.9rem;
  font-weight:700;

  cursor:pointer;
  text-decoration:none;
}

.secondary-btn:hover{
  border-color:var(--brand);
  color:var(--brand);
}

.danger-btn{
  background:var(--ended);
  border-color:var(--ended);
  color:#000;
}

.btn:hover{
  filter:none;
}

/* Full width helper */
.full-btn{
  width:100%;
  min-height:52px;
  padding:14px;
}

/* Keep card buttons green */
.pro-card .card-actions .btn,
.promo-card .card-actions .btn{
  background:var(--brand);
  border-color:var(--brand);
  color:var(--ink-inv);
}

/* ============================
   BADGES
============================ */

.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  border-radius:9999px;

  padding:.25rem .6rem;

  font-size:.75rem;
  font-weight:700;
  line-height:1;

  border:1px solid var(--line);

  background:var(--chip, var(--card));
  color:var(--muted);
}

.badge.pro{
  background:var(--brand);
  color:var(--ink-inv);
  border-color:var(--brand);
}

.badge.promo{
  background:var(--star-filled, #ffd54a);
  color:#0a0a0a;
  border-color:var(--star-filled, #ffd54a);
}

/* ============================
   LOGIN ACTION BUTTONS
============================ */

.login-action-links{
  display:flex;
  flex-direction:row;
  gap:12px;
  margin-top:20px;
  width:100%;
}

.outline-register-btn,
.staff-login-link{
  flex:1;

  display:flex;
  align-items:center;
  justify-content:center;

  min-height:52px;

  border:1px solid var(--brand);
  border-radius:14px;

  background:#000;
  color:var(--brand);

  text-decoration:none;

  font-weight:800;
  font-size:14px;
  text-align:center;
}

.outline-register-btn:hover,
.staff-login-link:hover{
  background:var(--brand);
  color:#000;
}

@media(max-width:480px){

  .login-action-links{
    flex-direction:column;
  }

}

/* ============================
   GLOBAL FLOATING BACK BUTTON
============================ */

.gg-backfab{
  position:fixed;
  top:12px;
  left:12px;
  z-index:9999;

  display:flex;
  align-items:center;
  gap:6px;

  padding:8px 14px;

  border-radius:9999px;
  border:1px solid var(--brand);

  background:rgba(10,10,10,.95);
  color:var(--ink);

  font-size:.85rem;

  box-shadow:0 10px 24px rgba(0,0,0,.7);

  cursor:pointer;
  text-decoration:none;

  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);

  transition:background .2s ease, border-color .2s ease;
}

.gg-backfab span.arrow{
  font-size:1rem;
  line-height:1;
}

.gg-backfab:hover{
  background:#111;
  border-color:var(--brand);
}