/* =========================================================
   WordSqueezer Premium gate
   Login BEFORE Premium + floating Ko-fi payment button.
   ========================================================= */

.premium-gate{
  max-width:680px;
}

.premium-gate h1{
  margin-bottom:10px;
}

.premium-gate-lead{
  margin-bottom:24px;
}

.premium-access-card,
.premium-buy-card{
  margin-top:18px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--paper);
}

.premium-access-card h2,
.premium-buy-card h2{
  margin:0 0 7px;
}

.premium-access-card p,
.premium-buy-card p{
  margin:0 0 17px;
  color:var(--muted);
}

#premium-access-form label{
  display:block;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.08em;
}

#premium-access-form input{
  display:block;
  width:100%;
  min-width:0;
  margin-top:6px;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  color:var(--ink);
  font:inherit;
}

#premium-access-form button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:12px;
  padding:0 18px;
  border:0;
  border-radius:10px;
  background:var(--accent);
  color:#fff;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}

#premium-access-form button:hover:not(:disabled){
  background:var(--accent-dark);
}

#premium-access-form button:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.premium-access-state,
.premium-payment-state{
  min-height:1.45em;
  margin-top:10px;
  font-size:.78rem;
  color:var(--muted);
}

.premium-access-state.is-error,
.premium-payment-state.is-error{
  font-weight:800;
}

.premium-access-state.is-success,
.premium-payment-state.is-success{
  color:var(--ink);
  font-weight:900;
}

.premium-payment-state.is-ready{
  color:var(--ink);
  font-weight:800;
}

.premium-gate-benefits{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:18px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:12px;
}

.premium-gate-benefits span{
  color:var(--muted);
  font-size:.86rem;
}

@media(max-width:720px){
  .premium-access-card,
  .premium-buy-card{
    padding:18px;
  }

  #premium-access-form input{
    min-height:48px;
  }

  #premium-access-form button{
    width:100%;
  }
}