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


/* Import Dropzone CSS */
@import "https://cdn.jsdelivr.net/npm/dropzone@5.9.3/dist/min/dropzone.min.css";

/* Import FilePond CSS */
@import "https://cdn.jsdelivr.net/npm/filepond@4.31.4/dist/filepond.min.css";
@import "https://cdn.jsdelivr.net/npm/filepond-plugin-image-preview@4.6.12/dist/filepond-plugin-image-preview.min.css";

/* Import our custom dropzone styles */
/* @import "dropzone.css"; */

/* @import "../tailwind/application.css"; */

/* Import custom DaisyUI theme */
/* @import "daisy-theme.css"; */

/* ─── Navbar transparent ↔ scrolled states ─────────────────────────────── */

/* Transparent state (home page, at top): links and icons are white */
nav[data-navbar-transparent-value="true"][data-scrolled="false"] .nav-link,
nav[data-navbar-transparent-value="true"][data-scrolled="false"] .nav-icon {
  color: rgba(255, 255, 255, 0.85);
  transition: color 300ms;
}
nav[data-navbar-transparent-value="true"][data-scrolled="false"] .nav-link:hover,
nav[data-navbar-transparent-value="true"][data-scrolled="false"] .nav-icon:hover {
  color: rgba(255, 255, 255, 1);
}

/* Scrolled state: links and icons turn primary (maroon) */
nav[data-navbar-transparent-value="true"][data-scrolled="true"] .nav-link,
nav[data-navbar-transparent-value="true"][data-scrolled="true"] .nav-icon {
  color: var(--color-primary);
  transition: color 300ms;
}
nav[data-navbar-transparent-value="true"][data-scrolled="true"] .nav-link:hover,
nav[data-navbar-transparent-value="true"][data-scrolled="true"] .nav-icon:hover {
  color: var(--color-primary);
  opacity: 0.75;
}

/* Non-home nav links (always visible) */
nav[data-navbar-transparent-value="false"] .nav-link,
nav[data-navbar-transparent-value="false"] .nav-icon {
  color: rgba(0, 0, 0, 0.55);
  transition: color 300ms;
}
nav[data-navbar-transparent-value="false"] .nav-link:hover,
nav[data-navbar-transparent-value="false"] .nav-icon:hover {
  color: var(--color-primary);
}

/* ─────────────────────────────────────────────────────────────────────────── */

/* Turbo Progress Bar */
.turbo-progress-bar {
  height: 3px;
  background: linear-gradient(to right, #dc2626, #b91c1c);
  z-index: 9999;
}

/* Page Transition Animations */
.turbo-loading {
  opacity: 0.6;
  transition: opacity 150ms ease-out;
}

.turbo-loaded {
  animation: turbo-fade-in 200ms ease-in forwards;
}

@keyframes turbo-fade-in {
  from {
    opacity: 0.8;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}