/* Global Styles */
body {
    background-color: #0d0f12;
    /* Slightly darker/cooler black */
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: #e0e0e0;
}

/* Glassmorphism Header */
.glass-effect {
    background: rgba(13, 15, 18, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Search Box */
.search-box-wrapper {
    background-color: #1a1d21;
    border-radius: 8px;
    /* Slightly tighter radius */
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.2s ease;
}

.search-box-wrapper:focus-within {
    border-color: #3b82f6;
    background-color: #212529;
}

#searchInput::placeholder {
    color: #555;
    font-size: 0.9rem;
}

/* Product Cards */
.product-card {
    background-color: #15171b;
    border-radius: 8px;
    /* Tighter radius for dense grid */
    border: 1px solid rgba(255, 255, 255, 0.03);
    border-left-width: 3px;
    /* Accent border on left */
    transition: background-color 0.15s ease;
}

.product-card:active {
    background-color: #1e2126;
}

/* Accent Borders */
.border-start-success {
    border-left-color: #22c55e !important;
}

/* Green-500 */
.border-start-warning {
    border-left-color: #eab308 !important;
}

/* Yellow-500 */
.border-start-danger {
    border-left-color: #ef4444 !important;
}

/* Red-500 */

/* Typography Utils */
.small-title {
    font-size: 0.9rem;
    line-height: 1.2;
}

.micro-text {
    font-size: 0.70rem;
}

.micro-badge {
    font-size: 0.6rem;
    font-weight: 400;
}

/* Removed text-truncate-2 */
.text-truncate-2 {
    display: block;
    overflow: visible;
    white-space: normal;
}

.border-white-10 {
    border-color: rgba(255, 255, 255, 0.05) !important;
}

/* Utilities */
.text-success {
    color: #4ade80 !important;
}

.text-warning {
    color: #facc15 !important;
}

.text-danger {
    color: #f87171 !important;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 4px;
}

::-webkit-scrollbar-track {
    background: #0d0f12;
}

::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 2px;
}

/* Grayscale effect for hidden items */
.grayscale-effect {
    filter: grayscale(100%);
    opacity: 0.5;
}