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

/* Modal transition styles */
.modal-transition {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.modal-transition.modal-active {
  opacity: 1;
  transform: scale(1);
}

/* Hide default disclosure triangles for details elements */
details > summary {
  list-style: none;
}
details > summary::-webkit-details-marker {
  display: none;
}

/* Fix over-scroll background - force solid background colors */
html {
  background-color: #f8f5ec !important;
  min-height: 100vh;
  height: 100%;
}

/* Dark mode background */
html.dark {
  background-color: #0a0a0a !important;
}

/* Body should be transparent to show html background */
body {
  background: transparent !important;
  min-height: 100vh;
}

/* Apply gradient only to body content, not html root */
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(145deg, #f8f5ec 0%, #f3e9d2 100%);
  z-index: -1;
  pointer-events: none;
}

/* Dark mode gradient overlay */
html.dark body::before {
  background: linear-gradient(145deg, #0a0a0a 0%, #18181b 100%);
}

/* Prevent horizontal scroll */
html, body {
  overflow-x: hidden;
}