/*
 * AgriNova Liquid Glass — standalone CSS visual effect
 * Extracted from expo-2026/styles.css (.expo-analysis-card, original lines 179–209).
 * No dependencies on React or business page styles.
 *
 * Usage: add class="agri-liquid-glass" to any container.
 * Optional CSS custom properties:
 *   --agri-glass-blur: 12px;
 *   --agri-glass-radius: 30px;
 * Layout, padding, size and text colors remain the responsibility of the host page.
 */

.agri-liquid-glass {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--agri-glass-radius, 30px);

  background:
    radial-gradient(
      85% 58% at 8% 0%,
      rgba(255, 255, 255, 0.25) 0%,
      rgba(255, 255, 255, 0.06) 48%,
      transparent 72%
    ),
    linear-gradient(
      145deg,
      rgba(247, 251, 253, 0.05) 0%,
      rgba(236, 246, 250, 0.05) 48%,
      rgba(226, 240, 246, 0.05) 100%
    );

  -webkit-backdrop-filter: blur(var(--agri-glass-blur, 6px));
  backdrop-filter: blur(var(--agri-glass-blur, 6px));

  box-shadow:
    0 28px 70px rgba(37, 65, 78, 0.13),
    0 5px 18px rgba(37, 65, 78, 0.06),
    inset 0 1px 0 #fff,
    inset 1px 0 0 rgba(255, 255, 255, 0.52),
    inset 0 -1px 0 rgba(113, 158, 178, 0.16);
}

/* Surface highlights; keep the overlay transparent to pointer interactions. */
.agri-liquid-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;

  background:
    radial-gradient(
      55% 22% at 18% 0%,
      rgba(255, 255, 255, 0.5),
      transparent 72%
    ),
    linear-gradient(
      118deg,
      rgba(255, 255, 255, 0.2) 0%,
      transparent 18%,
      transparent 78%,
      rgba(151, 190, 205, 0.01) 100%
    );
}

/* Inner glass rim. */
.agri-liquid-glass::after {
  content: "";
  position: absolute;
  inset: 1px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: calc(var(--agri-glass-radius, 30px) - 1px);
  pointer-events: none;
}

/* Content sits above decorative pseudo-elements. */
.agri-liquid-glass > * {
  position: relative;
  z-index: 1;
}