/* Shared action geometry and theme colors across authenticated routes. */
body[data-theme="dark"]{
  --action-primary:#8062dc;
  --action-primary-hover:#9478ed;
  --action-secondary-bg:#151a30;
  --action-secondary-hover:#202743;
  --action-secondary-border:#3b4565;
  --action-secondary-text:#ecebfa;
  --action-danger:#e98a99;
}
body[data-theme="light"]{
  --action-primary:#6549c8;
  --action-primary-hover:#5538b7;
  --action-secondary-bg:#ffffff;
  --action-secondary-hover:#efebfb;
  --action-secondary-border:#c7c6dc;
  --action-secondary-text:#282747;
  --action-danger:#aa334d;
}

body[data-theme] :is(.btn,.spk-btn){
  clip-path:none!important;
  border-radius:0!important;
  letter-spacing:0!important;
  box-shadow:none!important;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
body[data-theme] :is(.btn,.spk-btn):focus-visible{
  outline:2px solid var(--action-primary)!important;
  outline-offset:2px;
}
body[data-theme] :is(.btn,.spk-btn):disabled{opacity:.55;box-shadow:none!important}
body[data-theme] :is(.btn-primary,.spk-btn-primary,.live-toggle-button.btn-primary){
  background:linear-gradient(135deg,#6366f1,#8b5cf6)!important;
  border-color:#6366f1!important;
  color:#fff!important;
  border-radius:0!important;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)!important;
  box-shadow:0 8px 22px rgba(99,102,241,.2)!important;
}
body[data-theme] :is(.btn-primary,.spk-btn-primary,.live-toggle-button.btn-primary):is(:hover,:focus-visible){
  background:linear-gradient(135deg,#7375f7,#a276ff)!important;
  border-color:#7375f7!important;
  color:#fff!important;
  box-shadow:0 10px 26px rgba(99,102,241,.3)!important;
}
body[data-theme] :is(.btn-outline-secondary,.btn-outline-light,.btn-outline-primary,.spk-btn-secondary,.btn-secondary){
  background:var(--action-secondary-bg)!important;
  border:1px solid var(--action-secondary-border)!important;
  color:var(--action-secondary-text)!important;
}
body[data-theme] :is(.btn-outline-secondary,.btn-outline-light,.btn-outline-primary,.spk-btn-secondary,.btn-secondary):is(:hover,:focus-visible){
  background:var(--action-secondary-hover)!important;
  border-color:var(--action-primary)!important;
  color:var(--action-secondary-text)!important;
}
body[data-theme] :is(.btn-outline-danger,.btn-danger){
  background:color-mix(in srgb,var(--action-danger) 10%,var(--action-secondary-bg))!important;
  border:1px solid color-mix(in srgb,var(--action-danger) 48%,var(--action-secondary-border))!important;
  color:var(--action-danger)!important;
}
body[data-theme] :is(.btn-outline-danger,.btn-danger):is(:hover,:focus-visible){
  background:color-mix(in srgb,var(--action-danger) 19%,var(--action-secondary-bg))!important;
  border-color:var(--action-danger)!important;
  color:var(--action-danger)!important;
}

/* The former clipped topbar and event controls used pseudo elements to
   recreate the cut corner even after changing the base button shape. */
body[data-theme] #appTopbar :is(.app-topbar-cut,#sidebarToggle){
  clip-path:none!important;
  border-radius:0!important;
  background:var(--action-secondary-bg)!important;
  border:1px solid var(--action-secondary-border)!important;
  color:var(--action-secondary-text)!important;
  box-shadow:none!important;
}
body[data-theme] :is(.event-view-back,.event-view-toolbar .btn-outline-secondary){
  clip-path:none!important;
  border-radius:10px!important;
  background:var(--bg-main)!important;
  border:1px solid var(--border-subtle)!important;
  color:var(--action-secondary-text)!important;
  box-shadow:none!important;
}
body[data-theme] #appTopbar :is(.app-topbar-cut,#sidebarToggle)::before,
body[data-theme] #appTopbar :is(.app-topbar-cut,#sidebarToggle)::after,
body[data-theme] :is(.event-view-back,.event-view-toolbar .btn-outline-secondary)::before,
body[data-theme] :is(.event-view-back,.event-view-toolbar .btn-outline-secondary)::after{display:none!important}
body[data-theme] #appTopbar :is(.app-topbar-cut,#sidebarToggle):is(:hover,:focus-visible){
  background:var(--action-secondary-hover)!important;
  border-color:var(--action-primary)!important;
}
body[data-theme] :is(.event-view-back,.event-view-toolbar .btn-outline-secondary):is(:hover,:focus-visible){
  background:color-mix(in srgb,var(--bg-main) 86%,var(--action-primary) 14%)!important;
  border-color:var(--border-strong)!important;
}
body[data-theme] :is(#eventView,#localUserPage) :is(.event-view-back,.event-view-toolbar .btn-outline-secondary){
  background:var(--bg-main)!important;
  border-color:var(--border-subtle)!important;
}
body[data-theme] :is(#eventView,#localUserPage) :is(.event-view-back,.event-view-toolbar .btn-outline-secondary):is(:hover,:focus-visible){
  background:color-mix(in srgb,var(--bg-main) 86%,var(--action-primary) 14%)!important;
  border-color:var(--border-strong)!important;
}
body[data-theme] #incidentNotificationTrigger{
  border-radius:0!important;
  box-shadow:none!important;
}
/* Every topbar action uses the same box, regardless of Bootstrap's button
   padding or whether the action contains text or only an icon. */
body[data-theme] #appTopbar .app-topbar-action{
  box-sizing:border-box;
  height:40px;
  min-height:40px;
  padding-top:0!important;
  padding-bottom:0!important;
  align-items:center;
  justify-content:center;
  line-height:1.2;
}
body[data-theme] #appTopbar .app-topbar-action-icon{
  width:40px;
  min-width:40px;
  padding-left:0!important;
  padding-right:0!important;
}
@media(max-width:767.98px){
  body[data-theme] #appTopbar .app-topbar-action{
    height:42px;
    min-height:42px;
  }
}
body[data-theme="dark"] #incidentNotificationTrigger{
  border:1px solid var(--secondary-action-border)!important;
  background:var(--secondary-action-bg)!important;
  color:var(--secondary-action-text)!important;
}
body[data-theme="light"] #incidentNotificationTrigger{
  border:1px solid rgba(15,23,42,.12)!important;
  background:rgba(255,255,255,.68)!important;
  color:var(--text-main)!important;
}
body[data-theme] #incidentNotificationTrigger:is(:hover,:focus-visible,[aria-expanded="true"]){
  border-color:var(--border-strong)!important;
  background:var(--action-secondary-hover)!important;
}

.live-screen-shell:fullscreen .live-fullscreen-actions .btn-light{
  background:#f3efff!important;
  border-color:#f3efff!important;
  color:#292244!important;
}
.live-screen-shell:fullscreen .live-fullscreen-actions .btn-light:hover{
  background:#e5dbff!important;
  border-color:#e5dbff!important;
}

/* Consistent feedback without layout movement; keyboard focus remains visible. */
:where(.btn,.entity-action-trigger,.entity-action-item,.settings-nav button,.cap-category-tab){transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease,box-shadow 160ms ease,opacity 160ms ease}
:where(.btn,.entity-action-trigger,.cap-category-tab):active:not(:disabled):not([aria-disabled="true"]){filter:brightness(.94)}
:where(.btn,.entity-action-trigger,.entity-action-item,.cap-category-tab):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(prefers-reduced-motion:reduce){:where(.btn,.entity-action-trigger,.entity-action-item,.settings-nav button,.cap-category-tab){transition:none!important}}
