/**
 * CSP-safe utilities: Tailwind v3-style stone palette, slash opacity, and
 * arbitrary sizes that are NOT in the Tailwind 2.2 CDN build.
 * Load after: tailwindcss@2.2.19/dist/tailwind.min.css
 */

.shrink-0 {
  flex-shrink: 0;
}
.text-balance {
  text-wrap: balance;
}

/* ── Stone (v3 palette) ─────────────────────────────────────────────────── */
.text-stone-50 { color: #fafaf9; }
.text-stone-100 { color: #f5f5f4; }
.text-stone-200 { color: #e7e5e4; }
.text-stone-300 { color: #d6d3d1; }
.text-stone-400 { color: #a8a29e; }
.text-stone-500 { color: #78716c; }
.text-stone-600 { color: #57534e; }
.text-stone-700 { color: #44403c; }
.text-stone-800 { color: #292524; }
.text-stone-900 { color: #1c1917; }

.bg-stone-50 { background-color: #fafaf9; }
.bg-stone-100 { background-color: #f5f5f4; }
.bg-stone-200 { background-color: #e7e5e4; }
.bg-stone-300 { background-color: #d6d3d1; }

.border-stone-200 { border-color: #e7e5e4; }
.border-stone-300 { border-color: #d6d3d1; }

.hover\:bg-stone-300:hover { background-color: #d6d3d1; }
.hover\:bg-stone-50:hover { background-color: #fafaf9; }

/* Slash opacity (v3-style class names) */
.bg-stone-200\/50 { background-color: rgba(231, 229, 228, 0.5); }
.bg-stone-200\/70 { background-color: rgba(231, 229, 228, 0.7); }
.bg-stone-200\/80 { background-color: rgba(231, 229, 228, 0.8); }
.bg-stone-200\/90 { background-color: rgba(231, 229, 228, 0.9); }
.bg-stone-100\/90 { background-color: rgba(245, 245, 244, 0.9); }

.border-stone-200\/70 { border-color: rgba(231, 229, 228, 0.7); }
.border-stone-200\/80 { border-color: rgba(231, 229, 228, 0.8); }
.border-stone-200\/90 { border-color: rgba(231, 229, 228, 0.9); }
.border-stone-300\/70 { border-color: rgba(214, 211, 209, 0.7); }
.border-stone-400\/50 { border-color: rgba(168, 162, 158, 0.5); }
.border-stone-400\/60 { border-color: rgba(168, 162, 158, 0.6); }

.border-slate-200\/80 { border-color: rgba(226, 232, 240, 0.8); }
.border-slate-200\/90 { border-color: rgba(226, 232, 240, 0.9); }

.bg-blue-600\/10 { background-color: rgba(37, 99, 235, 0.1); }
.border-blue-200\/60 { border-color: rgba(191, 219, 254, 0.6); }
.border-blue-700\/30 { border-color: rgba(29, 78, 216, 0.3); }

.border-emerald-400\/70 { border-color: rgba(52, 211, 153, 0.7); }
.bg-emerald-50\/50 { background-color: rgba(236, 253, 245, 0.5); }
.hover\:bg-emerald-50\/80:hover { background-color: rgba(236, 253, 245, 0.8); }

.bg-amber-50\/95 { background-color: rgba(255, 251, 235, 0.95); }
.text-amber-900\/90 { color: rgba(120, 53, 15, 0.9); }

.bg-red-50\/80 { background-color: rgba(254, 242, 242, 0.8); }
.text-red-900\/80 { color: rgba(127, 29, 29, 0.8); }

.bg-amber-50\/90 { background-color: rgba(255, 251, 235, 0.9); }
.text-amber-900\/85 { color: rgba(120, 53, 15, 0.85); }

.bg-stone-200\/40 { background-color: rgba(231, 229, 228, 0.4); }

.bg-black\/40 { background-color: rgba(0, 0, 0, 0.4); }

.border-gray-200\/80 { border-color: rgba(229, 231, 235, 0.8); }

.shadow-gray-200\/80 {
  box-shadow: 0 25px 50px -12px rgba(229, 231, 235, 0.8);
}

.bg-gradient-to-b.from-violet-50\/90.to-white {
  background-image: linear-gradient(to bottom, rgba(245, 243, 255, 0.9), #ffffff);
}

.bg-gradient-to-b.from-slate-50\/80.to-white {
  background-image: linear-gradient(to bottom, rgba(248, 250, 252, 0.8), #ffffff);
}

.text-violet-900\/85 { color: rgba(76, 29, 149, 0.85); }
.text-violet-900\/70 { color: rgba(76, 29, 149, 0.7); }

/* Login hero icon — replaces ring-4 ring-brand-600/15 */
.login-brand-icon-glow {
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05),
    0 0 0 4px rgba(37, 99, 235, 0.15);
}

/* Meta pill on finding cards */
.bg-gradient-to-b.from-slate-50.to-slate-100\/80 {
  background-image: linear-gradient(to bottom, #f8fafc, rgba(241, 245, 249, 0.8));
}

.bg-gradient-to-br.from-white.to-stone-50\/90 {
  background-image: linear-gradient(to bottom right, #ffffff, rgba(250, 250, 249, 0.9));
}

.bg-gradient-to-br.from-white.to-indigo-50\/40 {
  background-image: linear-gradient(to bottom right, #ffffff, rgba(238, 242, 255, 0.4));
}

.bg-gradient-to-b.from-emerald-50.to-emerald-100\/90 {
  background-image: linear-gradient(to bottom, #ecfdf5, rgba(209, 250, 229, 0.9));
}

/* Arbitrary font sizes (Tailwind arbitrary class names) */
.text-\[6px\] { font-size: 6px; line-height: 1; }
.text-\[9px\] { font-size: 9px; line-height: 1.35; }
.text-\[10px\] { font-size: 10px; line-height: 1.4; }
.text-\[11px\] { font-size: 11px; line-height: 1.45; }
.text-\[12px\] { font-size: 12px; line-height: 1.5; }

.min-w-\[8rem\] { min-width: 8rem; }
.max-w-\[20rem\] { max-width: 20rem; }
.max-w-\[34rem\] { max-width: 34rem; }
.pl-\[14px\] { padding-left: 14px; }

.w-\[600px\] { width: 600px; }
.h-\[600px\] { height: 600px; }
.opacity-\[0\.07\] { opacity: 0.07; }

.border-violet-200\/80 { border-color: rgba(221, 214, 254, 0.8); }

/* divide-stone-100 for billing table lists */
.divide-stone-100 > * + * {
  border-top: 1px solid #f5f5f4;
}

.border-stone-300\/80 {
  border-color: rgba(214, 211, 209, 0.8);
}

.bg-gray-50\/50 {
  background-color: rgba(249, 250, 251, 0.5);
}

.bg-gradient-to-r.from-white.to-stone-50\/70 {
  background-image: linear-gradient(to right, #ffffff, rgba(250, 250, 249, 0.7));
}

.z-\[9999\] {
  z-index: 9999;
}

.bg-gray-900\/60 {
  background-color: rgba(17, 24, 39, 0.6);
}

.bg-white\/20 {
  background-color: rgba(255, 255, 255, 0.2);
}

.text-white\/80 {
  color: rgba(255, 255, 255, 0.8);
}
