/* Custom additions on top of Tailwind (Play CDN). */

/* Responsive guards — keep the app from ever scrolling sideways. */
*,
*::before,
*::after {
    min-width: 0; /* let flex/grid children shrink instead of overflowing */
}

html {
    font-size: 108%;
}

/* On very small phones, dial the base size back so nothing overflows. */
@media (max-width: 380px) {
    html { font-size: 100%; }
}

body {
    font-family: "SolaimanLipi", "Kalpurush", "Noto Sans Bengali", "Hind Siliguri",
                 system-ui, -apple-system, "Segoe UI", sans-serif;
    overflow-x: hidden; /* guard against accidental horizontal scroll */
}

img,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
}

/* Long unbreakable values (ref no, status text) wrap instead of overflowing. */
.break-long {
    word-break: break-word;
    overflow-wrap: anywhere;
}

input,
textarea,
select,
button {
    max-width: 100%;
}

/* Dashboard stat cards */
.stat-card {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -8px rgba(15, 23, 42, 0.15);
}

/* Public search result cards */
.result-card {
    transition: box-shadow 0.15s ease;
}
.result-card:hover {
    box-shadow: 0 10px 20px -8px rgba(15, 23, 42, 0.12);
}

/* Skeleton shimmer while searching */
.skeleton-card {
    animation: shimmer 1.2s ease-in-out infinite;
    background: linear-gradient(90deg, #e2e8f0 25%, #f8fafc 50%, #e2e8f0 75%);
    background-size: 200% 100%;
    border-radius: 0.75rem;
    height: 7rem;
}
@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .skeleton-card { animation: none; }
}