/* BRL_SUBSCRIPTION_UI_PHASE_B */
#brlSubscriptionWorkbench .brl-sub-kpis{
  display:grid;
  grid-template-columns:1fr;
  gap:.75rem;
}
@media (min-width: 980px){
  #brlSubscriptionWorkbench .brl-sub-kpis{
    grid-template-columns:repeat(4,1fr);
  }
}

#brlSubscriptionWorkbench .brl-sub-kpi,
#brlSubscriptionWorkbench .brl-sub-panel,
#brlSubscriptionWorkbench .brl-sub-plan{
  border:1px solid rgba(148,163,184,.16);
  border-radius:14px;
  background:rgba(15,23,42,.12);
}

#brlSubscriptionWorkbench .brl-sub-kpi,
#brlSubscriptionWorkbench .brl-sub-panel{
  padding:1rem;
}

#brlSubscriptionWorkbench .brl-sub-plan{
  padding:1.1rem;
  cursor:pointer;
  transition:.18s ease;
}

#brlSubscriptionWorkbench .brl-sub-plan:hover{
  border-color:rgba(99,102,241,.34);
  transform:translateY(-1px);
}

#brlSubscriptionWorkbench .brl-sub-plan.active{
  border-color:rgba(99,102,241,.50);
  box-shadow:0 0 0 1px rgba(99,102,241,.22) inset;
  background:linear-gradient(180deg, rgba(79,140,255,.09), rgba(139,92,246,.06));
}

#brlSubscriptionWorkbench .brl-sub-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media (min-width: 980px){
  #brlSubscriptionWorkbench .brl-sub-grid{
    grid-template-columns:1.2fr .8fr;
  }
}

#brlSubscriptionWorkbench .brl-sub-plan-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media (min-width: 980px){
  #brlSubscriptionWorkbench .brl-sub-plan-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

#brlSubscriptionWorkbench .brl-sub-badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.28rem .65rem;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
}

#brlSubscriptionWorkbench .brl-sub-badge-ok{
  color:#bbf7d0;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.28);
}
#brlSubscriptionWorkbench .brl-sub-badge-warn{
  color:#fde68a;
  background:rgba(245,158,11,.14);
  border:1px solid rgba(245,158,11,.28);
}
#brlSubscriptionWorkbench .brl-sub-badge-soft{
  color:#cbd5e1;
  background:rgba(148,163,184,.12);
  border:1px solid rgba(148,163,184,.22);
}
#brlSubscriptionWorkbench .brl-sub-badge-featured{
  color:#dbeafe;
  background:rgba(99,102,241,.14);
  border:1px solid rgba(99,102,241,.26);
}

#brlSubscriptionWorkbench .brl-sub-cycle{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

#brlSubscriptionWorkbench .brl-sub-cycle button{
  min-height:42px;
}

#brlSubscriptionWorkbench .brl-sub-cycle button.active{
  border-color:rgba(99,102,241,.50) !important;
  background:rgba(99,102,241,.14) !important;
  color:#eef2ff !important;
}

#brlSubscriptionWorkbench textarea.form-control{
  min-height:110px;
  resize:vertical;
}

#brlSubscriptionWorkbench .brl-sub-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  margin-top:1rem;
}

#brlSubscriptionWorkbench .brl-sub-meta{
  font-size:12px;
  color:#94a3b8;
  line-height:1.55;
}

#brlSubscriptionWorkbench .brl-sub-note{
  margin-top:.75rem;
  padding:.8rem .9rem;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.18);
  background:rgba(148,163,184,.08);
  color:#cbd5e1;
  font-size:12px;
  line-height:1.55;
}
