/* ARETÉ · event access CTA polish
   Keep amber + violet hierarchy, but make both actions feel embedded in the nocturnal UI. */
html:has(.event-detail-shell) .event-detail-actions a{
  position:relative;
  overflow:hidden;
  border-radius:12px!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 8px 26px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease;
}

html:has(.event-detail-shell) .event-detail-actions a::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.055),transparent 38%,rgba(255,255,255,.018));
  opacity:.75;
}

html:has(.event-detail-shell) .event-detail-actions a>span{
  position:relative;
  z-index:1;
}

html:has(.event-detail-shell) .action-free{
  background:linear-gradient(105deg,rgba(216,158,54,.28),rgba(235,181,77,.16))!important;
  color:#f1d59b!important;
  border:1px solid rgba(228,174,74,.46)!important;
}

html:has(.event-detail-shell) .action-ticket{
  background:linear-gradient(105deg,rgba(100,28,113,.30),rgba(132,41,146,.18))!important;
  color:#ead4ee!important;
  border:1px solid rgba(198,99,216,.34)!important;
}

html:has(.event-detail-shell) .action-free:hover{
  transform:translateY(-1px);
  background:linear-gradient(105deg,rgba(216,158,54,.38),rgba(235,181,77,.22))!important;
  border-color:rgba(237,186,91,.7)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.22),0 0 22px rgba(216,158,54,.08);
}

html:has(.event-detail-shell) .action-ticket:hover{
  transform:translateY(-1px);
  background:linear-gradient(105deg,rgba(100,28,113,.42),rgba(132,41,146,.25))!important;
  border-color:rgba(207,111,224,.58)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.22),0 0 22px rgba(121,37,137,.10);
}

html:has(.event-detail-shell) .event-detail-actions a:active{
  transform:translateY(0);
}

@media(max-width:720px){
  html:has(.event-detail-shell) .event-detail-actions{
    gap:10px;
  }

  html:has(.event-detail-shell) .event-detail-actions a{
    min-height:52px!important;
    padding-inline:17px!important;
    border-radius:12px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html:has(.event-detail-shell) .event-detail-actions a{
    transition:none!important;
  }
}
