/*
 * 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.
 */

@keyframes shimmer-slide {
  0%   { transform: translateX(-150%); }
  100% { transform: translateX(250%); }
}

.processing-shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
  animation: shimmer-slide 1.8s ease-in-out infinite;
}

/* Table row entry animation */
@keyframes row-enter {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.row-entering {
  animation: row-enter 300ms ease-out forwards;
}

/* Expandable cell content (description, filename sub-rows) */
.expandable-cell-item {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 300ms ease-in-out;
}
.expandable-cell-item.is-expanded {
  grid-template-rows: 1fr;
}
.expandable-cell-item > div {
  overflow: hidden;
}

/* Archived record row styling */
.record--archived {
  background-color: rgb(255 251 235); /* amber-50 */
  opacity: 0.75;
}
.record--archived:hover {
  background-color: rgb(254 243 199); /* amber-100 */
}

/* Animated notification banner */
.notification-banner-wrapper {
  display: grid;
  grid-template-rows: 0fr;
  margin-bottom: 0;
  transition: grid-template-rows 300ms ease-in-out, margin-bottom 300ms ease-in-out;
}
.notification-banner-wrapper.is-open {
  grid-template-rows: 1fr;
  margin-bottom: 1rem;
}
.notification-banner-wrapper > div {
  overflow: hidden;
}
.notification-banner-inner {
  transition: background-color 300ms ease-in-out,
              border-color 300ms ease-in-out,
              color 300ms ease-in-out;
}
.banner-theme-amber {
  background-color: rgb(255 251 235); /* amber-50 */
  border-color:     rgb(253 230 138); /* amber-200 */
  color:            rgb(146 64 14);   /* amber-800 */
}
.banner-theme-green {
  background-color: rgb(240 253 244); /* green-50 */
  border-color:     rgb(187 247 208); /* green-200 */
  color:            rgb(22 101 52);   /* green-800 */
}

/* ── Impersonation banner ─────────────────────────────────────────────────── */
/* Breathing animation: brightens over 5 s, holds dark for ~10 s, repeats.   */
@keyframes impersonation-breathe {
  0%   { background-color: #c0392b; } /* bright crimson  */
  33%  { background-color: #7b241c; } /* darkest crimson (~10 s dark phase) */
  100% { background-color: #c0392b; } /* back to bright  */
}

.impersonation-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  height: 3rem;
  background-color: #c0392b;
  color: #ffffff;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.875rem;
  animation: impersonation-breathe 15s ease-in-out infinite;
}

.impersonation-banner-spacer {
  height: 3rem;
}
.impersonation-banner__stop-btn {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 0.25rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
}
.impersonation-banner__stop-btn:hover {
  background: rgba(255, 255, 255, 0.25);
}
@media (prefers-reduced-motion: reduce) {
  .impersonation-banner {
    animation: none;
  }
}

/* ── Two-step verification grace banner ─────────────────────────── */
/* Calmer than the impersonation banner: this is a deadline, not an alarm.    */
.mfa-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  height: 3rem;
  /* Brand Book V2: Midnight ground, Cream text, Inter. Written out rather than
     given the V2 component classes, because the banner is fixed to the top of
     every page and belongs to none of them. */
  background-color: #2D1B4E;
  color: #FDF1EC;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
  font-size: 14px;
}

.mfa-banner-spacer {
  height: 3rem;
}
/* An underlined Cream link rather than a button: the one-size button rule
   leaves no smaller primary to put in a 3rem strip. */
.mfa-banner__link {
  color: #FDF1EC;
  font-weight: 600;
  text-decoration: underline;
  white-space: nowrap;
}
.mfa-banner__link:hover {
  text-decoration: none;
}

@keyframes ai-neural-cw {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes ai-neural-ccw {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}

@keyframes ai-neural-pulse {
  0%, 100% { transform: scale(0.95); opacity: 0.8; }
  50% { transform: scale(1.05); opacity: 1; }
}

@keyframes ai-neural-halo {
  0%, 100% { opacity: 0.2; transform: scale(0.9); }
  50% { opacity: 0.45; transform: scale(1.12); }
}

.ai-generation-loader {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.ai-generation-loader__spark {
  position: relative;
  width: 4rem;
  height: 4rem;
}

.ai-generation-loader__halo {
  position: absolute;
  inset: 0.4rem;
  border-radius: 9999px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.16) 0%, rgba(99, 102, 241, 0.02) 72%, rgba(99, 102, 241, 0) 100%);
  animation: ai-neural-halo 2.2s ease-in-out infinite;
}

.ai-generation-loader__orbit {
  position: absolute;
  inset: 0;
}

.ai-generation-loader__orbit--outer {
  animation: ai-neural-cw 4.2s linear infinite;
}

.ai-generation-loader__orbit--inner {
  animation: ai-neural-ccw 3.2s linear infinite;
}

.ai-generation-loader__node {
  position: absolute;
  border-radius: 9999px;
  box-shadow: 0 0 8px rgba(79, 70, 229, 0.35);
}

.ai-generation-loader__node--outer {
  top: 0.15rem;
  left: 50%;
  width: 0.52rem;
  height: 0.52rem;
  margin-left: -0.26rem;
  background: rgb(99 102 241);
}

.ai-generation-loader__node--inner {
  bottom: 0.35rem;
  left: 50%;
  width: 0.4rem;
  height: 0.4rem;
  margin-left: -0.2rem;
  background: rgb(167 139 250);
}

.ai-generation-loader__core {
  position: absolute;
  inset: 1.05rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: linear-gradient(135deg, rgb(99 102 241), rgb(79 70 229));
  animation: ai-neural-pulse 1.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .ai-generation-loader__halo,
  .ai-generation-loader__orbit--outer,
  .ai-generation-loader__orbit--inner,
  .ai-generation-loader__core {
    animation: none;
  }
}

/* Template placeholder fields */
mark.template-placeholder {
  cursor: pointer;
  border-bottom: 2px dashed #a78bfa;
  background: #f5f3ff;
  padding: 1px 4px;
  border-radius: 3px;
  transition: background 0.15s ease, border-color 0.15s ease;
}

mark.template-placeholder:hover {
  background: #ede9fe;
  border-color: #7c3aed;
}

mark.template-placeholder .template-placeholder-value {
  color: #6d28d9;
  font-style: italic;
  font-size: 0.875rem;
}

/* Hide agenda content display when inline editor is shown (replaces not stacks) */
div[data-toggle-target="content"]:not(.hidden) ~ .agenda-content-display {
  display: none;
}
