:root{
  --ma-pay-red:#c53838;
  --ma-pay-red-soft:rgba(197,56,56,.18);
  --ma-pay-red-strong:rgba(197,56,56,.82);
  --ma-pay-yellow:#ef9f22;
  --ma-pay-green:#2aa567;
}

.dni-access-card--locked{
  position:relative;
  filter:saturate(.55) blur(1px);
  pointer-events:none;
}

.dni-access-card--locked::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(197,56,56,.08) 0%, rgba(197,56,56,.22) 100%),
    repeating-linear-gradient(
      -45deg,
      rgba(255,255,255,.04) 0 14px,
      rgba(197,56,56,.14) 14px 28px
    );
  box-shadow:inset 0 0 0 2px rgba(197,56,56,.24);
}

.dni-access-banner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:0 auto 14px;
  width:max-content;
  max-width:100%;
  padding:10px 18px;
  border-radius:999px;
  background:rgba(197,56,56,.1);
  color:var(--ma-pay-red);
  font-family:'Barlow',sans-serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.dni-access-banner svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
}

.dni-access-status{
  margin:18px 0 12px;
  padding:18px 18px 16px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 26px -24px rgba(33,33,33,.45);
  border:1px solid rgba(0,0,0,.05);
}

.dni-access-status.is-pending{
  background:linear-gradient(180deg, rgba(239,159,34,.14) 0%, rgba(255,255,255,.94) 100%);
  border-color:rgba(239,159,34,.3);
}

.dni-access-status.is-locked{
  background:linear-gradient(180deg, rgba(197,56,56,.12) 0%, rgba(255,255,255,.96) 100%);
  border-color:rgba(197,56,56,.18);
}

.dni-access-title{
  color:#212121;
  font-family:'Barlow',sans-serif;
  font-size:19px;
  font-weight:700;
  line-height:1.15;
  margin:0 0 7px;
}

.dni-access-copy{
  color:#4a4a4a;
  font-family:'Barlow',sans-serif;
  font-size:14px;
  font-weight:500;
  line-height:1.4;
  margin:0;
}

.dni-access-button{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:52px;
  margin-top:16px;
  border:none;
  border-radius:999px;
  background:linear-gradient(135deg, #c53838 0%, #9f2020 100%);
  color:#fff;
  font-family:'Barlow',sans-serif;
  font-size:16px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 18px 28px -24px rgba(159,32,32,.7);
}

.dni-access-button.is-pending{
  background:linear-gradient(135deg, #f0a32f 0%, #d28317 100%);
  box-shadow:0 18px 28px -24px rgba(210,131,23,.68);
}

.dni-access-hidden{
  display:none !important;
}

.ma-toast-stack{
  position:fixed;
  left:50%;
  bottom:calc(88px + env(safe-area-inset-bottom, 0px));
  transform:translateX(-50%);
  z-index:3000;
  display:flex;
  flex-direction:column;
  gap:10px;
  width:min(calc(100vw - 28px), 360px);
}

.ma-toast{
  padding:14px 16px;
  border-radius:16px;
  background:rgba(31,31,31,.94);
  color:#fff;
  font-family:'Barlow',sans-serif;
  font-size:14px;
  font-weight:600;
  line-height:1.35;
  box-shadow:0 18px 34px -24px rgba(0,0,0,.72);
  animation:maToastIn .22s ease-out both;
}

.ma-toast.is-success{background:rgba(42,165,103,.96)}
.ma-toast.is-warning{background:rgba(239,159,34,.97);color:#222}
.ma-toast.is-error{background:rgba(197,56,56,.96)}

@keyframes maToastIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}