/* cache-bust: 20260321-1307 */
/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Waiver / Markdown prose styling */
.waiver-prose h1 { font-size: 1.75rem; font-weight: 700; margin-top: 1.5rem; margin-bottom: 0.75rem; line-height: 1.2; }
.waiver-prose h2 { font-size: 1.35rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; line-height: 1.3; }
.waiver-prose h3 { font-size: 1.15rem; font-weight: 600; margin-top: 1.25rem; margin-bottom: 0.5rem; line-height: 1.3; }
.waiver-prose h4, .waiver-prose h5, .waiver-prose h6 { font-size: 1rem; font-weight: 600; margin-top: 1rem; margin-bottom: 0.4rem; }
.waiver-prose p { margin-bottom: 0.75rem; }
.waiver-prose ul, .waiver-prose ol { margin-bottom: 0.75rem; padding-left: 1.5rem; }
.waiver-prose ul { list-style-type: disc; }
.waiver-prose ol { list-style-type: decimal; }
.waiver-prose li { margin-bottom: 0.25rem; }
.waiver-prose blockquote { border-left: 3px solid #475569; padding-left: 1rem; margin: 1rem 0; color: #94a3b8; }
.waiver-prose hr { border: none; border-top: 1px solid #334155; margin: 1.5rem 0; }
.waiver-prose a { color: #38bdf8; text-decoration: underline; }
.waiver-prose strong { font-weight: 700; }

/* Staff Help Guide prose styling */
.prose-staff h2 { font-size: 1.5rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 0.75rem; line-height: 1.2; color: #e2e8f0; border-bottom: 1px solid #1e293b; padding-bottom: 0.5rem; }
.prose-staff h3 { font-size: 1.2rem; font-weight: 600; margin-top: 2rem; margin-bottom: 0.5rem; line-height: 1.3; color: #cbd5e1; }
.prose-staff h4 { font-size: 1.05rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.4rem; color: #94a3b8; }
.prose-staff p { margin-bottom: 0.75rem; color: #94a3b8; line-height: 1.7; }
.prose-staff ul, .prose-staff ol { margin-bottom: 0.75rem; padding-left: 1.5rem; color: #94a3b8; }
.prose-staff ul { list-style-type: disc; }
.prose-staff ol { list-style-type: decimal; }
.prose-staff li { margin-bottom: 0.35rem; line-height: 1.6; }
.prose-staff strong { font-weight: 700; color: #e2e8f0; }
.prose-staff code { background: #1e293b; padding: 0.15rem 0.4rem; border-radius: 0.25rem; font-size: 0.875rem; color: #34d399; }
.prose-staff img { max-width: 100%; border-radius: 0.75rem; }
.prose-staff table { width: 100%; border-collapse: collapse; }
.prose-staff th { text-align: left; padding: 0.5rem; border-bottom: 1px solid #334155; color: #64748b; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; }
.prose-staff td { padding: 0.5rem; border-bottom: 1px solid rgba(30, 41, 59, 0.5); }
.prose-staff h2:first-child { margin-top: 0; }

/* Trix editor overrides for staff help guides */
trix-toolbar {
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 0.75rem;
  padding: 0.5rem;
}

trix-toolbar .trix-button-group {
  border: 1px solid #475569;
  border-radius: 0.5rem;
  margin-right: 0.5rem;
}

trix-toolbar .trix-button-group + .trix-button-group {
  margin-left: 0;
}

trix-toolbar .trix-button {
  background: transparent;
  border: none;
  border-bottom: none;
  filter: invert(85%) sepia(20%) saturate(500%) hue-rotate(100deg) brightness(1.1);
  padding: 0.4rem 0.6rem;
}

trix-toolbar .trix-button::before {
  opacity: 1 !important;
}

trix-toolbar .trix-button:not(:disabled):hover {
  background: rgba(16, 185, 129, 0.2);
  filter: invert(85%) sepia(30%) saturate(800%) hue-rotate(100deg) brightness(1.2);
}

trix-toolbar .trix-button.trix-active {
  background: rgba(16, 185, 129, 0.3);
  filter: invert(85%) sepia(40%) saturate(1000%) hue-rotate(100deg) brightness(1.3);
}

trix-toolbar .trix-button--icon::before {
  opacity: 1 !important;
}

trix-toolbar .trix-dialog {
  background: #1e293b;
  border: 1px solid #475569;
  color: #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.75rem;
}

trix-toolbar .trix-dialog input[type="text"],
trix-toolbar .trix-dialog input[type="url"] {
  background: #0f172a;
  border: 1px solid #475569;
  color: #e2e8f0;
  border-radius: 0.375rem;
  padding: 0.375rem 0.5rem;
}

trix-toolbar .trix-dialog .trix-button-group {
  border: none;
}

trix-toolbar .trix-dialog .trix-button-group .trix-button {
  filter: none;
  color: #a7f3d0;
  font-size: 0.875rem;
}

trix-editor {
  background: #0f172a;
  border: 1px solid #334155;
  border-top: none;
  color: #e2e8f0;
  min-height: 16rem;
  padding: 1rem;
  border-radius: 0 0 0.75rem 0.75rem;
}

trix-editor a {
  color: #34d399;
}

@keyframes lock-shake {
  0% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(6px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(4px); }
  100% { transform: translateX(0); }
}

.lock-shake {
  animation: lock-shake 0.35s ease-in-out;
}

/* Pagy pagination styling — dark theme with teal accents */
nav.pagy {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  padding: 1rem 0;
  font-size: 0.875rem;
}

nav.pagy a,
nav.pagy span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: 0.375rem;
  font-weight: 500;
  transition: background-color 0.15s, color 0.15s;
}

nav.pagy a {
  color: #94a3b8;
  background: #1e293b;
  border: 1px solid #334155;
  text-decoration: none;
}

nav.pagy a:hover {
  color: #4fd1c5;
  background: #2d3748;
  border-color: #4fd1c5;
}

nav.pagy a[aria-disabled="true"],
nav.pagy a.disabled {
  color: #475569;
  background: transparent;
  border-color: transparent;
  pointer-events: none;
}

nav.pagy span.current,
nav.pagy a.current {
  color: #fff;
  background: #4fd1c5;
  border: 1px solid #4fd1c5;
  font-weight: 600;
}

nav.pagy .gap {
  color: #64748b;
  border: none;
  background: none;
}

/*
 * Native <dialog> centering.
 *
 * Tailwind v4's Preflight resets `margin: 0` on the universal selector
 * (including ::backdrop), which clobbers the UA stylesheet's `margin: auto`
 * that centers a modal <dialog> opened via .showModal(). Without this rule
 * dialogs pin to the top-left of the viewport. Restoring `margin: auto` here
 * (an unlayered rule that beats Tailwind's @layer base) centers every modal
 * app-wide. See docs/DESIGN_SYSTEM.md → "Modals are always centered".
 */
dialog:modal {
  margin: auto;
}

.turbo-progress-bar {
  height: 3px;
  background: #34d399;
  box-shadow: 0 0 14px rgba(52, 211, 153, 0.55);
}

.member-bottom-nav {
  position: fixed;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.member-bottom-nav::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  height: 2px;
  width: 100%;
  background: linear-gradient(90deg, transparent, rgba(52, 211, 153, 0.9), transparent);
  opacity: 0;
  transform: translateX(-100%);
}

html[aria-busy="true"] .member-bottom-nav::before {
  opacity: 1;
  animation: member-nav-progress 1.1s ease-in-out infinite;
}

.member-tab-link {
  position: relative;
  border-radius: 0.75rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 120ms ease, color 120ms ease, transform 120ms ease;
}

.member-tab-link:active {
  color: #e2e8f0;
  background: rgba(51, 65, 85, 0.82);
  transform: translateY(1px);
}

.member-tab-link[data-member-navigation-loading="true"] {
  color: #34d399;
  background: rgba(16, 185, 129, 0.13);
}

.member-tab-link[data-member-navigation-loading="true"]::after {
  content: "";
  position: absolute;
  top: 0.3rem;
  left: calc(50% - 0.7rem);
  width: 1.4rem;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.9;
  animation: member-tab-pulse 900ms ease-in-out infinite;
}

@keyframes member-nav-progress {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

@keyframes member-tab-pulse {
  0%, 100% { opacity: 0.35; transform: scaleX(0.55); }
  50% { opacity: 1; transform: scaleX(1); }
}

/* Compact Tasks panel (dashboard card): trim chrome that only belongs on the
   full /tasks page. Scoped to the persistent .tasks-compact wrapper, so the
   rules survive turbo-stream re-renders of the list frame inside it. */
.tasks-compact [data-tasks-filter="all"],
.tasks-compact [data-tasks-archived-link] {
  display: none;
}

/* Dashboard Tasks detail drawer — slides in from the right when shown (the
   animation replays each time the panel goes from display:none to flex). */
@keyframes tasks-drawer-in {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.tasks-drawer-enter {
  animation: tasks-drawer-in 0.2s ease-out;
}
/* cache-bust: 1773941540 */