/* Screen-specific styles for Supplier_Dashboard_Screen */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
        
        body {
            font-family: 'Inter', sans-serif;
            margin: 0;
            padding: 0;
            height: 100vh;
            width: 100%;
            overflow-x: hidden;
        }
        
        .screen {
            height: 100%;
            overflow-y: auto;
        }
        
        .content {
            padding-bottom: 80px;
        }
        
        /* Fix for bottom navigation */
        .bottom-navigation {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: white;
            border-top: 1px solid #f1f1f1;
            padding: 12px 24px;
            border-top-left-radius: 24px;
            border-top-right-radius: 24px;
            box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
            z-index: 100;
        }
        
        /* Supplier-specific styles */
        .supplier-gradient-bg {
            background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
            color: white;
            border-radius: 16px;
            box-shadow: 0 10px 25px -5px rgba(14, 165, 233, 0.3);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .supplier-gradient-bg:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 30px -5px rgba(14, 165, 233, 0.4);
        }
        
        .supplier-accent-color {
            color: #0ea5e9;
        }
        
        /* Supplier card styles */
        .supplier-card {
            background: white;
            border-radius: 16px;
            padding: 20px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
            margin-bottom: 20px;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .supplier-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
        }
        
        .supplier-card-title {
            font-weight: 600;
            font-size: 16px;
            margin-bottom: 15px;
            color: #1f2937;
        }
        
        /* Product status indicators */
        .product-status {
            display: inline-flex;
            align-items: center;
            padding: 4px 10px;
            border-radius: 12px;
            font-size: 12px;
            font-weight: 500;
        }
        
        .product-status.in-stock {
            background-color: #d1fae5;
            color: #065f46;
        }
        
        .product-status.low-stock {
            background-color: #fef3c7;
            color: #92400e;
        }
        
        .product-status.out-of-stock {
            background-color: #fee2e2;
            color: #b91c1c;
        }
        
        /* Inventory progress bar */
        .inventory-progress-container {
            height: 8px;
            background-color: #e5e7eb;
            border-radius: 4px;
            overflow: hidden;
            margin: 8px 0;
        }
        
        .inventory-progress {
            height: 100%;
            border-radius: 4px;
            transition: width 0.5s ease;
        }
        
        .inventory-progress.high {
            background: linear-gradient(90deg, #10b981, #059669);
        }
        
        .inventory-progress.medium {
            background: linear-gradient(90deg, #f59e0b, #d97706);
        }
        
        .inventory-progress.low {
            background: linear-gradient(90deg, #ef4444, #dc2626);
        }
        
        /* Order notification styles */
        .order-notification {
            display: flex;
            align-items: center;
            padding: 12px;
            background-color: #f9fafb;
            border-radius: 12px;
            margin-bottom: 12px;
            transition: transform 0.3s ease, background-color 0.3s ease;
        }
        
        .order-notification:hover {
            transform: translateY(-3px);
            background-color: #f3f4f6;
        }
        
        .order-notification-icon {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background-color: #e0f2fe;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 12px;
            color: #0ea5e9;
        }
        
        .order-notification-content {
            flex: 1;
        }
        
        .order-notification-title {
            font-weight: 600;
            font-size: 14px;
            margin-bottom: 4px;
            color: #1f2937;
        }
        
        .order-notification-desc {
            font-size: 13px;
            color: #6b7280;
        }
        
        .order-notification-time {
            font-size: 12px;
            color: #9ca3af;
            white-space: nowrap;
            margin-left: 12px;
        }
        
        /* Metric card styles */
        .metric-card {
            background: white;
            border-radius: 12px;
            padding: 16px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
            transition: all 0.3s ease;
        }
        
        .metric-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.08);
        }
        
        .metric-value {
            font-size: 24px;
            font-weight: 700;
            margin-bottom: 4px;
            color: #1f2937;
        }
        
        .metric-label {
            font-size: 14px;
            color: #6b7280;
        }
        
        .mini-chart {
            display: flex;
            align-items: flex-end;
            height: 40px;
            gap: 2px;
        }
        
        .mini-chart-bar {
            width: 6px;
            background-color: #f97316;
            border-radius: 1px;
        }