/* ITDA liquid / medium. Screen only; retain product geometry and custom colors. */
@media screen {
  :root {
    --itda-effect-highlight: rgba(255,255,255,.90);
    --itda-effect-side: rgba(255,255,255,.50);
    --itda-effect-shade: rgba(15,23,42,.09);
    --itda-effect-depth: 0 9px 22px rgba(15,23,42,.12);
    --itda-effect-inset: inset 0 2px 0 var(--itda-effect-highlight),
      inset 1px 0 0 var(--itda-effect-side),
      inset 0 -2px 2px var(--itda-effect-shade);
  }

  body :is(.app-header,.subbar,.server-mobile-nav,.profile-menu-panel,
    .home-notice-focus,.quick-card,.panel,.event-card,.stat-card,.reading-card,
    .settings-card,.ev-card,.ev-leader-group,.login-card,.login-modal-card,
    .form-container,.form-box,.request-card,.custom-preview-card,.button-rules-card,
    .poll-card,.note-card,.sharing-card,.ad-card,.vehicle-card) {
    box-shadow: var(--itda-effect-inset),
      var(--itda-custom-shadow,var(--itda-effect-depth)),
      0 3px 8px rgba(15,23,42,.05) !important;
  }

  /* Header keeps its surface hue. Sidebar menus retain their opaque surface. */
  body .app-header {
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
  @supports (background-color: color-mix(in srgb, white 80%, transparent)) {
    html:not(.itda-menu-left-root):not(.itda-menu-right-root) body .app-header {
      background-color: color-mix(in srgb,
        var(--itda-custom-surface,var(--surface,#fff)) 82%,transparent) !important;
    }
  }

  body :is(.hero-main,.event-cover) {
    box-shadow: inset 0 2px 0 rgba(255,255,255,.58),
      inset 1px 0 0 rgba(255,255,255,.25),
      inset 0 -3px 5px rgba(15,23,42,.18),
      0 14px 30px rgba(15,23,42,.14) !important;
  }

  /* These existing positioned surfaces have no ::before in ITDA.
     A click-through reflection preserves their gradient and uploaded image. */
  body :is(.hero-main,.event-cover)::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(118deg,rgba(255,255,255,.14),
      transparent 42%,rgba(255,255,255,.07) 69%,transparent 70%);
  }

  body :is(.modal,.permission-modal,.global-register-modal,
    .workspace-search-dialog,.workspace-library-dialog,.account-modal) {
    box-shadow: var(--itda-effect-inset),
      0 28px 65px rgba(15,23,42,.28) !important;
  }

  /* Only backdrop layers are blurred. Modal contents remain sharp. */
  body :is(.modal-backdrop,.itda-modal,.itda-ai-backdrop,
    .workspace-modal-backdrop,.account-modal-backdrop).open {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }

  body :is(.btn,.icon-btn,.chip,.workspace-quick-btn,.attention-bell,
    .bible-speech-pill,.itda-ai-fab,.quick-icon) {
    box-shadow: inset 0 2px 0 rgba(255,255,255,.70),
      inset 0 -1px 2px rgba(15,23,42,.09),
      0 3px 7px rgba(15,23,42,.10) !important;
  }
  /* Preserve existing transform/color transitions by not replacing transition. */
  body :is(.btn,.icon-btn,.chip,.workspace-quick-btn,.attention-bell,
    .bible-speech-pill,.itda-ai-fab):active:not(:disabled):not([aria-disabled="true"]) {
    box-shadow: inset 0 3px 6px rgba(15,23,42,.22),
      inset 0 -1px 0 rgba(255,255,255,.65) !important;
  }
}

@media screen and (hover:hover) and (pointer:fine) {
  body :is(.quick-card,.event-card,.ev-card,.sharing-card):hover:not(:disabled):not([aria-disabled="true"]):not(.quick-card-disabled) {
    box-shadow: var(--itda-effect-inset),
      var(--itda-custom-shadow,var(--itda-effect-depth)),
      0 10px 26px rgba(15,23,42,.12) !important;
  }
  body :is(.btn,.icon-btn,.chip,.workspace-quick-btn,.attention-bell,
    .bible-speech-pill,.itda-ai-fab):hover:not(:disabled):not([aria-disabled="true"]) {
    box-shadow: inset 0 2px 0 var(--itda-effect-highlight),
      inset 0 -1px 2px var(--itda-effect-shade),
      0 6px 14px rgba(15,23,42,.14) !important;
  }
}

@media screen and (max-width:760px) {
  body :is(.modal-backdrop,.itda-modal,.itda-ai-backdrop,
    .workspace-modal-backdrop,.account-modal-backdrop).open {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
}

@media screen and (prefers-reduced-transparency:reduce) {
  html:not(.itda-menu-left-root):not(.itda-menu-right-root) body .app-header {
    background-color: var(--itda-custom-surface,var(--surface,#fff)) !important;
  }
  body :is(.app-header,.modal-backdrop,.itda-modal,.itda-ai-backdrop,
    .workspace-modal-backdrop,.account-modal-backdrop) {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media screen and (prefers-reduced-motion:reduce) {
  body :is(.btn,.icon-btn,.chip,.workspace-quick-btn,.attention-bell,
    .bible-speech-pill,.itda-ai-fab) { transition: none; }
}